/* The film owns the entrance. Legacy signature CSS remains dormant for rollback. */
.cinema{cursor:pointer;touch-action:manipulation;position:fixed;inset:0;z-index:80;isolation:isolate;background:#010305;opacity:1;transition:opacity 1.4s cubic-bezier(.2,.65,.3,1)}
.cinema-pending,.cinema-pending body{overflow:hidden}
.cinema-pending body>:not(.cinema):not(script):not(style){visibility:hidden}
.cinema-pending .cinema{display:block!important}
.cinema:before{content:"";position:absolute;inset:0;background:linear-gradient(#01030599,#010305d9),url("/arrival/media/kc-opening.jpg") center/cover;opacity:.5}
.cinema video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 50%;background:#010305}
/* Crop only a modest amount on wide landscape displays; never crop the title on phones. */
@media(min-aspect-ratio:4/3) and (max-aspect-ratio:21/9){.cinema video{object-fit:cover}}
.cinema-shade{position:absolute;inset:0;pointer-events:none;background:#010305;opacity:.9;transition:opacity .8s ease}
.cinema-active .cinema-shade{opacity:0}
.cinema-status{position:absolute;bottom:94px;left:7%;right:7%;text-align:center;font-size:13px;color:#c5d9e5}
.cinema-leaving .cinema{opacity:0;pointer-events:none}
.cinema-leaving body>:not(.cinema){visibility:visible}
.cinema-replay{font-size:10px;color:#9bb4c5;padding:12px;min-height:44px;letter-spacing:.04em}
.cinema-replay:hover{color:#e7f5ff}
/* During handoff, retain the city for one extra beat while navigation appears. */
.cinema-bridge{position:fixed;inset:0;z-index:0;pointer-events:none;object-fit:contain;width:100%;height:100%;opacity:0;transition:opacity 2s ease}
.cinema-bridge.is-visible{opacity:.25}
@media(min-aspect-ratio:4/3) and (max-aspect-ratio:21/9){.cinema-bridge{object-fit:cover}}
@media(max-width:760px){.cinema{background:radial-gradient(ellipse at center,#0c1b23,#010305 65%)}.cinema video{background:transparent}.cinema-replay{font-size:9px}}
/* Portrait phones play the 9:16 cut edge to edge. */
.cinema-portrait .cinema video,.cinema-portrait .cinema-bridge{object-fit:cover}
@media(prefers-reduced-motion:reduce){.cinema,.cinema-shade,.cinema-bridge{transition:none}}
