@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;--faint:#c8c8c8;--mono:"Berkeley Mono", ui-monospace, SFMono-Regular, Menlo, monospace;--t-cap:9px;--t-small:11px;--t-body:13px;--t-title:16px;--t-track:.08em;--blue:#2563eb;--purple:#7c3aed;--orange:#ea580c;--red:#dc2626;color-scheme:light dark}@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#0a0a0c;--fg:#d5e3ff;--border:#17181b;--muted:#808899;--faint:#2c3038;--blue:#5b8cff;--purple:#a77bff;--orange:#ff8a3d;--red:#ff5a52}}:root[data-theme=dark]{--bg:#0a0a0c;--fg:#d5e3ff;--border:#17181b;--muted:#808899;--faint:#2c3038;--blue:#5b8cff;--purple:#a77bff;--orange:#ff8a3d;--red:#ff5a52;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:var(--t-small);letter-spacing:-.01em;-webkit-user-select:none;user-select:none;touch-action:manipulation;line-height:1.3;overflow:hidden}#app{height:100dvh;display:grid}button{font:inherit;color:var(--muted);cursor:pointer;background:0 0;border:0;padding:4px;transition:color .12s}button:hover,button.on{color:var(--fg)}:focus-visible{outline:1px solid var(--fg);outline-offset:2px}.m{color:var(--muted)}:root{--tap:32px;--fx-h:56px;--bar-h:52px}@media (pointer:coarse){:root{--tap:44px;--bar-h:64px}}#app{grid-template-rows:var(--fx-h) minmax(0, 1fr) var(--bar-h)}html.native #app{height:100dvh;padding:0 env(safe-area-inset-right) max(0px, calc(env(safe-area-inset-bottom) - 12px)) env(safe-area-inset-left)}#fx{align-items:flex-start;gap:16px;min-width:0;min-height:0;padding:8px 16px 4px;display:flex;overflow:hidden}@media (width<=800px){#fx{padding-left:12px;padding-right:12px}}#fx.shut{padding:0}#fx-grip{left:0;right:0;top:var(--fx-h);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,opacity .12s;position:absolute;top:3px;left:50%}#fx-grip:hover:after{background:var(--muted)}#fx-grip.shut:after{opacity:0}#fx-grip.shut:hover:after{opacity:1}#fx .ctl{min-width:0;color:var(--muted);flex-direction:column;flex:1 1 0;gap:2px;display:flex}#fx .ctl:hover,#fx .ctl:focus-within{color:var(--fg)}#fx .cap{font-size:var(--t-cap);letter-spacing:var(--t-track);text-transform:uppercase;color:var(--muted);white-space:nowrap;justify-content:space-between;gap:6px;line-height:12px;display:flex;overflow:hidden}#fx .cap b{text-overflow:ellipsis;font-weight:400;overflow:hidden}#fx .cap i{color:var(--fg);font-variant-numeric:tabular-nums;font-style:normal}#fx input{-webkit-appearance:none;appearance:none;cursor:ew-resize;background:0 0;width:100%;min-width:0;height:28px;margin:0}#fx input::-webkit-slider-runnable-track{background:var(--border);border-radius:2px;height:4px}#fx input::-webkit-slider-thumb{-webkit-appearance:none;background:var(--fg);border:1px solid var(--bg);border-radius:4px;width:14px;height:22px;margin-top:-9px}#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}#rack{touch-action:none;width:100%;height:100%;display:block}.status{left:50%;bottom:calc(var(--bar-h) + 6px + max(0px, calc(env(safe-area-inset-bottom) - 12px)));background:var(--bg);max-width:calc(100% - 32px);color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-variant-numeric:tabular-nums;pointer-events:none;z-index:4;border-radius:6px;padding:2px 8px;position:absolute;overflow:hidden;transform:translate(-50%)}.status:empty{display:none}#bar{align-items:center;gap:4px;min-width:0;padding:0 8px;display:flex}#bar .left,#bar .right{display:contents}#bar>*>:is(button,.vbox){min-width:var(--tap);height:var(--tap);box-sizing:border-box;flex:1 1 0;margin:0}#bar .vbox{flex-grow:1.6}#bar .vbox.nav{flex-grow:2.6}#bar #play{flex-grow:1.4}#bar #dice{flex-grow:2.4}#bar button{color:var(--muted)}#bar button:hover{color:var(--fg)}#bar button.icon{border:1px solid var(--border);border-radius:8px;place-items:center;padding:0;display:inline-grid}#bar button.icon svg{width:18px;height:18px}#bar button.icon:hover{border-color:var(--muted)}#bar button.icon.on{background:var(--fg);border-color:var(--fg);color:var(--bg)}.vbox{border:1px solid var(--border);border-radius:8px;grid-template-rows:auto auto;grid-auto-flow:column;place-content:center start;column-gap:4px;padding:0 10px;display:inline-grid;position:relative}.vbox:before{content:attr(data-cap);font-size:var(--t-cap);letter-spacing:var(--t-track);text-transform:uppercase;color:var(--muted);grid-area:1/1/auto/-1;line-height:10px}.vbox>*{grid-row:2}.vbox b{font-weight:400;font-size:var(--t-body);font-variant-numeric:tabular-nums;line-height:18px}.vbox .m{font-size:var(--t-small);color:var(--muted);align-self:end;line-height:15px}.vbox select{-webkit-appearance:none;appearance:none;width:100%;font:inherit;font-size:var(--t-body);color:var(--fg);cursor:pointer;background:0 0;background-image:linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);background-position:right 4px center,right 0 center;background-repeat:no-repeat;background-size:4px 4px,4px 4px;border:0;padding:0 12px 0 0;line-height:18px}.vbox select:focus{outline:none}.vbox:focus-within,.vbox:hover{border-color:var(--muted)}#clockbox.live{border-color:var(--fg)}.fd{cursor:ew-resize;touch-action:none}#bar .vbox.nav{grid-template-columns:auto minmax(0,1fr) auto}#bar .vbox.nav button{height:18px;line-height:18px;font-size:var(--t-body);padding:0 2px}#seed{text-overflow:ellipsis;white-space:nowrap;text-align:center;min-width:0;color:var(--fg);font-variant-numeric:tabular-nums;overflow:hidden}#bar #seed{color:var(--fg)}#bar #seed.edited{color:var(--muted)}#bar #play{background:var(--fg);border:1px solid var(--fg);border-radius:8px;place-items:center;display:inline-grid}#bar #play,#bar #play:hover{color:var(--bg)}#bar #play svg{width:18px;height:18px}#bar #dice{background:var(--fg);min-width:max-content;color:var(--bg);font-weight:700;font-size:var(--t-body);border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:0 16px;display:inline-flex}#bar #dice:hover{opacity:.85}#bar #dice svg{width:18px;height:18px}#app{position:relative}.menu{bottom:calc(var(--bar-h) + 4px + env(safe-area-inset-bottom,0px));left:max(12px, env(safe-area-inset-left,0px));z-index:5;background:var(--bg);border:1px solid var(--faint);border-radius:3px;min-width:240px;max-height:60vh;padding:4px 0;position:absolute;overflow-y:auto}.menu .acts{border-bottom:1px solid var(--border);gap:8px;padding:4px 8px 6px;display:flex}.menu .acts button{color:var(--fg)}.menu .item{justify-content:space-between;align-items:center;gap:12px;padding:0 8px;display:flex}.menu .item .name{text-align:left;text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;padding:6px 0;overflow:hidden}.menu .item.on .name{color:var(--fg)}.menu .item .del{font-size:var(--t-cap)}@media (width<=900px){#bar #dice span{display:none}#bar #dice{min-width:var(--tap);padding:0 10px}#bar .vbox{padding:0 7px}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}#app #bar .corner-bl.corner-bl{border-bottom-left-radius:var(--corner-r)}#app #bar .corner-br.corner-br{border-bottom-right-radius:var(--corner-r)}#fx{grid-area:1/1}#rack,#mix{grid-area:2/1}#bar{grid-area:3/1}#mix{background:var(--bg);z-index:3;gap:8px;min-height:0;padding:8px;display:flex;overflow-x:auto}#mix[hidden]{display:none}#mix .mstrip{border:1px solid var(--border);background:var(--bg);min-width:72px;min-height:0;color:var(--fg);border-radius:3px;flex-direction:column;flex:1 1 0;display:flex}#mix .mstrip.soloed{border-color:var(--fg)}#mix .mhead{box-sizing:border-box;flex-direction:column;align-items:flex-start;gap:4px;min-width:0;height:52px;padding:10px 12px 0;display:flex}#mix .mtop{align-items:center;gap:8px;height:18px;display:flex}#mix .mtop svg{width:16px;height:16px}#mix .mnum{font-size:var(--t-body);font-weight:700}#mix .mkind{font-size:var(--t-cap);letter-spacing:var(--t-track);text-transform:uppercase;color:var(--muted);line-height:11px}#mix .mname{max-width:100%;font-size:var(--t-small);color:var(--fg);white-space:nowrap;text-overflow:ellipsis;line-height:14px;display:block;overflow:hidden}#mix .mfader{touch-action:none;cursor:ns-resize;flex:auto;min-height:120px;position:relative}#mix .mfader canvas{width:100%;height:100%;position:absolute;inset:0}#mix .mfoot{height:calc(var(--tap) + 8px);box-sizing:border-box;align-items:center;gap:4px;padding:0 8px 8px;display:flex}#mix .mfoot button{width:var(--tap);height:var(--tap);border:1px solid var(--border);color:var(--muted);font-size:var(--t-small);border-radius:6px;padding:0;font-weight:700}#mix .mfoot button.cur{background:var(--fg);border-color:var(--fg);color:var(--bg)}#mix .mdb{font-size:var(--t-small);font-variant-numeric:tabular-nums;color:var(--fg);white-space:nowrap;margin-left:auto}#mix .quiet .mhead,#mix .quiet .mfader{opacity:.35}@keyframes detent{0%{filter:brightness(1.8)}to{filter:none}}.tick{animation:.16s ease-out detent}