500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{font-family:'DM Sans',sans-serif;color:#263331;background:#f7f8fa;font-synthesis:none;font-size:13px;--muted:#89928f;--line:#e7ebe9;--mint:#c1f0cf;--purple:#bdadf0;--accent:#487c5b}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button,input,select{outline-offset:4px}button{color:inherit}button:disabled{opacity:.3;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #5e9672}input[type=checkbox],input[type=range]{accent-color:#628c70}button{transition:background .15s,box-shadow .15s,transform .15s}.topbar{height:82px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:38px;padding:0 28px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit;min-width:206px}.brand-mark{font-size:34px;background:#263c34;color:#cbefd5;border-radius:12px;width:43px;height:43px;text-align:center;line-height:42px}.brand strong{font-family:Manrope,sans-serif;font-size:22px;letter-spacing:-1px}.brand strong span{display:block;font-family:'DM Sans',sans-serif;font-size:8px;letter-spacing:2.8px;color:#84908b;margin-top:1px}.project-heading{display:flex;align-items:center;gap:10px;flex:1}.project-icon{color:#929d97;font-size:20px}.project-heading input{font-weight:600;border:0;background:transparent;width:185px;min-width:0}.project-badge,.version-tag{font-size:9px;letter-spacing:1.1px;color:#818d85;border:1px solid var(--line);border-radius:4px;padding:5px 7px;white-space:nowrap}.header-actions{display:flex;gap:10px;align-items:center}.save-status{font-size:11px;color:#7e8d83;margin-right:12px;white-space:nowrap}.btn{border:1px solid #e1e6e3;background:white;border-radius:7px;padding:10px 14px;display:inline-flex;gap:13px;align-items:center;font-size:12px}.btn:hover{background:#f0f4f0}.btn.dark{background:#293c32;color:white;border-color:#293c32}.btn.dark:hover{background:#466150}.app-layout{display:grid;grid-template-columns:246px minmax(500px,1fr) 260px;min-height:calc(100vh - 82px)}.library,.inspector{background:#fff;padding:27px 19px;border-right:1px solid var(--line)}.inspector{border-left:1px solid var(--line);border-right:0}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:600;color:#8c9690}.rail-heading h2{font-family:Manrope,sans-serif;font-size:19px;letter-spacing:-.6px;margin:8px 0 23px;display:flex;align-items:center;gap:10px}.rail-heading h2 span{font-size:10px;background:#f3f5f3;border-radius:5px;padding:3px 6px;color:#98a09a;letter-spacing:0}.search-box{height:36px;display:flex;gap:8px;align-items:center;border:1px solid #e6eae7;border-radius:6px;padding:0 9px;background:#fbfcfb}.search-box>span{font-size:23px;color:#8a968e}.search-box input{width:100%;min-width:0;background:none;border:0;font-size:11px}.search-box kbd{border:1px solid #e3e7e4;color:#adb5af;font-size:9px;padding:1px 5px;border-radius:3px}.category-tabs{display:flex;gap:5px;margin:16px 0 23px;flex-wrap:wrap}.category-tabs button{font-size:10px;padding:6px 8px;border:1px solid var(--line);border-radius:5px;background:#fff;color:#8a938c}.category-tabs button.active{background:#eaf4eb;border-color:#cce0ce;color:#486d50}.library-group-title{font-size:9px;letter-spacing:1.3px;color:#959d98;margin:22px 0 10px;display:flex;justify-content:space-between}.control-card{display:flex;width:100%;gap:11px;align-items:center;text-align:left;border:1px solid #e7ece8;border-radius:8px;background:#fff;padding:10px;margin:7px 0;cursor:grab}.control-card:hover{border-color:#a0c5a9;background:#f7fbf8;transform:translateX(2px)}.card-icon{width:35px;height:35px;border:1px solid #d8e7dc;background:#eff7f1;color:#77927e;border-radius:7px;display:grid;place-items:center;font-size:22px;flex-shrink:0}.control-card[data-group="Gestures"] .card-icon{background:#f7f1eb;border-color:#ecdfd2;color:#b99a7e}.control-card[data-group="Specialized"] .card-icon{background:#f1eef9;border-color:#e1dbee;color:#9b8abd}.card-copy{flex:1}.card-copy b{display:block;font-size:11px;font-weight:500}.card-copy small{display:block;font-size:9px;color:#9ca39d;margin-top:4px}.card-plus{color:#9eaaa1;font-size:15px}.library-note{display:flex;gap:9px;border-top:1px solid var(--line);margin-top:23px;padding-top:18px;color:#98a29a}.library-note>span{font-size:22px}.library-note p{font-size:10px;line-height:1.7;margin:0}.library-note b{display:block;color:#6c7d71;font-weight:500}.workspace{padding:31px 30px 0;min-width:0}.workspace-heading{display:flex;justify-content:space-between;align-items:flex-start;margin:2px 0 28px}.workspace-heading h1{font-family:Manrope,sans-serif;letter-spacing:-1.2px;font-size:26px;font-weight:600;margin:10px 0 7px;line-height:1.25}.workspace-heading p{font-size:11px;color:#8c9690;margin:0}.version-tag{margin-top:2px;font-size:8px;background:#fdfefd}.canvas-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:8px}.mode-switch{display:flex;padding:3px;background:#e9edeb;border-radius:7px}.mode-switch button{background:none;border:0;padding:8px 13px;border-radius:5px;font-size:11px;color:#8a958e;white-space:nowrap}.mode-switch button.active{background:#fff;color:#354c3f;box-shadow:0 1px 4px #2633310d}.toolbar-right{display:flex;align-items:center;gap:5px}.icon-btn{background:transparent;border:0;border-radius:5px;width:29px;height:29px;font-size:19px;color:#87948b}.icon-btn:hover{background:#e5eae7}.divider{height:17px;border-left:1px solid #dfe5e1;margin:0 7px}select{color:#526259;border:1px solid #e1e7e3;border-radius:6px;background:white;padding:7px;font-size:10px;max-width:100%}.canvas-area{padding:20px 22px 0;background:#eef2ef;border:1px solid #e0e7e1;border-radius:12px;background-image:radial-gradient(#cad4cd 0.65px,transparent 0.65px);background-size:14px 14px}.canvas-caption,.canvas-bottom{display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:1.3px;color:#88988c}.canvas-caption>span:first-child{display:flex;gap:6px;align-items:center}.green-dot{display:inline-block;width:5px;height:5px;background:#77a987;border-radius:50%;margin-right:4px}.phone-shell{position:relative;border-radius:28px;padding:9px;background:#26312e;margin:22px auto 16px;box-shadow:0 14px 25px #253e2d1f,0 0 0 1px #1d2925;width:100%}.camera{position:absolute;left:15px;top:47%;width:5px;height:22px;background:#18211e;border-radius:8px;z-index:20}.stage{position:relative;width:100%;aspect-ratio:20/9;border-radius:20px;background:#fafcfb;overflow:hidden;touch-action:none;user-select:none}.stage.grid{background-image:linear-gradient(#dde6df66 1px,transparent 1px),linear-gradient(90deg,#dde6df66 1px,transparent 1px);background-size:5% 10%}.center-art{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none;opacity:.65}.center-art>span{font-size:6px;letter-spacing:2.2px;color:#a5b1a7;z-index:1}.center-art>strong{font-family:Manrope,sans-serif;font-size:clamp(13px,1.7vw,27px);letter-spacing:-1px;font-weight:500;color:#7b8d80;margin:9px 0 4px;z-index:1}.center-art>small{font-size:7px;color:#9aa79d;z-index:1}.orbit{position:absolute;width:36%;aspect-ratio:1;border:1px solid #e3ebe5;border-radius:50%;transform:rotate(-25deg) scaleY(.65)}.orbit.two{transform:rotate(25deg) scaleY(.65);width:44%}.waveform{display:flex;align-items:center;gap:3px;height:24px;margin-top:9px;opacity:.55}.waveform i{display:block;width:2px;background:#b4cbbb;border-radius:1px}.guides{pointer-events:none;position:absolute;inset:0;overflow:hidden}.reach{position:absolute;bottom:-12%;width:42%;height:64%;border-radius:50%;border:1px dashed #b2d6ba;background:#ccebd11c}.reach.lt{left:-9%}.reach.rt{right:-9%;border-color:#cbbde3;background:#d6c9ee20}.reach span{position:absolute;bottom:24%;font-size:6px;letter-spacing:1.5px;color:#92b499}.reach.lt span{left:40%}.reach.rt span{right:40%;color:#ad9cc4}.index-guide{position:absolute;top:8%;font-size:6px;color:#9faf9f;letter-spacing:1.3px}.index-guide.left{left:9%}.index-guide.right{right:9%;color:#b3a2c6}#controls{position:absolute;inset:0}.game-control{position:absolute;display:flex;align-items:center;justify-content:center;flex-direction:column;border:1.5px solid color-mix(in srgb,var(--color),#54765d 15%);background:color-mix(in srgb,var(--color) 42%,transparent);color:color-mix(in srgb,var(--color),#273c31 60%);border-radius:50%;cursor:move;touch-action:none;gap:2px;box-shadow:inset 0 0 0 4px #ffffff42;outline:none}.game-control.selected:after{content:"";position:absolute;inset:-6px;border:1px solid #709c79;border-radius:7px;pointer-events:none}.game-control .control-symbol{font-size:clamp(12px,1.7vw,26px);line-height:1;pointer-events:none}.game-control .control-label{font-size:clamp(6px,.64vw,10px);letter-spacing:1px;font-weight:600;pointer-events:none;max-width:90%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.game-control.rect{border-radius:12px}.game-control.zone{border-style:dashed;border-radius:13px;background:color-mix(in srgb,var(--color) 22%,transparent)}.game-control.joy .knob{position:absolute;width:43%;height:43%;background:color-mix(in srgb,var(--color) 90%,white);border:1px solid #6d9a7855;border-radius:50%;box-shadow:0 3px 6px #293e321a;pointer-events:none}.game-control.joy .control-label{position:absolute;bottom:10%;font-size:6px}.game-control.joy .control-symbol{opacity:.35;font-size:30px}.resize-handle{position:absolute;bottom:-9px;right:-9px;width:9px;height:9px;background:#fff;border:1.5px solid #709c79;border-radius:2px;cursor:nwse-resize;z-index:3}.game-control.pressed{filter:saturate(1.6);box-shadow:0 0 0 7px color-mix(in srgb,var(--color) 28%,transparent),inset 0 0 15px #fff8}.game-control.pressed .control-symbol{transform:scale(1.18)}.test .game-control{cursor:pointer}.test .game-control.selected:after,.test .resize-handle{display:none}.test .center-art{opacity:.35}.canvas-bottom{font-size:8px;letter-spacing:0;margin-bottom:17px}.finger-legend{display:flex;gap:14px}.finger-legend span{display:flex;gap:5px;align-items:center}.finger-legend i{width:5px;height:5px;border-radius:50%}.mint{background:#94c9a2}.purple{background:#b7a2d9}.canvas-options{border-top:1px solid #dce4de;display:flex;align-items:center;gap:17px;padding:13px 0;font-size:9px;color:#7e8e83;background:#eef2ef}.canvas-options label{display:flex;align-items:center;gap:5px;white-space:nowrap}.canvas-options input{width:11px;height:11px;margin:0}.auto-scale{margin-left:auto;color:#a0aba3}.preset-section{margin:26px 0}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.section-title h2{font-size:12px;font-weight:500;margin:0}.section-title>span{font-size:8px;letter-spacing:1.2px;color:#929c95}.preset-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.preset{display:flex;gap:10px;align-items:center;text-align:left;background:#fff;border:1px solid #e3e8e4;border-radius:8px;padding:12px 9px;min-width:0}.preset.active{border-color:#abc5af;background:#f6faf6}.preset:hover{border-color:#8cae94}.preset strong{font-size:10px;display:block;font-weight:500}.preset span{display:block;font-size:8px;color:#98a29a;margin-top:4px;line-height:1.4}.preset b{font-weight:400;color:#8a9a8e;margin-left:auto}.mini-layout{position:relative;flex-shrink:0;width:48px;height:29px;border:1px solid #c9d5cd;border-radius:5px;background:#eef4ef}.mini-layout i{position:absolute;width:8px;height:8px;border-radius:50%;background:#a0c8ac;bottom:4px;left:6px}.mini-layout i:nth-child(2){left:auto;right:6px;background:#c3b2dc}.rhythm-mini i:nth-child(3){top:4px;left:8px;width:11px;height:4px;border-radius:2px}.rhythm-mini i:nth-child(4){top:4px;left:auto;right:8px;width:11px;height:4px;border-radius:2px;background:#c3b2dc}.dual-mini i{width:13px;height:13px;bottom:7px}.blank-mini{display:grid;place-items:center;color:#a6b5ab;border-style:dashed}.bottom-panel{border:1px solid #e3e8e4;background:#fff;border-radius:9px;overflow:hidden}.panel-tabs{display:flex;align-items:center;gap:17px;border-bottom:1px solid #e8ece9;padding:0 14px}.panel-tabs button{font-size:10px;background:transparent;border:0;border-bottom:2px solid transparent;padding:14px 0;color:#939c96}.panel-tabs button.active{border-color:#568866;color:#385540}.panel-tabs button span{font-size:8px;background:#eff3ef;padding:2px 4px;border-radius:4px;margin-left:4px}.panel-tabs>span{margin-left:auto;color:#a0a8a2;font-size:8px}.layer-row{display:flex;align-items:center;gap:9px;padding:10px 14px;border-bottom:1px solid #f0f3f0;font-size:10px;cursor:pointer}.layer-row:last-child{border:0}.layer-row.active{background:#f5f9f5}.layer-color{width:7px;height:7px;border-radius:50%}.layer-row .layer-name{flex:1}.layer-row .layer-finger{color:#98a29b;font-size:9px}.layer-row button{background:transparent;border:0;color:#93a196;padding:1px 5px;font-size:12px}.layer-row .visible-false{opacity:.4}footer{display:flex;align-items:center;justify-content:space-between;padding:21px 0;font-size:8px;color:#97a199}footer>span:last-child{font-size:7px;letter-spacing:1.2px}.selection-card{display:flex;gap:10px;align-items:center;background:#f5f8f5;border:1px solid #e6ece6;border-radius:7px;padding:12px}.selection-card b{display:block;font-size:12px;font-weight:500}.selection-card small{display:block;color:#96a299;font-size:9px;margin-top:5px}.prop-section{padding:20px 0;border-bottom:1px solid #edf0ed}.prop-title{font-size:9px;font-weight:600;letter-spacing:1.4px;color:#859288;margin-bottom:13px}.field{display:block;font-size:10px;color:#829086;margin-bottom:12px}.field:last-child{margin-bottom:0}.field input:not([type=range]):not([type=color]),.field select{display:block;background:#fcfdfc;border:1px solid #e3e9e3;border-radius:5px;padding:9px;width:100%;margin-top:7px;color:#536359;font-size:11px}.field input[type=color]{display:block;margin-top:7px;width:100%;height:30px;border:1px solid #e3e9e3;background:#fff;border-radius:5px}.field input[type=range]{width:100%;height:3px;margin:13px 0 7px}.field-head{display:flex;align-items:center;justify-content:space-between}.field-head output{font-size:10px;color:#587361}.field-pair{display:grid;grid-template-columns:1fr 1fr;gap:10px}.field-pair .field{margin:0}.finger-buttons{display:grid;grid-template-columns:1fr 1fr;gap:6px}.finger-buttons button{font-size:9px;border:1px solid #e4e9e5;border-radius:5px;padding:9px 5px;background:#fff;color:#8b978f}.finger-buttons button.active{background:#eef7ef;border-color:#abc7af;color:#54735b}.color-swatches{display:flex;gap:8px;margin-bottom:13px}.color-swatches button{width:23px;height:23px;border:3px solid white;border-radius:50%;box-shadow:0 0 0 1px #e1e6e2}.color-swatches button.active{box-shadow:0 0 0 1.5px #718b77}.inspector-actions{display:flex;gap:8px;margin-top:20px}.inspector-actions .btn{font-size:10px;padding:9px;flex:1;justify-content:center}.inspector-actions .delete{color:#b67e7a;flex:0}.inspector-tip{display:flex;gap:10px;padding:16px 12px;background:#f8f6f0;border:1px solid #eeece2;border-radius:7px;margin-top:24px;color:#9a957f}.inspector-tip>span{font-size:22px}.inspector-tip b{font-size:10px;font-weight:500;color:#7f7d67}.inspector-tip p{font-size:9px;line-height:1.8;margin:5px 0 0}.empty-state{padding:30px 16px;text-align:center;color:#99a39b;font-size:11px;line-height:1.8}.event-row{padding:7px 14px;display:flex;gap:10px;font-size:10px;border-bottom:1px solid #f0f3f1}.event-row time{color:#a3ada6;font-size:9px}.event-row b{font-weight:500;min-width:70px}.event-row span{color:#718778}#events{max-height:180px;overflow:auto}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,15px);background:#293f32;color:#f5fff5;border-radius:9px;padding:13px 20px;box-shadow:0 5px 30px #25352c26;font-size:12px;opacity:0;pointer-events:none;transition:all .2s;z-index:100}#toast.visible{opacity:1;transform:translate(-50%,0)}.canvas-area:fullscreen{display:flex;flex-direction:column;justify-content:center;background-color:#e9eee9;padding:12px 20px}.canvas-area:fullscreen .phone-shell{max-width:calc((100vh - 115px)*2.22);margin:10px auto}.canvas-area:fullscreen .canvas-options{background:transparent}.canvas-area:fullscreen .canvas-caption,.canvas-area:fullscreen .canvas-bottom{flex-shrink:0}.canvas-area:fullscreen .canvas-bottom{margin-bottom:6px}.canvas-area:fullscreen .stage .control-label{font-size:12px}.canvas-area:fullscreen .stage .control-symbol{font-size:30px}[hidden]{display:none!important}@media(min-width:1600px){.workspace{padding:38px 48px 0}.app-layout{grid-template-columns:260px minmax(600px,1fr) 280px}.workspace-heading h1{font-size:31px}.preset strong{font-size:12px}.preset span{font-size:10px}.phone-shell{margin:30px 0 25px}.canvas-area{padding:25px 28px 0}}@media(max-width:1200px){.topbar{padding:0 20px;gap:15px}.project-badge,.save-status{display:none}.app-layout{grid-template-columns:206px minmax(400px,1fr) 225px}.workspace{padding:25px 20px 0}.library,.inspector{padding:25px 14px}.workspace-heading h1{font-size:22px}.version-tag{display:none}.preset-grid{gap:6px}.preset{gap:7px}.preset b{display:none}.mini-layout{width:34px}.preset span{font-size:7px}.toolbar-right{gap:0}.mode-switch button{padding:7px 9px}.canvas-area{padding:15px 14px 0}.panel-tabs>span{display:none}}@media(max-width:980px){.app-layout{grid-template-columns:185px minmax(0,1fr)}.inspector{grid-column:1/-1;border-top:1px solid var(--line);padding:20px}.inspector #properties{display:flex;flex-wrap:wrap;gap:20px;align-items:flex-start}.inspector .prop-section{padding:0 15px 10px 0;min-width:170px;max-width:220px;border:0}.inspector .selection-card{max-width:230px}.inspector-actions{margin:0}.inspector-tip{max-width:400px}.project-heading{display:none}.header-actions{margin-left:auto}.topbar{height:70px}.workspace-heading h1{font-size:21px}.library{padding:25px 12px}.control-card{padding:8px;gap:7px}.card-icon{width:28px;height:28px;font-size:18px}.card-copy b{font-size:10px}.card-copy small{font-size:8px}.card-plus{display:none}.preset strong{font-size:9px}.mini-layout{display:none}}@media(max-width:620px){.topbar{height:65px;padding:0 14px}.brand{min-width:0}.brand strong{font-size:18px}.brand-mark{width:35px;height:35px;font-size:28px;line-height:35px}.header-actions{gap:5px}.btn{font-size:10px;padding:8px 9px}.app-layout{display:flex;flex-direction:column}.workspace{order:0;padding:22px 12px 0}.library{order:1;padding:20px;border-top:1px solid var(--line)}.inspector{order:2}.workspace-heading{margin-bottom:20px}.workspace-heading h1{font-size:24px}.workspace-heading p{font-size:10px}.canvas-toolbar{gap:4px}.divider{margin:0 3px}.toolbar-right select{font-size:9px;padding:5px;max-width:106px}.mode-switch button{font-size:10px;padding:7px 8px}.icon-btn{width:24px}.canvas-area{padding:12px 10px 0}.phone-shell{padding:6px;border-radius:21px;margin-top:15px}.stage{border-radius:16px}.canvas-options{gap:10px;font-size:8px}.canvas-options .auto-scale{display:none}.canvas-bottom{font-size:7px}.finger-legend{gap:7px}.preset{padding:12px 8px}.preset span{font-size:8px}.section-title h2{font-size:11px}.section-title>span{font-size:7px}.control-card{display:inline-flex;width:calc(50% - 8px);margin:4px;vertical-align:top}.card-copy b{font-size:11px}.card-copy small{font-size:9px}.library .rail-heading h2{margin-bottom:12px}.library-note{display:none}.game-control .control-symbol{font-size:15px}.game-control .control-label{font-size:6px}}@media(max-height:550px) and (orientation:landscape){body.testing .topbar,body.testing .library,body.testing .inspector,body.testing .workspace-heading,body.testing .preset-section,body.testing .bottom-panel,body.testing footer{display:none}body.testing .app-layout{display:block}body.testing .workspace{padding:5px 20px}body.testing .canvas-toolbar{margin-bottom:4px}body.testing .canvas-area{padding:5px 10px}body.testing .canvas-caption,body.testing .canvas-options,body.testing .canvas-bottom{display:none}body.testing .phone-shell{max-width:calc((100vh - 72px)*2.22);margin:5px auto}}

@media(min-width:981px){.topbar{position:sticky;top:0;z-index:30}.library,.inspector{position:sticky;top:82px;height:calc(100vh - 82px);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#dce5dd transparent;align-self:start}}
@media(max-width:380px){.canvas-toolbar{flex-wrap:wrap}.toolbar-right{margin-left:auto}.brand strong{font-size:16px}.brand strong span{letter-spacing:1.8px}.header-actions .btn{gap:4px;padding:7px}.canvas-bottom{flex-wrap:wrap;gap:7px}.finger-legend{margin-left:auto}}

/* Curved rhythm lanes use screen-height units, so strokes stay proportional. */
.preset-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.curve-mini{font-size:27px;color:#82b494;line-height:1}
.curve-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.curve-svg .game-control.curve-control{display:inline;position:static;border:0;border-radius:0;background:none;box-shadow:none;pointer-events:none;filter:none}
.stage:not(.test) .curve-svg.selected-lane{z-index:2}
.curve-control.selected:after{display:none}
.lane-ribbon{fill:var(--color);fill-opacity:.18;stroke:var(--color);stroke-width:.22;stroke-opacity:.65;pointer-events:visiblePainted;cursor:pointer}
.lane-center{fill:none;stroke:var(--color);stroke-width:.28;stroke-dasharray:1 1.8;opacity:.65;pointer-events:none}
.lane-select{fill:none;stroke:transparent;pointer-events:stroke;cursor:pointer}
.lane-origin{fill:#fbfdfb;stroke:var(--color);stroke-width:.6;pointer-events:none}
.lane-dot{fill:var(--color);opacity:.65;pointer-events:none}
.flow-note{fill:var(--color);stroke:white;stroke-width:.35;pointer-events:none}
.strike-hit{fill:var(--color);fill-opacity:.16;stroke:none;pointer-events:fill;cursor:grab}
.strike-line{fill:var(--color);stroke:none;pointer-events:fill;cursor:grab}
.strike-cap{fill:var(--color);pointer-events:none}
.curve-label{font-family:'DM Sans',sans-serif;font-size:2.25px;font-weight:600;letter-spacing:.22px;fill:color-mix(in srgb,var(--color),#243a30 32%);pointer-events:none}
.handle-tether{fill:none;stroke:#8b9e91;stroke-width:.22;stroke-dasharray:1 1;pointer-events:none}
.curve-handle{fill:white;stroke:#54775f;stroke-width:.55;pointer-events:all;cursor:grab}
.curve-handle.c1,.curve-handle.c2{stroke:#a394be;fill:#fbf8ff}
.strike-hint{fill:#6e8475;font-size:1.9px;letter-spacing:.3px;pointer-events:none}
.curve-control.selected .lane-ribbon{fill-opacity:.28;stroke-opacity:1;stroke-width:.35}
.test .lane-select,.test .lane-ribbon{pointer-events:none}
.test .strike-hit,.test .strike-line{cursor:pointer}
.curve-control.pressed .strike-hit{fill-opacity:.55}
.curve-control.pressed .strike-line{fill:#fff}
.has-curves .center-art{opacity:.17}
.has-curves .guides{opacity:.3}
.curve-editor-note{margin-top:14px;background:#f4f8f3;border:1px solid #e0ebe0;border-radius:7px;padding:11px 12px}
.curve-editor-note b{font-size:10px;font-weight:500;color:#52745b}
.curve-editor-note p,.curve-explainer{font-size:10px;line-height:1.7;color:#8b998e;margin:5px 0 0}
.curve-coordinates{margin-top:12px;font-size:10px;color:#69816f}
.curve-coordinates summary{cursor:pointer;padding:7px 0}
.curve-point-title{font-size:9px;color:#8d9b90;margin:13px 0 7px}
.reset-curve{font-size:9px;width:100%;justify-content:center;margin-top:16px}
@media(max-width:620px){.canvas-options{flex-wrap:wrap}.curve-label{font-size:2.5px}.curve-handle{r:2.7px}.strike-hint{font-size:2.2px}}
@media(prefers-reduced-motion:reduce){.flow-note{display:none}}


.left-hand-study .center-art{display:none}
.left-hand-study .guides .reach,.left-hand-study .guides .index-guide{display:none}
#hand-study-overlay{position:absolute;inset:0;pointer-events:none}
.half-divider{position:absolute;left:50%;top:10%;height:80%;border-left:1px dashed #d4dfd7;opacity:.6}
.unused-half{position:absolute;left:63%;top:29%;width:31%;color:#9da9a0}
.unused-half .eyebrow{font-size:clamp(5px,.65vw,9px);letter-spacing:1.2px}
.unused-half strong{display:block;font-family:Manrope,sans-serif;font-weight:500;font-size:clamp(13px,1.8vw,28px);line-height:1.35;letter-spacing:-.5px;margin:9px 0}
.unused-half p{font-size:clamp(6px,.8vw,11px);margin:6px 0}
.unused-half small{font-size:clamp(5px,.65vw,9px);line-height:1.6;color:#a9b2ac}
.left-hand-study .curve-label{font-size:2.6px}
.left-hand-fit{border:1px solid #dde7dd;border-radius:9px;background:#f5f9f4;margin-top:14px;padding:15px 16px}
.fit-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:11px}
.fit-tag{font-size:8px;letter-spacing:.8px;color:#8f9f91;white-space:nowrap}
.fit-targets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.fit-target{display:flex;align-items:center;flex-wrap:wrap;gap:6px;border:1px solid #e0e8df;border-radius:6px;background:#fff;padding:10px 8px;text-align:left;color:#718575;font-size:9px}
.fit-target.active{border-color:#a7bea7;background:#edf5eb}
.fit-target i{width:6px;height:6px;border-radius:50%;flex-shrink:0}
.fit-target b{display:block;width:100%;font-weight:500;font-size:14px;letter-spacing:.5px;padding-left:12px;color:#455f4b}
.left-hand-fit p{font-size:10px;line-height:1.8;color:#7d8c80;margin:12px 0 5px}
.left-hand-fit p b{font-weight:500;color:#55715a}
.left-hand-fit>small{font-size:9px;line-height:1.7;color:#98a397;display:block}
.preset[data-preset="left-hand"]{grid-column:1/-1}
.left-hand-mini{color:#749278;font-size:21px}
@media(max-width:620px){.left-hand-fit{padding:12px}.fit-tag{display:none}.fit-target{font-size:8px;padding:8px 6px}.unused-half strong{margin:5px 0}.unused-half small{display:none}}
@media(max-height:550px) and (orientation:landscape){body.testing .left-hand-fit{display:none}}

.restore-layout{margin-left:auto;margin-right:12px;border:0;background:transparent;padding:4px;color:#7e9582;font-size:9px;text-decoration:underline;text-underline-offset:3px}@media(max-width:620px){.preset-section .section-title{flex-wrap:wrap;gap:8px}.restore-layout{margin-left:0}}

.edge-option{display:flex;align-items:center;gap:7px;margin-top:14px;font-size:10px;color:#6d8574}.edge-option input{accent-color:#628c70;margin:0}

.edge-readout{display:flex;justify-content:space-between;align-items:center;padding:9px;margin-top:10px;background:#f1f7f0;border-radius:5px;font-size:9px;color:#869789}.edge-readout b{font-size:11px;color:#4b6b55;font-weight:500}

.mirror-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;margin:14px 0;border:1px solid #dce5df;border-radius:12px;background:#f0f5f1}.mirror-toolbar strong{font-size:12px;color:#354b40}.mirror-toolbar p{font-size:11px;line-height:1.6;color:#718278;margin:4px 0 0}.mirror-toolbar .btn{white-space:nowrap;flex-shrink:0}.mirror-toolbar .btn:disabled{opacity:.45;cursor:default}@media(max-width:600px){.mirror-toolbar{align-items:stretch;flex-direction:column}.mirror-toolbar .btn{align-self:flex-start}}