:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#161616;--panel:#232323;--device:#2d2d2d;--title:#3a3a3a;--ctl:#474747;--ctl-hi:#545454;--field:#181818;--line:#0f0f0f;--edge:#626262;--text:#e4e4e4;--muted:#b0b0b0;--faint:#9a9a9a;--on-accent:#101010;--accent:#ff9e2c;--accent-dim:#7a4f17;--mute:#e6b93c;--solo:#4aa3e6;--danger:#ff5a4a;--font:"Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif;font-family:var(--font)}#ui{position:fixed;inset:0;overflow:hidden}.app{--h:24px;--h2:24px;--cta:28px;--bar:40px;--row:40px;--nav:28px;--arrow:28px;--tile:48px;--pad:36px;--box:12px;--lh:12px;box-sizing:border-box;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:var(--bg);color:var(--text);font:400 12px/1.4 var(--font);font-variant-numeric:tabular-nums;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;display:grid;position:absolute;inset:0;overflow:hidden}.app[data-touch]{--h:36px;--h2:32px;--cta:44px;--bar:48px;--row:48px;--nav:36px;--arrow:32px;--tile:56px;--pad:48px;--box:20px}.app :is(button,input,a,.scroll){font-family:inherit}.app button{color:inherit;font:inherit;appearance:none}.app :is(b,strong,h1,h2,h3,h4){font-weight:500}.grow{flex:1 1 0;min-width:0}.vh{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.top{grid-area:top}.tracks{grid-area:tracks}.stage{grid-area:stage}.right{grid-area:right}.app[data-shell=wide]{grid-template-columns:clamp(232px,19vw,280px) minmax(0,1fr) clamp(320px,28vw,460px);grid-template-rows:var(--bar) minmax(0, 1fr);grid-template-areas:"top top top""tracks stage right"}.app[data-shell=tall]{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--bar) auto auto minmax(0, 1fr);--chrome:212px;--reserve:230px;--slot-h:clamp(270px, calc(var(--vh,100vh) - var(--chrome) - var(--reserve)), min(calc(100vw - 20px), 540px));grid-template-areas:"top""tracks""stage""right"}.app[data-shell=side]{grid-template:"top top top"44px"tracks stage right"minmax(0,1fr)/58px minmax(0,1fr) clamp(320px,36vw,360px)}.btn{box-sizing:border-box;height:var(--h);min-width:var(--h);border:1px solid var(--line);background:var(--ctl);color:var(--text);white-space:nowrap;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:2px;flex:none;justify-content:center;align-items:center;gap:4px;padding:0 12px;font-size:12px;line-height:1;text-decoration:none;display:inline-flex;position:relative}@media (hover:hover){.btn:hover{background:var(--ctl-hi)}}.btn:active{background:var(--accent);color:var(--on-accent)}.btn.sq{width:var(--h);padding:0}.btn.wide{width:100%;height:calc(var(--h) + 4px)}.btn.quiet{color:var(--muted);background:0 0}.btn.on,.btn.primary{background:var(--accent);color:var(--on-accent)}@media (hover:hover){.btn.on:hover,.btn.primary:hover{background:var(--accent);filter:brightness(1.1)}}.btn:disabled{opacity:.4;cursor:default;pointer-events:none}.btn .icon{flex:none}.app:not([data-touch]) .btn .icon[width="24"]{width:12px;height:12px}:is(.btn,.chip,.tile,.pick,.ms,.pad,.bar,.stamp,.toggle,.mic,.mini button,input[type=range],input[type=text]):focus-visible{outline:2px solid var(--accent);outline-offset:1px}.top{border-bottom:1px solid var(--line);background:var(--title);align-items:center;gap:8px;min-width:0;padding:0 8px;display:flex}.brand{color:var(--text);-webkit-user-select:none;user-select:none;align-items:center;gap:8px;margin:0 16px 0 0;display:flex}.mark-bubble{width:28px;height:28px;image-rendering:pixelated;display:block}.pxt{flex:none;display:block}.top .play,.top .share{height:var(--cta);gap:4px;padding:0 8px;font-weight:500}.top .play{width:76px}.top .play .icon{color:var(--accent)}.top .play.live{background:var(--accent);color:var(--on-accent)}.top .play.live .icon{color:var(--on-accent)}.top .play.attn{outline-offset:-3px;outline:2px solid #0000;animation:1.2s step-end infinite wake}@keyframes wake{0%{outline-color:#0000}50%{outline-color:var(--accent)}}.top .share{border-color:var(--accent)}.top>.sq{height:var(--cta);width:var(--cta)}.top>.sq:after{content:"";position:absolute;inset:-4px}.tempo .btn:after{content:"";position:absolute;inset:-5px}.tempo{box-sizing:border-box;height:var(--cta);border:1px solid var(--line);background:var(--field);align-items:stretch;display:flex}.tempo .btn{border:0;border-radius:0;height:auto}.tempo .btn:first-child{border-right:1px solid var(--line)}.tempo .btn:last-child{border-left:1px solid var(--line)}.tempo .lcdbtn{box-sizing:border-box;min-width:56px;color:var(--accent);cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:0 0;border:0;border-radius:0;grid-template-columns:auto auto;place-content:center;align-items:center;gap:4px 8px;padding:0 8px;display:grid}.tempo .lcdbtn:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.tempo .lcd{color:var(--accent);line-height:0;display:block}.tempo small{color:var(--muted);font-size:11px;line-height:1}.beats{grid-column:1/-1;justify-self:center;gap:2px;display:flex}.beats i{background:#3d3d3d;width:8px;height:3px}.beats i.on{background:var(--accent)}.beats i.one.on{background:var(--text)}.app[data-touch] .tempo .btn{width:32px;min-width:32px}.rec{color:var(--danger);align-items:center;gap:8px;font-size:12px;font-weight:500;display:inline-flex}.rec i{background:var(--danger);width:8px;height:8px;animation:1s step-end infinite blink}@keyframes blink{50%{opacity:.2}}.chain{align-items:center;gap:4px;padding:0 4px;display:flex}.chain i{background:var(--c);width:12px;height:12px}.chain i.next{box-sizing:border-box;border:2px solid var(--c);background:0 0}.tracks{background:var(--panel);flex-direction:column;min-width:0;min-height:0;display:flex}.app[data-shell=wide] .tracks{border-right:1px solid var(--line)}.app[data-shell=tall] .tracks{border-bottom:1px solid var(--line)}.app[data-shell=side] .tracks{border-right:1px solid var(--line)}.tracks>.scroll{border-top:1px solid var(--line);flex:1 1 0}.trackblock{flex-direction:column;min-width:0;min-height:0;display:flex}.trackblock .cap{height:20px;color:var(--muted);align-items:center;gap:8px;padding:0 8px;font-size:11px;display:flex}.trackblock .cap .h{color:var(--text);font-size:12px;font-weight:500}.trackblock .cap .chain{margin-left:auto;padding:0}.trackblock .list{touch-action:none;margin:0;padding:0 8px 4px;list-style:none;display:grid}.track{min-width:0;position:relative}.track .pick{box-sizing:border-box;border:1px solid var(--line);background:var(--device);cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:2px;width:100%;min-width:0;height:100%;padding:0;display:grid;position:relative;overflow:hidden}@media (hover:hover){.track .pick:hover{background:var(--title)}}.track .pick:before{content:"";background:var(--c);opacity:.35;position:absolute}.track.used .pick:before{opacity:1}.track.sel .pick{background:var(--title);border-color:var(--accent);outline:1px solid var(--accent);outline-offset:-2px}.track.quiet .pick{opacity:.5}.track .num{font-variant-numeric:tabular-nums;font-size:11px;font-style:normal;font-weight:500;line-height:var(--lh)}.track:not(.used) .num{color:var(--faint)}.track.sel .num,.track.used .num{color:var(--text)}.thumb{image-rendering:pixelated;background:#2a2a2a;flex:none;display:block}.track .meter{width:calc(var(--lvl,0) * 100%);background:var(--c);height:2px;position:absolute;bottom:0;left:0}.track .mark{color:var(--c);line-height:0;position:absolute;top:2px;right:4px}.track.friend .pick{animation:1.6s step-end infinite invite}@keyframes invite{0%{border-color:var(--line)}50%{border-color:var(--c)}}.trackblock[data-kind=strip] .list{grid-template-columns:repeat(8,minmax(0,1fr));gap:4px;padding-top:4px}.trackblock[data-kind=strip] .track{height:var(--row)}.trackblock[data-kind=strip] .pick{flex-direction:column;justify-content:center;align-items:center;gap:1px;display:flex}.trackblock[data-kind=strip] .pick:before{height:2px;top:0;left:0;right:0}.trackblock[data-kind=strip] .track.quiet .num{text-decoration:line-through}.trackblock[data-kind=column]{flex:1 1 0}.trackblock[data-kind=column] .cap{flex-direction:column;justify-content:center;align-items:flex-start;gap:0;height:24px;padding:0 4px}.trackblock[data-kind=column] .cap .n{font-size:11px;line-height:1.1}.trackblock[data-kind=column] .list{flex:1 1 0;grid-template-rows:repeat(8,minmax(0,1fr));grid-template-columns:minmax(0,1fr);gap:2px;padding:0 4px 4px}.trackblock[data-kind=column] .pick{justify-content:center;align-items:center;gap:4px;display:flex}.trackblock[data-kind=column] .pick:before{width:2px;top:0;bottom:0;left:0}.trackblock[data-kind=column] .num{text-align:center;width:8px}.trackblock[data-kind=column] .track.quiet .num{text-decoration:line-through}.trackblock[data-kind=rows] .list{gap:4px}.trackblock[data-kind=rows] .track{grid-template-columns:minmax(0, 1fr) var(--h2) var(--h2);height:var(--row);align-items:center;gap:4px;display:grid}.trackblock[data-kind=rows] .pick{text-align:left;grid-template-columns:12px 32px minmax(0,1fr);grid-template-areas:"num thumb name""num thumb sub";align-content:center;column-gap:4px;padding:0 8px}.trackblock[data-kind=rows] .num{text-align:center;grid-area:num;align-self:center}.trackblock[data-kind=rows] .thumb{grid-area:thumb;align-self:center}.trackblock[data-kind=rows] .pick:before{width:4px;top:0;bottom:0;left:0}.trackblock[data-kind=rows] .name{text-overflow:ellipsis;white-space:nowrap;grid-area:name;align-self:end;min-width:0;font-size:12px;overflow:hidden}.trackblock[data-kind=rows] .sub{min-width:0;color:var(--muted);text-overflow:ellipsis;white-space:nowrap;grid-area:sub;align-self:start;font-size:11px;overflow:hidden}.trackblock[data-kind=rows] .track.quiet .name{text-decoration:line-through}.ms{box-sizing:border-box;width:var(--h2);height:var(--h2);border:1px solid var(--line);background:var(--ctl);color:var(--text);cursor:pointer;touch-action:manipulation;border-radius:2px;flex:none;place-items:center;padding:0;font-size:11px;font-weight:500;display:grid}@media (hover:hover){.ms:hover{background:var(--ctl-hi)}}.ms.on{background:var(--mute);color:var(--on-accent)}.ms.solo.on{background:var(--solo)}.stage{background:var(--bg);grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;display:grid}.head{border-bottom:1px solid var(--line);background:var(--title);touch-action:none;align-items:center;gap:4px;min-width:0;padding:4px 8px;display:flex}.head .arrow{width:var(--arrow);height:var(--arrow)}.head .who{flex:1 1 0;min-width:0;padding:0 4px}.head .title{white-space:nowrap;align-items:center;gap:8px;min-width:0;display:flex;overflow:hidden}.head .title b{font-size:13px;font-weight:500}.head .title .dot{background:var(--c);flex:none;width:8px;height:8px}.head .preset{text-overflow:ellipsis;font-size:13px;overflow:hidden}.head .fam{color:var(--muted);font-size:11px}.head .line{color:var(--muted);-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:1px 0 0;font-size:11px;line-height:1.3;display:-webkit-box;overflow:hidden}.view{flex:none;align-items:center;gap:8px;padding:0 2px;display:flex}.view .lab{color:var(--muted);margin:0;font-size:11px}.mini{grid-template-columns:repeat(2,12px);gap:4px;display:grid}.trackblock .mini{grid-template-columns:repeat(2,8px);gap:4px}.trackblock .mini button{width:8px;height:8px}.mini button{box-sizing:border-box;border:1px solid var(--line);background:color-mix(in srgb, var(--accent) calc(10% + var(--k,0) * 70%), var(--ctl));cursor:pointer;touch-action:manipulation;border-radius:0;width:12px;height:12px;padding:0;position:relative}.mini button.here{outline:2px solid var(--text);outline-offset:0}.mini button:after{content:"";position:absolute;inset:-4px}.app[data-shell=tall] .head .line{display:none}.slot{touch-action:none;min-width:0;min-height:0;position:relative;overflow:hidden}.app[data-shell=tall] .slot{height:var(--slot-h)}.slot canvas{image-rendering:pixelated;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;will-change:transform;transition:none;display:block;position:absolute}#sheet-peer{pointer-events:none}.right{background:var(--panel);min-width:0;min-height:0}.app[data-shell=wide] .right,.app[data-shell=side] .right{border-left:1px solid var(--line)}.app[data-shell=tall] .right{border-top:1px solid var(--line)}.scroll{overscroll-behavior:contain;-webkit-overflow-scrolling:touch;touch-action:pan-y;scrollbar-width:thin;scrollbar-color:var(--ctl) transparent;flex:1 1 0;min-height:0;position:relative;overflow:hidden auto}.scroll::-webkit-scrollbar{width:8px}.scroll::-webkit-scrollbar-thumb{background:var(--ctl)}.info{border-top:1px solid var(--line);background:var(--field);color:var(--muted);flex:none;margin:0;padding:4px 8px;font-size:11px;line-height:1.4}.info span{-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;min-height:2.8em;display:-webkit-box;overflow:hidden}.app:not([data-shell=wide]) .info span{-webkit-line-clamp:1;line-clamp:1;min-height:1.4em}.trackname{align-items:center;gap:8px;margin:0;padding:8px 8px 0;font-size:13px;font-weight:500;display:flex}.trackname .dot{background:var(--c);width:8px;height:8px}.trackname small{color:var(--muted);font-size:12px;font-weight:400}.sec{border:1px solid var(--line);background:var(--device);margin:8px}.sec>header{box-sizing:border-box;border-bottom:1px solid var(--line);background:var(--title);align-items:center;min-height:24px;padding:0 8px;display:flex}.sec h3{color:var(--text);margin:0;font-size:12px;font-weight:500}.sec .body{padding:8px}.subline{color:var(--muted);text-wrap:pretty;margin:0 0 8px;font-size:11px}.lab{color:var(--muted);margin:8px 0 4px;font-size:11px;display:block}.note{color:var(--muted);text-wrap:pretty;margin:8px 0 0;font-size:11px;line-height:1.4}.banner{border:1px solid var(--line);border-left:4px solid var(--accent);background:var(--device);margin:8px;padding:8px}.banner p{text-wrap:pretty;margin:0 0 8px;font-size:12px}.group{grid-template-columns:56px minmax(0,1fr);align-items:start;gap:8px;margin-bottom:8px;display:grid}.group .lab{line-height:var(--h2);margin:0}.chips{flex-wrap:wrap;gap:4px;display:flex}.chip{box-sizing:border-box;height:var(--h2);border:1px solid var(--line);background:var(--ctl);color:var(--text);cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;border-radius:2px;align-items:center;gap:4px;padding:0 8px;font-size:12px;display:inline-flex}@media (hover:hover){.chip:hover{background:var(--ctl-hi)}}.chip:active,.chip.on{background:var(--accent);color:var(--on-accent)}.chip .sw{background:var(--pc,var(--accent));width:8px;height:8px}.actions{flex-wrap:wrap;gap:4px;margin-top:8px;display:flex}.actions .btn{flex:120px}.actions.stack{flex-flow:column;margin:8px 0 4px}.actions.stack .btn{flex:none}.grid4{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;display:grid}.tile{box-sizing:border-box;height:var(--tile);border:1px solid var(--line);background:var(--ctl);color:var(--text);cursor:pointer;touch-action:manipulation;border-radius:2px;place-content:center;justify-items:center;gap:4px;padding:0;font-size:11px;display:grid}@media (hover:hover){.tile:hover{background:var(--ctl-hi)}}.tile:active,.tile.on{background:var(--accent);color:var(--on-accent)}.tile:disabled{opacity:.4;pointer-events:none}.pair{grid-template-columns:1fr 1fr;gap:4px;margin:8px 0 4px;display:grid}.slider,.stepper{grid-template-columns:56px minmax(0,1fr);align-items:center;gap:8px;margin:0 0 4px;display:grid}.slider .lab,.stepper .lab{color:var(--text);margin:0;font-size:12px}.slider .bar{box-sizing:border-box;height:var(--h);border:1px solid var(--line);background:var(--field);display:block;position:relative;overflow:hidden}.slider .fill{background:var(--accent-dim);position:absolute;top:0;bottom:0;left:0}.slider input[type=range]{opacity:0;cursor:ew-resize;touch-action:pan-y;appearance:none;width:100%;height:100%;margin:0;padding:0;position:absolute;inset:0}.slider .val{color:var(--text);font-variant-numeric:tabular-nums;pointer-events:none;justify-content:flex-end;align-items:center;font-size:11px;display:flex;position:absolute;inset:0 8px 0 0}.stepper{grid-template-columns:56px var(--h) minmax(0, 1fr) var(--h);gap:0}.stepper .lab{margin-right:8px}.stepper .val{box-sizing:border-box;height:var(--h);border:1px solid var(--line);background:var(--field);font-variant-numeric:tabular-nums;border-width:1px 0;justify-content:center;align-items:center;font-size:12px;display:flex}.stepper .btn:first-of-type{border-right:1px solid var(--line)}.toggle{width:100%;min-height:var(--h);text-align:left;cursor:pointer;touch-action:manipulation;background:0 0;border:0;justify-content:space-between;align-items:center;gap:12px;margin:2px 0;padding:4px 0;display:flex}.toggle .text{gap:1px;min-width:0;display:grid}.toggle b{font-size:12px;font-weight:500}.toggle small{color:var(--muted);text-wrap:pretty;font-size:11px;line-height:1.3}.switch{box-sizing:border-box;width:var(--box);height:var(--box);border:1px solid var(--line);background:var(--field);flex:none}.toggle.on .switch{background:var(--accent)}.pads{grid-template-columns:repeat(6,minmax(0,1fr));gap:4px;display:grid}.pad{box-sizing:border-box;height:var(--pad);border:1px solid var(--line);background:color-mix(in srgb, var(--c) 22%, #202020);color:var(--text);cursor:pointer;touch-action:manipulation;border-radius:2px;padding:0;font-size:12px;font-weight:500}.pad:active{background:var(--accent);color:var(--on-accent)}.pad.now{background:var(--c);color:var(--on-accent)}.bars{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;display:grid}.bar{box-sizing:border-box;height:var(--pad);border:1px solid var(--line);border-bottom:4px solid var(--c);background:var(--ctl);cursor:pointer;touch-action:manipulation;border-radius:2px;place-content:center;justify-items:center;gap:1px;padding:0;display:grid}.bar small{font-size:11px}.bar b{font-size:12px}.bar.now{background:var(--title);outline:1px solid var(--c);outline-offset:-2px}.stamps{flex-wrap:wrap;gap:4px;display:flex}.stamp{box-sizing:border-box;border:1px solid var(--line);background:var(--ctl);cursor:pointer;touch-action:manipulation;border-radius:2px;flex-direction:column;justify-content:center;align-items:center;gap:4px;width:56px;height:56px;padding:0;display:flex}@media (hover:hover){.stamp:hover{background:var(--ctl-hi)}}.stamp:active{background:var(--accent)}.stamp svg{width:32px;height:32px;fill:var(--text)}.stamp:active svg{fill:var(--on-accent)}.stamp span{text-transform:capitalize;font-size:11px}.stamps .name{flex:100%;gap:4px;min-width:0;display:flex}.stamps input{box-sizing:border-box;width:0;min-width:0;height:calc(var(--h) + 4px);border:1px solid var(--line);background:var(--field);color:var(--text);-webkit-user-select:text;user-select:text;border-radius:2px;flex:1 1 0;padding:0 8px;font-size:12px}.app[data-touch] .stamps input{font-size:16px}.stamps input::placeholder{color:var(--faint)}.clipbtn{overflow:hidden}.clipbtn.rec{color:var(--danger);border-color:var(--danger)}.clipbtn.rec:after{content:"";height:4px;width:calc(var(--p,0) * 100%);background:var(--danger);position:absolute;bottom:0;left:0}.clipbtn.ready{background:var(--accent);color:var(--on-accent);animation:1.2s step-end infinite ready}@keyframes ready{0%{filter:none}50%{filter:brightness(1.15)}}.scrim{z-index:20;cursor:default;background:#0009;border:0;padding:0;position:fixed;inset:0}.sheet{z-index:21;box-sizing:border-box;width:min(420px,100%);padding:0 0 calc(16px + env(safe-area-inset-bottom));border:1px solid var(--line);background:var(--device);border-bottom:0;position:fixed;bottom:0;left:50%;transform:translate(-50%)}@media (min-width:700px){.sheet{border-bottom:1px solid var(--line);padding-bottom:16px;bottom:28px}}.sheet header{border-bottom:1px solid var(--line);background:var(--title);justify-content:space-between;align-items:center;gap:8px;padding:4px 4px 4px 12px;display:flex}.sheet h3{margin:0;font-size:12px}.sheet h3 small{color:var(--muted);font-size:11px;font-weight:400}.sheet .say{min-height:36px;color:var(--text);text-align:center;text-wrap:pretty;margin:12px 16px 4px;font-size:13px}.sheet .fine{color:var(--muted);text-align:center;text-wrap:pretty;margin:4px 16px 0;font-size:11px}.micwrap{place-items:center;height:124px;display:grid;position:relative}.mic{box-sizing:border-box;border:1px solid var(--line);background:var(--ctl);width:80px;height:80px;color:var(--text);outline:calc(2px + var(--level,0) * 14px) solid color-mix(in srgb, var(--c,var(--accent)) 45%, transparent);outline-offset:0;cursor:pointer;touch-action:manipulation;border-radius:2px;place-items:center;padding:0;display:grid}.mic.rec{background:var(--danger);color:#fff}.voice[data-phase=ready] .mic{animation:2s step-end infinite breathe}.voice[data-phase=working] .mic{opacity:.5}.voice[data-phase=denied] .mic{color:var(--danger)}.voice[data-phase=quiet] .mic{animation:.4s steps(4,jump-none) nope}@keyframes breathe{50%{outline-width:8px}}@keyframes nope{25%{transform:translate(-6px)}75%{transform:translate(6px)}}.reddot{background:var(--danger);width:8px;height:8px;animation:1s step-end infinite blink;position:absolute;top:16px;right:calc(50% - 56px)}.toast{top:calc(env(safe-area-inset-top) + 56px);z-index:30;border:1px solid var(--edge);background:var(--title);padding:8px 12px;font-size:12px;position:fixed;left:50%;transform:translate(-50%)}@media (max-width:520px){.top{gap:4px;padding:0 8px}.app[data-touch] .top>.sq{width:40px;min-width:40px}.tempo .lcdbtn{column-gap:4px;padding:0 4px}}@media (max-width:430px){.tempo small{display:none}}@media (max-width:380px){.top{gap:4px;padding:0 4px}.top .play{width:72px;padding:0 4px}.top .share{padding:0 4px}.app[data-touch] .top>.sq{width:36px;min-width:36px}.tempo .lcdbtn{min-width:48px}}@media (max-width:370px){.top .share .lbl{display:none}.top .share{padding:0 12px}}@media (max-width:340px){.top .play .lbl{display:none}.top .play{width:44px;padding:0}}.app:not([data-shell=wide]) .trackname,.app:not([data-shell=wide]) .head .fam{display:none}.app[data-shell=side] .top{gap:8px}.app[data-shell=side] .top .play,.app[data-shell=side] .top .share{height:40px;padding:0 12px}.app[data-shell=side] .top>.sq{height:40px}.app[data-shell=side] .head{border-bottom:0;height:32px;padding:0 8px}.app[data-shell=side] .head .line{-webkit-line-clamp:1;line-clamp:1}.app[data-shell=side] .sec{margin-left:4px;margin-right:4px}.app[data-shell=side] .pads{grid-template-columns:repeat(3,minmax(0,1fr))}.app[data-shell=side] .pad{height:40px}.app[data-shell=side] .group{grid-template-columns:minmax(0,1fr);gap:0}.app[data-shell=side] .group .lab{margin:4px 0;line-height:1.4}.app[data-shell=side] .slider,.app[data-shell=side] .stepper{grid-template-columns:48px minmax(0,1fr)}.app[data-shell=side] .stepper{grid-template-columns:48px var(--h) minmax(0, 1fr) var(--h)}@media (max-width:760px){.app[data-shell=side] .head .view .lab{display:none}}@media (max-width:700px){.app[data-shell=side] .head .title .preset{display:none}}@media (max-height:760px){.app[data-shell=tall]{--chrome:204px;--reserve:222px}.app[data-shell=tall] .head{padding:2px 8px}.app[data-shell=tall] .tabs button,.app[data-shell=tall] .deckbtn{height:calc(var(--nav) - 4px)}}@media (max-height:700px){.app[data-shell=tall]{--chrome:176px;--reserve:218px}.app[data-shell=tall] .info{display:none}}@media (max-height:639px){.app[data-shell=tall]{--reserve:120px}}@media (max-height:359px){.app[data-shell=side] .info{display:none}}.app[data-shell=tall] .head .view .lab{display:none}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.console{flex-direction:column;height:100%;min-height:0;display:flex}.console .pagebar{border-bottom:1px solid var(--line);background:var(--title);flex:none;display:flex}.tabs{flex:1 1 0;min-width:0;display:flex}.tabs button{min-width:0;height:var(--nav);border:0;border-bottom:2px solid #0000;border-left:1px solid var(--line);color:var(--muted);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:0;flex:1 1 0;padding:0 2px;font-size:12px}.tabs button:first-child{border-left:0}@media (hover:hover){.tabs button:hover{color:var(--text)}}.tabs button.on{border-bottom-color:var(--accent);background:var(--panel);color:var(--text);font-weight:500}.tabs button:focus-visible,.deckbtn:focus-visible{outline:2px solid var(--accent);outline-offset:-3px}.deckbtn{box-sizing:border-box;min-width:var(--nav);height:var(--nav);border:0;border-left:1px solid var(--line);color:var(--text);cursor:pointer;touch-action:manipulation;background:0 0;border-radius:0;flex:none;justify-content:center;align-items:center;gap:4px;padding:0 8px;font-size:12px;display:inline-flex}.deckbtn .icon{color:var(--muted)}.deckbtn.on{background:var(--accent);color:var(--on-accent)}.deckbtn.on .icon{color:var(--on-accent)}@media (max-width:359px){.deckbtn .w{display:none}}.pages{flex-direction:column;flex:1 1 0;min-height:0;display:flex;position:relative}.page{flex-direction:column;flex:1 1 0;min-height:0;display:flex}.page[hidden]{display:none}.mixdock{height:var(--dock,300px);border-top:1px solid var(--line);background:var(--panel);flex:none;overflow:hidden}.mixdock .mixer{height:100%;min-height:0;padding-bottom:4px}.mixdock .strips{min-height:0}.fader{cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;flex:1 1 0;min-width:0;min-height:0;position:relative}.fader:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.fader .ticks{top:calc(var(--cap) / 2);bottom:calc(var(--cap) / 2);opacity:.5;pointer-events:none;position:absolute;left:1px;right:1px}.fader .ticks:before{content:"";background:linear-gradient(var(--faint), var(--faint)) bottom / 100% 1px no-repeat, repeating-linear-gradient(to bottom, var(--faint) 0 1px, transparent 1px 10%);position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#000 0 3px,#0000 3px calc(100% - 3px),#000 calc(100% - 3px));mask-image:linear-gradient(90deg,#000 0 3px,#0000 3px calc(100% - 3px),#000 calc(100% - 3px))}.fader .groove{top:calc(var(--cap) / 2);bottom:calc(var(--cap) / 2);outline:1px solid var(--line);background:var(--field);pointer-events:none;width:4px;margin-left:-2px;position:absolute;left:50%}.fader .fill{left:50%;bottom:calc(var(--cap) / 2 + var(--lo) * (100% - var(--cap)));width:4px;height:calc(var(--len) * (100% - var(--cap)));background:var(--c,var(--accent));pointer-events:none;margin-left:-2px;position:absolute}.fader .detent{left:3px;right:3px;bottom:calc(var(--cap) / 2 + var(--d) * (100% - var(--cap)));background:var(--text);opacity:.55;pointer-events:none;height:1px;position:absolute}.fader .cap{left:50%;bottom:calc(var(--pos) * (100% - var(--cap)));box-sizing:border-box;width:min(100% - 2px,36px);height:var(--cap);border:1px solid var(--line);border-top-color:var(--edge);background:var(--ctl-hi);pointer-events:none;position:absolute;transform:translate(-50%)}.fader .cap:after{content:"";background:var(--edge);height:2px;margin-top:-1px;position:absolute;top:50%;left:0;right:0}.fader.held .cap:after{background:var(--accent)}.fader.h{cursor:ew-resize}.fader.h .ticks{top:1px;bottom:1px;left:calc(var(--cap) / 2);right:calc(var(--cap) / 2)}.fader.h .ticks:before{background:linear-gradient(var(--faint), var(--faint)) right / 1px 100% no-repeat, repeating-linear-gradient(to right, var(--faint) 0 1px, transparent 1px 10%);-webkit-mask-image:linear-gradient(#000 0 3px,#0000 3px calc(100% - 3px),#000 calc(100% - 3px));mask-image:linear-gradient(#000 0 3px,#0000 3px calc(100% - 3px),#000 calc(100% - 3px))}.fader.h .groove{top:50%;bottom:auto;left:calc(var(--cap) / 2);right:calc(var(--cap) / 2);width:auto;height:4px;margin:-2px 0 0}.fader.h .fill{top:50%;bottom:auto;left:calc(var(--cap) / 2 + var(--lo) * (100% - var(--cap)));width:calc(var(--len) * (100% - var(--cap)));height:4px;margin:-2px 0 0}.fader.h .detent{top:3px;bottom:3px;left:calc(var(--cap) / 2 + var(--d) * (100% - var(--cap)));width:1px;height:auto;right:auto}.fader.h .cap{top:50%;bottom:auto;left:calc(var(--pos) * (100% - var(--cap)));width:var(--cap);border-top-color:var(--line);border-left-color:var(--edge);height:min(100% - 2px,28px);transform:translateY(-50%)}.fader.h .cap:after{width:2px;height:auto;margin:0 0 0 -1px;inset:0 auto 0 50%}.meter{box-sizing:border-box;width:6px;margin:calc(var(--capsz,24px) / 2) 0;border:1px solid var(--line);background:var(--field);flex:none;display:block;position:relative}.meter:before{content:"";clip-path:inset(calc((1 - var(--f,0)) * 100%) 0 0 0);background:linear-gradient(to top, var(--mc,#7ccf6a) 0 70%, var(--mid,var(--mc,var(--mute))) 70% 88%, var(--danger) 88% 100%);position:absolute;inset:0}.meter:after{content:"";background:repeating-linear-gradient(to top, transparent 0 2px, var(--field) 2px 3px);position:absolute;inset:0}.meter .peak{left:0;right:0;bottom:calc(var(--k,0) * (100% - 2px));z-index:1;background:var(--text);height:2px;position:absolute}.mixer{box-sizing:border-box;flex-direction:column;gap:4px;min-height:100%;padding:4px 4px 8px;display:flex}.banks{flex:none;gap:4px;display:flex}.banks .chip{flex:1 1 0;justify-content:center;min-width:0;padding:0 2px}.strips{border:1px solid var(--line);background:var(--device);flex:1 1 0;grid-template-columns:repeat(9,minmax(0,1fr));min-height:168px;display:grid}.strip{border-left:1px solid var(--line);grid-template-rows:auto minmax(0,1fr) auto auto;row-gap:4px;min-width:0;min-height:0;padding:4px 0;display:grid;position:relative}.strip:first-child{border-left:0}.strip:before{content:"";background:var(--c,var(--edge));height:3px;position:absolute;top:0;left:0;right:0}.strip.sel{outline:1px solid var(--accent);outline-offset:-1px;background:color-mix(in srgb, var(--accent) 9%, var(--title))}.strip.out{border-left-width:2px}.strip .num{box-sizing:border-box;width:100%;min-height:var(--h2);color:var(--muted);font:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;border-radius:0;flex-direction:column;justify-content:center;align-items:center;padding:0;display:flex}.strip .num b{font-size:11px;font-weight:500;line-height:14px;display:block}.strip .num output{white-space:nowrap;max-width:100%;font-size:11px;line-height:14px;display:block;overflow:hidden}.strip .num.static{cursor:default}.strip.sel .num{color:var(--text)}.strip .num:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.strip .travel{min-height:44px;display:flex;position:relative}.strip .travel .meter{width:5px;position:absolute;top:0;bottom:0;left:5px}.strip .travel .meter+.meter{left:auto;right:5px}.strip.quiet .travel,.strip.quiet .num output{opacity:.5}.strip .ms{justify-self:center}.strip .lamp{box-sizing:border-box;width:calc(100% - 2px);height:var(--h2);border:1px solid var(--line);background:var(--field);color:var(--faint);place-items:center;margin:0 auto;font-size:11px;font-style:normal;display:grid}.strip .lamp.on{background:var(--danger);color:var(--on-accent)}.fx{box-sizing:border-box;flex-direction:column;gap:4px;min-height:100%;padding:4px 8px 8px;display:flex;container-type:inline-size}.targets{flex:none;gap:4px;display:flex}.targets .chip{flex:1 1 0;justify-content:center;min-width:0;padding:0 2px;position:relative}.targets .chip .led{background:#3d3d3d;width:4px;height:4px;position:absolute;top:3px;left:3px}.targets .chip.live .led{background:var(--accent)}.targets .chip.on.live .led{background:var(--on-accent)}.deck{flex:1 1 0;gap:8px;min-height:110px;display:flex}.xy{box-sizing:border-box;border:1px solid var(--line);background:var(--field);cursor:crosshair;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;flex:1 1 0;min-width:0;min-height:0;position:relative;overflow:hidden;container-type:inline-size}.xy:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.xy.down{border-color:var(--accent)}.xy.on:not(.down){border-color:var(--accent-dim)}.xy .grid{pointer-events:none;position:absolute;inset:0}.xy .grid:before{content:"";background:linear-gradient(90deg,#2a2a2a 1px,#0000 1px) 0 0/12.5% 100%,linear-gradient(#2a2a2a 1px,#0000 1px) 0 0/100% 16.6667%;position:absolute;inset:0}.xy.steps .grid:before{background:linear-gradient(to right, #2a2a2a 1px, transparent 1px) 0 0 / calc(100% / var(--n)) 100%, linear-gradient(to bottom, #2a2a2a 1px, transparent 1px) 0 0 / 100% calc(100% / 6)}.xy .band{top:0;bottom:0;left:calc(var(--col,0) / var(--n) * 100%);width:calc(100% / var(--n));background:color-mix(in srgb, var(--accent) 14%, transparent);pointer-events:none;display:none;position:absolute}.xy.steps.on .band{display:block}.xy .line{background:var(--edge);opacity:.55;pointer-events:none;position:absolute}.xy .line.v{top:0;bottom:0;left:calc(var(--x) * 100%);width:1px}.xy .line.z{left:0;right:0;top:calc((1 - var(--y)) * 100%);height:1px}.xy.on .line{background:var(--accent);opacity:.9}.xy .puck{left:calc(var(--x) * 100%);top:calc((1 - var(--y)) * 100%);box-sizing:border-box;border:2px solid var(--edge);pointer-events:none;width:24px;height:24px;margin:-12px 0 0 -12px;position:absolute}.xy.on .puck{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 35%, transparent)}.xy.down .puck{background:var(--accent)}.xy .ax{color:var(--faint);pointer-events:none;font-size:11px;line-height:1.2;position:absolute}.xy .ax.x{text-align:center;bottom:4px;left:0;right:0}.xy .ax.y{writing-mode:vertical-rl;top:50%;left:4px;transform:translateY(-50%)rotate(180deg)}.xy.steps .ax.x{display:none}.xy .cols{grid-template-columns:repeat(var(--n), minmax(0, 1fr));pointer-events:none;display:grid;position:absolute;bottom:4px;left:0;right:0}.xy .cols b{color:var(--faint);text-align:center;white-space:nowrap;font-size:11px;font-weight:400;line-height:1.2;overflow:hidden}.xy .cols b.now{color:var(--text);font-weight:500}@container (width<=230px){.xy .cols b:nth-child(2n){visibility:hidden}}.xy .read{color:var(--muted);pointer-events:none;white-space:nowrap;align-items:baseline;gap:8px;font-size:12px;display:flex;position:absolute;top:6px;left:8px;right:8px;overflow:hidden}.xy .read b{color:var(--text);font-weight:500}.xy .read span{color:var(--muted)}.eqbank{flex:none;gap:4px;width:132px;min-height:0;display:flex}.eqbank .band{border:1px solid var(--line);background:var(--device);flex:1 1 0;grid-template-rows:auto minmax(0,1fr) auto;row-gap:4px;min-width:0;padding:4px 0;display:grid}.eqbank .val,.eqbank .bandname{color:var(--muted);text-align:center;font-size:11px;font-weight:400;line-height:14px;display:block}.eqchip{display:none}@container (width<=329px){.eqchip{display:inline-flex}.fx .eqbank{flex:1 1 0;width:auto}.fx.eq .xy,.fx:not(.eq) .eqbank{display:none}}.keys{flex:none;align-items:center;gap:4px;display:flex}@container (width<=359px){.keys.second{flex-wrap:wrap}.keys.second .bend{flex:100%}}.keys .btn{min-width:0;padding:0 8px}.keys .hold{flex:none;width:64px}.keys .reset{flex:none;width:60px}.brakes{flex:1 1 0;align-items:center;gap:4px;min-width:0;display:flex}.brakes .lab,.bend .lab{color:var(--muted);flex:none;margin:0;font-size:11px}.brakes .btn{touch-action:none;-webkit-touch-callout:none;flex:1 1 0;padding:0 2px}.btn.drop{height:var(--cta);touch-action:none;-webkit-touch-callout:none;flex:1.2 1 0;position:relative;overflow:hidden}.btn.drop .fill{transform:scaleX(var(--build,0));transform-origin:0;background:var(--accent-dim);position:absolute;inset:0}.btn.drop .icon,.btn.drop .t{position:relative}.btn.drop.live{outline:2px solid var(--accent);outline-offset:-3px}.keys .btn[role=switch]{flex:none}.keys .btn.drop+.btn[role=switch]{width:76px}.bend{flex:2.2 1 0;align-items:center;gap:8px;min-width:0;display:flex}.bend .fader{height:var(--cta);flex:1 1 0;min-width:64px}.bend .val{width:44px;color:var(--muted);text-align:right;flex:none;font-size:11px}.scenes{grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin-bottom:8px;display:grid}.scene{box-sizing:border-box;height:calc(var(--pad) + 16px);border:1px solid var(--line);background:var(--ctl);color:var(--text);font:inherit;cursor:pointer;touch-action:pan-y;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:2px;flex-direction:column;justify-content:space-between;padding:4px;display:flex;position:relative}.scene:active{background:var(--ctl-hi)}.scene:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.scene:not(.full){border-style:dashed;border-color:var(--edge);color:var(--muted);background:0 0}.scene .no{text-align:left;font-size:11px;font-weight:500;line-height:1}.scene .keep{text-align:center;font-size:11px;line-height:1}.scene .mini{align-items:flex-end;gap:2px;height:56%;display:flex}.scene .mini i{height:calc(var(--h) * 100%);background:var(--text);flex:1 1 0;min-height:2px}.scene .mini i.m{background:var(--mute);opacity:.4}.scene.here{border-color:var(--accent);outline:1px solid var(--accent);outline-offset:-2px}.scene.here .mini i:not(.m){background:var(--accent)}.scene.next{animation:.46s step-end infinite scene-next}.scene.saved{animation:.45s steps(3,end) scene-saved}.scene.blend:after{content:"";width:calc(var(--t,0) * 100%);background:var(--accent);height:4px;position:absolute;bottom:0;left:0}@keyframes scene-next{0%{border-color:var(--accent);outline:2px solid var(--accent);outline-offset:-3px}50%{border-color:var(--line);outline:none}}@keyframes scene-saved{0%{background:var(--accent);color:var(--on-accent)}to{background:var(--ctl)}}.scenes+.btn{margin-bottom:8px}.app[data-shell=wide] .right{--dock:clamp(250px, calc(var(--vh,100vh) * .36), 340px)}.app[data-deck] .stage{display:none}.app[data-shell=tall][data-deck]{grid-template-rows:var(--bar) auto minmax(0, 1fr);grid-template-areas:"top""tracks""right"}.app[data-shell=side][data-deck]{grid-template-columns:58px minmax(0,1fr);grid-template-areas:"top top""tracks right"}.app[data-deck] .strips{min-height:260px}.app[data-deck] .strip .travel{min-height:120px}