#eko-cinema{position:fixed;inset:0;z-index:10000;overflow:hidden;background:#020910;color:#ddf9f5;font-family:Inter,system-ui,sans-serif;--arrival:0;opacity:1;transition:opacity .65s ease}
#eko-cinema.is-leaving{opacity:0;pointer-events:none}
.cinema-stage,.cinema-vignette{position:absolute;inset:0}
.cinema-stage canvas{width:100%;height:100%;display:block}
.cinema-vignette{pointer-events:none;background:radial-gradient(ellipse at 50% 45%,transparent 30%,#01060b85 100%);box-shadow:inset 0 1px #98e6e72b,inset 0 -1px #98e6e72b}
#eko-cinema:after{content:"";position:absolute;inset:0;background:#e7f2f0;opacity:var(--arrival);pointer-events:none}
.cinema-caption{position:absolute;left:20px;right:20px;bottom:20%;text-align:center;opacity:0;z-index:2;pointer-events:none}
.cinema-caption span{display:block;font-size:clamp(20px,2.6vw,32px);font-weight:650;line-height:1.35;letter-spacing:.2em;color:#e5fff7;margin-bottom:12px}
.cinema-caption b{font-size:clamp(10px,1.15vw,15px);font-weight:500;letter-spacing:.23em;color:#edffff}
.cinema-progress{position:absolute;bottom:0;left:0;right:0;height:2px;background:#69babb15;z-index:3}
.cinema-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#327fd1,#8cffd7);transform:scaleX(0);transform-origin:left;box-shadow:0 0 14px #88fff0}
.cinema-fallback{display:none;position:absolute;inset:0;align-items:center;justify-content:center;font-size:clamp(80px,20vw,180px);font-weight:900;letter-spacing:-.04em;color:#a3eee0}
#eko-cinema.is-reduced .cinema-fallback{display:flex}
#eko-cinema.is-reduced .cinema-stage,#eko-cinema.is-reduced .cinema-caption{display:none}
@media(max-width:640px){.cinema-caption{bottom:25%}.cinema-caption span{font-size:clamp(15px,4vw,22px);letter-spacing:.14em}.cinema-caption b{font-size:10px;letter-spacing:.13em}}
@media(prefers-reduced-motion:reduce){#eko-cinema{transition:opacity .2s}.cinema-progress{display:none}}

/* Suspend expensive glass/backdrop layers while the opaque cinema covers them. */
body.eko-intro-running > :not(#eko-cinema){visibility:hidden!important}
body.eko-intro-running > :not(#eko-cinema),body.eko-intro-running > :not(#eko-cinema) *,body.eko-intro-running > :not(#eko-cinema)::before,body.eko-intro-running > :not(#eko-cinema)::after{animation-play-state:paused!important}
#eko-cinema{outline:none;contain:layout paint}
.cinema-caption,.cinema-progress i{will-change:transform,opacity}