:root{--bg:#14161a;--panel:#1c1f26;--edge:#2a2e38;--text:#d6dae2;--dim:#8a91a0;--accent:#5bc8af;--warn:#e4b363;--err:#e46363;font-family:Inter,system-ui,sans-serif}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}body.bench{padding:1rem 1.5rem 4rem}header{flex-wrap:wrap;align-items:baseline;gap:1rem;display:flex}h1{margin:.5rem 0;font-size:1.4rem}h1 .sub{color:var(--dim);font-size:.85rem;font-weight:400}h2{color:var(--accent);margin:0 0 .75rem;font-size:1rem}h3{color:var(--dim);margin:.5rem 0 .25rem;font-size:.85rem}.badge{border:1px solid var(--edge);color:var(--dim);border-radius:999px;padding:.2rem .6rem;font-size:.75rem}.badge.ok{color:var(--accent);border-color:var(--accent)}.badge.err{color:var(--err);border-color:var(--err)}main{grid-template-columns:repeat(auto-fit,minmax(420px,1fr));align-items:start;gap:1rem;display:grid}.panel{background:var(--panel);border:1px solid var(--edge);border-radius:10px;padding:1rem}.row{flex-wrap:wrap;align-items:center;gap:.75rem;margin-bottom:.6rem;display:flex}.monitor-head{justify-content:flex-start}.monitor-head h3{margin:0}label{color:var(--dim);font-size:.85rem}label input[type=range]{vertical-align:middle;accent-color:var(--accent)}button{color:var(--text);border:1px solid var(--edge);cursor:pointer;background:#262b35;border-radius:6px;padding:.45rem .9rem;font-size:.85rem}button:hover{border-color:var(--accent)}button.primary{background:var(--accent);color:#10231e;font-weight:600}button.primary:disabled{opacity:.7;cursor:default}button.small{padding:.2rem .6rem;font-size:.75rem}select,input[type=number]{color:var(--text);border:1px solid var(--edge);background:#262b35;border-radius:6px;max-width:16rem;padding:.35rem .5rem;font-size:.85rem}input[type=number]{width:5rem}.stats{color:var(--dim);font-variant-numeric:tabular-nums;font-size:.8rem}.hint{color:var(--dim);margin:.5rem 0 0;font-size:.75rem}.small{font-size:.75rem}.device-list{margin-bottom:.5rem}.device{color:var(--text);padding:.15rem 0;font-size:.8rem}.log{border:1px solid var(--edge);white-space:pre;background:#10131a;border-radius:6px;height:14rem;margin:0;padding:.5rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.72rem;line-height:1.5;overflow-y:auto}.piano{user-select:none;height:110px;margin-top:.5rem;display:flex;position:relative}.key{border:1px solid #000;border-radius:0 0 4px 4px;padding:0}.key.white{z-index:1;background:#e8eaee;flex:1}.key.black{z-index:2;background:#23262d;width:24px;height:62%;margin:0 -12px}.key.white.held,.key.white.lit{background:var(--accent)}.key.black.held,.key.black.lit{background:#3d8a77}.welcome{background:radial-gradient(42rem 30rem at 50% 40%,#5bc8af12,#0000 70%);place-items:center;min-height:100vh;display:grid}.welcome-card{text-align:center;background:var(--panel);border:1px solid var(--edge);border-radius:16px;max-width:26rem;padding:3rem 3.5rem}.logo{letter-spacing:-.03em;color:var(--text);margin:0;font-size:3rem}.logo.small{font-size:1.3rem;font-weight:700}.tagline{color:var(--dim);margin:.5rem 0 2rem;font-size:1.05rem}.begin{background:var(--accent);color:#10231e;cursor:pointer;border:none;border-radius:999px;padding:.9rem 2rem;font-size:1.1rem;font-weight:700}.begin:hover{filter:brightness(1.1)}.begin:disabled{opacity:.7;cursor:default}.fine-print{color:var(--dim);margin-top:2rem;font-size:.8rem;line-height:1.5}.error-text{color:var(--err);font-size:.85rem}.dots:after{content:"";text-align:left;width:1.2em;animation:1.2s step-end infinite dots;display:inline-block}@keyframes dots{0%{content:""}25%{content:"."}50%{content:".."}75%{content:"..."}}.logo .flip{color:var(--accent);display:inline-block}.welcome-card.intro .logo .flip{animation:1.1s cubic-bezier(.34,1.35,.5,1) .8s both logo-flip}@keyframes logo-flip{0%{transform:rotate(180deg)}to{transform:rotate(0)}}.welcome-card.intro .tagline,.welcome-card.intro .begin,.welcome-card.intro .fine-print{animation:.55s ease-out both rise}.welcome-card.intro .tagline{animation-delay:1.5s}.welcome-card.intro .begin{animation-delay:1.7s}.welcome-card.intro .fine-print{animation-delay:1.9s}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.logo.small .flip{transition:transform .45s cubic-bezier(.34,1.3,.6,1)}.logo.small:hover .flip{transform:rotate(180deg)}@media (prefers-reduced-motion:reduce){.welcome-card.intro .logo .flip,.welcome-card.intro .tagline,.welcome-card.intro .begin,.welcome-card.intro .fine-print{animation:none}.logo.small .flip{transition:none}.play.on{animation:none}.dots:after{content:"…";animation:none}}.studio{flex-direction:column;height:100vh;display:flex;overflow:hidden}.studio-header{border-bottom:1px solid var(--edge);background:var(--panel);flex-wrap:wrap;align-items:center;gap:.9rem 1.25rem;padding:.75rem 1.25rem;display:flex}.diag-link{color:var(--text);border:1px solid var(--edge);background:#262b35;border-radius:6px;padding:.2rem .6rem;text-decoration:none;display:inline-block}.diag-link:hover{border-color:var(--accent)}.header-link:hover{border-color:var(--warn)}.channel-status{color:var(--dim);margin-bottom:.6rem;font-size:.75rem}.channel-status strong{color:var(--accent);font-weight:600}.share-chip.on{border-color:var(--accent);color:var(--accent)}.projects-wrap{position:relative}.projects-pop{z-index:40;background:var(--panel);border:1px solid var(--edge);border-radius:10px;flex-direction:column;gap:.5rem;width:19rem;padding:.6rem;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 30px #00000073}.projects-current{gap:.4rem;display:flex}.project-name{color:var(--text);border:1px solid var(--edge);background:#262b35;border-radius:6px;flex:1;min-width:0;padding:.25rem .5rem;font-size:.8rem}.new-project{align-self:flex-start}.projects-list{border-top:1px solid var(--edge);max-height:14rem;margin:0;padding:.25rem 0 0;list-style:none;overflow-y:auto}.projects-list li{align-items:center;gap:.35rem;display:flex}.project-open{text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;justify-content:space-between;align-items:baseline;gap:.5rem;min-width:0;padding:.35rem .3rem;display:flex}.project-open:hover{background:#262b35;border:none}.project-title{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.project-when{color:var(--dim);flex:none;font-size:.68rem}.project-del{padding:.1rem .45rem}.studio-footer{text-align:center;color:var(--dim);opacity:.65;user-select:none;flex:none;padding:3px 0 5px;font-size:11px}.studio-main{flex:1;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(330px,30rem) 1fr;gap:.9rem;min-height:0;padding:.9rem;display:grid}.left-col{flex-direction:column;gap:.9rem;height:100%;min-height:0;display:flex;overflow:hidden auto}@media (width<=1080px){.studio{height:auto;overflow:visible}.share-chip.on{border-color:var(--accent);color:var(--accent)}.projects-wrap{position:relative}.projects-pop{z-index:40;background:var(--panel);border:1px solid var(--edge);border-radius:10px;flex-direction:column;gap:.5rem;width:19rem;padding:.6rem;display:flex;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 8px 30px #00000073}.projects-current{gap:.4rem;display:flex}.project-name{color:var(--text);border:1px solid var(--edge);background:#262b35;border-radius:6px;flex:1;min-width:0;padding:.25rem .5rem;font-size:.8rem}.new-project{align-self:flex-start}.projects-list{border-top:1px solid var(--edge);max-height:14rem;margin:0;padding:.25rem 0 0;list-style:none;overflow-y:auto}.projects-list li{align-items:center;gap:.35rem;display:flex}.project-open{text-align:left;cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;justify-content:space-between;align-items:baseline;gap:.5rem;min-width:0;padding:.35rem .3rem;display:flex}.project-open:hover{background:#262b35;border:none}.project-title{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.8rem;overflow:hidden}.project-when{color:var(--dim);flex:none;font-size:.68rem}.project-del{padding:.1rem .45rem}.studio-footer{text-align:center;color:var(--dim);opacity:.65;user-select:none;flex:none;padding:3px 0 5px;font-size:11px}.studio-main{grid-template-columns:1fr}.left-col{height:auto;overflow:visible}}.transport{align-items:center;gap:1rem;display:flex}.play{background:var(--accent);color:#10231e;cursor:pointer;border:none;border-radius:50%;place-items:center;width:52px;height:52px;font-size:1.3rem;transition:transform 50ms;display:grid}.play:hover{filter:brightness(1.1)}.play:active{transform:scale(.94)}.play.on{background:var(--warn);animation:beat-pulse var(--beat,.6s) ease-out infinite}@keyframes beat-pulse{0%{box-shadow:0 0 #e4b3638c}70%{box-shadow:0 0 0 13px #e4b36300}to{box-shadow:0 0 #e4b36300}}.position{font-variant-numeric:tabular-nums;min-width:3.5rem;color:var(--text);font-family:JetBrains Mono,ui-monospace,monospace;font-size:1.15rem}.position.counting{color:var(--warn);animation:1s ease-in-out infinite rec-pulse}.tempo{align-items:center;gap:.35rem;display:flex}.tempo input{text-align:center;font-variant-numeric:tabular-nums;width:3.6rem;font-size:1rem}.tempo input::-webkit-outer-spin-button{-webkit-appearance:none}.tempo input::-webkit-inner-spin-button{-webkit-appearance:none}.tempo .unit{color:var(--dim);font-size:.75rem}.nudge{border-radius:6px;width:30px;height:30px;padding:0;font-size:1rem}.toggle.on{border-color:var(--accent);color:var(--accent)}.card{background:var(--panel);border:1px solid var(--edge);border-radius:12px;padding:.9rem 1rem}.card-head{align-items:baseline;gap:.75rem;margin-bottom:.75rem;display:flex}.card-head h2{color:var(--text);margin:0;font-size:1rem}.oct-ctl{align-items:center;gap:.35rem;display:inline-flex}.oct-label{color:var(--dim);text-align:center;min-width:4.2em;font-size:.75rem}.sound-name{color:var(--accent);font-size:.9rem}.midi-chip{color:var(--dim);background:#10131a;border-radius:8px;margin-bottom:1rem;padding:.5rem .75rem;font-size:.85rem}.midi-chip .ok{color:var(--accent)}.midi-chip .chip-note{color:var(--dim);font-style:normal}.midi-chip .chip-note strong{color:var(--text)}.knobs{flex-wrap:wrap;gap:2rem;margin-bottom:1rem;display:flex}.knobs label{flex-direction:column;gap:.3rem;display:flex}.knobs input[type=range]{width:12rem}.knob-name{color:var(--text);font-size:.85rem}.real-term{color:var(--dim);margin-left:.4rem;font-size:.72rem;font-style:normal}.sound-piano{margin-top:.5rem}.pad-surface{grid-template-columns:repeat(4,1fr);gap:.4rem;margin-top:.5rem;display:grid}.pad{aspect-ratio:2.6;border:1px solid var(--edge);cursor:pointer;user-select:none;touch-action:none;background:#232833;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:.15rem;min-width:0;display:flex}.pad:active,.pad.lit{background:var(--accent);border-color:var(--accent)}.pad:active .pad-name,.pad.lit .pad-name,.pad:active .pad-note,.pad.lit .pad-note{color:#10231e}.pad-name{color:var(--text);font-size:.8rem;font-weight:600}.pad-note{color:var(--dim);font-size:.65rem}.clip-card{flex-direction:column;height:100%;min-height:0;display:flex;overflow:hidden}@media (width<=1080px){.clip-card{height:auto}}.card-head .tip{color:var(--dim);text-align:right;margin-left:auto;font-size:.72rem}.clip-controls{align-items:center;gap:.75rem;margin-bottom:.75rem;display:flex}.clip-controls .spacer{flex:1}.clip-controls label{align-items:center;gap:.4rem;font-size:.8rem;display:flex}.clip-controls button:disabled{opacity:.4;cursor:default}.tracks-panel,.sound-card{flex:none}.track-row{border:1px solid var(--edge);cursor:pointer;background:#171a20;border-radius:8px;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;margin-bottom:.5rem;padding:.5rem .6rem;display:flex}.track-row.selected{border-color:var(--accent);background:#1a2027}.track-row.collapsed{padding:.3rem .6rem}.track-row.collapsed .track-name{font-size:.85rem}.track-summary{color:var(--dim);white-space:nowrap;text-overflow:ellipsis;max-width:11rem;font-size:.78rem;overflow:hidden}.track-row .spacer{flex:1}.track-name{color:var(--text);background:0 0;border:1px solid #0000;border-radius:6px;width:8rem;padding:.25rem .4rem;font-size:.9rem;font-weight:600}.track-name:hover,.track-name:focus{border-color:var(--edge);background:#10131a}.mini-label{color:var(--dim);margin-bottom:.1rem;font-size:.62rem;display:block}.track-out select{max-width:11rem}.track-ch select{width:4rem}.track-nudge input{width:4.2rem}.track-warn{color:var(--warn);font-size:.75rem}.track-remove{color:var(--dim)}.track-remove:hover:not(:disabled){color:var(--err);border-color:var(--err)}.add-track{width:100%;color:var(--dim);border-style:dashed;padding:.55rem;font-size:.85rem}.add-track:hover{color:var(--accent)}.roll-scroll{border:1px solid var(--edge);background:#171a20;border-radius:8px;flex:1;min-height:8rem;position:relative;overflow-y:auto}.key-rename{border-radius:3px;height:16px;padding:0 4px;font-size:.7rem}@media (width<=1080px){.roll-scroll{flex:none;max-height:480px}}.piano-roll{touch-action:none;user-select:none;width:100%;display:block}.drum-wrap{width:100%;position:relative}.drum-grid{touch-action:none;user-select:none;width:100%;display:block}.lane-rename{border:1px solid var(--accent);width:84px;height:26px;color:var(--text);z-index:5;background:#10131a;border-radius:5px;padding:0 6px;font-size:.78rem;position:absolute;left:4px}.view-switch{border:1px solid var(--edge);border-radius:6px;display:flex;overflow:hidden}.view-switch button{border:none;border-radius:0}.view-switch button.active{background:var(--accent);color:#10231e;font-weight:600}.pad-learn{border:1px solid var(--accent);background:#14201d;border-radius:8px;margin-bottom:.75rem;padding:.75rem}.pad-learn-head{color:var(--text);margin-bottom:.5rem;font-size:.85rem}.pad-learn-chips{flex-wrap:wrap;gap:.35rem;margin-bottom:.6rem;display:flex}.pad-chip{border:1px solid var(--edge);color:var(--accent);background:#10131a;border-radius:999px;padding:.15rem .5rem;font-size:.72rem}.pad-chip.idle{color:var(--dim)}.pad-learn-actions{gap:.5rem;display:flex}.sample-browser{border:1px solid var(--edge);background:#14181f;border-radius:8px;margin-bottom:.75rem;padding:.6rem .75rem}.sb-head{flex-wrap:wrap;align-items:center;gap:.6rem;display:flex}.sb-hint{color:var(--dim);font-size:.72rem}.sb-status{color:var(--dim);margin-left:auto;font-size:.72rem}.sb-search{width:14rem}.sb-target{align-items:center;gap:.35rem;font-size:.8rem;display:flex}.sb-results{border-top:1px solid var(--edge);max-height:10rem;margin-top:.5rem;overflow-y:auto}.sb-row{align-items:center;gap:.6rem;padding:.15rem 0;font-size:.78rem;display:flex}.sb-name{color:var(--text);cursor:pointer;text-align:left;background:0 0;border:none;padding:.1rem .2rem}.sb-name:hover{color:var(--accent);border:none}.sb-path{color:var(--dim);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.68rem;overflow:hidden}.sb-more{color:var(--dim);padding:.3rem 0;font-size:.72rem}.sb-assigned{flex-wrap:wrap;gap:.35rem;margin-top:.5rem;display:flex}.sb-clear{color:var(--dim);cursor:pointer;background:0 0;border:none;margin-left:.3rem;padding:0;font-size:.7rem}.sb-clear:hover{color:var(--err);border:none}.sb-patch{border-left:2px solid var(--edge);margin:.15rem 0}.sb-patch-name{font-weight:600}.sb-nested{padding-left:1.5rem}.listen-inline{margin-left:auto;position:relative}.listen-controls{align-items:center;gap:.5rem;display:flex}.listen-controls select{max-width:8.5rem;padding:.2rem .5rem;font-size:.75rem}.listen-controls input[type=range]{width:4.5rem;accent-color:var(--accent)}.listen-meter{background:#10131a;border-radius:3px;width:90px;height:17px}.listen-error{z-index:30;background:var(--panel);border:1px solid var(--warn);color:var(--warn);white-space:nowrap;border-radius:6px;padding:.35rem .6rem;font-size:.78rem;position:absolute;top:calc(100% + 6px);right:0}.pad-learn-dups{color:var(--warn);margin-bottom:.4rem;font-size:.72rem}button.record{color:var(--dim)}button.record-all.on,button.record.on{border-color:var(--err);color:var(--err);background:#3a1d22;animation:1.6s ease-in-out infinite rec-pulse}@keyframes rec-pulse{50%{box-shadow:0 0 6px #e4636399}}.rec-snap select{max-width:7rem;font-size:.78rem}.parts-bar{border-bottom:1px solid #262b35;align-items:center;gap:.35rem;margin-bottom:.5rem;padding:.3rem .15rem .5rem;display:flex}.part-launch.current{border-color:var(--accent);color:var(--accent)}.clip-slots{gap:.2rem;display:flex}.slot{width:26px;height:26px;color:var(--dim);border-radius:5px;padding:0;font-size:.72rem}.slot.filled{color:var(--text)}.slot.playing{border-color:var(--accent);color:var(--accent);background:#173028}.slot.queued{border-color:var(--warn);color:var(--warn);animation:.8s ease-in-out infinite rec-pulse}.part-tag{color:var(--dim);font-size:.85rem;font-weight:400}