@font-face{font-family:Silkscreen;font-weight:400;font-display:block;src:url(/assets/silkscreen-latin-400-normal-CtPo2yA5.woff2)format("woff2")}@font-face{font-family:Silkscreen;font-weight:700;font-display:block;src:url(/assets/silkscreen-latin-700-normal-CSE2nhgM.woff2)format("woff2")}@font-face{font-family:IBM Plex Sans;font-weight:400;font-display:swap;src:url(/assets/ibm-plex-sans-latin-400-normal-CDDApCn2.woff2)format("woff2")}@font-face{font-family:IBM Plex Sans;font-weight:500;font-display:swap;src:url(/assets/ibm-plex-sans-latin-500-normal-6ng42L7E.woff2)format("woff2")}@font-face{font-family:IBM Plex Sans;font-weight:600;font-display:swap;src:url(/assets/ibm-plex-sans-latin-600-normal-CuJfVYMP.woff2)format("woff2")}@font-face{font-family:IBM Plex Mono;font-weight:400;font-display:swap;src:url(/assets/ibm-plex-mono-latin-400-normal-DMJ8VG8y.woff2)format("woff2")}@font-face{font-family:IBM Plex Mono;font-weight:500;font-display:swap;src:url(/assets/ibm-plex-mono-latin-500-normal-DSY6xOcd.woff2)format("woff2")}:root{--sky:#080a17;--dark:#0f131c;--key-body:#090d15d1;--panel:#1c2331;--plate:#283041;--line:#2f3a4e;--grey:#5d6a80;--disabled:#48526a;--disabled-ink:#9aa3b8;--bone:#f4f0e6;--body-ink:#d6d4cc;--muted:#8a93a8;--red:#fe5f55;--gold:#eac058;--orange:#fda200;--green:#4bc292;--blue:#009dff;--font-body:"IBM Plex Sans", "Segoe UI", system-ui, sans-serif;--font-mono:"IBM Plex Mono", ui-monospace, monospace;--font-pixel:"Silkscreen", ui-monospace, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}[hidden]{display:none!important}body{background:var(--sky);color:var(--bone);font-family:var(--font-body);margin:0;font-size:14px;line-height:1.5}canvas.sky{z-index:-1;width:100%;height:100%;image-rendering:pixelated;position:fixed;inset:0}h1,h2{font-family:var(--font-pixel);text-transform:uppercase;text-shadow:0 3px #0000008c;margin:0;font-weight:400;line-height:1.2}p{margin:0}.eyebrow{color:var(--muted);font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;font-size:12px}.quiet{color:var(--muted)}.pixel{font-family:var(--font-pixel);text-transform:uppercase}.sr-only{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;position:absolute;overflow:hidden}:where(.key,.panel,.frame){--notch:4px;--notched:polygon(var(--notch) 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, var(--notch) 100%, 0 calc(100% - var(--notch)), 0 var(--notch));--frame:polygon(evenodd, var(--notch) 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% calc(100% - var(--notch)), calc(100% - var(--notch)) 100%, var(--notch) 100%, 0 calc(100% - var(--notch)), 0 var(--notch), var(--notch) 0, calc(var(--notch) + 1px) 2px, 2px calc(var(--notch) + 1px), 2px calc(100% - var(--notch) - 1px), calc(var(--notch) + 1px) calc(100% - 2px), calc(100% - var(--notch) - 1px) calc(100% - 2px), calc(100% - 2px) calc(100% - var(--notch) - 1px), calc(100% - 2px) calc(var(--notch) + 1px), calc(100% - var(--notch) - 1px) 2px, calc(var(--notch) + 1px) 2px);isolation:isolate;position:relative}:where(.key,.panel,.frame):before,:where(.key,.panel,.frame):after{content:"";pointer-events:none;position:absolute;inset:0}.key{--c:var(--grey);--ink:var(--bone);--body:var(--key-body);min-height:34px;color:var(--ink);font:400 13px/1 var(--font-pixel);text-transform:uppercase;text-shadow:0 2px #0000008c;white-space:nowrap;cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;gap:8px;padding:8px 14px 6px;display:inline-flex}.key:before{z-index:-1;background:var(--body);clip-path:var(--notched)}.key:after{z-index:-1;background:var(--c);clip-path:var(--frame)}.key:is(.gold,.green,.red,.blue){--ink:color-mix(in srgb, var(--c) 82%, white)}.key.gold{--c:var(--gold)}.key.green{--c:var(--green)}.key.red{--c:var(--red)}.key.blue{--c:var(--blue)}.key:hover:not(:disabled){--body:color-mix(in srgb, var(--c) 18%, var(--key-body));transform:translateY(-2px)}.key:active:not(:disabled),.key.solid{--body:var(--c);color:var(--dark);text-shadow:none;transform:none}.key:disabled{--c:var(--disabled);--ink:var(--disabled-ink);opacity:.55;cursor:default}.key:focus-visible{outline:2px solid var(--bone);outline-offset:3px}.key.small{min-height:28px;padding:6px 10px 4px;font-size:12px}.key.quiet{--body:transparent;--ink:var(--muted)}.key.quiet:after{display:none}.key.quiet:hover:not(:disabled){--ink:var(--bone)}.key.quiet.red{--ink:color-mix(in srgb, var(--red) 82%, white)}.panel{--notch:6px}.panel:before{z-index:-2;clip-path:var(--notched);background:#0000005c;transform:translate(3px,6px)}.panel:after{z-index:-1;background:var(--panel);clip-path:var(--notched);box-shadow:inset 1px 1px #ffffff1a}.frame{--c:var(--grey);--body:var(--key-body)}.frame:before{z-index:-1;background:var(--body);clip-path:var(--notched)}.frame:after{z-index:-1;background:var(--c);clip-path:var(--frame)}.field{min-width:0;display:flex}.field:focus-within{--c:var(--gold)}.field>:is(input,select){min-width:0;color:var(--bone);font:400 14px/1.2 var(--font-body);background:0 0;border:0;outline:0;flex:1;padding:9px 12px 8px}.field>select{appearance:none;cursor:pointer;padding-right:34px}.field>select option{background:var(--panel);color:var(--bone)}.field:has(>select):before{background:linear-gradient(var(--muted), var(--muted)) no-repeat calc(100% - 14px) calc(50% - 2px) / 10px 2px, linear-gradient(var(--muted), var(--muted)) no-repeat calc(100% - 16px) 50% / 6px 2px, linear-gradient(var(--muted), var(--muted)) no-repeat calc(100% - 18px) calc(50% + 2px) / 2px 2px, var(--body)}.field:has(>:disabled){--c:var(--disabled);opacity:.6}html,body{height:100%}.stage{flex-direction:column;gap:10px;height:100%;padding:10px;display:flex}.screen{flex:1;place-items:center;min-height:0;display:grid}.controls{flex-direction:column;gap:10px;display:flex}.stage.watching .screen{background:#000;position:fixed;inset:0}.stage.watching .screen:before,.stage.watching .screen:after,.stage.watching .idle{display:none}.stage.watching .controls{z-index:1;background:#080a17cc;padding:12px 10px 10px;transition:opacity .25s;position:fixed;inset:auto 0 0}.stage.controls-hidden{cursor:none}.stage.controls-hidden .controls{opacity:0;pointer-events:none}video{object-fit:fill;width:100%;height:100%;display:none;position:absolute;inset:0}.stage.watching video{display:block}video[data-sizing=fit]{object-fit:contain}video[data-sizing=crop]{object-fit:cover}video::cue{color:#f4f0e6;background:#090d15d1;font-family:IBM Plex Sans,Segoe UI,system-ui,sans-serif}video::-webkit-media-text-track-container{transition:transform .25s}.stage.watching:not(.controls-hidden) video::-webkit-media-text-track-container{transform:translateY(calc(-8px - var(--controls-height,0px)))}@media (prefers-reduced-motion:reduce){.stage.watching .controls{transition:none}video::-webkit-media-text-track-container{transition:none}}.idle{text-align:center;justify-items:center;gap:2px;padding:16px;display:grid}.sign{max-width:100%;height:auto}.placeholder{color:var(--muted);text-shadow:0 2px #0000008c;font-size:12px}.unblock{width:fit-content;height:fit-content;margin:auto;position:absolute;inset:0}.bar,.tray{align-items:center;gap:12px;display:flex}.bar{position:relative}.icon-key{flex:none;width:40px;padding:0}.icon-key .glyph{filter:drop-shadow(0 2px #0000008c);position:relative}.icon-key:is(:active,:disabled) .glyph{filter:none}.glyph:before,.glyph:after{content:"";display:block}.play-key .glyph:before{clip-path:polygon(0 0,3px 0,3px 2px,6px 2px,6px 4px,9px 4px,9px 6px,12px 6px,12px 8px,9px 8px,9px 10px,6px 10px,6px 12px,3px 12px,3px 14px,0 14px);background:currentColor;width:12px;height:14px}.play-key.playing .glyph:before{clip-path:polygon(1px 0,5px 0,5px 14px,1px 14px,1px 0,7px 0,11px 0,11px 14px,7px 14px,7px 0)}.mute-key .glyph{width:17px;height:14px}.mute-key .glyph:before{clip-path:polygon(0 4px,4px 4px,9px 0,9px 14px,4px 10px,0 10px);background:currentColor;width:9px;height:14px;position:absolute;top:0;left:0}.mute-key .glyph:after{background:linear-gradient(currentColor,currentColor) 0 2px/2px 6px no-repeat,linear-gradient(currentColor,currentColor) 4px 0/2px 10px no-repeat;width:6px;height:10px;position:absolute;top:2px;left:11px}.mute-key.muted .glyph:after{background:linear-gradient(currentColor,currentColor) 0 0/2px 2px no-repeat,linear-gradient(currentColor,currentColor) 4px 0/2px 2px no-repeat,linear-gradient(currentColor,currentColor) 2px 2px/2px 2px no-repeat,linear-gradient(currentColor,currentColor) 0 4px/2px 2px no-repeat,linear-gradient(currentColor,currentColor) 4px 4px/2px 2px no-repeat;height:6px;top:4px}.settings-key .glyph:before{background:linear-gradient(currentColor,currentColor) 3px 0/4px 4px no-repeat,linear-gradient(currentColor,currentColor) 8px 4px/4px 4px no-repeat,linear-gradient(currentColor,currentColor) 4px 8px/4px 4px no-repeat,linear-gradient(currentColor,currentColor) 0 1px/14px 2px no-repeat,linear-gradient(currentColor,currentColor) 0 5px/14px 2px no-repeat,linear-gradient(currentColor,currentColor) 0 9px/14px 2px no-repeat;width:14px;height:12px}.settings-key[aria-expanded=true]{--body:color-mix(in srgb, var(--c) 30%, var(--key-body))}.slider{--fill:0%;appearance:none;cursor:pointer;background:0 0;min-width:48px;height:22px;margin:0}.slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--gold) var(--fill), var(--plate) var(--fill));height:8px}.slider::-webkit-slider-thumb{background:var(--bone);appearance:none;border:0;width:10px;height:18px;margin-top:-5px;box-shadow:0 2px #0000008c}.slider::-moz-range-track{background:var(--plate);height:8px}.slider::-moz-range-progress{background:var(--gold);height:8px}.slider::-moz-range-thumb{background:var(--bone);border:0;border-radius:0;width:10px;height:18px}.slider:disabled{opacity:.5;cursor:default}.slider:focus-visible{outline:2px solid var(--bone);outline-offset:4px}.scrub{flex:1}.clock{color:var(--muted);flex:none;font-size:13px}.rate{color:var(--gold);flex:none;font-size:12px}.drift{min-width:84px;color:var(--green);text-align:right;flex:none;font-size:12px}:is(.drift,#sync).correcting{color:var(--orange)}.settings{z-index:2;gap:12px;width:min(300px,100vw - 20px);padding:14px 16px 16px;display:grid;position:absolute;bottom:calc(100% + 12px);right:0}.setting{grid-template-columns:90px 1fr auto;align-items:center;gap:10px;display:grid}.setting-label{color:var(--muted);font-size:12px}.setting-value{min-width:30px;color:var(--bone);text-align:right;font-size:12px}.setting .field{grid-column:2/-1}.setting-note{color:var(--muted);margin-top:-6px;padding-left:100px;font-size:12px}.sync-row{display:none}#sync{color:var(--green);text-align:left;grid-column:2/-1}@media (width<=520px){.drift{display:none}.sync-row{display:grid}}.library{flex:1}.role,.viewers{color:var(--muted);flex:none;font-size:12px}.role.host{color:var(--gold)}.error{color:var(--red);font-size:12px}