:root{--ink:#11110f;--paper:#e8e4d7;--orange:#ff5a1f;--acid:#d7ff45;--grey:#8d8b82;--line:#35342f;--panel:#191916;font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#f2efe4;background:var(--ink)}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden}button,input,select{font:inherit}button{min-height:44px;color:inherit;background:transparent;border:1px solid #4a4942;cursor:pointer}button:hover,button:focus-visible{border-color:var(--acid);outline:2px solid transparent}main{height:100dvh;display:grid;grid-template-rows:76px minmax(0,1fr)}header{display:flex;align-items:center;justify-content:space-between;padding:10px 18px;border-bottom:1px solid var(--line);background:#0b0b0a}.brand{display:flex;align-items:center;gap:12px}.route{width:48px;height:48px;display:grid;place-items:center;background:var(--orange);color:#111;font-weight:900;border-radius:50%}h1{font-size:22px;letter-spacing:.12em;margin:0}header p{margin:2px 0 0;color:#929087;font:11px ui-monospace,monospace;text-transform:uppercase}.transport{display:flex;gap:8px;align-items:center}.transport label{font:10px ui-monospace,monospace;color:#aaa}.transport input{display:block;width:64px;height:28px;background:#171714;color:#fff;border:1px solid #444;padding:3px}.transport button{padding:0 15px;text-transform:uppercase;font-size:11px;font-weight:800}.transport .hot{background:var(--acid);color:#111;border-color:var(--acid)}.studio{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 360px}.stage{min-width:0;min-height:0;padding:18px;display:grid;grid-template-rows:auto minmax(260px,1fr) 145px auto;gap:12px;background:radial-gradient(circle at 80% 10%,#25231b 0,transparent 35%),#121210}.destination{display:flex;justify-content:space-between;align-items:end;border-bottom:5px solid var(--orange);padding-bottom:9px}.destination span{display:block;color:#aaa;font:10px ui-monospace,monospace;text-transform:uppercase}.destination strong{font-size:clamp(26px,4vw,60px);line-height:.95;letter-spacing:-.04em}.status{display:flex;align-items:center;gap:7px;text-align:right}.status i{width:8px;height:8px;background:var(--acid);border-radius:50%}.status.running i{animation:pulse 1s steps(2) infinite}.sequencer-wrap{min-width:0;overflow-x:auto;overscroll-behavior-inline:contain}.sequencer{height:100%;min-width:840px;display:grid;grid-template-columns:repeat(16,1fr);border:1px solid #3b3933;background:#0b0b09}.step{min-width:0;border:0;border-right:1px solid #393731;padding:0;display:grid;grid-template-rows:22px 1fr 43px;background:transparent;position:relative}.step:nth-child(4n){border-right:3px solid #706b5f}.step-num{padding-top:5px;color:#69675f;font:9px ui-monospace,monospace}.window{margin:5px;border:1px solid #49463f;background:#151512;display:flex;align-items:end;justify-content:center;padding-bottom:9px;position:relative;overflow:hidden}.window:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 45%,#2b2923 46% 53%,transparent 54%),linear-gradient(#25231e 49%,#3c3930 50% 52%,#25231e 53%);opacity:.55}.step[data-level="1"] .window{background:#696f31}.step[data-level="2"] .window{background:var(--orange);box-shadow:inset 0 0 30px #ffb15d}.step[data-active="true"]{background:#26251f}.hit-label{position:relative;z-index:1;font:9px ui-monospace,monospace;color:#111;font-weight:900}.octave{margin:0 5px 5px;background:#1d1c18;border-color:#393731;min-height:36px;font:10px ui-monospace,monospace;color:#aaa}.octave:hover{color:var(--acid)}canvas{width:100%;height:145px;background:#0b0b09;border:1px solid #34332e}.legend{display:flex;gap:18px;align-items:center;color:#7f7c72;font:9px ui-monospace,monospace;text-transform:uppercase;white-space:nowrap}.legend span{display:flex;align-items:center;gap:5px}.legend b{width:8px;height:8px;background:#222}.legend .ghost{background:#696f31}.legend .accent{background:var(--orange)}.rack{min-height:0;overflow-y:auto;border-left:1px solid var(--line);background:var(--panel)}.recipes{position:sticky;top:0;z-index:4;display:grid;grid-template-columns:repeat(3,1fr);background:#0d0d0b}.recipes button{border-width:0 0 1px 1px;font-size:10px;text-transform:uppercase}.recipes button.active{background:var(--orange);color:#111}.rack section{border-bottom:1px solid var(--line)}.section-head{height:47px;display:flex;justify-content:space-between;align-items:center;padding-left:16px;font:10px ui-monospace,monospace;color:#aaa;text-transform:uppercase}.fold{width:47px;border-width:0 0 0 1px;font-size:18px}.section-body{padding:0 16px 18px}.section-body[hidden]{display:none}.root{display:flex;justify-content:space-between;align-items:center;text-transform:uppercase;font-size:11px;color:#aaa}.root select{width:120px;height:44px;background:#11110f;color:#fff;border:1px solid #4a4942;padding:0 10px}.tones{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}.tones button{font:10px ui-monospace,monospace;text-transform:uppercase}.tones button.on{background:var(--acid);border-color:var(--acid);color:#111}.hint{color:#77746d;font-size:10px;line-height:1.4;margin:9px 0 0}.sliders{display:grid;gap:16px}.sliders label{display:grid;grid-template-columns:1fr auto;gap:6px;color:#aaa;font:10px ui-monospace,monospace;text-transform:uppercase}.sliders input{grid-column:1/-1;width:100%;accent-color:var(--orange)}output{color:var(--acid)}.memory{display:grid;grid-template-columns:1fr 1fr;gap:7px}.memory button:last-of-type{grid-column:1/-1}.memory p{grid-column:1/-1;min-height:14px;margin:4px 0;color:var(--acid);font:10px ui-monospace,monospace}@keyframes pulse{50%{opacity:.2}}@media(max-width:800px){html,body{overflow:auto}main{height:auto;min-height:100dvh;display:block}header{position:sticky;top:0;z-index:10;height:auto;min-height:66px;padding:8px 10px}.route{width:40px;height:40px}.brand h1{font-size:15px}.brand p{display:none}.transport{gap:4px}.transport label{display:none}.transport button{padding:0 9px;font-size:9px}.studio{display:flex;flex-direction:column}.stage{height:560px;padding:10px;grid-template-rows:auto 320px 105px auto}.destination strong{font-size:28px}.sequencer{min-width:900px}.rack{overflow:visible;border-left:0;border-top:1px solid var(--line)}.recipes{top:66px}.rack section:not(:first-of-type) .section-body{padding-bottom:18px}.legend{overflow-x:auto;gap:12px}canvas{height:105px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}