.replayStage,.replayMetrics{display:none}
.replayStage .srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.replayStage .replayCanvas{bottom:130px}.replayStage:has(canvas){background:#bdc9aa}.replayHeading strong{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.replayStage .replayHeading{max-width:45%}
@media(max-width:900px){.replayStage .replayCanvas{bottom:90px}}
.replayTimeline input{appearance:none;background:transparent;border:0;padding:0}.replayTimeline input::-webkit-slider-runnable-track{height:5px;background:#cbdde3;border-radius:5px}.replayTimeline input::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:#dd792f;border:2px solid white;box-shadow:0 1px 4px #385d6440;margin-top:-5.5px}.replayTimeline input::-moz-range-track{height:5px;background:#cbdde3;border-radius:5px}.replayTimeline input::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:#dd792f;border:2px solid white}
.labReplayActive>#builder-stage,.labReplayActive>.builderMetrics,.labReplayActive>.labStatus{display:none}
.labReplayActive>.replayStage{display:block;flex:1;min-height:0;position:relative;background:linear-gradient(#d6e8f2,#e9f0e4);overflow:hidden}
.replayCanvas{position:absolute;inset:0}.replayCanvas canvas{display:block;width:100%;height:100%;touch-action:none}
.replayHeading{position:absolute;top:20px;left:24px;display:flex;align-items:flex-start;flex-direction:column;gap:7px;pointer-events:none;color:#244e60;max-width:calc(100% - 48px)}
.replayBadge{font-size:8px;font-weight:800;letter-spacing:.12em;color:#487969}.replayHeading strong{font-size:20px;letter-spacing:-.04em}.replayHeading>span:not(.replayBadge){font-size:11px}
#replay-stale-badge{padding:5px 8px;background:#fff0ce;color:#895b19;border-radius:4px}
.replayEmpty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px 28px 40px;color:#21495d;background:radial-gradient(ellipse at 50% 80%,#bbd1b5 0,transparent 60%)}
.replayEmpty>span{font-size:54px;line-height:1;color:#628e8b}.replayEmpty h2{font-size:clamp(22px,2.8vw,38px);line-height:1.15;letter-spacing:-.05em;margin:15px 0}.replayEmpty p{font-size:13px;max-width:350px;line-height:1.7;color:#587789;margin:0 0 20px}.replayEmpty .btn{font-size:12px}
.replayPlayback{position:absolute;bottom:18px;left:24px;right:24px;max-width:780px;margin:auto;background:#fffffff2;border:1px solid #cfdfdf;border-radius:12px;padding:13px 16px 11px;box-shadow:0 8px 30px #385d6412;color:#294f60}
.replayPhaseLine{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:11px}.replayPhaseLine>span{font-size:9px;color:#738b98}.replayTimeline{display:block;margin:8px 0 5px}.replayTimeline input{display:block;width:100%;height:18px;margin:0;accent-color:#dc782a;cursor:pointer}
.replayTransport{display:flex;align-items:center;gap:8px}.replayTransport button{background:#edf5f7;border:1px solid #cfe0e6;border-radius:5px;padding:8px 12px;color:#24556e;font:600 11px Inter,Arial,sans-serif;cursor:pointer}.replayTransport #replay-play{background:#176f93;color:#fff;border-color:#176f93;min-width:78px}.replayTransport select{font:11px Inter,Arial,sans-serif;border:1px solid #cadde4;border-radius:5px;padding:7px;background:white;color:#335f73}.replayTransport #replay-clock{margin-left:auto;font-size:11px;font-variant-numeric:tabular-nums}
.labReplayActive>.replayMetrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0;background:#f8fbfd;border-top:1px solid #d1e0e8;padding:20px;gap:20px;flex-shrink:0}
.replayMetrics>div{border-right:1px solid #d7e4e9;padding:0 10px}.replayMetrics>div:last-child{border:0}.replayMetrics dt{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#6e8998;margin-bottom:5px}.replayMetrics dd{font-size:22px;font-weight:650;letter-spacing:-.04em;margin:0;color:#295369;font-variant-numeric:tabular-nums}
.replayCameras{display:grid;gap:7px;margin:12px 0}.replayCameras button,.replayEvents button{font:600 11px Inter,Arial,sans-serif;text-align:left;border:1px solid #d4e3ea;border-radius:6px;background:#f9fbfc;color:#456c82;padding:12px;cursor:pointer}.replayCameras button[aria-pressed=true]{background:#e7f3fa;border-color:#2b8cb7;color:#116992;box-shadow:inset 3px 0 #2b8cb7}.replayEvents{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0 20px}.replayEvents button{font-size:10px;padding:8px}.replayWarnings p,.replayStale{font-size:11px;line-height:1.6;padding:10px 12px;background:#fff4e3;color:#8a622a;border-radius:6px}.replayNote{border-top:1px solid #e3ebef;padding-top:17px;margin-top:20px}.replayWatch{font-size:11px;padding:10px 13px;margin-top:12px}.labPartTabs #tab-replay{margin-top:-10px;margin-bottom:10px}
@media(max-width:1150px){.replayHeading{left:16px;top:16px}.replayHeading strong{font-size:17px}.replayPlayback{left:12px;right:12px;padding:11px;bottom:12px}.replayTransport button{padding:7px 8px}.replayTransport{gap:5px}.replayPhaseLine>span{font-size:8px}.labReplayActive>.replayMetrics{padding:14px 10px;gap:8px}.replayMetrics dd{font-size:18px}}
@media(max-width:900px){.labPartTabs #tab-replay{margin:0}.replayHeading{top:9px;left:13px;gap:3px}.replayBadge{font-size:6px}.replayHeading strong{font-size:12px}.replayHeading>span:not(.replayBadge){font-size:8px}#replay-motor-name{display:none}#replay-stale-badge{padding:2px 5px}.replayPlayback{bottom:7px;left:9px;right:9px;padding:7px 9px;border-radius:7px}.replayPhaseLine{font-size:9px}.replayPhaseLine>span{font-size:7px}.replayTimeline{margin:3px 0}.replayTimeline input{height:13px}.replayTransport button{font-size:9px;padding:5px 7px}.replayTransport #replay-play{min-width:62px}.replayTransport select{font-size:10px;padding:4px}.replayTransport #replay-clock{font-size:9px}.labReplayActive>.replayMetrics{padding:8px 10px;gap:5px}.replayMetrics dt{font-size:7px;margin-bottom:2px}.replayMetrics dd{font-size:13px}.replayMetrics>div{padding-inline:8px}.replayEmpty{padding:55px 20px 12px}.replayEmpty>span{display:none}.replayEmpty h2{font-size:20px;margin:5px 0}.replayEmpty p{font-size:10px;max-width:290px;margin:3px 0 10px}.replayEmpty .btn{font-size:10px;padding:9px 12px}.replayCameras{grid-template-columns:repeat(3,minmax(0,1fr))}.replayCameras button{font-size:10px;text-align:center;padding:10px 5px}}
