@font-face{font-family:Space Grotesk;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/space-grotesk-latin-400-normal-CJ-V5oYT.woff2)format("woff2"),url(/assets/space-grotesk-latin-400-normal-BnQMeOim.woff)format("woff")}@font-face{font-family:Space Grotesk;font-style:normal;font-display:swap;font-weight:500;src:url(/assets/space-grotesk-latin-500-normal-lFbtlQH6.woff2)format("woff2"),url(/assets/space-grotesk-latin-500-normal-CNSSEhBt.woff)format("woff")}@font-face{font-family:Space Grotesk;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/space-grotesk-latin-700-normal-RjhwGPKo.woff2)format("woff2"),url(/assets/space-grotesk-latin-700-normal-CwsQ-cCU.woff)format("woff")}@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/jetbrains-mono-latin-400-normal-V6pRDFza.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-400-normal-6-qcROiO.woff)format("woff")}@font-face{font-family:JetBrains Mono;font-style:normal;font-display:swap;font-weight:700;src:url(/assets/jetbrains-mono-latin-700-normal-BYuf6tUa.woff2)format("woff2"),url(/assets/jetbrains-mono-latin-700-normal-D3wTyLJW.woff)format("woff")}:root{--bg:#0a0d11;--panel:#141616;--panel-2:#1f2222;--line:#26333d;--fg:#f6f7f7;--muted:#aab1b1;--accent:#1fe0c2;--accent-deep:#0d9488;--hot:#f36;--slide:#0e7490;--shadow:4px 4px 0 0 #141616d9;--stepw:44px;--lbw:48px;--seqgap:4px}*{box-sizing:border-box}body{background:var(--bg);color:var(--fg);margin:0;padding:24px;font-family:Space Grotesk,ui-sans-serif,system-ui,sans-serif}h1{color:var(--fg);letter-spacing:4px;margin:0;font-family:Space Grotesk,sans-serif;font-size:26px;font-weight:700}h1 span{color:var(--accent)}h2{color:var(--accent);letter-spacing:3px;margin:0 0 12px;font-family:JetBrains Mono,monospace;font-size:12px}.brandrow{align-items:center;gap:20px;margin-bottom:14px;display:flex}.wordmark{letter-spacing:4px;color:var(--muted);margin-left:auto;font-family:JetBrains Mono,monospace;font-size:11px}#scope{border:1px solid var(--line);background:var(--panel);flex:1;min-width:0;height:40px}#scope.tall{max-width:360px;height:200px}#scope,#filterScope{cursor:pointer}:is(#scope:fullscreen,#filterScope:fullscreen){background:var(--bg);border:none;max-width:none;width:100vw!important;height:100vh!important}#scopeMode{color:var(--muted);flex:none;padding:6px 9px;font-size:10px}#scopeMode:hover{color:var(--accent)}footer{letter-spacing:2px;color:var(--muted);margin-top:8px;font-family:JetBrains Mono,monospace;font-size:10px}footer a{color:var(--muted)}footer a:hover{color:var(--accent)}header{margin-bottom:20px}.transport{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.transport label{color:var(--muted);align-items:center;gap:8px;font-family:JetBrains Mono,monospace;font-size:11px;display:flex}.val{color:var(--accent)}.divider{background:var(--line);width:1px;height:22px}button{background:var(--panel-2);color:var(--fg);border:1px solid var(--line);cursor:pointer;letter-spacing:1px;border-radius:0;padding:7px 12px;font-family:JetBrains Mono,monospace;font-size:11px}button:hover{border-color:var(--accent);color:var(--accent)}button.big{color:var(--accent);box-shadow:var(--shadow);padding:8px 24px;font-size:18px}button.cta{background:var(--accent);color:#0a0d11;border-color:var(--accent);font-weight:700}button.cta:hover{background:var(--fg);color:#0a0d11}button.armed{background:var(--accent);color:#0a0d11;border-color:var(--accent)}.hint{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:11px}.hint b{color:var(--accent)}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:var(--shadow);border-radius:0;max-width:100%;margin-bottom:24px;padding:18px;overflow-x:hidden}.knobs{flex-wrap:wrap;gap:18px;margin-bottom:16px;display:flex}.knobs label{letter-spacing:1px;color:var(--muted);flex-direction:column;gap:5px;font-family:JetBrains Mono,monospace;font-size:9px;display:flex}.knobs input[type=range]{width:100px;accent-color:var(--accent)}#filterScope{border:1px solid var(--line);background:var(--panel-2);width:200px;height:64px}select{background:var(--panel-2);color:var(--fg);border:1px solid var(--line);border-radius:0;padding:5px;font-family:JetBrains Mono,monospace;font-size:11px}.seq{grid-template-columns:repeat(16,1fr);gap:4px;display:grid}#drumSeq{display:block}.cell{background:var(--bg);border:1px solid var(--line);flex-direction:column;gap:4px;min-width:0;padding:6px 4px;display:flex}.cell.beat{border-top:2px solid var(--accent-deep)}.cell.now{outline:2px solid var(--accent)}.cell button{padding:4px 2px;font-size:9px}.cell select{width:100%;padding:2px;font-size:10px}.cell .on.active{background:var(--accent);color:#0a0d11;border-color:var(--accent)}.cell .slide.active{background:var(--slide);color:var(--fg);border-color:var(--slide)}.cell .acc.active{background:var(--hot);color:#0a0d11;border-color:var(--hot)}.drumrow{grid-template-columns:48px repeat(16,1fr);align-items:center;gap:4px;margin-bottom:6px;display:grid}.drumrow span{color:var(--muted);font-family:JetBrains Mono,monospace;font-size:10px}.dcell{background:var(--bg);border:1px solid var(--line);min-width:0;height:30px;padding:0}.dcell.beat{border-top:2px solid var(--accent-deep)}.dcell.active{background:var(--accent)}.dcell.now{outline:2px solid var(--fg)}.seqwrap{overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--line) transparent;overflow:auto hidden}@media (width<=1100px){:root{--stepw:44px}#scope{flex-basis:100%;order:5;height:54px}#scope.tall{max-width:none;height:168px}.fcurve{flex:100%}#filterScope{width:100%}.brandrow{gap:10px 12px}.seq:not(#drumSeq),.ruler:not(.lead){grid-template-columns:repeat(16, minmax(var(--stepw), 1fr));min-width:calc(16 * var(--stepw) + 15 * var(--seqgap))}.ruler.lead,.drumrow{grid-template-columns:var(--lbw) repeat(16, minmax(var(--stepw), 1fr));min-width:calc(var(--lbw) + 16 * var(--stepw) + 16 * var(--seqgap))}.drumrow span,.ruler.lead span:first-child{z-index:3;background:var(--panel);border-right:1px solid var(--line);align-self:stretch;align-items:center;padding-right:4px;display:flex;position:sticky;left:0}.cell select{appearance:none;text-align:center;text-align-last:center}}@media (width<=700px){:root{--stepw:max(30px, calc((100vw - 124px) / 8))}body{padding:12px}.panel{padding:12px 10px}.cell button{padding:9px 2px;font-size:10px}.cell{padding:6px 2px}.cell select{padding:6px 0;font-size:11px}.dcell{height:44px}.transport{gap:8px}button{padding:10px 12px}h1{letter-spacing:2px;font-size:20px}.wordmark{letter-spacing:2px;font-size:9px}.seqwrap.lead{scroll-padding-left:calc(var(--lbw) + var(--seqgap))}html{scroll-padding-bottom:96px}}.knobs label.wide input[type=range]{width:260px;accent-color:var(--hot)}button.rec-on{background:var(--hot);color:#0a0d11;border-color:var(--hot);animation:1s infinite pulse}@keyframes pulse{50%{opacity:.6}}.droptgt.dropping{color:var(--accent);outline:1px dashed var(--accent)}h2 .hint{letter-spacing:0;text-transform:none}input[type=range]{accent-color:var(--accent)}.transport{align-items:stretch;gap:14px}.tgroup{border:1px solid var(--line);background:var(--panel);flex-wrap:wrap;align-items:center;gap:10px;padding:12px 14px 10px;display:flex;position:relative}.tgroup .tlabel{letter-spacing:2px;color:var(--muted);background:var(--bg);padding:0 5px;font-family:JetBrains Mono,monospace;font-size:8px;position:absolute;top:-7px;left:8px}#helpBtn{color:var(--muted);flex:none;padding:5px 10px;font-size:12px}#homeLink{letter-spacing:2px;color:var(--muted);border:1px solid var(--line);background:var(--panel-2);flex:none;padding:6px 9px;font-family:JetBrains Mono,monospace;font-size:10px;text-decoration:none}#homeLink:hover,#homeLink:focus-visible{color:var(--accent);border-color:var(--accent)}#songChain{letter-spacing:1px;color:var(--accent);text-overflow:ellipsis;white-space:nowrap;max-width:150px;padding:0 2px;font-family:JetBrains Mono,monospace;font-size:10px;overflow:hidden}.songadd{padding:7px 8px;font-size:10px}#stepRec.rec-on{color:#0a0d11;background:#f36;border-color:#f36}.helppop{z-index:40;background:var(--panel-2);border:1px solid var(--line);box-shadow:var(--shadow);letter-spacing:1px;max-width:360px;color:var(--muted);padding:12px 16px;font-family:JetBrains Mono,monospace;font-size:10px;position:fixed;top:54px;right:18px}.helppop h3{letter-spacing:2px;color:var(--fg);margin-bottom:8px;font-size:9px}.helppop .hrow{margin-bottom:5px;line-height:1.5}.helppop b{color:var(--accent)}.rowcap{letter-spacing:2px;color:var(--muted);flex-basis:100%;margin-bottom:-8px;font-family:JetBrains Mono,monospace;font-size:8px}.ruler{grid-template-columns:repeat(16,1fr);gap:4px;margin-bottom:4px;display:grid}.ruler.lead{grid-template-columns:48px repeat(16,1fr)}.ruler span{color:var(--muted);text-align:center;font-family:JetBrains Mono,monospace;font-size:9px}.ruler span.beat{color:var(--accent);font-weight:700}button.playing{background:var(--accent);color:#0a0d11;border-color:var(--accent)}button.trip-on{background:var(--hot);color:#0a0d11;border-color:var(--hot);animation:.8s infinite pulse}.droptgt{cursor:pointer}.droptgt:hover{color:var(--accent)}.transport{z-index:20;background:var(--bg);padding:8px 0 4px;position:sticky;top:0}.cell.beat,.dcell.beat:not(.active){background:#0e141a}.ruler span.now{color:var(--fg);background:var(--accent-deep)}button.snap{min-width:34px;color:var(--muted)}button.snap.has{color:var(--accent);border-color:var(--accent-deep)}html,body{overscroll-behavior:none}button,.rowcap,.tlabel,.ruler,.drumrow span,h1,h2,.helppop,.wordmark,footer{-webkit-user-select:none;user-select:none}button,.dcell,select,label{touch-action:manipulation}button,.dcell{-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--accent);outline-offset:1px}body{padding-left:max(24px, env(safe-area-inset-left));padding-right:max(24px, env(safe-area-inset-right));padding-top:max(24px, env(safe-area-inset-top))}@media (pointer:coarse){input[type=range]{appearance:none;touch-action:none;background:0 0;height:32px}input[type=range]::-webkit-slider-runnable-track{background:var(--panel-2);border:1px solid var(--line);height:6px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border:1px solid var(--bg);width:26px;height:26px;margin-top:-10px}input[type=range]::-moz-range-track{background:var(--panel-2);border:1px solid var(--line);height:6px}input[type=range]::-moz-range-thumb{background:var(--accent);border:1px solid var(--bg);border-radius:0;width:26px;height:26px}.knobs label.wide input[type=range]::-webkit-slider-thumb{background:var(--hot)}.knobs label.wide input[type=range]::-moz-range-thumb{background:var(--hot)}input[type=checkbox]{width:20px;height:20px;accent-color:var(--accent)}select{padding:8px 6px;font-size:12px}}@media (width<=700px){body{padding-left:max(12px, env(safe-area-inset-left));padding-right:max(12px, env(safe-area-inset-right));padding-top:max(12px, env(safe-area-inset-top));padding-bottom:calc(88px + env(safe-area-inset-bottom))}.transport{flex-direction:column;align-items:stretch;position:static}.tgroup{width:100%}.tgroup label{flex:auto}.tgroup input[type=range]{flex:auto;min-width:0}.knobs{grid-template-columns:repeat(auto-fit,minmax(108px,1fr));gap:14px;display:grid}.knobs .rowcap{grid-column:1/-1;margin-bottom:-6px}.knobs label.wide{grid-column:1/-1}.knobs input[type=range],.knobs label.wide input[type=range]{width:100%}.brandrow{flex-wrap:wrap}footer{margin-bottom:4px}}#ctrlToggle{display:none}@media (width<=700px){#ctrlToggle{width:100%;margin:6px 0 10px;display:block}.transport.collapsed{display:none}}.dock{display:none}@media (width<=700px){.dock{z-index:50;border-top:1px solid var(--line);padding:8px max(10px, env(safe-area-inset-right)) calc(8px + env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));background:#0a0d11f2;grid-auto-columns:1fr;grid-auto-flow:column;gap:6px;display:grid;position:fixed;inset:auto 0 0}.dock button{letter-spacing:1px;padding:14px 4px;font-size:11px}.dock button.big{box-shadow:none;padding:12px 4px;font-size:16px}}@supports ((-webkit-backdrop-filter:blur(6px)) or (backdrop-filter:blur(6px))){.dock{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}}.toast{z-index:60;background:var(--panel-2);border:1px solid var(--accent);max-width:calc(100vw - 24px);box-shadow:var(--shadow);letter-spacing:1px;align-items:center;gap:12px;padding:10px 12px;font-family:JetBrains Mono,monospace;font-size:10px;display:flex;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.toast button{padding:7px 10px}@media (width<=700px){.toast{bottom:calc(96px + env(safe-area-inset-bottom))}}@media (prefers-reduced-motion:reduce){button.rec-on,button.trip-on{animation:none}}
