:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;--ink: #f3f1e7;--dim: #8a8f88;--line: #313732;--panel: #101312;--panel-2: #151918;--signal: #ff5a36;--acid: #d3ed75;--safe-bottom: max(16px, env(safe-area-inset-bottom))}*{box-sizing:border-box}html{background:#070909;scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(90deg,transparent 49.8%,rgba(255,255,255,.016) 50%,transparent 50.2%),radial-gradient(circle at 10% 0%,rgba(255,90,54,.1),transparent 30rem),#070909;color:var(--ink);overflow-x:hidden}button,input{font:inherit}button{color:inherit;touch-action:manipulation;cursor:pointer}button:focus-visible,input:focus-visible,.step:focus-visible{outline:2px solid #fff;outline-offset:2px}.skip-link{position:fixed;left:12px;top:-70px;z-index:100;padding:12px 16px;color:#000;background:var(--acid)}.skip-link:focus{top:12px}main{width:min(100%,1600px);margin-inline:auto;border-inline:1px solid #151917;background:#070909d6}.topbar{min-height:96px;padding:max(14px,env(safe-area-inset-top)) clamp(12px,3vw,38px) 13px;display:flex;align-items:end;justify-content:space-between;gap:20px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#111614,#090b0a)}.maker,.scene-heading span,.selection-title>span,.performance-head>div>span,.project-name>span{display:block;color:var(--dim);font-size:9px;font-weight:800;letter-spacing:.22em}.wordmark{display:flex;align-items:baseline;gap:10px}.wordmark i{width:22px;height:9px;background:var(--signal);clip-path:polygon(0 0,100% 0,70% 100%,0 100%)}.wordmark strong{font-family:Impact,Haettenschweiler,Arial Narrow Bold,sans-serif;font-size:clamp(31px,6vw,52px);line-height:.92;letter-spacing:.02em}.wordmark em{color:var(--dim);font-size:8px;font-style:normal;letter-spacing:.2em;white-space:nowrap}.transport{display:grid;grid-template-columns:auto auto auto;align-items:stretch;gap:6px}.play,.metal,.tempo{min-height:52px;border:1px solid #3a423d;background:#171b19}.play{min-width:94px;display:flex;align-items:center;justify-content:center;gap:10px;border-color:#72331f;background:linear-gradient(145deg,#25140e,#17100d)}.play span{color:var(--signal)}.play b{font-size:11px;letter-spacing:.16em}.play.active{background:var(--signal);color:#160906}.play.active span{color:#160906}.metal{min-width:56px;padding:0 12px;color:#c6cbc3;font-size:10px;font-weight:900;letter-spacing:.12em}.tempo{position:relative;width:86px;display:block;padding:5px 5px 0}.tempo span{position:absolute;top:5px;left:7px;color:var(--dim);font-size:7px;font-weight:800;letter-spacing:.1em}.tempo input{min-width:0;width:100%;height:100%;padding:7px 0 0;border:0;background:none;color:var(--acid);text-align:center;font-family:ui-monospace,monospace;font-size:22px;font-weight:800}.scene-strip{display:grid;grid-template-columns:130px minmax(340px,1fr) minmax(260px,.55fr);align-items:center;gap:15px;padding:12px clamp(12px,3vw,38px);border-bottom:1px solid var(--line);background:#0c0f0e}.scene-heading small{display:block;margin-top:4px;color:#555c57;font-size:8px}.scene-buttons{display:grid;grid-template-columns:repeat(4,minmax(85px,1fr));gap:5px}.scene-unit{display:grid;grid-template-columns:1fr 44px;gap:2px}.scene,.chain{min-height:44px;border:1px solid #303632;background:#131715}.scene{padding:5px 8px;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:8px;text-align:left}.scene span{color:#616761;font-family:ui-monospace,monospace;font-size:10px}.scene b{overflow:hidden;font-size:9px;letter-spacing:.11em;text-overflow:ellipsis;white-space:nowrap}.scene.current{border-color:var(--acid);background:#22291c}.scene.current span{color:var(--acid)}.chain{color:#565d57;font-family:ui-monospace,monospace}.chain.joined{color:#0d120b;border-color:var(--acid);background:var(--acid);font-weight:900}.scene-settings{display:grid;grid-template-columns:44px 44px minmax(140px,1fr);align-items:center;gap:4px}.segment{min-width:44px;height:44px;border:1px solid #39413c;background:#111513;font-family:ui-monospace,monospace}.segment.on{border-color:var(--signal);color:var(--signal)}.scene-settings label,.parameter-grid label,.master{min-height:44px;display:grid;grid-template-columns:auto 1fr 42px;align-items:center;gap:8px;padding:0 8px;border:1px solid #252b27;background:#111412}label>span,.choice-row>span{color:var(--dim);font-size:8px;font-weight:900;letter-spacing:.12em;white-space:nowrap}output{color:#e1e5dd;font-family:ui-monospace,monospace;font-size:10px;text-align:right}input[type=range]{width:100%;height:30px;accent-color:var(--acid)}.sequencer{overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-color:#343b36 #090b0a;background:#090b0a}.bar-ruler,.lane{min-width:max(860px,calc(218px + var(--step-count,16) * 46px));display:grid;grid-template-columns:218px 1fr}.bar-ruler{height:28px;position:sticky;top:0;z-index:4;background:#0c0f0e;border-bottom:1px solid #242925}.bar-ruler>span{padding:9px 16px;color:#535a54;font-size:7px;font-weight:800;letter-spacing:.2em}.bar-ruler>div{display:grid;grid-template-columns:repeat(var(--step-count,16),44px);gap:2px}.bar-ruler i{display:grid;place-items:center;color:#434944;font: 8px ui-monospace,monospace;border-left:1px solid #171a18}.bar-ruler i.beat{color:#9da39d;border-left-color:#3d443f}.lane{min-height:58px;border-bottom:1px solid #202521}.lane-head{position:sticky;left:0;z-index:3;display:grid;grid-template-columns:minmax(78px,1fr) 88px 46px;align-items:stretch;background:#101311;box-shadow:9px 0 18px #0000008c;border-right:1px solid #343a36}.voice-pad,.length,.tiny{border:0;background:none}.voice-pad{min-height:56px;display:grid;grid-template-columns:32px 1fr;align-items:center;padding:4px 7px;text-align:left}.voice-pad b{width:32px;height:32px;display:grid;place-items:center;color:#090b0a;background:var(--lane);border-radius:50%;font-family:ui-monospace,monospace;font-size:13px;box-shadow:0 0 16px color-mix(in srgb,var(--lane),transparent 70%)}.voice-pad span{padding-left:8px;color:#b9beb7;font-size:8px;font-weight:900;letter-spacing:.08em;overflow:hidden;text-overflow:ellipsis}.lane-switches{display:grid;grid-template-columns:1fr 1fr}.tiny{min-width:44px;min-height:44px;color:#656c67;border-left:1px solid #232824;font:800 9px ui-monospace,monospace}.tiny.latched{color:#0a0d0b;background:var(--lane)}.length{min-width:44px;display:grid;place-content:center;border-left:1px solid #252a26}.length span{color:#555c57;font-size:6px;letter-spacing:.1em}.length b{color:#cbd0c9;font:11px ui-monospace,monospace}.steps{display:grid;grid-template-columns:repeat(var(--step-count),44px);gap:2px;padding:7px 0;background:repeating-linear-gradient(90deg,transparent 0 183px,rgba(255,255,255,.025) 183px 184px)}.step{position:relative;width:44px;height:44px;padding:0;border:1px solid #2b312d;background:#111513}.step:before{content:"";position:absolute;inset:9px;border:1px solid #353b37;border-radius:50%}.step.on:before{border-color:var(--lane);background:color-mix(in srgb,var(--lane),#0a0c0b 45%);box-shadow:0 0 10px color-mix(in srgb,var(--lane),transparent 62%)}.step.on.soft:before{opacity:.65;transform:scale(.78)}.step.on.accent:after{content:"";position:absolute;inset:4px;border:1px solid var(--lane)}.step.selected{border-color:#fff}.step.playhead{background:#f0efe7}.step.playhead:before{border-color:#111;box-shadow:none}.step span{position:relative;z-index:1;color:#080a09;font:900 8px ui-monospace,monospace}.lane-stack.has-solo .lane:not(:has(.tiny:nth-child(2).latched)){opacity:.42}.edit-deck{display:grid;grid-template-columns:178px 1fr;border-top:1px solid #424a44;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#131715,#0c0f0e)}.selection-title{min-height:154px;padding:19px 16px;border-right:1px solid #303632;box-shadow:inset 4px 0 var(--lane)}.selection-title b{display:block;margin-top:17px;color:var(--lane);font-family:Impact,sans-serif;font-size:25px;font-weight:400;letter-spacing:.04em}.selection-title em{display:block;margin-top:5px;color:#747b75;font: 11px ui-monospace,monospace}.parameter-grid{padding:8px;display:grid;grid-template-columns:repeat(4,minmax(170px,1fr));gap:5px;overflow-x:auto}.parameter-grid label{min-width:170px}.choice-row{min-height:44px;min-width:260px;display:grid;grid-template-columns:1fr repeat(4,44px);align-items:center;padding-left:8px;border:1px solid #252b27;background:#111412}.choice-row button{min-width:44px;height:44px;border:0;border-left:1px solid #2d332f;background:none;color:#747c76;font:800 9px ui-monospace,monospace}.choice-row button.on{color:#0b0d0c;background:var(--acid)}.wide-switch{min-height:44px;padding:0 13px;border:1px solid #333a35;background:#151917;color:#a7ada7;font-size:9px;font-weight:900;letter-spacing:.1em}.wide-switch.on{color:#170a06;background:var(--signal);border-color:var(--signal)}.wide-switch span{float:right;color:var(--dim)}.wide-switch:disabled{opacity:.36}.performance{padding:clamp(18px,4vw,48px) clamp(12px,3vw,38px);border-bottom:1px solid var(--line);background:radial-gradient(circle at 65% 20%,rgba(211,237,117,.055),transparent 34rem),#0b0e0c}.performance-head{display:flex;align-items:end;justify-content:space-between;gap:14px;margin-bottom:15px}.performance-head h2{margin:3px 0 0;font-size:clamp(18px,3vw,29px);letter-spacing:-.04em}.record{min-height:44px;padding:0 15px;display:flex;align-items:center;gap:9px;border:1px solid #3d4540;background:#151917;color:#9ba19c;font-size:9px;font-weight:900;letter-spacing:.12em}.record i{width:9px;height:9px;border-radius:50%;background:#6c726d}.record.on{border-color:var(--signal);color:var(--signal)}.record.on i{background:var(--signal);box-shadow:0 0 12px var(--signal)}.pads{display:grid;grid-template-columns:repeat(8,1fr);gap:7px}.pads button{position:relative;min-height:clamp(80px,10vw,140px);display:grid;align-content:center;justify-items:center;border:1px solid color-mix(in srgb,var(--lane),#333 55%);background:linear-gradient(145deg,color-mix(in srgb,var(--lane),#101311 90%),#0b0d0c);box-shadow:inset 0 -7px 12px #0000004d;user-select:none}.pads button:after{content:"";width:30px;height:3px;position:absolute;bottom:11px;background:var(--lane);opacity:.65}.pads button b{color:var(--lane);font:28px Impact,sans-serif}.pads button span{margin-top:4px;color:#9ba19b;font-size:7px;font-weight:900;letter-spacing:.08em}.pads button small{position:absolute;top:8px;right:8px;color:#555b57;font:8px ui-monospace,monospace}.pads button.hit{transform:translateY(3px);filter:brightness(1.8)}.project-panel{min-height:94px;display:grid;grid-template-columns:minmax(170px,1fr) minmax(180px,.7fr) auto;align-items:center;gap:10px;padding:13px clamp(12px,3vw,38px);border-bottom:1px solid var(--line);background:#0f1211}.suite-preset{display:grid;gap:5px}.suite-preset span{color:#777f78;font:800 8px ui-monospace,monospace;letter-spacing:.12em}.suite-preset select{min-height:44px;border:1px solid #38403a;background:#171b19;color:#e7ece7;padding:0 10px;border-radius:3px}.project-name input{width:100%;height:36px;margin-top:4px;padding:0;border:0;border-bottom:1px solid #3d443f;background:none;color:var(--ink);font-size:17px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.project-actions{display:grid;grid-template-columns:repeat(3,minmax(96px,auto));gap:5px}.project-actions button{min-height:44px;padding:0 12px;border:1px solid #38403a;background:#171b19;color:#b4bab4;font-size:8px;font-weight:900;letter-spacing:.11em}.project-actions button:is(#exportSuite,#importSuite){border-color:#627e67;color:#cbe5cf}.project-panel p{grid-column:1/-1;margin:0;color:#505650;font:8px ui-monospace,monospace}footer{min-height:60px;padding:15px clamp(12px,3vw,38px) var(--safe-bottom);display:flex;justify-content:space-between;gap:12px;color:#4e554f;font:8px ui-monospace,monospace;letter-spacing:.08em}#toast{position:fixed;z-index:30;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));max-width:calc(100% - 28px);padding:12px 18px;color:#0a0c0b;background:var(--acid);font-size:11px;font-weight:800;transform:translate(-50%,30px);opacity:0;pointer-events:none;transition:.2s ease}#toast.show{transform:translate(-50%);opacity:1}@media(max-width:820px){.topbar{min-height:82px;align-items:center;padding-inline:12px}.wordmark em{display:none}.maker{font-size:7px}.wordmark i{width:13px}.wordmark strong{font-size:31px}.play{min-width:58px}.play b{display:none}.tempo{width:74px}.metal{min-width:44px;padding:0}.scene-strip{grid-template-columns:1fr;gap:8px;padding:10px 12px}.scene-heading small{display:inline;margin-left:8px}.scene-heading{display:flex;align-items:baseline}.scene-settings{grid-template-columns:44px 44px 1fr}.edit-deck{grid-template-columns:1fr}.selection-title{min-height:auto;padding:10px 14px;display:flex;align-items:baseline;gap:10px;border-right:0;border-bottom:1px solid #2b312d;box-shadow:inset 4px 0 var(--lane)}.selection-title b,.selection-title em{display:inline;margin:0}.selection-title b{font-size:18px}.parameter-grid{grid-template-columns:repeat(3,minmax(170px,1fr))}.pads{grid-template-columns:repeat(4,1fr)}.pads button{min-height:92px}.project-panel{grid-template-columns:1fr}.project-actions{grid-template-columns:repeat(3,1fr)}.project-panel p{grid-column:1}}@media(max-width:430px){.topbar{gap:7px}.wordmark strong{font-size:27px}.wordmark i{display:none}.maker{letter-spacing:.12em}.transport{gap:3px}.tempo{width:68px;padding-inline:5px}.tempo input{font-size:19px}.play{min-width:46px}.scene-buttons{grid-template-columns:repeat(2,1fr)}.scene-unit{grid-template-columns:1fr 44px}.scene-heading small{display:none}.bar-ruler,.lane{grid-template-columns:200px 1fr;min-width:max(892px,calc(200px + var(--step-count,16) * 46px))}.lane-head{grid-template-columns:minmax(60px,1fr) 88px 46px}.voice-pad span{display:none}.bar-ruler>span{padding-left:9px}.parameter-grid{grid-template-columns:repeat(2,minmax(170px,1fr))}.performance-head{align-items:center}.performance-head h2{font-size:17px}.record{padding:0 9px}.pads{gap:5px}.pads button{min-height:78px}.pads button b{font-size:23px}.pads button span{display:none}.project-actions{grid-template-columns:1fr}.project-actions button{width:100%}footer{flex-direction:column}}@media(max-width:350px){.topbar{flex-wrap:wrap}.brand{width:100%}.transport{width:100%;grid-template-columns:1fr 74px 50px}.parameter-grid{grid-template-columns:repeat(1,minmax(250px,1fr))}.choice-row{min-width:250px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}