:root{--panel-fg:#e8ece9}*{box-sizing:border-box;margin:0;padding:0}html,body{background:#000;width:100%;height:100%;overflow:hidden}canvas#sim,canvas#playback{cursor:none;touch-action:none;width:100%;height:100%;display:block;position:absolute;inset:0}canvas#playback{z-index:1;object-fit:contain;cursor:default;background:#000}canvas#playback[hidden]{display:none}body:has(canvas#sim[data-frame]){background:var(--color-canvas)}canvas#sim[data-frame],canvas#playback[data-frame]{--frame-reserved-height:180px;inset:50% auto auto;left:calc((100% - 340px - var(--space-10)) / 2);width:max(0px, min(100% - 340px - var(--space-10) - 180px, (100dvh - var(--frame-reserved-height)) * var(--frame-ratio)));height:auto;aspect-ratio:var(--frame-ratio);translate:-50% -50%}body:has(.bottom-bar[data-expanded]) :is(canvas#sim,canvas#playback)[data-frame]{--frame-reserved-height:330px;top:calc(50% - 75px)}canvas#sim[data-frame],canvas#playback[data-frame]{scale:var(--artboard-zoom,1)}canvas#playback[data-frame]{object-fit:fill}canvas#playbackGhost,#cropHandles{z-index:1;display:block;position:fixed}canvas#playbackGhost{opacity:.4;pointer-events:none}#cropHandles{outline:1px solid var(--color-content);cursor:move;touch-action:none;user-select:none}:is(canvas#playbackGhost,#cropHandles)[hidden]{display:none}#cropHandles span{border:1px solid var(--color-content);background:var(--color-canvas);width:8px;height:8px;position:absolute}#cropHandles span:before{content:"";position:absolute;inset:-8px}#cropHandles [data-corner=nw]{cursor:nwse-resize;top:-4px;left:-4px}#cropHandles [data-corner=ne]{cursor:nesw-resize;top:-4px;right:-4px}#cropHandles [data-corner=sw]{cursor:nesw-resize;bottom:-4px;left:-4px}#cropHandles [data-corner=se]{cursor:nwse-resize;bottom:-4px;right:-4px}.bottom-bar{bottom:var(--space-20);left:calc((100% - 340px - var(--space-10)) / 2);z-index:5;color:var(--color-content);user-select:none;position:absolute;translate:-50%}.bottom-bar__controls,.bottom-bar__side{align-items:center;gap:var(--space-10);display:flex}.bottom-bar:not([data-expanded]) .bottom-bar__timeline-only{display:none}.bottom-bar[data-expanded]{bottom:var(--space-10);left:var(--space-10);right:calc(340px + 2 * var(--space-10));height:140px;padding:var(--space-20);border-radius:var(--radius-l);background:var(--color-surface);overflow:clip;translate:none}.bottom-bar[data-expanded] .bottom-bar__controls{z-index:1;justify-content:space-between;position:relative}.bottom-bar[data-expanded] .bottom-bar__freeze{border-radius:var(--radius-m);width:40px;height:40px}.bottom-bar[data-expanded] .bottom-bar__group{gap:5px;height:40px;padding:0}.bottom-bar[data-expanded] .bottom-bar__group--frames{gap:2px}.bottom-bar__divider{background:#0003;width:1px;height:30px}.timeline{cursor:pointer;touch-action:none;outline:none;position:absolute;inset:70px 0 0}.timeline:focus-visible .timeline__scrubber{color:var(--color-focus-ring)}.timeline__buffered{width:calc(var(--space-20) + var(--buffered,0) * (100% - 2 * var(--space-20)));background:#e6e6d6;position:absolute;top:6px;bottom:0;left:0}.timeline__ticks{top:15px;left:var(--space-20);right:var(--space-20);height:15px;position:absolute}.timeline__ticks span{width:1px;height:5px;top:0;left:calc(var(--at) * (100% - 1px));background:#0003;position:absolute}.timeline__ticks span[data-major]{height:15px}.timeline__labels{top:40px;left:var(--space-20);right:var(--space-20);height:10px;font:400 10px/10px var(--font-sans);color:#000;position:absolute}.timeline__labels span{top:0;left:calc(var(--at) * (100% - 1px) + .5px);position:absolute;translate:-50%}.timeline__labels span:first-child{translate:none}.timeline__labels span:last-child{translate:-100%}.timeline__scrubber{top:0;left:calc(var(--space-20) + var(--playhead,0) * (100% - 2 * var(--space-20)) - 6px);color:var(--color-content);position:absolute}:where(.bottom-bar button:not(.button)){all:unset;cursor:pointer;justify-content:center;align-items:center;transition:background-color .2s;display:flex}.bottom-bar button:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px}.bottom-bar button:disabled{cursor:default;opacity:.4}.bottom-bar svg{display:block}.bottom-bar__freeze{border-radius:var(--radius-l);background:var(--color-accent);width:50px;height:50px;color:var(--color-content-fixed-dark)}.bottom-bar__freeze .icon-play,.bottom-bar__freeze[aria-pressed=true] .icon-pause,#recordButton .icon-stop,#recordButton[aria-pressed=true] .icon-record{display:none}.bottom-bar__freeze[aria-pressed=true] .icon-play,#recordButton[aria-pressed=true] .icon-stop{display:block}.bottom-bar__group{border-radius:var(--radius-l);background:var(--color-surface);align-items:center;height:50px;padding:5px;display:flex}.bottom-bar__button{border-radius:var(--radius-m);width:40px;height:40px}.bottom-bar__button:not(:disabled):hover,.bottom-bar__button[aria-pressed=true]{background:var(--color-surface-muted)}.bottom-bar-tooltip{z-index:20;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,visibility .18s;position:fixed;translate:-50% -100%}.bottom-bar-tooltip[data-visible]{opacity:1;visibility:visible}canvas#sim.media-move{cursor:grab}canvas#sim.media-move.dragging{cursor:grabbing}canvas#sim.media-move~#simCursor{display:none}#simCursor{transform-origin:11px 7px;pointer-events:none;z-index:10;opacity:0;will-change:transform;width:12px;height:14px;position:fixed;top:0;left:0}#panel{--slider-copy-width:100%;top:var(--space-10);right:var(--space-10);z-index:2;width:340px;max-height:calc(100% - 2 * var(--space-10));background:var(--color-surface);color:var(--color-content);font:450 11px/20px var(--font-sans);letter-spacing:-.11px;border-radius:var(--radius-l);user-select:none;scrollbar-width:none;position:absolute;overflow-y:auto}#panel::-webkit-scrollbar{display:none}.panel-header{z-index:3;height:60px;padding-inline:var(--space-20);background:var(--color-surface);justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.panel-header:after{content:"";right:var(--space-20);bottom:0;left:var(--space-20);background:var(--color-border);height:1px;position:absolute}#panel h1{font:600 13px/1.1 var(--font-sans);letter-spacing:-.26px}.panel-title{min-width:0;margin-right:var(--space-10);flex:1}#panelTitle{box-sizing:border-box;width:100%;height:30px;margin-left:calc(-1 * var(--space-5));padding:0 var(--space-5);border-radius:var(--radius-xs);color:inherit;font:inherit;letter-spacing:inherit;text-overflow:ellipsis;user-select:text;background:0 0;border:0}#panelTitle:hover{background:var(--color-control-surface-active)}#panelTitle:focus-visible{outline:1px solid var(--color-focus-ring);background:var(--color-control-surface-active)}#fileMenu{width:30px}#fileMenu .dropdown__trigger{border-radius:var(--radius-s);background:0 0;justify-content:center;width:30px;height:30px;padding:7px}#fileMenu .dropdown__trigger:hover,#fileMenu .dropdown__trigger:active,#fileMenu[data-open] .dropdown__trigger{background:var(--dropdown-trigger-background)}#panel #fileMenu .dropdown__menu{width:var(--dropdown-menu-width);top:5px}.section-header:focus-visible{outline:2px solid var(--color-focus-ring);outline-offset:2px;border-radius:var(--radius-xs)}.panel-intro{gap:var(--space-10);padding:var(--space-20);flex-direction:column;display:flex}.panel-section{gap:var(--space-20);padding:0 var(--space-20) var(--space-20);flex-direction:column;display:flex}.panel-section:before{content:"";background:var(--color-border);height:1px}.section-header{all:unset;box-sizing:border-box;width:100%;font:600 13px/1.1 var(--font-sans);letter-spacing:-.26px;cursor:pointer;justify-content:space-between;align-items:center;display:flex}.section-header .chevron{transition:transform .16s cubic-bezier(.2,0,0,1)}.section-header[aria-expanded=false] .chevron{transform:rotate(180deg)}.section-body{gap:var(--space-10);flex-direction:column;display:flex}#panel [hidden]{display:none}.row{align-items:center;gap:var(--space-10);min-height:20px;display:flex}#panel .dimmed{opacity:.3}.row>label{white-space:nowrap;flex:0 0 80px;margin-right:auto}#panel .slider[data-variant=inline]>.slider__label{white-space:nowrap;width:100px}#panel .slider{--slider-track:var(--color-control-surface-active)}#panel .slider__handle{background:var(--color-control-thumb)}#panel .dropdown__trigger-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}#panel .dropdown__menu{width:max-content;left:auto;right:0}#panel .dropdown__item-label{white-space:nowrap}#panel .dropdown__group-label{padding:var(--space-5) var(--space-10);color:var(--color-content-muted);font:500 12px/1.3 var(--font-sans)}#panel .dropdown__trigger:disabled{cursor:default;opacity:.4}.voice-level-row>label{margin-right:var(--space-10);flex-basis:100px}.voice-level-track{border-radius:var(--radius-s);background:var(--color-control-surface-active);flex:1;min-width:0;height:30px;position:relative;overflow:hidden}.voice-level-fill{background:var(--color-control-edge);width:0;transition:width 40ms linear,background .12s linear;position:absolute;inset:0 auto 0 0}.voice-level-gate{background:var(--color-control-ink);opacity:.4;border-radius:2px;width:2px;height:14px;margin-left:-1px;position:absolute;top:50%;transform:translateY(-50%)}.voice-level-track output{top:50%;right:var(--space-15);font-variant-numeric:tabular-nums;font-weight:500;position:absolute;transform:translateY(-50%)}.voice-level-row.gate-open .voice-level-fill{background:var(--color-accent)}output.editable{cursor:text;font-variant-numeric:tabular-nums}input.edit{width:48px;height:30px;padding:0 var(--space-5);border-radius:var(--radius-s);background:var(--color-control-surface-active);color:var(--color-control-ink);font:inherit;text-align:right;border:0;outline:none}input[type=color]{appearance:none;border-radius:var(--radius-xs);cursor:pointer;background:0 0;border:none;flex:none;width:35px;height:20px;padding:0}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:1px solid var(--color-border-strong);border-radius:var(--radius-xs)}input[type=color]::-moz-color-swatch{border:1px solid var(--color-border-strong);border-radius:var(--radius-xs)}#rampWrap{padding-top:24px;position:relative}#gradientPreview{border:1px solid var(--color-border);border-radius:var(--radius-s);height:30px}.handle{border:2px solid var(--color-surface);border-radius:var(--radius-xs);width:16px;height:16px;box-shadow:0 0 0 1px var(--color-border-strong);cursor:grab;touch-action:none;position:absolute;top:2px;transform:translate(-50%)}.handle.selected{box-shadow:0 0 0 2px var(--color-control-ink)}.stopEdit{align-items:center;gap:var(--space-5);display:flex}.stopEdit input[type=color]{border-radius:var(--radius-m);height:35px}.stopEdit input[type=color]::-webkit-color-swatch{border-radius:var(--radius-m)}.stopEdit output{text-align:right;flex:1}.brandSwatches{gap:var(--space-5);flex-wrap:wrap;display:flex}.brandSwatches button{border-radius:var(--radius-xs);width:20px;height:20px;box-shadow:0 0 0 1px var(--color-border-strong);cursor:pointer;border:0;padding:0}.video-controls{gap:var(--space-10);flex-direction:column;display:flex}.buttons{gap:var(--space-5);flex-wrap:wrap;display:flex}#panel .buttons>.button{padding-inline:var(--space-15);flex:auto}.capture-status,.hint{color:var(--color-content-muted);line-height:1.4}.source-drop-field{gap:var(--space-15);flex-direction:column;display:flex}.source-drop{align-items:center;gap:var(--space-20);width:100%;height:60px;padding:0 var(--space-20) 0 var(--space-10);border-radius:var(--radius-s);background:var(--color-control-surface-muted);color:var(--color-content);font:inherit;text-align:left;cursor:pointer;border:0;font-weight:550;transition:box-shadow .15s;display:flex}.source-drop:hover,.source-drop:focus-visible{box-shadow:inset 0 0 0 1px var(--color-border-strong);outline:none}.source-drop.is-dragging{box-shadow:inset 0 0 0 2px var(--color-content)}.source-drop__thumb{background:var(--color-control-surface-strong) center / cover no-repeat;border-radius:2px;flex:0 0 50px;height:40px}.source-drop__name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.source-drop__thumb[hidden]+.source-drop__name{color:var(--color-content-muted)}.source-drop__icon{opacity:.3;flex:none;display:flex}#voiceMeter{--voice-bar-w:1.9vw;--voice-bar-gap:1.15vw;--voice-bar-h:27.8vh;--voice-x:50%;--voice-y:50%;left:var(--voice-x);top:var(--voice-y);align-items:center;gap:var(--voice-bar-gap);height:var(--voice-bar-h);pointer-events:none;user-select:none;z-index:8;display:none;position:fixed;transform:translate(-50%,-50%)}#voiceMeter[data-align=bottom]{transform:translate(-50%,-100%)}#voiceMeter[data-align=top]{transform:translate(-50%)}#voiceMeter.visible{display:flex}.voice-bar{width:var(--voice-bar-w);background:var(--panel-fg);will-change:transform;border-radius:999px;height:100%;transition:transform 60ms linear;transform:scaleY(.07)}#voiceMeter[data-align=bottom] .voice-bar{transform-origin:bottom}#voiceMeter[data-align=top] .voice-bar{transform-origin:top}#voiceMeter[data-value-gradient=true] .voice-bar{background:linear-gradient(to bottom, #000, var(--panel-fg) 50%, #000)}#voiceMeter[data-value-gradient=true][data-align=bottom] .voice-bar{background:linear-gradient(to bottom, #000, var(--panel-fg))}#voiceMeter[data-value-gradient=true][data-align=top] .voice-bar{background:linear-gradient(to bottom, var(--panel-fg), #000)}#performanceHud{left:var(--space-10);bottom:var(--space-10);z-index:9;min-width:184px;padding:var(--space-10) var(--space-15);border-radius:var(--radius-m);background:var(--color-surface);color:var(--color-content);font-variant-numeric:tabular-nums;white-space:pre;pointer-events:none;user-select:none;font:11px/1.55 SF Mono,ui-monospace,Menlo,monospace;display:none;position:fixed}#err{color:#fff;text-align:center;background:#111;place-items:center;padding:40px;font:14px/1.6 ui-monospace,monospace;display:none;position:absolute;inset:0}