@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;padding:2px;display:grid}.screen:has(video.live){--body:#000}video{object-fit:contain;width:100%;height:100%;clip-path:var(--notched);display:none}video.live{display:block}.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}.bar,.tray{align-items:center;gap:12px;display:flex}.toggle{flex:none;width:40px;padding:0}.toggle .glyph{filter:drop-shadow(0 2px #0000008c)}.toggle .glyph:before{content:"";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;display:block}.toggle.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)}.toggle:is(:active,:disabled) .glyph{filter:none}.scrub{--fill:0%;appearance:none;cursor:pointer;background:0 0;flex:1;min-width:48px;height:22px;margin:0}.scrub::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--gold) var(--fill), var(--plate) var(--fill));height:8px}.scrub::-webkit-slider-thumb{background:var(--bone);appearance:none;border:0;width:10px;height:18px;margin-top:-5px;box-shadow:0 2px #0000008c}.scrub::-moz-range-track{background:var(--plate);height:8px}.scrub::-moz-range-progress{background:var(--gold);height:8px}.scrub::-moz-range-thumb{background:var(--bone);border:0;border-radius:0;width:10px;height:18px}.scrub:disabled{opacity:.5;cursor:default}.scrub:focus-visible{outline:2px solid var(--bone);outline-offset:4px}.clock{color:var(--muted);flex:none;font-size:13px}.drift{min-width:84px;color:var(--green);text-align:right;flex:none;font-size:12px}.drift.correcting{color:var(--orange)}.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}
