/* Immediate, fully opaque loading shell. The orb's charge follows verified work. */
.game-preloader{--charge:0;position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;color:#ecf6ff;font-family:'Bahnschrift','Arial Narrow',Arial,sans-serif;background:radial-gradient(ellipse at 50% 48%,#102f3d 0%,#081622 39%,#02060c 76%);isolation:isolate;transition:opacity .38s ease}
.game-preloader::before{content:'';position:absolute;inset:0;z-index:-1;opacity:.38;background-image:radial-gradient(circle,#99dfff80 1px,transparent 1.5px),radial-gradient(circle,#d3f4ff70 1px,transparent 1.5px);background-size:107px 113px,173px 157px;background-position:11px 27px,67px 101px;mask-image:linear-gradient(transparent,#000 26%,#000 73%,transparent)}
.game-preloader::after{content:'';position:absolute;inset:18px;z-index:-1;pointer-events:none;border:1px solid #42758c45;clip-path:polygon(0 0,24% 0,24% 1px,1px 1px,1px 24%,0 24%,0 76%,1px 76%,1px calc(100% - 1px),24% calc(100% - 1px),24% 100%,76% 100%,76% calc(100% - 1px),calc(100% - 1px) calc(100% - 1px),calc(100% - 1px) 76%,100% 76%,100% 24%,calc(100% - 1px) 24%,calc(100% - 1px) 1px,76% 1px,76% 0,100% 0,100% 100%,0 100%)}
.loader-content{position:relative;width:min(88vw,690px);text-align:center;display:flex;align-items:center;flex-direction:column}
.loader-brand{display:block;width:min(76vw,510px);height:auto;max-height:140px;object-fit:contain;margin:-8px 0 1vh;filter:drop-shadow(0 8px 22px #000b)}
.loader-eyebrow{font-size:10px;line-height:1;letter-spacing:4px;color:#79b8cf;font-weight:600;margin-bottom:7px}
.loader-orb{position:relative;width:min(49vh,440px,74vw);aspect-ratio:1;flex:none;isolation:isolate;margin:4px 0 1px}
.loader-orb::before{content:'';position:absolute;inset:3%;border-radius:50%;background:radial-gradient(circle,#e0631312 20%,#ff6b1722 43%,#35baff10 58%,transparent 71%);box-shadow:0 0 calc(20px + var(--charge)*45px) #ff621222;transform:scale(calc(.96 + var(--charge)*.06));transition:transform .4s ease}
.loader-orb-art{position:absolute;inset:3.5%;width:93%;height:93%;object-fit:contain;filter:brightness(calc(.35 + var(--charge)*.73)) saturate(calc(.35 + var(--charge)*.75));transition:filter .3s ease;user-select:none;pointer-events:none}
.loader-core-glow{position:absolute;left:44%;top:32%;width:12%;aspect-ratio:1;border-radius:50%;background:#ffe4a6;box-shadow:0 0 14px 5px #ff9b34,0 0 40px 12px #ff681a;mix-blend-mode:screen;opacity:calc(.06 + var(--charge)*.34);animation:loaderCorePulse 2.2s ease-in-out infinite}
.loader-charge-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.loader-charge-track{fill:none;stroke:#6cc6dd24;stroke-width:.65}
.loader-charge-fill{fill:none;stroke:#ffb950;stroke-width:1;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:calc(100 - var(--charge)*100);filter:drop-shadow(0 0 3px #ff871f);transition:stroke-dashoffset .3s ease}
.loader-orbit{position:absolute;inset:-1%;border-radius:50%;border:1px dashed #4ea2be40;animation:loaderOrbit 28s linear infinite}
.loader-orbit::before,.loader-orbit::after{content:'';position:absolute;left:49%;top:-2px;width:6px;height:6px;background:#b9f3ff;box-shadow:0 0 15px 3px #37beff;border-radius:50%}
.loader-orbit::after{top:auto;bottom:-2px;background:#ffba56;box-shadow:0 0 15px 3px #ff8e21}
.loader-counter{display:flex;justify-content:center;align-items:baseline;gap:5px;color:#fff0d0;font-size:clamp(40px,5.2vh,64px);line-height:1;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-2px;text-shadow:0 0 24px #ff851c55;margin-top:8px}
.loader-counter small{font-size:.37em;letter-spacing:0;color:#bcb299}
.loader-heading{font-size:clamp(12px,1.6vh,17px);font-weight:800;letter-spacing:3px;line-height:1.2;margin:8px 0 8px;color:#e4f7ff}
.loader-energy-track{width:min(74vw,380px);height:5px;border:1px solid #2c5b6b;background:#061018;margin:5px 0 14px;position:relative;box-shadow:0 0 15px #126ba328;overflow:hidden}
.loader-energy-track i{display:block;height:100%;width:100%;transform:scaleX(var(--charge));transform-origin:left;transition:transform .3s ease;background:linear-gradient(90deg,#ce5117,#ffdc7c);box-shadow:0 0 12px #ff8d22}
.loader-status{font-size:12px;letter-spacing:.45px;line-height:1.4;color:#a9c6d4;min-height:18px;margin:0}
.loader-retry{margin-top:17px;padding:12px 30px;border:1px solid #ffb153;background:linear-gradient(#382818,#161a20);color:#ffe2ae;letter-spacing:2px;font-size:12px;font-weight:800;box-shadow:inset 0 0 20px #dd691915,0 0 18px #ff942318;clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px)}
.loader-retry:hover,.loader-retry:focus-visible{background:#61381d;color:#fff}
.game-preloader[data-state=failed] .loader-orbit,.game-preloader[data-state=failed] .loader-core-glow{animation-play-state:paused}
.game-preloader[data-state=failed] .loader-heading{color:#ffc082}
.game-preloader[data-state=charged] .loader-orb{filter:drop-shadow(0 0 18px #ff952244)}
.game-preloader[data-state=leaving]{opacity:0;pointer-events:none}
@keyframes loaderOrbit{to{transform:rotate(360deg)}}
@keyframes loaderCorePulse{50%{filter:brightness(1.3);transform:scale(1.05)}}
.loader-reduced *{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){.game-preloader *{animation:none!important;transition:none!important}}
@media(max-width:600px){.game-preloader::after{inset:11px}.loader-brand{margin:0 0 2vh;width:85vw;max-height:115px}.loader-orb{width:min(72vw,41vh)}.loader-eyebrow{font-size:8px;letter-spacing:2.5px}.loader-content{width:90vw}.loader-heading{letter-spacing:2px}.loader-status{font-size:11px}.loader-counter{margin-top:16px}}
@media(max-height:620px) and (min-aspect-ratio:1/1){.loader-content{width:min(94vw,920px);display:grid;grid-template-columns:42% 58%;grid-template-rows:auto;column-gap:10px}.loader-brand{grid-column:2;grid-row:1;width:80%;max-height:85px;justify-self:center;margin:0}.loader-eyebrow{grid-column:2;grid-row:2;font-size:8px;margin-top:4px}.loader-orb{grid-column:1;grid-row:1/10;width:min(68vh,37vw);margin:0}.loader-counter,.loader-heading,.loader-energy-track,.loader-status,.loader-retry{grid-column:2;justify-self:center}.loader-counter{margin-top:13px}.loader-energy-track{max-width:80%;margin-bottom:10px}.loader-heading{font-size:12px}}

/* Retry remains fully visible on shorter screens. */
.game-preloader[data-state=failed] .loader-orb{width:min(35vh,330px,62vw)}
.game-preloader[data-state=failed] .loader-brand{max-height:105px}

/* Keep the entry action in the layout while assets load, so charging never resizes the orb or shifts the stack. */
.game-preloader[data-state=loading] [data-loader-enter][hidden]{display:inline-flex!important;visibility:hidden;pointer-events:none}

/* The film borrows only the reserved action slot; the original charging layout stays intact. */
.game-preloader[data-cinematic-active="true"] [data-loader-enter][hidden]{display:inline-flex!important;visibility:hidden;pointer-events:none}

/* One opaque handoff surface sits inside the existing loader. Before the film
   exits it hides the charged illustration; then the HUD starts beneath black. */
.loader-blackout{position:absolute;inset:0;z-index:3;background:#000;opacity:0;pointer-events:none;transition:opacity .22s ease}
.game-preloader[data-cinematic-handoff=covering] .loader-blackout{opacity:1}
.game-preloader[data-cinematic-handoff=black] .loader-blackout{opacity:1;transition:none}
.game-preloader[data-cinematic-handoff=black] .loader-content{visibility:hidden}
.game-preloader.loader-reduced{transition:none}
@media(prefers-reduced-motion:reduce){.game-preloader{transition:none}}

/* Reserve a real toolbar row. The orb flexes into the remaining space instead of
   letting the logo or a recovery button drift behind the cinematic controls. */
.game-preloader[data-cinematic-active="true"]{box-sizing:border-box;padding-top:calc(max(12px,env(safe-area-inset-top)) + 60px);padding-bottom:max(18px,env(safe-area-inset-bottom))}
.game-preloader[data-cinematic-active="true"][data-state="failed"] [data-loader-enter]{display:none!important}
.game-preloader[data-cinematic-active="true"][data-state="failed"] .loader-retry{min-height:48px;margin-top:12px}
@media(max-width:600px) and (orientation:portrait){
 .game-preloader[data-cinematic-active="true"] .loader-content{
  width:90vw;height:100%;max-height:760px;min-height:0;display:grid;grid-template-columns:100%;
  grid-template-rows:clamp(66px,13svh,115px) auto minmax(0,1fr) auto auto auto auto auto;
  justify-items:center;align-items:center;row-gap:5px
 }
 .game-preloader[data-cinematic-active="true"] .loader-brand{grid-row:1;width:85vw;height:100%;max-height:none;margin:0}
 .game-preloader[data-cinematic-active="true"] .loader-eyebrow{grid-row:2;margin:0;font-size:8px;letter-spacing:2px;line-height:1.3}
 .game-preloader[data-cinematic-active="true"] .loader-orb{grid-row:3;width:auto;height:100%;max-height:min(72vw,440px);min-height:0;margin:0;align-self:center}
 .game-preloader[data-cinematic-active="true"] .loader-counter{grid-row:4;margin:3px 0 0;font-size:clamp(38px,5.2svh,54px)}
 .game-preloader[data-cinematic-active="true"] .loader-heading{grid-row:5;margin:3px 0;font-size:clamp(11px,1.8svh,15px);letter-spacing:2px}
 .game-preloader[data-cinematic-active="true"] .loader-energy-track{grid-row:6;margin:3px 0 8px}
 .game-preloader[data-cinematic-active="true"] .loader-status{grid-row:7;width:100%;min-height:0;margin:0;font-size:11px;line-height:1.4}
 .game-preloader[data-cinematic-active="true"] [data-loader-enter],
 .game-preloader[data-cinematic-active="true"] .loader-retry{grid-row:8;width:min(300px,86vw);min-height:48px;margin-top:8px;padding:12px 16px}
}
@media(max-height:620px) and (min-aspect-ratio:1/1){
 .game-preloader[data-cinematic-active="true"] .loader-content{max-height:100%;row-gap:2px}
 .game-preloader[data-cinematic-active="true"] .loader-orb{width:min(calc(100svh - 110px),34vw);margin:0}
 .game-preloader[data-cinematic-active="true"] .loader-brand{max-height:min(18svh,78px)}
 .game-preloader[data-cinematic-active="true"] .loader-counter{margin-top:3px;font-size:clamp(30px,7svh,42px)}
 .game-preloader[data-cinematic-active="true"] .loader-heading{margin:3px 0;font-size:11px}
 .game-preloader[data-cinematic-active="true"] .loader-energy-track{margin:3px 0 5px}
 .game-preloader[data-cinematic-active="true"] .loader-status{font-size:10px;line-height:1.3}
 .game-preloader[data-cinematic-active="true"] [data-loader-enter],
 .game-preloader[data-cinematic-active="true"] .loader-retry{margin-top:6px;min-height:42px;padding:10px 18px;font-size:11px}
}
