:root{--oled:#ff9a3c;--ink:#0a0c10;--panel:#14171c;--panel-2:#1b1f26;--panel-3:#232831;--line:#272c34;--line-soft:#1d2128;--signal:#5cc8f5;--signal-dim:#2f7da0;--active:#34d27f;--sweep:#f5b13d;--rec:#f0605c;--text:#e8ebf0;--text-muted:#99a1ad;--text-dim:#5b626d;--r-sm:6px;--r-md:10px;--r-lg:16px;--ease:cubic-bezier(.4,0,.2,1);--font-sans:system-ui,-apple-system,"Segoe UI",Roboto,Inter,"Helvetica Neue",Arial,sans-serif;--font-mono:ui-monospace,"SF Mono","JetBrains Mono","Roboto Mono",Menlo,Consolas,monospace}*,*:before,*:after{box-sizing:border-box}html,body,#app{height:100%}body{margin:0;background:var(--ink);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4,p{margin:0}button{font-family:inherit}a{color:inherit}::selection{background:#5cc8f540}*{scrollbar-width:thin;scrollbar-color:var(--panel-3) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--panel-3);border-radius:99px;border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-thumb:hover{background:#2e343e;background-clip:padding-box}:focus-visible{outline:2px solid var(--signal);outline-offset:2px}.ico{display:inline-block;vertical-align:middle;flex:0 0 auto}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 18px;border:2px solid #211f1b;border-radius:6px;background:#e7e5dd;color:#1b1b18;font-size:13px;font-weight:700;letter-spacing:.02em;cursor:pointer;text-decoration:none;transition:background .12s var(--ease)}.btn:hover{background:#fff}.btn:active{background:#d4d2c8}.btn:disabled{opacity:.4;pointer-events:none}.btn--primary{background:#1b1b18;color:#f0f0e8}.btn--primary:hover{background:#34342e}.btn--ghost{background:transparent}.btn--ghost:hover{background:#ffffff0a}.mbtn{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 11px;border:2px solid #211f1b;border-radius:6px;background:#e7e5dd;color:#1b1b18;font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:.02em;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:manipulation;transition:background .12s var(--ease),color .12s var(--ease)}.mbtn:hover{background:#fff}.mbtn:active,.mbtn.flash{background:#d4d2c8}.mbtn:disabled{opacity:.35;pointer-events:none}.mbtn.block{width:100%}.mbtn.on{background:#1b1b18;color:#f0f0e8}.mbtn.danger{color:#c0392b}.mbtn.danger.on{background:#c0392b;color:#fff}.mbtn--ghost{background:#e7e5dd}.mbtn--ghost.on{background:#1b1b18;color:#f0f0e8}[data-tip]{position:relative}[data-tip]:after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);left:50%;transform:translate(-50%) translateY(-3px);background:var(--panel-3);color:var(--text);border:1px solid var(--line);border-radius:6px;padding:4px 8px;font-family:var(--font-mono);font-size:11px;letter-spacing:.02em;line-height:1.2;white-space:nowrap;opacity:0;pointer-events:none;z-index:120;box-shadow:0 6px 18px #00000073;transition:opacity .12s var(--ease),transform .12s var(--ease)}[data-tip]:hover:after,[data-tip]:focus-visible:after{opacity:1;transform:translate(-50%) translateY(0);transition-delay:.15s}@media(hover:none){[data-tip]:after{display:none}}.knob{display:inline-flex;flex-direction:column;align-items:center;gap:6px;width:86px;-webkit-user-select:none;user-select:none}.knob__dial{position:relative;width:66px;height:66px;cursor:ns-resize;touch-action:none}.knob__svg{display:block;width:66px;height:66px}.knob__tick{stroke:var(--line);stroke-width:1.25;stroke-linecap:round}.knob__tick--major{stroke:var(--text-dim)}.knob__track{fill:none;stroke:var(--line);stroke-width:2.5;stroke-linecap:round}.knob__val{fill:none;stroke:var(--accent,var(--signal));stroke-width:2.5;stroke-linecap:round;transition:stroke .15s var(--ease)}.knob__cap{fill:var(--panel-2);stroke:none}.knob__pointer{stroke:var(--text);stroke-width:2;stroke-linecap:round}.knob__num{font-family:var(--font-mono);font-size:13px;color:var(--text);background:transparent;border:none;text-align:center;width:100%;padding:0;-moz-appearance:textfield}.knob__num::-webkit-outer-spin-button,.knob__num::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.knob__num:focus{outline:none;color:var(--accent,var(--signal))}.knob__label{font-family:var(--font-mono);font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:#d0ccc2;text-align:center;white-space:normal;overflow-wrap:anywhere;word-break:break-word;max-width:100%}.toggle{display:inline-flex;align-items:center;gap:7px;background:none;border:none;cursor:pointer;color:var(--text-muted);padding:2px}.toggle__track{position:relative;width:30px;height:16px;border-radius:99px;background:var(--panel-3);border:1px solid var(--line);transition:background .16s var(--ease)}.toggle__thumb{position:absolute;top:1px;left:1px;width:12px;height:12px;border-radius:50%;background:var(--text-dim);transition:transform .16s var(--ease),background .16s var(--ease)}.toggle.on .toggle__track{background:color-mix(in srgb,var(--signal) 30%,var(--panel-3));border-color:var(--signal-dim)}.toggle.on .toggle__thumb{transform:translate(14px);background:var(--signal)}.toggle__label{font-family:var(--font-mono);font-size:9px;letter-spacing:.04em;text-transform:uppercase}.toggle.on .toggle__label{color:var(--text)}.modal-scrim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:grid;place-items:center;padding:20px;background:#0a090752}.modal{width:100%;max-width:440px;background:#322f2b;color:#e8e5dd;border:1px solid #46423b;border-radius:12px;box-shadow:0 24px 60px #00000080;--text:#e8e5dd;--text-muted:#a8a39a;--text-dim:#7e796f;--line:#46423b}.field{width:100%;height:40px;padding:0 12px;background:var(--panel-2);border:1px solid var(--line);border-radius:0;color:var(--text);font-size:14px}.field:focus{outline:none;border-color:var(--signal-dim);box-shadow:0 0 0 2px #5cc8f52e}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important}}.appbar__cog{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;margin-left:auto;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:transparent;color:#bdbdb5;cursor:pointer;transition:background .12s var(--ease),color .12s var(--ease)}.appbar__cog:hover{background:#ffffff14;color:#f4f4f0}.settings{padding:24px;color:var(--text)}.settings__title{font-size:17px;font-weight:700;margin-bottom:20px}.settings__label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:14px}.settings__tones{display:flex;flex-wrap:wrap;gap:14px}.tone{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;border:2px solid transparent;border-radius:50%;background:transparent;cursor:pointer;padding:0;transition:border-color .12s var(--ease)}.tone__dot{width:26px;height:26px;border-radius:50%;background:var(--tone)}.tone--on{border-color:var(--tone)}.tone:hover .tone__dot{transform:scale(1.08)}.settings__hint{margin-top:18px;font-size:12px;color:var(--text-dim);line-height:1.5}.page{--orange:var(--oled);height:100dvh;display:flex;flex-direction:column;background:#272523;overflow:hidden}.appbar{flex:0 0 auto;height:62px;display:flex;align-items:center;gap:12px;padding:0 16px;background:#0c0c0c;color:#f4f4f0}.appbar__home{display:inline-flex;align-items:center;gap:11px;height:44px;padding:0 10px;border:none;background:transparent;color:inherit;text-decoration:none;border-radius:10px;cursor:pointer;transition:background .14s ease}.appbar__home:hover{background:#ffffff17}.appbar__home:active{background:#ffffff0d}.appbar__mark{display:block;width:28px;height:28px}.appbar__name{display:none}.appbar__name b{color:var(--orange);font-weight:800}@media(max-width:640px){.appbar{height:56px;padding:0 12px}.appbar__name{display:none}.appbar__mark{width:32px;height:32px}}.appbar__nav{display:flex;align-items:center;gap:6px;margin-left:6px}.appbar__tab{font-family:var(--font-mono);font-weight:700;font-size:13px;letter-spacing:.1em;color:#8a8a85;text-decoration:none;padding:6px 12px;border-radius:8px;transition:background .14s ease,color .14s ease}.appbar__tab:hover{background:#ffffff14;color:#f4f4f0}.appbar__tab--on{color:var(--orange);background:color-mix(in srgb,var(--oled) 13%,transparent)}.appbar__switch{display:none;align-items:center;gap:8px;margin-left:auto;height:38px;padding:0 12px;border:1px solid rgba(255,255,255,.14);border-radius:9px;background:#ffffff0a;color:#f4f4f0;font-family:var(--font-mono);font-size:13px;letter-spacing:.06em;cursor:pointer;transition:background .14s ease}.appbar__switch:hover{background:#ffffff17}.appbar__switch-name{font-weight:700;color:var(--oled)}.picker{padding:24px}.picker__list{display:flex;flex-direction:column;gap:10px}.picker__item{display:flex;align-items:center;gap:12px;padding:14px 16px;border:1px solid #46423b;border-radius:11px;font-family:var(--font-mono);font-weight:700;font-size:15px;letter-spacing:.06em;color:var(--text);text-decoration:none;transition:background .12s ease,border-color .12s ease}.picker__item:hover{background:#ffffff0d}.picker__item--on{border-color:var(--oled);color:var(--oled);background:color-mix(in srgb,var(--oled) 10%,transparent)}@media(max-width:600px){.appbar__nav{display:none}.appbar__switch{display:inline-flex;margin-left:10px;min-width:140px;justify-content:space-between}.appbar .appbar__cog{margin-left:auto}}.studio{--text:#e8e5dd;--text-muted:#a8a39a;--text-dim:#7e796f;--panel:#322f2b;--panel-2:#3a3733;--panel-3:#3a3733;--line:#46423b;--signal:var(--oled);--signal-dim:color-mix(in srgb,var(--oled) 82%,#000);--rec:#c0392b;--face:#272523;--face-2:#201e1c;--sel:#322f2b;--screen:#1c1c1a;--cap:#46453f;--padoff:#4f4f48;color:var(--text);flex:1;min-height:0;background:var(--face);display:flex;overflow:hidden}.deck{flex:1 1 auto;min-height:0;width:100%;display:flex;flex-direction:column;background:var(--face);color:var(--text);overflow:hidden}.knob__cap{fill:#1c1a17}.knob__pointer{stroke:#eceadf}.knob__track,.knob__tick{stroke:#5a564d}.knob__tick--major{stroke:#807a6d}.topbar{flex:0 0 auto;display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:10px 18px;background:#322f2b;border-bottom:1px solid #161412}.tgroup{display:flex;align-items:center;gap:10px}.tgroup--knobs{gap:22px;margin-left:0;flex:0 0 auto;align-items:center;justify-content:center}.tgroup--knobs .knob{gap:4px}.tgroup--knobs .knob__num{display:none}.tgroup--knobs .knob:before{content:"";display:block;height:17px;flex:0 0 auto}.recline{flex:1 1 auto;min-width:0;align-self:stretch;display:flex;align-items:center;gap:12px;padding:0 16px;background:#0d0d0b;color:color-mix(in srgb,var(--oled) 80%,#fff);border-radius:4px;overflow:hidden}.recline__play{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex:0 0 auto;border:1.5px solid color-mix(in srgb,var(--oled) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--oled) 10%,transparent);color:var(--oled);cursor:pointer;transition:background .12s var(--ease)}.recline__play:hover{background:color-mix(in srgb,var(--oled) 22%,transparent)}.recline__wave{flex:1 1 auto;min-width:0;height:40px;max-height:40px;overflow:hidden}.recline__time{flex:0 0 auto;font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:11px;color:color-mix(in srgb,var(--oled) 72%,#5a5044);min-width:5ch;text-align:right}.recline__dot{width:9px;height:9px;border-radius:50%;background:#f0605c;flex:0 0 auto;animation:recpulse 1s ease-in-out infinite}@keyframes recpulse{0%,to{opacity:1}50%{opacity:.25}}.recline--empty .recline__wave{background:linear-gradient(to bottom,transparent calc(50% - 1px),color-mix(in srgb,var(--oled) 38%,transparent) calc(50% - 1px),color-mix(in srgb,var(--oled) 38%,transparent) calc(50% + 1px),transparent calc(50% + 1px))}.recline--rec .recline__wave{background-image:repeating-linear-gradient(90deg,color-mix(in srgb,var(--oled) 34%,transparent) 0 3px,transparent 3px 11px);background-size:200% 100%;animation:recscroll .7s linear infinite}@keyframes recscroll{0%{background-position:0 0}to{background-position:-22px 0}}.disp{flex:1 1 auto;min-width:340px;min-height:126px;align-self:stretch;display:flex;flex-wrap:wrap;align-content:flex-start;align-items:stretch;gap:13px;padding:13px 14px;background:#0d0d0b;border-radius:6px;overflow:hidden;box-shadow:inset 0 0 0 1px #000,inset 0 0 30px #000000b8}.disp__transport{flex:0 0 auto;order:0;display:flex;align-items:stretch;gap:8px}.disp__noteview{flex:1 1 100%;order:2;min-width:0;min-height:72px;display:flex;align-items:stretch;gap:12px}.disp__notebox{flex:0 0 auto;display:flex;align-items:center;gap:4px;border:1.5px solid color-mix(in srgb,var(--oled) 32%,transparent);border-radius:8px;padding:4px 8px;background:color-mix(in srgb,var(--oled) 5%,transparent)}.disp__notebox--center{flex:1 1 auto;justify-content:center}.disp__tbtn,.disp__act{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;align-self:stretch;border:1.5px solid color-mix(in srgb,var(--oled) 50%,transparent);border-radius:10px;background:color-mix(in srgb,var(--oled) 7%,transparent);color:var(--oled);cursor:pointer;transition:background .12s var(--ease),color .12s var(--ease)}.disp__tbtn{min-width:58px}.disp__act{width:48px}.disp__tbtn:hover,.disp__act:hover{background:color-mix(in srgb,var(--oled) 20%,transparent)}.disp__tbtn:disabled,.disp__act:disabled{opacity:.38;pointer-events:none}.disp__tbtn.on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff);color:#0d0d0b}.disp__tbtn--rec.on{background:#e0463a;border-color:#ff7a6a;color:#fff}.disp__step{flex:0 0 auto;width:26px;display:inline-flex;align-items:center;justify-content:center;border:none;background:none;color:var(--oled);cursor:pointer;opacity:.82;transition:opacity .12s var(--ease)}.disp__step:hover{opacity:1}.disp__txt{flex:0 0 auto;display:flex;flex-direction:column;justify-content:center;gap:7px;min-width:0;padding:0 4px}.disp__txt--center{align-items:center;text-align:center;flex:1 1 auto}.disp__name{font-family:var(--font-mono);font-size:30px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--oled);line-height:1}.disp__nameline{display:flex;align-items:center;gap:9px;min-width:0}.disp__num{flex:0 0 auto;font-family:var(--font-mono);font-size:14px;font-weight:700;line-height:1;color:var(--oled);padding:3px 8px;border-radius:6px;border:1px solid color-mix(in srgb,var(--oled) 42%,transparent);background:color-mix(in srgb,var(--oled) 9%,transparent)}.disp__noteline{display:flex;align-items:baseline;gap:9px}.disp__noteval{font-family:var(--font-mono);font-size:17px;font-weight:700;color:color-mix(in srgb,var(--oled) 76%,#fff);cursor:text;border-bottom:1.5px solid transparent;transition:border-color .12s var(--ease)}.disp__noteval:hover{border-bottom-color:color-mix(in srgb,var(--oled) 55%,transparent)}.disp__noteinput{width:60px;background:transparent;border:none;border-bottom:1.5px solid color-mix(in srgb,var(--oled) 70%,transparent);color:color-mix(in srgb,var(--oled) 76%,#fff);font-family:var(--font-mono);font-size:17px;font-weight:700;padding:0;outline:none}.disp__hz{font-family:var(--font-mono);font-size:12px;color:color-mix(in srgb,var(--oled) 62%,#5a5044)}.disp__sub{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;color:color-mix(in srgb,var(--oled) 62%,#5a5044);text-transform:uppercase}.disp__scopebox{flex:1 1 auto;min-width:40px;align-self:stretch;display:flex;align-items:stretch;border:1.5px solid color-mix(in srgb,var(--oled) 32%,transparent);border-radius:8px;padding:5px 8px;background:color-mix(in srgb,var(--oled) 5%,transparent);overflow:hidden}.disp__scope{flex:1 1 auto;min-width:0;height:auto;align-self:stretch;opacity:.95}.disp__wave{fill:none;stroke:var(--oled);stroke-width:1.8;vector-effect:non-scaling-stroke}.disp__scopeg{transform-box:view-box;transform-origin:50% 50%}.disp__acts{flex:0 0 auto;order:1;display:flex;align-items:stretch;gap:8px}.disp__rec{flex:1 1 100%;order:2;min-width:0;min-height:72px;align-self:stretch;display:flex;align-items:center;padding:0 12px;border:1.5px solid color-mix(in srgb,var(--oled) 32%,transparent);border-radius:8px;background:color-mix(in srgb,var(--oled) 5%,transparent);overflow:hidden}.disp__rec .recline{flex:1;min-width:0;background:transparent;padding:0}.stage{flex:1 1 auto;min-height:0;display:flex;flex-direction:column}.detail{flex:0 0 auto;max-height:46%;display:flex;flex-direction:column;border-bottom:1px solid var(--line);overflow:auto}.detail--empty{align-items:center;justify-content:center;color:var(--text-dim);font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase}.detail__knobs{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:flex-start;gap:20px 24px;padding:18px 24px 22px}.detail__knobs .knob{width:104px}.detail__knobs .knob__dial,.detail__knobs .knob__svg{width:82px;height:82px}.detail__knobs .switch-cell{display:flex;align-items:flex-start;height:84px;padding:8px 6px 0}.note{display:inline-flex;align-items:center;gap:8px;background:transparent;border:none;padding:0;margin-left:auto}@keyframes oledscroll{to{transform:translate(-240px)}}.tracks{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;background:#070705;box-shadow:inset 0 0 60px #000000b3}.tracks__list{flex:1 1 auto;min-height:0;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:14px}.trk{--accent:var(--signal);position:relative;flex:0 0 auto;display:grid;grid-template-columns:178px 1fr auto;align-items:stretch;background:#0c0a08;border:2px solid color-mix(in srgb,var(--oled) 30%,transparent);border-radius:7px;overflow:hidden;opacity:.42;transition:opacity .12s var(--ease)}.trk:hover{z-index:6}.trk--sel{background:color-mix(in srgb,var(--oled) 15%,#201a13);border-color:var(--oled);opacity:1;z-index:2}.trk__sel{display:flex;align-items:center;gap:12px;padding:0 16px;height:72px;background:transparent;border:none;color:var(--text);cursor:pointer;text-align:left;min-width:0;font-family:inherit}.trk__sel:hover{background:color-mix(in srgb,var(--oled) 6%,transparent)}.trk__dot{width:11px;height:11px;border-radius:2px;background:var(--oled);flex:0 0 auto}.trk__idx{font-family:var(--font-mono);font-size:17px;font-weight:700;color:color-mix(in srgb,var(--oled) 72%,#5a4a36)}.trk__name{font-size:14px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--oled);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trk__grid{display:flex;align-items:center;padding:10px 16px;min-width:0}.trk__right{display:flex;align-items:center;gap:10px;padding:10px 14px}.trk__right .mbtn{background:color-mix(in srgb,var(--oled) 6%,transparent);border-color:color-mix(in srgb,var(--oled) 40%,transparent);color:var(--oled)}.trk__right .mbtn:hover{background:color-mix(in srgb,var(--oled) 18%,transparent)}.trk__right .mbtn.on{background:var(--oled);border-color:var(--oled);color:#0d0d0b}.trk__right .mbtn.danger{color:#ff8a6a;border-color:#ff785a66}.trk__right .mbtn.danger:hover{background:#ff785a29}.trk__right [data-tip]:after{left:auto;right:0;top:auto;bottom:calc(100% + 6px);transform:translate(0) translateY(4px)}.trk__right [data-tip]:hover:after,.trk__right [data-tip]:focus-visible:after{transform:translate(0) translateY(0)}.row-scroller{position:relative;width:100%;min-width:0;overflow-x:auto;overflow-y:hidden;overscroll-behavior-x:contain}.row-cells{--col:1fr;position:relative;display:grid;grid-template-columns:repeat(var(--cols),var(--col));grid-template-rows:var(--stepH,28px);gap:var(--cgap,4px);touch-action:pan-x}.row-cells.scrollable{--col:var(--cellW,24px);width:max-content}.cell{-webkit-appearance:none;-moz-appearance:none;appearance:none;margin:0;padding:0;background:#191510;border:1.5px solid color-mix(in srgb,var(--oled) 55%,transparent);border-radius:3px;cursor:pointer;transition:background .08s var(--ease)}.cell:hover{background:#2a2316}.cell:active{background:#3a2f1c}.cell.on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff)}.cell.on:hover{filter:brightness(1.12)}.cell.head{background:#3c2d18}.cell.hit{background:color-mix(in srgb,var(--oled) 58%,#fff)}.save{padding:24px}.save__title{font-size:17px;font-weight:700;margin-bottom:16px}.save__label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-bottom:6px}.save__hint{margin-top:8px;font-size:12px;color:var(--text-dim)}.save__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.addpick{padding:22px;color:var(--text)}.addpick__title{font-size:16px;font-weight:700;letter-spacing:.02em;margin-bottom:14px}.addpick__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.voice{display:flex;align-items:center;height:48px;padding:0 16px;border:2px solid #1b1b18;border-radius:3px;background:#e7e5dd;color:#1b1b18;font-family:var(--font-mono);font-size:13px;font-weight:700;letter-spacing:.04em;cursor:pointer;box-shadow:3px 3px #1b1b18;transition:transform .05s var(--ease),box-shadow .05s var(--ease),background .12s var(--ease)}.voice:hover{background:#fff}.voice:active{transform:translate(3px,3px);box-shadow:0 0 #1b1b18}@media(max-width:760px){.topbar{flex-direction:column;align-items:stretch;gap:10px;padding:10px 12px}.disp{align-self:stretch;width:100%;min-width:0;flex-wrap:wrap;min-height:0;padding:10px;gap:8px;align-items:center}.disp__noteview{order:2;flex:1 1 100%;min-height:116px;flex-wrap:wrap;gap:8px;align-items:center;align-content:center}.disp__txt{flex:1 1 auto;align-items:center;text-align:center}.disp__name{font-size:22px}.disp__scope{flex:1 1 100%;height:40px;align-self:auto}.disp__step{width:34px}.disp__notebox{flex:1 1 100%;justify-content:center}.disp__scopebox{flex:1 1 100%;min-height:46px}.disp__transport{order:0;flex:1 1 100%;justify-content:center}.disp__tbtn{align-self:auto;height:50px;min-width:50px}.disp__acts{order:1;flex:1 1 100%;justify-content:center}.disp__act{align-self:auto;height:46px}.disp__rec{order:2;flex:1 1 100%;padding:0 10px;min-height:116px}.tgroup{justify-content:center;flex-wrap:wrap}.tgroup--knobs{margin-left:0;gap:14px;justify-content:center}.tgroup--knobs .knob{width:74px}.tgroup--knobs .knob__dial,.tgroup--knobs .knob__svg{width:56px;height:56px}.tgroup--knobs .knob:before{height:14px}.detail{max-height:42%}.detail__knobs{flex-wrap:nowrap;overflow-x:auto;gap:12px;padding:12px 14px}.detail__knobs .knob,.detail__knobs .switch-cell{flex:0 0 auto}.detail__knobs .knob{width:82px}.detail__knobs .knob__dial,.detail__knobs .knob__svg{width:62px;height:62px}.trk{grid-template-columns:1fr auto;grid-template-areas:"sel right" "grid grid"}.trk__sel{grid-area:sel;height:58px}.trk__right{grid-area:right;justify-content:flex-end}.trk__grid{grid-area:grid;padding:8px 12px 12px}.row-cells{grid-template-columns:repeat(8,1fr);grid-template-rows:none;grid-auto-rows:38px;width:auto;gap:6px}.tracks__list{padding:12px;gap:10px}.tracks__list{justify-content:flex-start}}@media(max-width:430px){.disp__name{font-size:18px}.disp__scope{height:36px}.detail__knobs .knob{width:76px}.detail__knobs .knob__dial,.detail__knobs .knob__svg{width:58px;height:58px}.row-cells{grid-auto-rows:34px;gap:5px}}.deck--keys{flex:1 1 auto;min-height:0}.topbar--keys{flex-direction:column;align-items:stretch;gap:12px}.disp--ctrl{flex:0 0 auto;min-width:0;min-height:112px}.keysboard{flex:1 1 auto;min-height:0;min-width:0;display:flex;flex-direction:column;gap:11px;padding:11px;background:#0d0d0b;border-radius:12px;overflow:hidden;box-shadow:inset 0 0 0 1px #000,inset 0 0 40px #000000b8}.stage--keys{align-items:stretch;justify-content:stretch;gap:14px;padding:18px;background:#070705;box-shadow:inset 0 0 70px #000000b3}.mpad{position:relative;border:1.5px solid color-mix(in srgb,var(--oled) 50%,transparent);border-radius:8px;background:#191510;cursor:pointer;min-height:58px;touch-action:none;transition:background .08s var(--ease)}.mpad:hover{background:#23190f}.mpad__num{position:absolute;left:8px;bottom:6px;font-family:var(--font-mono);font-size:11px;font-weight:700;color:color-mix(in srgb,var(--oled) 60%,#46362a)}.mpad--on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff)}.mpad--on .mpad__num{color:#0d0d0b}.mpad__chord{position:absolute;top:9px;left:0;right:0;text-align:center;font-family:var(--font-mono);font-size:16px;font-weight:800;color:var(--oled)}.mpad--on .mpad__chord{color:#0d0d0b;text-shadow:none}.chordbar{flex:0 0 auto;display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;padding:2px 2px 0}.chordbar__group{display:flex;align-items:center;gap:8px}.chordbar__label{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:color-mix(in srgb,var(--oled) 60%,#5a5044)}.chordbar__step{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border:1.5px solid color-mix(in srgb,var(--oled) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--oled) 7%,transparent);color:var(--oled);cursor:pointer;transition:background .12s var(--ease)}.chordbar__step:hover{background:color-mix(in srgb,var(--oled) 18%,transparent)}.chordbar__val{min-width:30px;text-align:center;font-family:var(--font-mono);font-size:15px;font-weight:700;color:var(--oled)}.chordtypes{display:flex;gap:5px}.chordtype{padding:6px 10px;border:1.5px solid color-mix(in srgb,var(--oled) 45%,transparent);border-radius:8px;background:color-mix(in srgb,var(--oled) 7%,transparent);color:var(--oled);font-family:var(--font-mono);font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:background .12s var(--ease),color .12s var(--ease)}.chordtype:hover{background:color-mix(in srgb,var(--oled) 18%,transparent)}.chordtype.on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff);color:#0d0d0b}.piano{position:relative;flex:1 1 auto;min-height:0;display:flex;flex-direction:column;justify-content:flex-end;padding:0;margin:0}.pkeys-wrap{position:relative;width:100%}.pkeys--white{display:flex;gap:5px}.pkey{cursor:pointer;touch-action:none;font-family:var(--font-mono);transition:background .06s var(--ease),color .06s var(--ease)}.pkey--white{flex:1 1 0;min-width:0;height:94px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:9px;border:1.5px solid color-mix(in srgb,var(--oled) 45%,transparent);border-radius:8px;background:#191510;color:color-mix(in srgb,var(--oled) 80%,#fff)}.pkeys--black{position:absolute;top:0;left:0;width:100%;height:56px;pointer-events:none}.pkey--black{position:absolute;transform:translate(-50%);height:56px;pointer-events:auto;display:flex;align-items:flex-end;justify-content:center;padding-bottom:7px;border:1.5px solid color-mix(in srgb,var(--oled) 60%,transparent);border-radius:6px;background:#0a0806;color:color-mix(in srgb,var(--oled) 78%,#fff)}.pkey--on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff);color:#0d0d0b}@media(max-width:760px){.stage--keys{padding:18px 12px;gap:16px}.piano{padding:0;margin:0}.pkey--white{height:82px}.pkeys--black,.pkey--black{height:48px}}.pkey__lbl{font-size:11px;font-weight:700;text-transform:uppercase;pointer-events:none}.deck__dials{flex:0 0 auto;display:flex;align-items:flex-start;justify-content:center;gap:10px 22px;flex-wrap:wrap}.deck__dials .knob{width:78px}.deck__dials .knob__dial,.deck__dials .knob__svg{width:56px;height:56px}.deck__dials .knob__label{color:color-mix(in srgb,var(--oled) 62%,#5a5044)}.board__waves{flex:0 0 auto;order:1;display:flex;align-items:stretch;gap:6px}.disp__wbtn{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;width:46px;align-self:stretch;border:1.5px solid color-mix(in srgb,var(--oled) 50%,transparent);border-radius:10px;background:color-mix(in srgb,var(--oled) 7%,transparent);color:var(--oled);cursor:pointer;transition:background .12s var(--ease),color .12s var(--ease)}.disp__wbtn:hover{background:color-mix(in srgb,var(--oled) 20%,transparent)}.disp__wbtn.on{background:var(--oled);border-color:color-mix(in srgb,var(--oled) 60%,#fff);color:#0d0d0b}.board__pads{flex:0 0 auto;display:grid;grid-template-columns:repeat(8,1fr);gap:9px}@media(max-width:760px){.deck__dials{gap:8px 16px;justify-content:space-between}.deck__dials .knob{width:62px}.deck__dials .knob__dial,.deck__dials .knob__svg{width:46px;height:46px}.topbar--keys{gap:10px}.keysboard{padding:9px;gap:9px}.board__waves{order:1;flex:1 1 100%;justify-content:center}.board__pads{grid-template-columns:repeat(4,1fr)}.chordbar{gap:8px 14px}.chordtype{padding:6px 8px}}@media(min-width:1100px){.disp__noteview,.disp__rec{order:1;flex:1 1 auto}.disp__acts,.board__waves{order:2}}