:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--surface:#111;--surface-2:#222;--hover:#303030;--border:#707070;--text:#eee;--muted:#9a9a9a;--accent:#2a6ae0;--on-accent:#fff;--focus:#ffd54a;--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--btn-font-size:.9em;--btn-font-weight:400;--slider-track:var(--border);--slider-fill:var(--accent);--slider-thumb:var(--text);--slider-track-h:8px;--slider-thumb-d:20px;--ui-text-size:.8rem;--ui-text-lh:1.15;font-family:system-ui,sans-serif}*{box-sizing:border-box}html,body{height:100%;color:var(--text);background:#000;margin:0;overflow:hidden}#stage{width:100vw;height:100vh;display:block;position:fixed;inset:0}.overlay{text-align:center;background:#000000d9;flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:2rem;display:flex;position:fixed;inset:0}.overlay[hidden],.controls[hidden],.notice[hidden]{display:none}.warn{color:#ccc;max-width:34rem;line-height:1.5}.hint{color:var(--muted);font-size:.9rem}button,.btn,select{font:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;padding:.4rem .8rem}button.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);padding:.7rem 2rem;font-size:1.2rem}button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}input[type=range]:focus-visible,input[type=checkbox]:focus-visible{outline:3px solid var(--focus);outline-offset:3px}.controls{background:linear-gradient(#0000,#000c);flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;padding:3.25rem 1rem .75rem;transition:opacity .4s;display:flex;position:fixed;bottom:0;left:0;right:0}.controls.idle{opacity:0}.controls.collapsed{display:none}.controls.idle:focus-within{opacity:1}.group{align-items:center;gap:.5rem;display:flex}.group-label{display:none}#seek{width:min(30vw,22rem)}input[type=range]{appearance:none;height:24px;accent-color:var(--slider-fill);cursor:pointer;background:0 0;margin:0}input[type=range]::-webkit-slider-runnable-track{background:var(--slider-track);height:var(--slider-track-h);border-radius:calc(var(--slider-track-h) / 2)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:var(--slider-thumb-d);height:var(--slider-thumb-d);margin-top:calc((var(--slider-track-h) - var(--slider-thumb-d)) / 2);background:var(--slider-thumb);border:0;border-radius:50%}input[type=range]::-moz-range-track{background:var(--slider-track);height:var(--slider-track-h);border-radius:calc(var(--slider-track-h) / 2)}input[type=range]::-moz-range-thumb{width:var(--slider-thumb-d);height:var(--slider-thumb-d);background:var(--slider-thumb);border:0;border-radius:50%}.value-btn{min-width:8rem;font-size:var(--ui-text-size);line-height:var(--ui-text-lh);justify-content:space-between;align-items:center;gap:.5rem;display:flex}.value-val{color:var(--muted);font-variant-numeric:tabular-nums}.value-btn[aria-expanded=true]{border-color:var(--accent)}.value-panel[hidden]{display:none}.value-item{display:block;position:relative}.value-panel{z-index:3;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-md);min-width:12rem;padding:.5rem .6rem;position:absolute;bottom:calc(100% + .4rem);left:0}.value-panel input[type=range]{width:100%}.group-label{font-size:var(--ui-text-size);line-height:var(--ui-text-lh)}.sheet-head{z-index:2;background:var(--surface);position:sticky;top:0}.sheet-handle{display:none}input[type=checkbox]{accent-color:var(--slider-fill)}@media (max-width:599px){.controls{padding:0 .75rem calc(.6rem + env(safe-area-inset-bottom));max-height:88vh;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;grid-template-columns:minmax(0,1fr);align-items:stretch;gap:.6rem;max-height:88dvh;display:grid;overflow-y:auto}.controls .controls-head{background:var(--surface);grid-column:1;justify-content:flex-end;margin:0 -.75rem;padding:.5rem .75rem .25rem;display:flex;position:sticky;top:0;right:auto}.controls .group{border:1px solid var(--border);border-radius:var(--radius-md);background:#1119;flex-wrap:wrap;justify-content:flex-start;gap:.5rem;min-width:0;padding:.5rem;display:flex}.group-label{color:var(--muted);flex:0 0 100%;display:block}.controls .group>button,.controls .group>select{flex:auto}.controls .group>button[data-source],.controls .group>button#play-btn{flex:8rem}#seek{width:100%}.controls input[type=range]{--slider-thumb-d:28px;height:44px;min-height:44px}.value-group .value-item{flex:100%;min-width:0}.value-btn{width:100%;min-height:44px}.value-panel{background:0 0;border:0;min-width:0;padding:.4rem .25rem 0;position:static}.value-panel input[type=range]{width:100%;display:block}.display-row{flex-flow:wrap;align-items:center}.display-row>.group-label{flex:0 0 100%}.display-row>label{min-height:44px;font-size:var(--ui-text-size);line-height:var(--ui-text-lh);align-items:center;gap:.4rem;display:flex}.display-row>label input[type=checkbox],.display-row>label select{min-width:44px;min-height:44px}.controls>.source{order:99;padding:0 .25rem}button,.btn,select{min-width:44px;min-height:44px}dialog#shortcuts button.key{justify-content:center;align-items:center;min-width:44px;min-height:44px;padding:.25rem .5rem;display:inline-flex}dialog#shortcuts th,dialog#shortcuts td{padding-top:.25rem;padding-bottom:.25rem}}.time,.source{font-variant-numeric:tabular-nums;color:var(--muted)}.notice{background:#3a1d1d;border:1px solid #a33;border-radius:6px;max-width:90vw;padding:.6rem 1rem;position:fixed;top:1rem;left:50%;transform:translate(-50%)}.notice.info{background:#1d2a3a;border-color:#36a}body.drag-over #stage{outline:4px dashed var(--accent);outline-offset:-12px}.toast{border:1px solid var(--border);opacity:0;pointer-events:none;background:#0009;border-radius:6px;padding:.4rem .8rem;transition:opacity .32s;position:fixed;top:1rem;right:1rem}.toast.shown{opacity:1}.studio{z-index:5;background:var(--surface);width:320px;max-width:90vw;color:var(--text);border:1px solid var(--border);border-radius:var(--radius-lg);--tp-base-background-color:var(--surface);--tp-base-border-radius:var(--radius-md);--tp-container-background-color:var(--surface-2);--tp-container-background-color-hover:var(--hover);--tp-container-background-color-focus:var(--hover);--tp-container-background-color-active:var(--hover);--tp-container-foreground-color:var(--text);--tp-label-foreground-color:var(--muted);--tp-monitor-background-color:var(--surface-2);--tp-monitor-foreground-color:var(--muted);--tp-input-background-color:var(--surface-2);--tp-input-background-color-hover:var(--hover);--tp-input-background-color-focus:var(--hover);--tp-input-background-color-active:var(--hover);--tp-input-foreground-color:var(--text);--tp-button-background-color:var(--surface-2);--tp-button-background-color-hover:var(--hover);--tp-button-background-color-focus:var(--hover);--tp-button-background-color-active:var(--accent);--tp-button-foreground-color:var(--text);--tp-groove-foreground-color:var(--border);position:fixed;top:12px;bottom:12px;right:12px;overflow-y:auto}.studio :focus-visible{outline:2px solid var(--focus);outline-offset:2px}.studio[hidden]{display:none}.studio-head,dialog#shortcuts .dialog-head{justify-content:space-between;align-items:center;gap:.5rem;display:flex}@media (max-width:599px){.studio{border-radius:var(--radius-lg) var(--radius-lg) 0 0;width:100%;max-width:100%;max-height:80vh;padding:0 16px calc(12px + env(safe-area-inset-bottom));-webkit-overflow-scrolling:touch;--tp-container-unit-size:44px;--tp-container-unit-spacing:6px;border-bottom:0;inset:auto 0 0;overflow:hidden auto}.studio:not([hidden]){animation:.25s ease-out studio-slide-up}.studio button,.studio select{min-width:44px;min-height:44px}.studio input,.studio textarea,.studio .tp-sldv{min-height:44px}.studio .tp-sldv_t{height:44px;margin:0}.studio .tp-sldv_k:after{border-radius:50%;width:28px;height:28px;right:-14px}.studio .tp-lblv_l{font-size:var(--ui-text-size);line-height:var(--ui-text-lh)}.studio .sheet-head{margin:0 -16px;padding:4px 16px}dialog#shortcuts .sheet-head{margin:-.6rem -.6rem .25rem;padding:.6rem .6rem .25rem}.sheet-head{touch-action:pan-x pan-up pinch-zoom}.sheet-handle{touch-action:none;cursor:grab;flex:none;width:100%;height:44px;margin:0;display:block;position:relative}.sheet-handle:before{content:"";background:var(--muted);border-radius:2px;width:40px;height:4px;margin:-2px 0 0 -20px;position:absolute;top:50%;left:50%}}@keyframes studio-slide-up{0%{transform:translateY(100%)}to{transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.studio:not([hidden]){animation:none}}dialog#shortcuts{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-lg);max-width:min(34rem,92vw);padding:1rem 1.25rem}dialog#shortcuts::backdrop{background:#0009}dialog#shortcuts h2{margin:0 0 .5rem;font-size:1.1rem}dialog#shortcuts table{border-collapse:collapse;width:100%}dialog#shortcuts th,dialog#shortcuts td{text-align:left;vertical-align:top;padding:.3rem .5rem .3rem 0;font-weight:400}dialog#shortcuts th{white-space:nowrap}dialog#shortcuts kbd{font:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);padding:.05rem .4rem}dialog#shortcuts button.key{font:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:inherit;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;padding:.05rem .4rem}dialog#shortcuts button.key:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.studio .tp-btnv_b,.studio #studio-close{font:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:inherit;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md)}.studio .tp-btnv_b:active{color:var(--on-accent)}.studio .studio-tiles{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:6px 0;display:grid}.studio .studio-tiles>.tp-btnv{min-width:0;margin:0}.studio .studio-tiles .tp-btnv_b{width:100%;height:44px;min-height:44px;margin:0;padding:0 .25rem}.studio-body,.studio .tp-rotv{min-width:0;max-width:100%}.studio .tp-sldv,.studio .tp-sldv_t{touch-action:none}.studio .tp-sldv_t:before{background-color:var(--border);border-radius:4px;height:8px}.studio .tp-sldv_k{--btn-bg:var(--text);--btn-bg-h:var(--text);--btn-bg-f:var(--text);--btn-bg-a:var(--text)}.studio .tp-sldv_k:before{background-color:var(--accent);border-radius:4px;height:8px}.studio .tp-sldv_k:after{background-color:var(--text)}dialog#shortcuts .keys{grid-template-columns:repeat(5,44px);gap:.25rem;display:grid}dialog#shortcuts .short{display:none}@media (max-width:599px){dialog#shortcuts{width:calc(100vw - 1rem);max-width:calc(100vw - 1rem);max-height:92vh;padding:.6rem .6rem .8rem;overflow-y:auto}dialog#shortcuts h2{margin:0 0 .4rem}dialog#shortcuts table,dialog#shortcuts tbody{width:100%;display:block}dialog#shortcuts tbody{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;display:grid}dialog#shortcuts tr{align-items:center;gap:.35rem;min-width:0;display:flex}dialog#shortcuts tr.wide{grid-column:1/-1}dialog#shortcuts th,dialog#shortcuts td{white-space:normal;min-width:0;font-size:var(--ui-text-size);line-height:var(--ui-text-lh);padding:0;display:block}dialog#shortcuts th{flex-wrap:wrap;flex:none;align-items:center;gap:.3rem;display:flex}dialog#shortcuts td{flex:auto}dialog#shortcuts .full{display:none}dialog#shortcuts .short{display:inline}dialog#shortcuts .keys{grid-template-columns:repeat(5,44px);gap:.25rem;display:grid}}.close-btn{font:inherit;font-size:var(--btn-font-size);font-weight:var(--btn-font-weight);color:var(--text);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;flex:none;padding:.4rem .8rem}.close-btn:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.controls-head{background:0 0;position:absolute;top:.5rem;right:.5rem}#controls-show{z-index:6;position:fixed;bottom:.75rem;right:1rem}#controls-show[hidden]{display:none}@media (max-width:599px){.close-btn,#controls-close,#controls-show{min-width:44px;min-height:44px}}
