.theory-lesson-preview{display:grid;gap:16px;padding:24px;border:1px solid #24394c;border-radius:20px;background:linear-gradient(145deg,#081725,#102b40);box-shadow:0 20px 48px rgba(5,19,32,.22);color:#fff}
.theory-lesson-preview>header{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.theory-lesson-preview>header h5{margin:3px 0 0;color:#fff;font-size:1.28rem}.theory-lesson-preview>header>span{color:#c9d7e2;font-size:.82rem;font-weight:800}
.theory-preview-stage,.theory-learner-scene-canvas{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;background:#03090f;isolation:isolate}.theory-preview-stage{border:1px solid rgba(255,255,255,.13);border-radius:15px}.theory-preview-stage>img,.theory-learner-scene-canvas>img{display:block;width:100%;height:100%;min-width:0;min-height:0;max-width:100%;max-height:100%;object-fit:contain;object-position:50% 50%;background:#03090f}.theory-preview-stage.is-fading>img{animation:theory-preview-fade .36s ease-out}.theory-preview-empty{text-align:center;color:#aebfcb}.theory-preview-empty strong{display:block;color:#fff;font-size:1.05rem}.theory-preview-empty p{margin:6px 0 0}.theory-preview-stage .theory-scene-cue-layer,.theory-preview-stage .theory-arrow-cue{pointer-events:none}
.theory-preview-stage.is-crossfading>img{position:absolute;inset:0}.theory-preview-stage.is-crossfading .theory-preview-outgoing{z-index:1;animation:theory-scene-fade-out var(--theory-scene-fade,500ms) linear forwards}.theory-preview-stage.is-crossfading .theory-preview-incoming{z-index:2;animation:theory-scene-fade-in var(--theory-scene-fade,500ms) linear forwards}.theory-preview-stage.is-crossfading .theory-scene-cue-layer{z-index:3}
.theory-preview-stage.is-crossfading .theory-scene-interaction-layer{animation:theory-scene-fade-in var(--theory-scene-fade,500ms) linear}
.theory-learner-scene-canvas.is-entering>img{animation:theory-scene-fade-in var(--theory-scene-fade,500ms) linear}
.theory-master-scrub{--theory-scrub-progress:0%;position:relative;height:32px;display:flex;align-items:center;margin:-2px 1px 0}.theory-master-scrub input{position:relative;z-index:3;width:100%;height:24px;margin:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer}.theory-master-scrub input::-webkit-slider-runnable-track{height:5px;border-radius:999px;background:linear-gradient(90deg,#e2bd68 0 var(--theory-scrub-progress),#3d566b var(--theory-scrub-progress) 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.theory-master-scrub input::-moz-range-track{height:5px;border-radius:999px;background:#3d566b}.theory-master-scrub input::-moz-range-progress{height:5px;border-radius:999px;background:#e2bd68}.theory-master-scrub input::-webkit-slider-thumb{width:14px;height:14px;margin-top:-4.5px;border:2px solid #fff;border-radius:50%;appearance:none;-webkit-appearance:none;background:#e2bd68;box-shadow:0 1px 8px rgba(0,0,0,.65);transition:transform .12s ease}.theory-master-scrub input::-moz-range-thumb{width:11px;height:11px;border:2px solid #fff;border-radius:50%;background:#e2bd68;box-shadow:0 1px 8px rgba(0,0,0,.65)}.theory-master-scrub input:hover::-webkit-slider-thumb,.theory-master-scrub input:focus-visible::-webkit-slider-thumb{transform:scale(1.18)}.theory-master-scrub input:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:8px}.theory-scrub-boundaries{position:absolute;z-index:2;inset:13px 7px auto;height:7px;pointer-events:none}.theory-scrub-boundaries i{position:absolute;top:0;width:1px;height:7px;background:rgba(255,255,255,.5);transform:translateX(-.5px)}.theory-master-scrub output{position:absolute;z-index:5;bottom:27px;transform:translateX(-50%);padding:4px 7px;border:1px solid #526a7d;border-radius:6px;background:#071725;color:#fff;font-size:.72rem;white-space:nowrap;pointer-events:none;box-shadow:0 5px 14px rgba(0,0,0,.35)}
.theory-preview-transport{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.theory-preview-transport>span{margin-left:auto;color:#c9d7e2;font-variant-numeric:tabular-nums}.theory-preview-transport .tertiary-action{border-color:#526a7d;background:#173449;color:#fff}
.theory-scene-timeline{display:grid;gap:10px;padding-top:4px}.theory-scene-timeline>header h6{margin:2px 0 0;color:#dce7ee}.theory-scene-filmstrip{display:flex;gap:12px;width:100%;overflow-x:auto;overflow-y:hidden;padding:4px 3px 12px;scroll-snap-type:x proximity;scrollbar-color:#b9954f #173449}
.theory-timeline-card{flex:0 0 226px;overflow:hidden;border:1px solid #40576a;border-radius:13px;background:#11283a;scroll-snap-align:start;transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.theory-timeline-card.is-active{border-color:#e2bd68;box-shadow:0 0 0 2px rgba(226,189,104,.33),0 10px 24px rgba(0,0,0,.22)}.theory-timeline-card.is-dragging{opacity:.55;transform:scale(.98)}.theory-timeline-card>button{display:grid;width:100%;padding:0;border:0;background:transparent;color:#fff;text-align:left;cursor:pointer}
.theory-timeline-thumb{display:grid;place-items:center;width:100%;aspect-ratio:16/9;overflow:hidden;background:#07121b;color:#8fa5b5;font-size:.75rem;font-weight:800}.theory-timeline-thumb img{width:100%;height:100%;object-fit:contain}.theory-timeline-card>button>span:nth-child(2){display:grid;gap:3px;padding:10px 11px 4px}.theory-timeline-card>button small{overflow:hidden;color:#adc0ce;text-overflow:ellipsis;white-space:nowrap}.theory-timeline-card>button>em{padding:0 11px;color:#e2bd68;font-size:.75rem;font-style:normal;font-weight:800}
.theory-timeline-badges{display:flex!important;gap:5px!important;padding:8px 11px 10px!important}.theory-timeline-badges i{padding:3px 6px;border-radius:999px;background:#243d50;color:#8da2b2;font-size:.62rem;font-style:normal;font-weight:800}.theory-timeline-badges i.ready{background:#1d5946;color:#c9f6df}.theory-timeline-card-settings{display:grid;grid-template-columns:1fr 1fr;gap:7px;padding:9px 10px;border-top:1px solid #2f485a;background:#0d2131}.theory-timeline-card-settings label{display:grid;gap:3px;color:#b8c8d3;font-size:.65rem;font-weight:800}.theory-timeline-card-settings input,.theory-timeline-card-settings select{min-width:0;width:100%;padding:6px 7px;border:1px solid #52687a;border-radius:7px;background:#fff;color:#17364e;font:inherit}
.theory-lesson-preview:fullscreen{padding:28px;overflow:auto;border-radius:0}.theory-lesson-preview:fullscreen .theory-preview-stage{width:min(100%,calc((100vh - 240px)*16/9));max-height:calc(100vh - 240px);justify-self:center}
@keyframes theory-preview-fade{from{opacity:.15}to{opacity:1}}
@keyframes theory-scene-fade-out{from{opacity:1}to{opacity:0}}@keyframes theory-scene-fade-in{from{opacity:0}to{opacity:1}}
@media(max-width:760px){.theory-lesson-preview{padding:15px;border-radius:15px}.theory-master-scrub{height:38px}.theory-master-scrub input{height:32px}.theory-preview-transport>span{width:100%;margin-left:0}.theory-timeline-card{flex-basis:200px}}
@media(prefers-reduced-motion:reduce){.theory-preview-stage.is-fading>img,.theory-preview-stage.is-crossfading>img{animation:none}.theory-timeline-card{transition:none}}