:root{--bg: #0a0b0d;--surface: #141619;--surface-raised: #1d2025;--border: #2a2e35;--text: #e8eaed;--text-dim: #9aa0a6;--accent: #4c8dff;--accent-dim: #2f5fb0;--danger: #ff6b6b;--radius: 10px;--control-height: 38px}@media(prefers-color-scheme:light){:root{--bg: #f6f7f9;--surface: #ffffff;--surface-raised: #f0f2f5;--border: #d9dde3;--text: #1a1d21;--text-dim: #5f6673}}*{box-sizing:border-box}.icon{width:1.35em;height:1.35em;flex:none;display:block;fill:currentColor}[hidden]{display:none!important}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.5;-webkit-font-smoothing:antialiased}.app{max-width:1180px;margin:0 auto;padding:32px 20px 80px}.masthead{margin-bottom:24px}.wordmark{display:flex;align-items:center;gap:10px;font-size:26px;font-weight:650;letter-spacing:-.02em}.wordmark .glyph{display:flex;color:var(--accent);font-size:26px}.tagline{margin:6px 0 0;color:var(--text-dim)}.loader{display:flex;gap:10px;margin-bottom:12px}.url-input,.subtitle-row input{flex:1;min-width:0;height:46px;padding:0 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:15px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.url-input:focus,.subtitle-row input:focus{outline:2px solid var(--accent);outline-offset:-1px}.play-button{height:46px;padding:0 26px;background:var(--accent);border:none;border-radius:var(--radius);color:#fff;font-size:15px;font-weight:600;cursor:pointer}.play-button:hover:not(:disabled){background:#5f9bff}.play-button:disabled{opacity:.55;cursor:progress}.status-line{min-height:22px;margin-bottom:18px;font-size:13.5px;color:var(--text-dim)}.status-line.error{color:var(--danger)}.status-line .hint{display:block;color:var(--text-dim);margin-top:2px}.notice{display:flex;gap:10px;align-items:flex-start;margin-bottom:16px;padding:11px 14px;background:color-mix(in srgb,#f5a524 12%,transparent);border:1px solid color-mix(in srgb,#f5a524 40%,transparent);border-radius:var(--radius);font-size:13.5px;line-height:1.5}.notice .icon{margin-top:1px;color:#f5a524;font-size:14px}.notice-lines{display:grid;gap:7px}.notice b{font-weight:650}.stage{display:grid;grid-template-columns:minmax(0,1fr);gap:18px}.video-shell{position:relative;background:#000;border-radius:var(--radius);overflow:hidden;aspect-ratio:16 / 9}.video-shell:fullscreen{border-radius:0;aspect-ratio:auto}video{width:100%;height:100%;display:block;background:#000}video::cue{background:#000000b8;color:#fff;font-size:1.05em;line-height:1.35}.spinner{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.spinner-ring{width:44px;height:44px;border:3px solid rgba(255,255,255,.18);border-top-color:#fff;border-radius:50%;animation:spin .85s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.center-error{position:absolute;inset:0;display:grid;place-items:center;padding:32px;text-align:center;background:#000000c7;color:#fff;font-size:15px}.controls{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 10px;background:linear-gradient(transparent,#000000d1);opacity:0;transition:opacity .18s ease}.video-shell:hover .controls,.video-shell.controls-visible .controls,.controls:focus-within{opacity:1}@media(pointer:coarse){.controls{opacity:1}.icon-button,.chip-button{min-width:44px;min-height:44px}.icon-button{width:44px}.scrubber{height:28px}.control-row{flex-wrap:wrap;row-gap:4px}}.scrubber{position:relative;height:18px;display:flex;align-items:center;cursor:pointer}.scrub-track{position:relative;width:100%;height:4px;background:#ffffff42;border-radius:2px}.scrubber:hover .scrub-track{height:6px}.scrub-buffered,.scrub-played{position:absolute;top:0;left:0;height:100%;border-radius:2px}.scrub-buffered{background:#ffffff57}.scrub-played{background:var(--accent)}.scrub-knob{position:absolute;top:50%;width:12px;height:12px;margin-left:-6px;border-radius:50%;background:#fff;transform:translateY(-50%) scale(0);transition:transform .12s ease}.scrubber:hover .scrub-knob{transform:translateY(-50%) scale(1)}.scrub-tooltip{position:absolute;bottom:22px;transform:translate(-50%);padding:3px 7px;background:#000000db;border-radius:4px;font-size:12px;font-variant-numeric:tabular-nums;color:#fff;pointer-events:none;white-space:nowrap}.control-row{display:flex;align-items:center;gap:6px;margin-top:2px}.spacer{flex:1}.icon-button,.chip-button{height:32px;background:transparent;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;display:inline-flex;align-items:center;justify-content:center}.icon-button{width:32px;font-size:15px;padding:0}.icon-button .icon,.icon-button>span{display:flex;align-items:center;justify-content:center}.chip-button{padding:0 10px;font-size:12.5px;font-weight:550;border:1px solid rgba(255,255,255,.26)}.icon-button:hover,.chip-button:hover{background:#ffffff29}.chip-button.active{background:var(--accent);border-color:var(--accent)}.volume-group{display:flex;align-items:center;gap:4px}.volume-slider{width:0;opacity:0;transition:width .18s ease,opacity .18s ease;accent-color:var(--accent)}.volume-group:hover .volume-slider,.volume-slider:focus{width:76px;opacity:1}.timecode{margin-left:4px;font-size:12.5px;font-variant-numeric:tabular-nums;color:#ffffffe6;white-space:nowrap}.menu{position:absolute;right:12px;bottom:62px;min-width:210px;max-width:320px;max-height:300px;overflow-y:auto;padding:6px;background:#141619f7;border:1px solid rgba(255,255,255,.12);border-radius:8px;box-shadow:0 12px 32px #00000080}.menu-title{padding:6px 10px 4px;font-size:11px;font-weight:650;text-transform:uppercase;letter-spacing:.06em;color:#ffffff80}.menu-item{display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:10px;width:100%;padding:8px 10px;background:transparent;border:none;border-radius:6px;color:#fff;font-size:13.5px;text-align:left;cursor:pointer}.menu-item:hover{background:#ffffff1f}.menu-item[aria-checked=true]{color:var(--accent)}.menu-item[disabled]{opacity:.42;cursor:not-allowed}.menu-tick{display:flex;align-items:center;color:var(--accent);font-size:12px}.menu-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.menu-item .meta{font-size:11.5px;color:#ffffff80;white-space:nowrap}.details{padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);font-size:13.5px}.details h2{margin:0 0 16px;font-size:15px}.specs{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px 28px;margin:0 0 18px}.spec{min-width:0}.specs dt{margin-bottom:2px;color:var(--text-dim);font-size:11.5px;text-transform:uppercase;letter-spacing:.05em}.specs dd{margin:0;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}.notes{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-bottom:18px}.notes:empty{display:none}.note{padding:9px 12px;background:var(--surface-raised);border-left:2px solid var(--accent);border-radius:4px;color:var(--text-dim);font-size:12.5px;line-height:1.45;overflow-wrap:anywhere}.subtitle-loader{max-width:420px}.subtitle-loader label{display:block;margin-bottom:6px;color:var(--text-dim);font-size:12.5px}.subtitle-row{display:flex;gap:6px}.subtitle-row input{height:34px;font-size:12.5px}.subtitle-row button{height:34px;padding:0 14px;background:var(--surface-raised);border:1px solid var(--border);border-radius:8px;color:var(--text);cursor:pointer;font-size:13px}.subtitle-row button:hover{border-color:var(--accent)}.host-session{margin-top:18px;padding-top:14px;border-top:1px solid var(--border)}.host-session summary{cursor:pointer;font-size:13px;font-weight:600;color:var(--text-dim);list-style:none}.host-session summary::-webkit-details-marker{display:none}.host-session summary:before{content:"";display:inline-block;width:0;height:0;margin-right:7px;border-left:5px solid var(--accent);border-top:4px solid transparent;border-bottom:4px solid transparent;transition:transform .15s ease}.host-session[open] summary:before{transform:rotate(90deg)}.host-session-help{margin:10px 0;color:var(--text-dim);font-size:12px;line-height:1.5}.host-session label{display:block;margin:8px 0 4px;color:var(--text-dim);font-size:12px}.host-session input{width:100%;height:32px;padding:0 10px;margin-bottom:4px;background:var(--surface-raised);border:1px solid var(--border);border-radius:8px;color:var(--text);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.host-session input:focus{outline:2px solid var(--accent);outline-offset:-1px}.host-session .subtitle-row{margin-top:8px}.bookmarklet-help{margin-top:14px;padding-top:12px;border-top:1px dashed var(--border)}.bookmarklet{display:inline-flex;align-items:center;gap:7px;padding:7px 14px;background:var(--accent);border-radius:8px;color:#fff;font-size:13px;font-weight:600;text-decoration:none;cursor:grab}.bookmarklet:active{cursor:grabbing}.session-status{margin-top:8px;font-size:12px;color:var(--text-dim);word-break:break-word}.explainer{margin-top:56px;padding-top:28px;border-top:1px solid var(--border)}.explainer h2{margin:0 0 18px;font-size:16px}.explainer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}.explainer h3{margin:0 0 6px;font-size:14px}.explainer p{margin:0;color:var(--text-dim);font-size:13.5px}.gate{display:grid;justify-items:start;gap:10px;margin-bottom:16px;padding:20px;background:color-mix(in srgb,#f5a524 10%,transparent);border:1px solid color-mix(in srgb,#f5a524 45%,transparent);border-radius:var(--radius)}.gate-icon .icon{font-size:22px;color:#f5a524}.gate-title{margin:0;font-size:17px;font-weight:650}.gate-body{margin:0;font-size:13.5px;line-height:1.55;color:var(--muted, #a9a9b3)}.gate-signals{margin:0;font-size:12px;color:var(--muted, #a9a9b3);opacity:.75}.gate-signals:empty{display:none}.tagline-hint{margin:-6px 0 0;max-width:62ch;font-size:12.5px;line-height:1.5;color:var(--muted, #a9a9b3);opacity:.8}