.cast-main{padding-top:34px}.cast-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.cast-heading h1{font-size:28px;font-weight:550;margin:0 0 6px;letter-spacing:-.6px}.cast-heading p{margin:0;color:#9db2c7;font-size:14px}.free-note{color:#86a5bf;font-size:12px;white-space:nowrap}.test-stage{--stage-hue:210;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:450px;aspect-ratio:16/8;border:1px solid #54718b;border-radius:12px;background:radial-gradient(ellipse at 80% 20%,hsl(var(--stage-hue) 48% 29%),hsl(calc(var(--stage-hue) + 35) 40% 13%) 80%);color:#f5faff;box-shadow:0 14px 60px #0003;padding:26px 32px}.stage-grid{position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#def3ff09 1px,transparent 1px),linear-gradient(90deg,#def3ff09 1px,transparent 1px);background-size:40px 40px;pointer-events:none}.stage-top,.stage-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px}.stage-top{color:#d2e4f4;font-size:12px;font-family:ui-monospace,"SFMono-Regular",monospace}.stage-top>#run-status:before{content:"";display:inline-block;background:#a2bdce;width:6px;height:6px;margin-right:8px;border-radius:50%}.test-stage.is-running #run-status:before{background:#a6efd0}.timer-center{text-align:center;position:relative;width:100%;margin:auto}.timer-caption{font-size:13px;color:#c2d8e9;letter-spacing:.22em}.time-display{font-family:ui-monospace,"SFMono-Regular","Cascadia Code",Consolas,monospace;font-weight:450;font-size:clamp(38px,7.8vw,100px);line-height:1.2;letter-spacing:-.055em;font-variant-numeric:tabular-nums;margin:16px 0 24px;white-space:nowrap;text-shadow:0 0 40px #e0f4ff12}.time-display>span{font-size:.48em;color:#c3deee;letter-spacing:-.03em;margin-left:.05em}.motion-track{position:relative;height:14px;max-width:580px;width:72%;margin:auto;border-top:1px solid #effaff35;background:repeating-linear-gradient(90deg,#e0f3ff35 0px,#e0f3ff35 1px,transparent 1px,transparent 10%);background-size:100% 6px;background-repeat:no-repeat}#motion-dot{position:absolute;top:-4px;width:8px;height:8px;border-radius:50%;background:#edfbff;box-shadow:0 0 14px #dff7ffb0;left:0}.stage-telemetry{display:flex;justify-content:center;gap:35px;color:#c0d5e6;font-size:11px;margin-top:18px}.stage-telemetry b{font:inherit;font-family:ui-monospace,monospace;letter-spacing:.12em}.stage-brand{font-size:14px;font-weight:600;letter-spacing:-.3px}.stage-brand>span{color:#bce8ff}.stage-buttons{display:flex;gap:8px}.stage-button{font-size:12px;color:#ecf7ff;background:#07142145;backdrop-filter:blur(8px);border:1px solid #c1e4ff55;border-radius:6px;padding:9px 12px}.stage-button:hover{background:#d5edff20}.stage-button[aria-pressed=true]{background:#b7e6ff;color:#123049}.timer-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:20px 0}.mode-group{display:flex;padding:4px;border:1px solid #37516c;border-radius:8px;background:#132236}.mode-button{background:none;border:0;color:#99b1ca;font-size:13px;padding:8px 18px;border-radius:5px}.mode-button.active{background:#294761;color:#e0f1ff}.timer-controls #duration-control{display:flex;align-items:center;gap:8px}.timer-controls label{margin:0;font-size:12px}.timer-controls input{width:92px;padding:8px 10px;font-size:13px}.timer-controls #timer-feedback{font-size:12px;color:#9cbedb;flex:1}.cast-settings{border:1px solid #30465e;border-radius:10px;background:#142438;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding:22px 24px;gap:24px}.setting-item{display:flex;flex-direction:column;justify-content:center;gap:8px;min-width:0}.setting-item>label{font-size:12px;margin:0}.setting-item>span{font-size:11px;color:#849fb9}.setting-item input[type=range]{width:100%;padding:0;accent-color:#abd6f5;border:0}.setting-item select{padding:6px 9px;font-size:12px}.setting-item output{float:right;color:#c1dff4}.cast-help{display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:30px 0 10px;color:#8fa8c0;font-size:12px;line-height:1.9}.cast-help h2{font-weight:550;font-size:17px;color:#cbdfee;margin:0 0 10px}.cast-help p{margin:0 0 10px}kbd{font:11px ui-monospace,monospace;border:1px solid #425e78;background:#1b3046;padding:2px 5px;border-radius:4px;color:#c9dfef}.test-stage:fullscreen{width:100vw;height:100dvh;max-width:none;min-height:0;aspect-ratio:auto;border:0;border-radius:0;padding:clamp(20px,3vw,48px)}.test-stage:fullscreen .time-display{font-size:clamp(40px,10vw,210px)}.test-stage:fullscreen .timer-caption{font-size:clamp(13px,1.5vw,24px)}.test-stage:fullscreen .motion-track{max-width:none;width:75%}.test-stage:fullscreen .stage-telemetry{font-size:clamp(11px,1vw,18px)}.test-stage:fullscreen .stage-button{font-size:clamp(12px,1vw,18px);padding:12px 18px}.test-stage:fullscreen .stage-top{font-size:clamp(12px,1.1vw,20px)}@media(max-width:760px){.cast-heading{display:block}.cast-heading h1{font-size:25px}.free-note{display:block;margin-top:12px}.test-stage{aspect-ratio:auto;min-height:340px;padding:20px 17px}.time-display{font-size:clamp(30px,8.5vw,65px);margin:20px 0 26px}.stage-top{font-size:10px}.stage-brand{display:none}.stage-bottom{justify-content:center}.stage-buttons{width:100%;justify-content:center}.stage-button{padding:10px 12px;flex:1;white-space:nowrap}.timer-caption{font-size:12px}.stage-telemetry{gap:20px;font-size:10px}.cast-settings{grid-template-columns:1fr 1fr;padding:20px;gap:24px 20px}.cast-help{grid-template-columns:1fr;gap:16px}.mode-button{padding:8px 12px}.timer-controls{gap:12px}.cast-main{padding-top:26px}.test-stage:fullscreen .stage-buttons{width:auto}.test-stage:fullscreen .stage-button{padding:10px}.test-stage:fullscreen .time-display{font-size:clamp(30px,9vw,90px)}}
/* Pixel styling is an optional display theme. */
@font-face{font-family:Silkscreen;src:url('/brand/fonts/Silkscreen-Regular.ttf') format('truetype');font-weight:400;font-display:swap}.pixel-style .time-display{font-family:Silkscreen,ui-monospace,monospace;font-size:clamp(34px,7.2vw,88px);letter-spacing:-.055em;text-shadow:3px 3px 0 #07152165}.pixel-style .time-display>span{color:#b5e6ed}.test-stage.pixel-style{border-radius:2px;border:2px solid #7093ae;box-shadow:6px 6px 0 #080f1c}.pixel-style .stage-grid{background-size:32px 32px}.pixel-style .stage-grid:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0px,transparent 3px,#0309150a 3px,#0309150a 4px);opacity:.5}.pixel-style #motion-dot{width:9px;height:9px;border-radius:0;box-shadow:3px 3px 0 #10283890,0 0 12px #dff7ff55}.pixel-style .stage-button{border-radius:0;border:2px solid #a3c5dd85;box-shadow:3px 3px 0 #07152180;backdrop-filter:none;background:#0a1e31c4}.pixel-style .stage-button:hover{background:#294c66}.pixel-style .stage-button[aria-pressed=true]{background:#b7e6ff}.pixel-style .stage-brand{font-family:Silkscreen,monospace;font-size:12px}.pixel-style .stage-top>#run-status:before{border-radius:0}.test-stage.pixel-style:fullscreen .time-display{font-size:clamp(36px,9vw,180px)}@media(max-width:760px){.pixel-style .time-display{font-size:clamp(26px,7.5vw,54px)}.test-stage.pixel-style:fullscreen .time-display{font-size:clamp(26px,7.9vw,100px)}.pixel-style .stage-button{padding:9px}.test-stage.pixel-style{padding:20px 15px}}
.cast-settings{grid-template-columns:repeat(5,minmax(0,1fr))}@media(max-width:950px){.cast-settings{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:760px){.cast-settings{grid-template-columns:repeat(2,minmax(0,1fr))}}
.scene-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}.test-stage.has-pattern .timer-center{background:#081a2bbd;border:1px solid #adcfe940;padding:20px 0;border-radius:2px;box-shadow:5px 5px 0 #050e1940}.test-stage.has-pattern:fullscreen .timer-center{width:85%;align-self:center;padding:4vh 0}.scene-controls{display:flex;gap:20px;align-items:center;padding:18px 22px;background:#142438;border:1px solid #30465e;border-radius:8px;margin:0 0 16px}.scene-controls>div{min-width:135px}.scene-controls select{width:100%;font-size:12px;padding:8px 10px}.scene-controls label{font-size:12px;margin-bottom:5px}.scene-controls p{margin:0;color:#9db5ca;font-size:12px;max-width:460px}.stage-buttons{gap:7px}@media(max-width:760px){.scene-controls{flex-wrap:wrap;padding:18px;gap:14px}.scene-controls>div{min-width:0;flex:1}.scene-controls p{flex-basis:100%}.stage-button{padding:9px 6px;font-size:11px}.test-stage.has-pattern .time-display{font-size:clamp(24px,7vw,50px)}}
.stage-telemetry{gap:22px;flex-wrap:wrap;margin-top:12px;row-gap:4px}.stage-telemetry small{font-size:9px;opacity:.75}.frame-cycle-grid{width:72%;max-width:580px;margin:14px auto 0;display:grid;grid-template-columns:repeat(30,minmax(0,1fr));gap:3px}.frame-cycle-grid i{display:block;height:5px;background:#b3d7ec30;border:1px solid #c6e8f01c}.frame-cycle-grid .current{background:#f5fffa;border-color:#f5fffa;box-shadow:0 0 6px #b4f5ed88}.sound-status{margin-top:12px;font-size:11px;color:#c1d9e7}.test-stage:fullscreen .frame-cycle-grid{max-width:900px}.test-stage:fullscreen .frame-cycle-grid i{height:clamp(5px,.7vh,9px)}.test-stage:fullscreen .sound-status{font-size:clamp(11px,1vw,16px)}@media(max-width:760px){.stage-telemetry{gap:6px 14px;font-size:9px}.frame-cycle-grid{width:86%;gap:2px}.frame-cycle-grid i{height:4px}.sound-status{font-size:10px}.scene-controls>div{flex:1 1 40%}}