/* One optimized key image; the opening reuses the game renderer on demand. */
#launch-screen,#opening-screen{position:fixed;inset:0;z-index:900;color:#f7f4db;background:#092822;isolation:isolate;overflow:hidden;font-family:inherit}
#launch-screen[hidden],#opening-screen[hidden],.race-transition[hidden],.finish-stretch[hidden]{display:none!important}
.launch-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;z-index:-2}
#launch-screen:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#072b287a,transparent 48%),linear-gradient(0deg,#06231cba,transparent 22%);pointer-events:none}
.launch-top{position:absolute;top:5.5%;left:5%;display:flex;gap:14px;align-items:center;color:#d4ddbc;font:600 clamp(10px,.85vw,13px)/1.3 monospace;letter-spacing:.18em}
.launch-stamp{border:1px solid #d5ee8670;border-radius:50%;display:grid;place-items:center;width:36px;height:36px;color:#e4f08b;font:700 22px/1 serif}
.launch-copy{position:absolute;left:4.8%;top:48%;transform:translateY(-50%);width:39%;max-width:690px}
.launch-copy h1{margin:0}.launch-wordmark{width:100%;height:auto;display:block;filter:drop-shadow(0 7px 0 #142f22) drop-shadow(0 12px 18px #061b16);transform:rotate(-3deg)}
.launch-tagline{margin:20px 0 30px;color:#eff4d6;font-size:clamp(16px,1.5vw,25px);font-weight:600;letter-spacing:.1em}
.launch-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
#launch-screen button{font-family:inherit;cursor:pointer;color:#edf3d5;border:1px solid #adca936e;background:#123e33cf;border-radius:9px;min-height:50px;padding:12px 23px;font-size:clamp(14px,1.1vw,18px);font-weight:700;transition:transform .18s,background .18s}
#launch-screen button:hover{transform:translateY(-2px);background:#31503a}
#launch-screen #launch-play{color:#162b20;background:#e6f783;border:2px solid #f9ffb9;box-shadow:0 4px 0 #769444,0 0 30px #e7f58125;min-width:185px;font-size:clamp(18px,1.4vw,23px)}
#launch-screen button:disabled{opacity:.55;cursor:wait;transform:none}
#launch-screen button:focus-visible,#opening-screen button:focus-visible{outline:3px solid #fff7b2;outline-offset:5px}
#launch-screen #launch-film{display:block;margin-top:25px;padding:0;min-height:30px;background:none;border:0;color:#cadbbd;font-size:13px;font-weight:500}
.launch-status{position:absolute;left:5%;bottom:4%;font-size:12px;color:#bbccbb;letter-spacing:.08em;margin:0}
.launch-course{position:absolute;right:4.5%;bottom:4%;display:flex;align-items:baseline;gap:8px;color:#f5f3d0;text-shadow:0 2px 8px #122516}
.launch-course b{font:italic 800 clamp(28px,3.2vw,54px)/1 sans-serif}.launch-course span{font-size:12px;letter-spacing:.13em}
#opening-screen{background:#071912}
.opening-shade{position:absolute;inset:0;background:linear-gradient(0deg,#071912df,transparent 42%,transparent 75%,#07191266)}
.opening-controls{position:absolute;top:5%;right:4%;display:flex;gap:10px}.opening-controls button{padding:10px 18px;color:#f5f8dd;background:#142a22db;border:1px solid #d9e8ac6e;border-radius:7px;cursor:pointer;font:600 14px inherit;min-height:44px}
.opening-copy{position:absolute;left:6%;bottom:11%;right:6%}.opening-copy p{display:none;margin:0}.opening-copy[data-beat="0"] p:nth-child(1),.opening-copy[data-beat="1"] p:nth-child(2),.opening-copy[data-beat="2"] p:nth-child(3){display:block;animation:film-caption .3s ease-out}
.opening-copy small{display:block;font:600 13px monospace;letter-spacing:.2em;color:#dcf191;margin-bottom:12px}.opening-copy strong{font-size:clamp(26px,4vw,62px);line-height:1.25;font-weight:900;text-shadow:0 3px 14px #132515}
.film-track{position:absolute;left:6%;right:6%;bottom:6%;height:3px;background:#d7e3ac36}.film-track i{display:block;height:100%;background:#dcf187;transform:scaleX(var(--film-progress,0));transform-origin:left;transition:transform .2s linear}
.race-transition{position:fixed;inset:0;z-index:850;display:grid;place-items:center;pointer-events:none;overflow:hidden;color:#eff7c1}
.race-transition>div{padding:24px 5vw;background:linear-gradient(90deg,transparent,#112c25ed 20%,#112c25ed 80%,transparent);text-align:center;width:100%}
.race-transition span{font-weight:600;letter-spacing:.18em;font-size:clamp(11px,1.2vw,18px)}.race-transition strong{display:block;font-size:clamp(36px,6vw,88px);font-weight:900;font-style:italic;line-height:1.5;text-shadow:3px 4px #466135}
.race-transition[data-kind="start"]>div{align-self:start;margin-top:12vh;padding:12px}.race-transition[data-kind="retry"]{color:#eadab2}
.transition-checks{position:absolute;inset:0;background:repeating-conic-gradient(#d5ec7c 0 25%,#163a2e 0 50%) 0 0/80px 80px;transform:translateX(-110%) skewX(-15deg);opacity:.9}
.race-transition.animate[data-kind="start"] .transition-checks{animation:flag-wipe 1.35s ease-in-out both}.race-transition.animate>div{animation:result-arrive 1.35s ease both}.race-transition.animate[data-kind="start"]>div{animation:film-caption 1.35s ease both}
.race-transition.animate[data-kind="finish"]:after{content:'';position:absolute;inset:-15%;background-image:radial-gradient(ellipse,#e4f576 0 2px,transparent 3px),radial-gradient(ellipse,#faf0ab 0 2px,transparent 3px);background-size:93px 129px,151px 99px;background-position:0 0,47px 39px;animation:finish-confetti 1.35s linear both;opacity:.6;z-index:-1}
.finish-stretch{position:fixed;left:50%;top:16%;transform:translateX(-50%);z-index:180;pointer-events:none;background:#19352bd9;color:#e5f596;border:1px solid #d8ed7866;padding:8px 22px;border-radius:5px;font-size:clamp(16px,2vw,26px);font-weight:800;animation:film-caption .2s ease-out}
@keyframes flag-wipe{0%{transform:translateX(-120%) skewX(-15deg)}45%{transform:translateX(0) skewX(-15deg)}100%{transform:translateX(120%) skewX(-15deg)}}
@keyframes film-caption{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@keyframes result-arrive{0%{opacity:0;transform:scale(.92)}18%,72%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.04)}}
@keyframes finish-confetti{from{transform:translateY(-8%);opacity:.8}to{transform:translateY(14%);opacity:0}}
@media(max-aspect-ratio:1/1){.launch-art{object-position:65% 20%;height:62%;}.launch-copy{top:auto;bottom:11%;left:7%;width:86%;transform:none;max-width:600px}.launch-wordmark{width:80%;max-width:480px}.launch-top{top:3%}.launch-tagline{margin:6px 0 16px}.launch-status{bottom:3%;max-width:55%}.launch-course{bottom:3%}#launch-screen:after{background:linear-gradient(0deg,#092822 32%,#092822d9 48%,transparent 75%)}#launch-screen #launch-film{margin-top:12px}}
@media(max-height:500px) and (min-aspect-ratio:1/1){.launch-copy{top:48%;width:40%}.launch-top{top:4%;font-size:9px}.launch-stamp{width:24px;height:24px;font-size:16px}.launch-tagline{font-size:14px;margin:8px 0 14px}#launch-screen button{padding:8px 14px;min-height:40px}#launch-screen #launch-play{min-width:140px;font-size:17px}#launch-screen #launch-film{margin-top:8px;font-size:11px}.launch-status{font-size:10px}.launch-wordmark{max-width:380px}}
@media(prefers-reduced-motion:reduce){.race-transition *,.race-transition:after,.finish-stretch,.opening-copy p{animation:none!important;transition:none!important}.transition-checks{display:none}#launch-screen button{transition:none}}
/* Native opening uses the already-loaded gameplay renderer underneath this transparent layer. */
#opening-screen{background:transparent}
.opening-active #app>*:not(#world){visibility:hidden!important}
#opening-screen:before{content:'';position:absolute;inset:0;background:#0b211c;opacity:0;pointer-events:none}
#opening-screen.shot-cut:before{animation:shot-dissolve .35s ease-out both}
@keyframes shot-dissolve{0%{opacity:.7}100%{opacity:0}}
.launch-copy{top:36%;width:38%}
.launch-tagline{max-width:90%;font-size:clamp(15px,1.3vw,22px);margin:8px 0 22px}
.launch-wordmark{filter:drop-shadow(0 5px 0 #142f22) drop-shadow(0 9px 14px #061b16)}
@media(max-height:500px) and (min-aspect-ratio:1/1){.launch-copy{top:39%;width:38%}.launch-tagline{font-size:13px;margin:5px 0 10px}.launch-actions{gap:8px}#launch-screen #launch-play{min-width:130px}#launch-screen button{padding:7px 11px;font-size:12px}}
@media(max-aspect-ratio:1/1){.launch-copy{top:auto;bottom:11%;width:86%;left:7%}}
.opening-copy[data-beat="1"],.opening-copy[data-beat="2"]{top:15%;bottom:auto}
.opening-copy[data-beat="1"] strong,.opening-copy[data-beat="2"] strong{font-size:clamp(24px,3vw,44px)}
.opening-shade{background:linear-gradient(0deg,#071912b3,transparent 22%,transparent 60%,#0719124d)}
@media(max-height:500px){.opening-copy strong{font-size:27px}.opening-copy small{font-size:10px;margin-bottom:5px}.opening-copy[data-beat="1"],.opening-copy[data-beat="2"]{top:19%}}
@media(prefers-reduced-motion:reduce){#opening-screen.shot-cut:before{animation:none}}
#opening-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#071912;display:none}
#opening-screen.video-mode #opening-video{display:block}
#opening-screen.video-mode .opening-copy,#opening-screen.video-mode .opening-shade{display:none}
#opening-screen.video-mode:before{display:none}
.opening-controls{z-index:3}.film-track{z-index:3}