@font-face{font-family:Berkeley Mono;font-weight:400;src:url(/fonts/BerkeleyMono-Regular.woff2)format("woff2")}@font-face{font-family:Berkeley Mono;font-weight:500 700;src:url(/fonts/BerkeleyMono-Bold.woff2)format("woff2")}:root{--bg:#fff;--fg:#000;--border:#e5e5e5;--muted:#666;--fg-rgb:0,0,0;--bg-rgb:255,255,255;--accent:var(--fg);--accent-rgb:var(--fg-rgb);--cols:4;color-scheme:light dark;--m1:var(--accent);--m2:var(--accent);--m3:var(--accent);--m4:var(--accent);--band-lo:#a8a8a8;--band-mid:#5a5a5a;--band-hi:#000}@media (prefers-color-scheme:dark){:root:not([data-theme=light]):not([data-theme=mono]){--bg:#121214;--fg:#fff;--border:#262626;--muted:#999;--fg-rgb:255,255,255;--bg-rgb:18,18,20;--band-lo:#5c5c5c;--band-mid:#b0b0b0;--band-hi:#fff}}:root[data-theme=dark]{--bg:#121214;--fg:#fff;--border:#262626;--muted:#999;--fg-rgb:255,255,255;--bg-rgb:18,18,20;--band-lo:#5c5c5c;--band-mid:#b0b0b0;--band-hi:#fff;color-scheme:dark}:root[data-theme=light]{color-scheme:light}:root[data-theme=mono]{--bg:#131313;--fg:#e8e8e8;--border:#2e2e2e;--muted:#8a8a8a;--fg-rgb:232,232,232;--bg-rgb:19,19,19;--accent:#e8e8e8;--accent-rgb:232,232,232;--m1:#3fae4e;--m2:#d8c02e;--m3:#ef8c2a;--m4:#e0402c;--band-lo:#6b7075;--band-mid:#b9bcc0;--band-hi:#fff;color-scheme:dark}:root[data-theme=mono] .pad .name{font-weight:400}*{box-sizing:border-box}html,body{height:100%;margin:0}body{letter-spacing:-.01em;background:var(--bg);color:var(--fg);-webkit-user-select:none;user-select:none;touch-action:manipulation;font-family:Berkeley Mono,ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.3;overflow:hidden}#app{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--head-h,44px) var(--fx-h,36px) minmax(0, 1fr);height:100dvh;display:grid;position:relative}:root[data-full]{--head-h:0px}:root[data-full] header{opacity:0;border-bottom-color:#0000;transition:opacity .14s;overflow:hidden}:root[data-full][data-peek]{--head-h:44px}:root[data-full][data-peek] header{opacity:1;border-bottom-color:var(--border)}header{border-bottom:1px solid var(--border);grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:4px;min-width:0;padding:0 8px;font-size:11px;display:grid}header .left,header .transport,header .right{align-items:center;gap:4px;min-width:0;display:flex}header .left{padding-left:4px}header .left .spacer,header .right .spacer{flex:1}header .transport{gap:6px}header .title{margin-right:8px}header button{color:var(--muted);border-color:#0000}header button:hover:not(:disabled),header button:focus-visible{color:var(--fg)}header button:disabled{color:var(--border)}header #play{color:var(--accent)}header #random{color:var(--fg);border-color:var(--border)}header #random:hover:not(:disabled){border-color:var(--fg)}header #random:disabled{color:var(--border);border-color:var(--border)}header button.active,header button.active:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:var(--bg)}header #record.active,header #record.active:hover:not(:disabled){color:#e0402c;background:0 0;border-color:#0000}header #record.active svg:not(.loop) circle{fill:currentColor}@media (prefers-reduced-motion:no-preference){header #record.active svg:not(.loop){animation:1.4s ease-in-out infinite rec-pulse}}@keyframes rec-pulse{0%,to{opacity:1}50%{opacity:.45}}header #record{position:relative}header #record .loop{pointer-events:none;width:auto;height:auto;position:absolute;inset:1px;overflow:visible}header #record .loop circle{stroke-linecap:butt;fill:none!important}header #record .loop .trk{stroke:rgba(var(--fg-rgb), .16);stroke-width:1.5px}header #record .loop .pos{stroke:rgba(var(--fg-rgb), .55);stroke-width:1.5px;transition:stroke .16s}header #record.has .loop .pos{stroke:var(--accent)}header #record.active .loop .pos{stroke:rgba(var(--fg-rgb), .9)}header #record .loop .cov{stroke:rgba(var(--fg-rgb), .3);stroke-width:4px}header #record:not(.rolling) .loop{opacity:0}header #record .loop{transition:opacity .16s}header #play:disabled{color:var(--muted)}header button.text{align-items:center;gap:6px;min-width:0;padding:0 6px;display:inline-flex}header button.text span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.dd,.pop{align-items:center;display:inline-flex;position:relative}.dd .ddb{align-items:center;gap:6px;padding:0 6px 0 8px;display:inline-flex}.menu{background:var(--bg);border:1px solid var(--border);z-index:2;border-radius:3px;flex-direction:column;min-width:100%;padding:4px;display:flex;position:absolute;top:calc(100% + 5px);right:0;box-shadow:0 4px 16px #00000047}.menu[hidden]{display:none}.menu button{text-align:left;height:26px;color:var(--fg);border-color:#0000;padding:0 4px}.menu button.cur{font-weight:500}.menu hr{border:0;border-top:1px solid var(--border);margin:4px 0}.dd .menu{min-width:calc(100% + 24px);left:-1px;right:auto}.pop .menu{right:-1px}#share-menu{font-variant-numeric:tabular-nums;gap:4px;min-width:240px;padding:8px}.menu.wide{min-width:280px}.saverow{gap:4px;padding:0 0 6px;display:flex}.saverow input{min-width:0;height:28px;font:inherit;color:var(--fg);border:1px solid var(--border);background:0 0;border-radius:3px;flex:auto;padding:0 8px;font-size:11px}.saverow input:focus{border-color:var(--fg);outline:0}.saverow button{height:28px;padding:0 12px}#kit-list{flex-direction:column;max-height:260px;display:flex;overflow-y:auto}#kit-list .empty{padding:6px 4px 8px;font-size:11px}.kit{align-items:center;gap:2px;display:flex}.kit .load{text-align:left;border-color:#0000;flex-direction:column;flex:auto;align-items:flex-start;gap:2px;min-width:0;height:auto;padding:6px 4px;display:flex}.kit .load .kn-name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:11px;font-weight:500;overflow:hidden}.kit .load .meta{font-variant-numeric:tabular-nums;font-size:9px}.kit.other .load .kn-name{color:var(--muted)}.kit .del{width:24px;height:24px;color:var(--muted);opacity:0;border-color:#0000;flex:none;transition:opacity .12s}.kit:hover .del,.kit:focus-within .del{opacity:1}.kit .del:hover{color:var(--fg);border-color:var(--border)}#share-url{cursor:copy;-webkit-user-select:all;user-select:all;word-break:break-all}header .title{white-space:nowrap;margin-right:4px;font-weight:700}header #status{white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:11px;overflow:hidden}.spacer{flex:1}.muted{color:var(--muted)}header .tempo{align-items:center;gap:2px;font-size:11px;display:inline-flex}header .tempo input{width:42px;height:28px;font:inherit;font-variant-numeric:tabular-nums;color:var(--fg);text-align:right;cursor:ns-resize;-moz-appearance:textfield;appearance:textfield;background:0 0;border:1px solid #0000;border-radius:3px;padding:0 2px 0 4px;font-size:11px}header .tempo input:hover{border-color:var(--border)}header .tempo input::-webkit-outer-spin-button,header .tempo input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}header .tempo input:focus{border-color:var(--fg);outline:0}header .sep{background:var(--border);flex:none;width:1px;height:16px;margin:0 4px}header .transport #record{margin-left:2px}header .timecode{font-variant-numeric:tabular-nums;color:var(--muted);min-width:44px;margin-left:8px;margin-right:2px;font-size:11px}header .timecode.on{color:var(--fg)}header .meter{align-items:center;margin:0 8px;display:flex}header .meter .fader{width:120px;height:14px}button,select{font:inherit;color:var(--fg);cursor:pointer;touch-action:manipulation;white-space:nowrap;background:0 0;border:1px solid;border-radius:3px;height:28px;padding:0 10px;font-size:11px;transition:background .12s,color .12s}button.text{border:0;height:auto;padding:0;font-size:11px;text-decoration:underline}header button.text{height:28px;text-decoration:none}header #folder-prompt:empty{display:none}header #folder-prompt{white-space:nowrap;align-items:center;display:inline-flex}button.solid{background:var(--fg);color:var(--bg);border-color:var(--fg)}button:disabled{color:var(--muted);cursor:default}button:hover:not(:disabled){background:rgba(var(--fg-rgb), .08)}button.solid:hover:not(:disabled){background:var(--fg);opacity:.85}button:focus-visible,select:focus-visible,input:focus-visible{outline:1px solid var(--fg);outline-offset:2px}button.icon{justify-content:center;align-items:center;width:28px;padding:0;display:inline-flex}button[hidden]{display:none}select{padding-right:4px}#grid{grid-template-columns:repeat(var(--cols), minmax(0, 1fr));grid-auto-rows:minmax(0,1fr);gap:8px;min-height:0;padding:8px;display:grid}.pad{background:var(--bg);border:1px solid var(--border);border-radius:3px;grid-template-rows:auto minmax(0,1fr) auto auto auto;min-width:0;min-height:0;transition:border-color .12s;display:grid;position:relative}.pad.empty{cursor:pointer;border-style:dashed}.pad .head{cursor:pointer;align-items:center;gap:6px;min-width:0;height:48px;padding:0 6px 0 10px;display:flex;overflow:hidden}.pad .key{text-align:center;border-radius:2px;flex:none;width:15px;height:15px;font-size:11px;line-height:15px}.pad.on .key{color:var(--fg)}.pad.solo .key{background:var(--accent);color:var(--bg)}.pad .badge{color:var(--muted);font-variant-numeric:tabular-nums;flex:none;font-size:9px;line-height:9px}.pad .badge:empty{display:none}.pad .namerow{align-items:center;min-width:0;height:15px;padding:0 10px;display:flex}.pad .name{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--fg);opacity:0;text-align:left;direction:rtl;flex:auto;font-size:11px;font-weight:500;transition:color .12s,opacity .12s;overflow:hidden}.pad:not(.on):not(.empty) .name{color:var(--muted)}.pad .knobs{flex:none;align-items:flex-start;gap:4px;display:flex}.pad .kn{opacity:0;transition:opacity .12s}.pad:hover .name,.pad:focus-within .name,.pad:hover .kn,.pad:focus-within .kn,.pad .kn:has(.knob.set){opacity:1}@media (pointer:coarse){.pad .name,.pad .kn{opacity:1}}.kn{flex-direction:column;flex:none;align-items:center;gap:1px;min-width:30px;display:flex}.kn em{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);font-size:8px;font-style:normal;line-height:8px;transition:color .12s}.kn:hover em,.kn:has(.knob.set) em{color:var(--fg)}.pad .wave{cursor:pointer;touch-action:none;min-height:0;position:relative}.pad.part .wave{cursor:ew-resize}.pad .wave canvas{width:100%;height:100%;transition:opacity .12s;display:block;position:absolute;inset:0}.pad .wave .hint{color:var(--muted);pointer-events:none;justify-content:center;align-items:center;font-size:11px;display:none;position:absolute;inset:0}.pad.empty .wave .hint,.pad.busy .wave .hint,.pad.error .wave .hint{display:flex}.pad:not(.on) .wave canvas{opacity:.3}.pad.empty .wave canvas,.pad.busy .wave canvas,.pad.error .wave canvas{opacity:0}.pad.empty .namerow,.pad.empty .bottom{visibility:hidden}.pad .steps{visibility:hidden;grid-auto-columns:1fr;grid-auto-flow:column;gap:2px;height:8px;margin:6px 10px 0;display:grid}.pad .bottom{align-items:center;min-width:0;padding:8px 10px 10px;display:flex}.fader{--lv:0;--meter-scale:linear-gradient(90deg, var(--m1) 0 62%, var(--m2) 62% 80%, var(--m3) 80% 91%, var(--m4) 91% 100%);--meter-cover:linear-gradient(90deg, transparent calc(var(--lv) * 100%), var(--border) 0);--meter-peak:linear-gradient(90deg, transparent calc(var(--pk,0) * 100%), rgba(var(--fg-rgb), .5) 0, rgba(var(--fg-rgb), .5) calc(var(--pk,0) * 100% + 2px), transparent 0);-webkit-appearance:none;appearance:none;cursor:ew-resize;background:0 0;margin:0}.fader::-webkit-slider-runnable-track{background:var(--meter-peak), var(--meter-cover), var(--meter-scale);border-radius:1px;height:2px}.fader::-webkit-slider-thumb{-webkit-appearance:none;background:var(--fg);border:1px solid var(--bg);border-radius:2px;width:8px;height:12px;margin-top:-5px}.fader::-moz-range-track{background:var(--meter-peak), var(--meter-cover), var(--meter-scale);border-radius:1px;height:2px}.fader::-moz-range-thumb{background:var(--fg);border:1px solid var(--bg);border-radius:2px;width:8px;height:12px}.fader:focus-visible{outline:1px solid var(--fg);outline-offset:2px}.pad .gain{width:100%;height:16px}.pad:not(.on) .gain::-webkit-slider-thumb{background:var(--muted)}.pad:not(.on) .gain::-moz-range-thumb{background:var(--muted)}.pad.oneshot .steps{visibility:visible}input[type=range].auto{background:linear-gradient(90deg, transparent var(--a0,0%), rgba(var(--accent-rgb), .45) 0, rgba(var(--accent-rgb), .45) var(--a1,0%), transparent 0) no-repeat left 1px / 100% 2px}.pad .steps span{background:var(--border);cursor:pointer;border-radius:1px;transition:background .12s;display:block}.pad .steps span.hit{background:rgba(var(--accent-rgb), .6)}.pad .steps span.hit.acc{background:var(--accent)}.pad .steps span.cur{outline:1px solid var(--accent);outline-offset:1px}.pad:not(.on) .steps span.hit{background:rgba(var(--fg-rgb), .25)}.knob{cursor:ns-resize;touch-action:none;-webkit-tap-highlight-color:transparent;flex:none;width:26px;height:26px}.knob svg{width:100%;height:100%;display:block;overflow:visible}.knob circle{fill:none}.knob .trk{stroke:rgba(var(--fg-rgb), .22);stroke-width:1.5px}.knob .val{stroke:rgba(var(--accent-rgb), .75);stroke-width:2.25px;transition:stroke .12s}.knob .dot{fill:var(--accent);stroke:none;transition:fill .12s}.knob .aut{stroke:rgba(var(--accent-rgb), .55);stroke-width:1.5px;stroke-linecap:butt}#totem .face .knob .aut{stroke-width:var(--ring-w,1.5)}.pad .kn.auto{opacity:1}.kn.auto em{color:var(--fg)}.knob:hover .val,.knob:focus-visible .val,.knob.set .val{stroke:var(--accent)}.knob:focus-visible{outline:1px solid var(--fg);outline-offset:2px;border-radius:50%}.pad:not(.on) .knob .val{stroke:var(--muted)}.pad:not(.on) .knob .dot{fill:var(--muted)}.pad .actions{flex:0 auto;align-items:center;gap:4px;min-width:0;margin-right:auto;display:flex}.pad .actions button{border-color:#0000;flex:0 24px;min-width:18px;height:24px;padding:0}.pad .actions button:hover:not(:disabled){border-color:var(--border)}.pad .actions .rate{font-variant-numeric:tabular-nums;width:auto;min-width:24px;color:var(--muted);flex:none;padding:0 5px;font-size:10px}.actions .dial{cursor:ew-resize}.pad .actions .dial.on,.pad .actions .dial.on:hover,#totem .face .actions .dial.on{background:var(--accent);border-color:var(--accent);color:var(--bg)}.pad.locked .actions [data-act=lock] svg{fill:currentColor}.pad.rated .actions .rate,.pad.solo .actions [data-act=solo],.pad.locked .actions [data-act=lock],.pad.free .actions [data-act=sync],.pad.part .actions [data-act=whole],.pad.back .actions [data-act=back],.pad.rated .actions .rate:hover,.pad.solo .actions [data-act=solo]:hover,.pad.locked .actions [data-act=lock]:hover,.pad.free .actions [data-act=sync]:hover,.pad.part .actions [data-act=whole]:hover,.pad.back .actions [data-act=back]:hover,#totem .face.back .actions [data-act=back]{background:var(--accent);border-color:var(--accent);color:var(--bg)}@media (pointer:fine){.pad .actions{opacity:0;transition:opacity .12s}.pad:hover .actions,.pad:focus-within .actions{opacity:1}}:root[data-cols="6"] .pad .head,:root[data-cols="8"] .pad .head{gap:4px;height:40px;padding:0 4px 0 8px}:root[data-cols="6"] .pad .namerow,:root[data-cols="8"] .pad .namerow{height:13px;padding:0 8px}:root[data-cols="6"] .pad .steps,:root[data-cols="8"] .pad .steps{margin:5px 8px 0}:root[data-cols="6"] .pad .bottom,:root[data-cols="8"] .pad .bottom{padding:6px 8px 8px}.pad{container-type:inline-size}@container (width<=362px){.pad .kn em{display:none}.pad .knob{width:22px;height:22px}.pad .kn{min-width:22px}.pad .knobs{gap:4px;margin-left:4px}}@container (width<=346px){.pad .knob{width:18px;height:18px}.pad .kn{min-width:18px}.pad .knobs{gap:3px;margin-left:2px}.pad .kn:nth-last-child(-n+3){display:none}.pad .actions{gap:2px}.pad .actions button{flex:0 16px;min-width:13px;height:20px}.pad .actions button svg{width:11px;height:11px}.pad .actions .rate{min-width:15px;padding:0 2px;font-size:9px}.pad .actions [data-act=whole]{display:none}}@container (width<=280px){.pad .knobs{display:none}}@container (width<=230px){.pad .actions{display:none}}.pad.shot .wave{cursor:pointer}.pad.shot:active{border-color:var(--accent)}#fx{border-bottom:1px solid var(--border);align-items:flex-start;gap:32px;min-height:0;padding:10px 16px 4px;display:flex;position:relative;overflow:hidden}#fx.shut{border-bottom:0;padding:0}#fx-grip.shut:after{opacity:0}#fx-grip.shut:hover:after{opacity:1}#fx-grip:after{transition:background .12s,opacity .12s}:root{--fx-h:36px}#fx-grip{left:0;right:0;top:calc(var(--head-h,44px) + var(--fx-h,36px));z-index:4;cursor:ns-resize;touch-action:none;height:9px;margin-top:-4px;position:absolute}#fx-grip:after{content:"";background:var(--border);border-radius:1px;width:36px;height:2px;margin-left:-18px;transition:background .12s;position:absolute;top:3px;left:50%}#fx-grip:hover:after{background:var(--muted)}#fx .sub{height:calc(var(--fx-open,0) * 32px);opacity:var(--fx-open,0);pointer-events:none;align-items:flex-start;gap:12px;display:flex;overflow:hidden}#fx.open .sub{pointer-events:auto}#fx .sub .lbl{letter-spacing:.08em;text-transform:uppercase;color:var(--muted);flex:none;font-size:9px;line-height:1.35}#fx .sub .p{flex-direction:column;flex:1 1 0;gap:3px;min-width:0;display:flex}#fx .sub .note{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:9px;font-style:normal;line-height:1.35;overflow:hidden}#fx .ctl{container:fxctl/inline-size}#fx .sub .p{container:fxsub/inline-size}@container fxsub (width<=74px){#fx .sub .p em{display:none}}@container fxctl (width<=118px){#fx .sub .lbl{display:none}}#fx .sub .p em{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:9px;font-style:normal;line-height:1.35;overflow:hidden}#fx .ctl{min-width:0;color:var(--muted);flex-direction:column;flex:1 1 0;align-items:stretch;gap:6px;display:flex}#fx .ctl .row{align-items:center;gap:10px;display:flex}#fx .ctl:hover,#fx .ctl:focus-within{color:var(--fg)}#fx .ico{flex:none;display:inline-flex}#fx input{-webkit-appearance:none;appearance:none;cursor:ew-resize;background:0 0;flex:auto;min-width:0;height:16px;margin:0}#fx input::-webkit-slider-runnable-track{background:var(--border);border-radius:1px;height:2px}#fx input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--fg);border:1px solid var(--bg);border-radius:2px;width:8px;height:12px;margin-top:-5px}#fx input::-moz-range-track{background:var(--border);height:2px}#fx input::-moz-range-thumb{background:var(--fg);border:1px solid var(--bg);border-radius:2px;width:8px;height:12px}.drop,.pad.over{outline:2px solid var(--accent);outline-offset:-2px}#app.drop:has(.pad.over){outline-color:#0000}#overlay{background:var(--bg);z-index:3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}#overlay[hidden]{display:none}#overlay button{height:44px;padding:0 20px;font-size:16px}@media (width<=800px){#fx{gap:16px;padding:0 8px}header{gap:6px;padding:0 8px}header .timecode,header .title,header #status,header .meter,header .sep,header .step,header #folder-prompt,header .dd[data-for=temper]{display:none}:root{--cols:2!important}#grid{gap:6px;padding:6px}.pad .head{height:42px;padding:0 6px 0 10px}.pad .namerow{padding:0 10px}.pad .steps{margin:6px 10px 0}.pad .bottom{padding:6px 10px 10px}}#joy{pointer-events:none;z-index:5;position:fixed}#joy .home,#joy .puck{border-radius:50%;position:absolute;top:50%;left:50%}#joy .home{background:var(--fg);opacity:0;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;transition:opacity .16s}#joy.away .home{opacity:.3}#joy .puck{pointer-events:auto;cursor:grab;touch-action:none;width:30px;height:30px}#joy .puck:before{content:"";background:var(--fg);width:20px;height:20px;box-shadow:0 0 0 2px var(--bg);opacity:.3;border-radius:50%;margin:-10px 0 0 -10px;transition:opacity .16s,transform .2s cubic-bezier(.22,.61,.36,1);position:absolute;top:50%;left:50%}#joy .puck:hover:before,#joy.away .puck:before,#joy.live .puck:before{opacity:1}#joy .puck:hover:before{transform:scale(1.1)}#joy .puck:focus-visible{outline:none}#joy .puck:focus-visible:before{opacity:1;box-shadow:0 0 0 2px var(--bg), 0 0 0 5px rgba(var(--fg-rgb), .25)}#joy.live .puck{cursor:grabbing}#joy.live .puck:before{transform:scale(1.35)}.pad.on:not(.empty):not(.busy):not(.error) .wave canvas{opacity:var(--mix,1)}header .step{align-items:center;gap:2px;display:flex}header .step .val{text-align:center;min-width:56px;color:var(--muted);font-variant-numeric:tabular-nums}header .step button{width:20px;height:20px}header .step button:disabled{opacity:.25;cursor:default}@media (prefers-reduced-motion:no-preference){button.icon,.pad .actions button,header button,#fx .ico,.step button{transition:transform .14s cubic-bezier(.22,.61,.36,1),background .12s,border-color .12s,opacity .12s}button.icon:active,.pad .actions button:active,header button:active,.step button:active:not(:disabled){transition-duration:60ms;transform:scale(.88)}.knob .val{transition:stroke-dasharray 90ms linear}.knob .dot{transition:cx 90ms linear,cy 90ms linear}.kn.auto .knob .val,.kn.auto .knob .dot{transition:none}.knob{transition:transform .16s cubic-bezier(.22,.61,.36,1)}.knob:active{transform:scale(1.12)}.pad{animation:.26s cubic-bezier(.22,.61,.36,1) both pad-in;animation-delay:calc(var(--i,0) * 18ms)}@keyframes pad-in{0%{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}.pad.busy .wave .hint{animation:1.1s ease-in-out infinite breathe}@keyframes breathe{0%,to{opacity:.35}50%{opacity:1}}.pad{transition:border-color .12s,box-shadow .16s}.pad.solo{box-shadow:inset 0 0 0 1px var(--accent)}}:root[data-view=totem] #grid,:root[data-view=grid] #totem{display:none}#grid,#totem{grid-row:3}#totem{touch-action:none;min-height:0;position:relative;overflow:hidden}#totem .stage{perspective:none;cursor:grab;position:absolute;inset:0}#totem .stage:active{cursor:grabbing}#totem .shell{width:0;height:0;transform-style:preserve-3d;position:absolute;top:50%;left:50%}#totem .face{backface-visibility:visible;border:1px solid var(--border);background:rgba(var(--bg-rgb), .16);grid-template-rows:auto minmax(0,1fr) auto;display:grid;position:absolute;top:0;left:0;overflow:hidden}#totem .face canvas{width:100%;height:100%;min-height:0;display:block}#totem .face.cap{grid-template-rows:auto minmax(0,1fr) auto}#totem .face .head{min-width:0;padding:11px var(--tile-pad,10px) 4px;letter-spacing:.02em;align-items:center;gap:5px;font-size:8px;line-height:11px;display:flex}#totem .face .head.off{opacity:.45}#totem .face .num{background:var(--fg);color:var(--bg);flex:none;padding:1px 3px;font-weight:700}#totem .face .nm{text-overflow:ellipsis;white-space:nowrap;min-width:0;color:var(--fg);flex:auto;overflow:hidden}#totem .face .chip{border:1px solid var(--border);color:var(--muted);white-space:nowrap;flex:none;padding:0 3px}#totem .face .chip:empty{display:none}#totem .face .actions{flex:none;align-items:center;gap:1px;margin-left:auto;display:flex}#totem .face .knobs{padding:2px var(--tile-pad,10px) 11px;justify-content:space-between;align-items:center;gap:2px;min-width:0;display:flex}#totem .face .knob .trk{stroke-width:var(--ring-w,1.5)}#totem .face .knob .val{stroke-width:var(--ring-v,2.25)}#totem .face .knob .dot{r:var(--ring-dot,1.9)}#totem .face .kn{min-width:0;width:var(--knob,22px);opacity:1;gap:0;position:relative}#totem .face .kn em{text-align:center;font-size:min(9px, calc((var(--knob,22px) * .875 - 10px) / 4.8));letter-spacing:0;pointer-events:none;white-space:nowrap;line-height:1;position:absolute;top:50%;left:0;right:0;transform:translateY(-50%)}#totem .face.tight .kn em{display:none}#totem .face .knob{width:var(--knob,22px);height:var(--knob,22px)}#totem .face .actions button{width:var(--act,17px);height:var(--act,17px);border-color:#0000;border-radius:2px;min-width:0}#totem .face .actions button svg{width:calc(var(--act,17px) * .62);height:calc(var(--act,17px) * .62)}#totem .face .actions .rate{width:auto;min-width:var(--act,17px);font-size:calc(var(--act,17px) * .46);padding:0 2px}#totem .hint{text-align:center;letter-spacing:.06em;color:var(--muted);pointer-events:none;opacity:0;font-size:9px;transition:opacity .2s;position:absolute;bottom:8px;left:0;right:0}#totem.hint-on .hint{opacity:1}#totem .hint:after{content:"drag to turn · drag a face for level · click to mute · alt-click to solo · scroll to ride up"}@media (width<=800px){#totem .hint:after{content:"drag to turn · tap a face to mute"}}
