/* Copyright (c) A|iens. All rights reserved. */
/* [HEADER] The Human / cinematic chapter theatre + watch pages. v16.0.0. */
.th-universe .th-cinema{border:1px solid var(--line);background:#050b12;overflow:hidden;isolation:isolate}
.th-universe .th-cinema-stage{position:relative;aspect-ratio:21/10;min-height:330px;overflow:hidden;background:#07131e;touch-action:pan-y;perspective:1100px;outline-offset:-5px}
.th-universe .th-cinema-stage:focus-visible{outline:3px solid var(--accent)}
.th-universe .th-cinema-static,.th-universe .th-cinema-static img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.th-universe .th-cinema-layers{position:absolute;inset:-3%;transform:rotateX(var(--cinema-y,0deg)) rotateY(var(--cinema-x,0deg));transform-origin:center;pointer-events:none}
.th-universe .th-cinema-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.th-universe .th-cinema-object{position:absolute;left:var(--object-x);top:var(--object-y);width:var(--object-width);height:auto;max-width:none;will-change:transform;filter:drop-shadow(0 8px 15px #0005)}
.th-universe .th-cinema-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,#030a12c9,transparent 35%),linear-gradient(90deg,#02070c36,transparent 25%,transparent 80%,#02070c4a)}
.th-universe .th-cinema-hud{position:absolute;z-index:2;left:22px;right:22px;top:18px;display:flex;justify-content:space-between;gap:20px;font:10px/1.4 THText,system-ui;letter-spacing:.18em;color:#d6efec;text-shadow:0 2px 5px black;pointer-events:none}
.th-universe .th-cinema-hud b{display:inline-block;border:1px solid #bce8df70;padding:5px 8px;font-weight:400;background:#04101d70}
.th-universe .th-cinema-hint{position:absolute;z-index:2;bottom:20px;left:22px;font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:#d6efec;pointer-events:none}
.th-universe .th-cinema-bar{padding:20px;display:flex;gap:12px;align-items:center;justify-content:space-between;border-top:1px solid var(--line);flex-wrap:wrap}
.th-universe .th-cinema-choices{display:flex;gap:9px;flex-wrap:wrap}
.th-universe .th-cinema-choices a{padding:9px 15px;text-decoration:none;border:1px solid var(--line);font-size:11px;letter-spacing:.05em;min-height:40px}
.th-universe .th-cinema-choices a[aria-current=true]{color:var(--accent);border-color:var(--accent);background:#173035}
.th-universe .th-cinema-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.th-universe .th-cinema-controls button{font:12px THText,system-ui;background:#0e1e2c;border:1px solid var(--line);padding:10px 13px;min-height:42px;color:var(--ink)}
.th-universe .th-cinema-controls button:disabled{opacity:.5;cursor:default}
.th-universe .th-cinema-controls label{font-size:10px;color:var(--muted);display:flex;align-items:center;gap:8px}
.th-universe .th-cinema-controls input{width:90px;accent-color:#94dcd8}
.th-universe .th-cinema-caption{font-size:12px;color:var(--muted);padding:0 20px 20px;margin:0}
.th-universe .th-cinema-load{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%)}
.th-universe .th-cinema[data-asset-warning=true] .th-cinema-caption:after{content:' Some layers are unavailable; the dossier and base artwork remain readable.';color:#e0b483}
.th-universe .th-watch-hero{padding-top:130px;padding-bottom:60px}
.th-universe .th-watch-hero h1{font-size:clamp(2.5rem,6vw,5rem);max-width:1100px;margin-top:20px}
.th-universe .th-watch-hero .th-lead{max-width:880px;color:var(--muted)}
.th-universe .th-watch-player{margin-top:35px;border:1px solid var(--line);background:black}
.th-universe .th-watch-player video{aspect-ratio:16/9;width:100%;max-height:70svh;object-fit:contain;display:block}
.th-universe .th-watch-cues{display:grid;grid-template-columns:repeat(3,1fr);gap:25px;margin:35px 0}
.th-universe .th-watch-cue{padding-top:20px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
.th-universe .th-watch-cue span{font-size:10px;letter-spacing:.12em;color:var(--accent);display:block;margin-bottom:8px}
.th-universe .th-model-stills{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:30px 0 0}
.th-universe .th-model-stills figure{margin:0}
.th-universe .th-model-stills img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border:1px solid var(--line)}
.th-universe .th-view-note{font-size:11px;color:var(--muted)}
.th-universe .th-watch-link{margin-top:20px;display:inline-flex;gap:15px;align-items:center;font-size:13px}
@media(max-width:700px){.th-universe .th-cinema-stage{aspect-ratio:4/5;min-height:400px}.th-universe .th-cinema-object{left:var(--portrait-x);top:var(--portrait-y);width:var(--portrait-width)}.th-universe .th-cinema-hud{left:14px;right:14px;font-size:8px}.th-universe .th-cinema-hint{left:14px;font-size:8px}.th-universe .th-cinema-bar{padding:14px}.th-universe .th-cinema-caption{padding:0 14px 18px}.th-universe .th-watch-cues{grid-template-columns:1fr;gap:10px}.th-universe .th-model-stills{gap:10px;grid-template-columns:1fr}.th-universe .th-watch-hero{padding-top:115px}.th-universe .th-model-stills figcaption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.th-universe .th-cinema-layers{transform:none!important}.th-universe .th-cinema-object{will-change:auto}}
.th-universe[data-motion=off] .th-cinema-layers{transform:none!important}.th-universe[data-motion=off] .th-cinema-object{will-change:auto}
/* End: Cinematic chapter design. */
