body{background:#f6f7ef;color:#153f39;font-family:system-ui,-apple-system,"Segoe UI",sans-serif;margin:0}.workshop{max-width:1220px;padding:28px 24px 32px}.workshop-head{display:flex;align-items:start;justify-content:space-between;gap:25px;margin-bottom:25px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;margin:0 0 10px;color:#3e7465}h1{font-size:clamp(30px,4.5vw,51px);line-height:1.03;letter-spacing:-.055em;font-weight:800;margin:0 0 18px}h1 span{color:#087b6c}.intro{max-width:710px;font-size:16px;line-height:1.55;margin:0;color:#4d6a60}.version{border:1px solid #c4d9c8;background:#edf3e7;padding:9px 13px;border-radius:30px;white-space:nowrap;font-size:12px;font-weight:650}.control-panel,.example-panel,.source-panel{background:white;border:1px solid #d4e0d5;border-radius:22px;padding:24px;margin-bottom:20px;min-width:0}.control-panel{background:#eaf1e7}.scenario-field .form-label{font-weight:750;font-size:14px;margin-bottom:8px}.form-select{border-radius:11px;border-color:#a6c4b1;min-height:46px;color:#174d41;font-size:15px}.settings-grid{display:grid;grid-template-columns:1fr 1fr 1.4fr auto;align-items:center;gap:24px;margin-top:21px}.settings-grid>label{font-size:12px;font-weight:700}.settings-grid output{float:right;color:#316e5a;font-weight:500}.form-range{margin-top:12px;height:20px}.form-range::-webkit-slider-thumb{background:#087b6c}.form-range::-moz-range-thumb{background:#087b6c}.switches{display:flex;flex-direction:column;gap:12px;font-size:13px}.switches label{display:flex;align-items:center;gap:9px;min-height:24px}.switches small{color:#668073;font-size:10px}.form-check-input:checked{background-color:#087b6c;border-color:#087b6c}.form-check-input{flex:0 0 auto;margin-top:0;width:18px;height:18px}.reset-button{border:1px solid #9bb9a5;border-radius:11px;font-size:13px;min-height:44px;background:#fff;color:#18543f}.motion-note{font-size:12px;line-height:1.5;color:#527264;margin:17px 0 0}.example-heading{display:flex;align-items:center;justify-content:space-between;gap:15px}.example-heading h2,.source-panel h2{font-size:26px;font-weight:750;letter-spacing:-.035em;line-height:1.15;margin:0 0 14px}.example-heading .eyebrow{margin-bottom:7px}.live-tag{font-size:11px;font-weight:700;color:#087b6c;background:#e8f7ed;border:1px solid #bedecb;padding:7px 10px;border-radius:30px;white-space:nowrap}.where{font-size:15px;color:#486b5c;line-height:1.6;margin-bottom:9px}.try{font-size:13px;line-height:1.55;background:#f3f6ed;border-left:3px solid #d3bd66;padding:10px 13px;margin:0 0 18px}.source-panel>p{font-size:14px;line-height:1.6;max-width:950px}.source-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:15px}.btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;border-radius:11px;font-weight:650;padding:10px 16px}.btn-primary{--bs-btn-bg:#087b6c;--bs-btn-border-color:#087b6c;--bs-btn-hover-bg:#066557;--bs-btn-hover-border-color:#066557;--bs-btn-active-bg:#065c50}.btn-outline-primary{--bs-btn-color:#087b6c;--bs-btn-border-color:#87b5a7;--bs-btn-hover-bg:#e3f0e8;--bs-btn-hover-color:#15574e;--bs-btn-hover-border-color:#087b6c}.workshop-status{margin-top:16px;color:#416e5b;min-height:23px}.source-panel summary{font-size:13px;font-weight:650;min-height:44px;cursor:pointer;padding-top:10px}.source-panel summary span{font-size:11px;color:#6a8175;font-weight:400;margin-left:12px}.source-panel pre{background:#123d35;color:#daf6df;max-height:390px;overflow:auto;padding:18px;border-radius:13px;font-size:12px;line-height:1.5;tab-size:2;white-space:pre}.source-panel code{overflow-wrap:anywhere}footer{font-size:12px;color:#587868;line-height:1.6;padding:4px 4px 0}footer a{color:#087b6c}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #d69829;outline-offset:3px}@media(max-width:850px){.settings-grid{grid-template-columns:1fr 1fr;gap:18px}.reset-button{align-self:end}.workshop-head{display:block}.version{display:inline-block;margin-top:17px}.workshop{padding:22px 18px}}@media(max-width:540px){.workshop{padding:18px 12px}.control-panel,.example-panel,.source-panel{padding:18px 14px;border-radius:17px}.workshop-head{margin-bottom:18px}h1{font-size:34px}.intro{font-size:14px}.settings-grid{gap:18px 16px}.settings-grid .switches{grid-column:1/-1}.reset-button{grid-column:1/-1}.example-heading{display:block}.live-tag{display:inline-block;margin-bottom:13px}.example-heading h2,.source-panel h2{font-size:23px}.where{font-size:14px}.source-actions{display:grid;grid-template-columns:1fr}.source-panel summary span{display:block;margin:6px 0}.switches small{font-size:11px}.try{padding:9px 11px}}@media(max-width:330px){.workshop{padding:15px 8px}.control-panel,.example-panel,.source-panel{padding:16px 11px}h1{font-size:30px}.settings-grid{grid-template-columns:1fr}.settings-grid .switches,.reset-button{grid-column:1}.demo-button{padding:10px 9px}}
