: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;--soft:#d2d2d2;--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);-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:50px;--row:46px;--nav:36px;--arrow:32px;--tile:54px;--pad:48px;--box:18px}.app :is(button,input,a,.scroll){font-family:inherit}.app button{color:inherit;font:inherit;appearance:none}.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(300px,26vw,360px);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:242px;--reserve:170px;--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(232px,28vw,264px)}.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:6px;padding:0 10px;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,.drop,.toggle,.mic,.nav button,.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:6px;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 14px 0 2px;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:700}.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 output{align-items:center;gap:6px;padding:0 8px;display:flex}.tempo .lcd{color:var(--accent);line-height:0;display:block}.tempo small{color:var(--muted);font-size:11px}.app[data-touch] .tempo .btn{width:32px;min-width:32px}.rec{color:var(--danger);align-items:center;gap:6px;font-size:12px;font-weight:700;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:3px;padding:0 4px;display:flex}.chain i{background:var(--c);width:10px;height:10px}.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:700}.trackblock .cap .chain{margin-left:auto;padding:0}.trackblock .list{touch-action:none;margin:0;padding:0 8px 5px;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:700;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:3px}.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:3px;padding-top:3px}.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 6px}.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:3px;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:9px}.trackblock[data-kind=column] .track.quiet .num{text-decoration:line-through}.trackblock[data-kind=rows] .list{gap:3px}.trackblock[data-kind=rows] .track{grid-template-columns:minmax(0, 1fr) var(--h2) var(--h2);height:var(--row);align-items:center;gap:3px;display:grid}.trackblock[data-kind=rows] .pick{text-align:left;grid-template-columns:14px 32px minmax(0,1fr);grid-template-areas:"num thumb name""num thumb sub";align-content:center;column-gap:6px;padding:0 6px 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:3px;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:700;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:700}.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:6px;padding:0 2px;display:flex}.view .lab{color:var(--muted);margin:0;font-size:11px}.mini{grid-template-columns:repeat(2,14px);gap:3px;display:grid}.trackblock .mini{grid-template-columns:repeat(2,10px);gap:2px}.trackblock .mini button{width:10px;height:10px}.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:14px;height:14px;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;display:block;position:absolute}.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)}.panel{flex-direction:column;height:100%;min-height:0;display:flex}.nav{border-bottom:1px solid var(--line);background:var(--title);flex:none;display:flex}.nav 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 6px;font-size:12px}.nav button:first-child{border-left:0}@media (hover:hover){.nav button:hover{color:var(--text)}}.nav button.on{border-bottom-color:var(--accent);background:var(--panel);color:var(--text);font-weight:700}.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 10px 5px;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}.who-track{padding-bottom:2px}.trackname{align-items:center;gap:8px;margin:0;padding:8px 10px 2px;font-size:13px;font-weight:700;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:6px}.sec>header{border-bottom:1px solid var(--line);background:var(--title);align-items:center;min-height:22px;padding:0 8px;display:flex}.sec h3{color:var(--text);margin:0;font-size:12px;font-weight:700}.sec .body{padding:8px}.subline{color:var(--muted);margin:0 0 6px;font-size:11px}.lab{color:var(--muted);margin:8px 0 4px;font-size:11px;display:block}.note{color:var(--muted);margin:6px 0 2px;font-size:11px;line-height:1.4}.banner{border:1px solid var(--line);border-left:3px solid var(--accent);background:var(--device);margin:6px;padding:8px}.banner p{margin:0 0 8px;font-size:12px}.group{grid-template-columns:54px minmax(0,1fr);align-items:start;gap:6px;margin-bottom:6px;display:grid}.group .lab{margin:6px 0 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:6px;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:54px minmax(0,1fr);align-items:center;gap:6px;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 6px 0 0}.stepper{grid-template-columns:54px var(--h) minmax(0, 1fr) var(--h);gap:0}.stepper .lab{margin-right:6px}.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:700}.toggle small{color:var(--muted);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:700}.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:3px 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{color:var(--soft);font-size:11px}.bar b{font-size:12px}.bar.now{background:var(--title);outline:1px solid var(--c);outline-offset:-2px}.drop{box-sizing:border-box;width:100%;height:calc(var(--pad) + 8px);border:1px solid var(--line);background:var(--ctl);text-align:left;cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:2px;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:10px;padding:0 12px;display:grid;position:relative;overflow:hidden}.drop .icon{grid-row:1/span 2;position:relative}.app:not([data-touch]) .drop .icon{width:24px;height:24px}.drop b,.drop small{position:relative}.drop b{align-self:end;font-size:12px}.drop small{color:var(--soft);align-self:start;font-size:11px}.drop .fill{transform:scaleX(var(--build,0));transform-origin:0;background:var(--accent-dim);position:absolute;inset:0}.drop.live{outline:2px solid var(--accent);outline-offset:-3px}.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:3px;width:58px;height:58px;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(--accent)}.stamp:active svg{fill:var(--on-accent)}.stamp span{color:var(--soft);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:3px;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(14px + 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:14px;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;margin:12px 14px 4px;font-size:13px}.sheet .fine{color:var(--muted);text-align:center;margin:4px 14px 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:10px;height:10px;animation:1s step-end infinite blink;position:absolute;top:14px;right:calc(50% - 58px)}.toast{top:calc(env(safe-area-inset-top) + 56px);z-index:30;border:1px solid var(--edge);background:var(--title);padding:6px 12px;font-size:12px;position:fixed;left:50%;transform:translate(-50%)}@media (max-width:520px){.top{gap:4px;padding:0 6px}.app[data-touch] .top>.sq{width:40px;min-width:40px}.tempo output{gap:4px;padding:0 6px}}@media (max-width:430px){.tempo small{display:none}}@media (max-width:380px){.top{gap:3px;padding:0 5px}.top .play{width:72px;padding:0 6px}.top .share{padding:0 6px}.app[data-touch] .top>.sq{width:36px;min-width:36px}.tempo output{padding:0 4px}}@media (max-width:370px){.top .share .lbl{display:none}.top .share{padding:0 11px}}@media (max-width:340px){.top .play .lbl{display:none}.top .play{width:44px;padding:0}}.app:not([data-shell=wide]) .trackname{display:none}.app:not([data-shell=wide]) .who-track>.sec:first-of-type{margin-top:6px}.app:not([data-shell=wide]) .head .fam{display:none}.app[data-shell=side] .top{gap:6px}.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 6px}.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:42px}.app[data-shell=side] .nav button{padding:0 2px}.app[data-shell=side] .group{grid-template-columns:minmax(0,1fr);gap:0}.app[data-shell=side] .group .lab{margin:4px 0}.app[data-shell=side] .slider,.app[data-shell=side] .stepper{grid-template-columns:50px minmax(0,1fr)}.app[data-shell=side] .stepper{grid-template-columns:50px var(--h) minmax(0, 1fr) var(--h)}@media (max-width:640px){.app[data-shell=side] .head .view .lab{display:none}}@media (max-height:760px){.app[data-shell=tall]{--chrome:224px;--reserve:150px}.app[data-shell=tall] .head{padding:2px 8px}.app[data-shell=tall] .info{padding:3px 10px}.app[data-shell=tall] .info span{-webkit-line-clamp:1;line-clamp:1;min-height:1.4em}.app[data-shell=tall] .nav button{height:calc(var(--nav) - 4px)}}@media (max-height:600px){.app[data-shell=tall]{--chrome:196px;--reserve:110px}.app[data-shell=tall] .info{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}