.game-wrap{isolation:isolate}
.cinema-stage{position:absolute;inset:0;pointer-events:none;z-index:3;overflow:hidden;border-radius:inherit}
.cinema-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;visibility:hidden;pointer-events:none}
.cinema-video.visible{visibility:visible}
.cinema-wings,.cinema-goal{object-fit:cover}
#pause-panel{z-index:10}

.cinema-wings{inset:auto;left:20%;top:20%;width:60%;height:60%;object-fit:contain;transform:none}
.cinema-outro.visible{animation:cosmicArrival .18s ease-out}@keyframes cosmicArrival{from{opacity:0}to{opacity:1}}

.cinema-outro{transform-origin:52% 46%;will-change:transform}
body[data-screen=finish] #finish-screen{animation:resultReveal .28s ease-out}
body[data-screen=finish] .foil-shell{animation:cardArrival .72s cubic-bezier(.16,.8,.25,1)}
@keyframes resultReveal{from{opacity:0}to{opacity:1}}
@keyframes cardArrival{0%{opacity:0;transform:perspective(900px) translateZ(-600px) translateY(70px) rotate(-12deg) scale(.25)}68%{opacity:1;transform:perspective(900px) translateZ(35px) translateY(-8px) rotate(1deg) scale(1.05)}100%{opacity:1;transform:rotate(-3deg) scale(1)}}
@media(prefers-reduced-motion:reduce){body[data-screen=finish] #finish-screen,body[data-screen=finish] .foil-shell{animation:none!important}}

.cinema-stage.intro-pending{background:#cfab75}.cinema-stage.intro-pending .cinema-intro{visibility:visible;opacity:1!important}

.cinema-stage.intro-cover{background:#cfab75 url('assets/video/intro-poster.jpg') center/cover no-repeat}
