/* Bright, brief retro-future departure. No free camera controls. */
.launch-title{position:fixed;inset:0;z-index:51;padding:0;will-change:transform,opacity}
.launch-title button{padding:0;width:min(87vw,1060px);font-size:inherit;display:flex;flex-direction:column;align-items:center;gap:28px;outline-offset:12px}
.title-logo{display:block;width:100%;height:auto;max-height:62svh;object-fit:contain}
.launch-invite{font-size:10px;line-height:1;letter-spacing:4px;font-weight:400;color:#bbd6e4;opacity:.75;transition:opacity .3s}
.launch-title button:hover .launch-invite{opacity:1}
.opening-galaxy{position:fixed;inset:0;z-index:49;background:#02040bed;pointer-events:none;overflow:hidden;will-change:opacity}
.opening-galaxy[hidden]{display:none}
.milky-way{position:absolute;inset:-35%;background:radial-gradient(ellipse at 44% 50%,#67c8ff14,transparent 22%),radial-gradient(ellipse at 58% 48%,#e964b512,transparent 30%),radial-gradient(ellipse at 50% 50%,#294b7126,transparent 48%);transform:rotate(-24deg) scaleY(.42);filter:blur(15px)}
.milky-way:after{content:'';position:absolute;inset:12%;background-image:radial-gradient(#94cbef55 .5px,transparent 1px),radial-gradient(#f9d2e733 .7px,transparent 1.2px);background-size:37px 41px,61px 67px;mask-image:radial-gradient(ellipse,black,transparent 65%)}
.speed-star{position:absolute;left:50%;top:50%;width:2px;height:2px;border-radius:50%;background:#baf0ff;opacity:0;box-shadow:0 0 8px #5ccaff;transform:rotate(var(--angle)) translateX(20px);transform-origin:0 0}
.intro-running .speed-star{animation:warp-speed 1.05s var(--delay) cubic-bezier(.4,0,.9,.35) both}
.speed-star:nth-child(4n){background:#ff99d0;box-shadow:0 0 8px #ff56bb}
.launch-flash{position:absolute;inset:0;background:radial-gradient(ellipse,#a1e7ff35,transparent 60%);opacity:0}
.intro-running .launch-flash{animation:departure-flash 1.15s ease-out both}
.intro-running .launch-title button{animation:retro-title 2.2s cubic-bezier(.12,.7,.2,1) both}
.quiet-star{position:absolute;width:2px;height:2px;background:#c5e9ff;border-radius:50%;box-shadow:0 0 7px #89d7ff;animation:quiet-twinkle 4.5s var(--delay) ease-in-out infinite}
.quiet-star:nth-child(3n){background:#ffc4e2}
.intro-unfolding .launch-invite{opacity:0}
.intro-waiting .fairy-light{opacity:0!important}
#replay-intro{font-size:18px;min-width:44px;padding:8px}
.camera-controls{display:none!important}
.cos-reveal{position:absolute;inset:0;pointer-events:none;display:grid;place-items:center;opacity:0;transform:scale(.88);transition:opacity .18s,transform .45s;z-index:0}
.cos-reveal img{width:min(90%,660px);height:90%;object-fit:contain;opacity:.62;filter:drop-shadow(0 0 30px #397eb52a)}
.cos-reveal.visible{opacity:1;transform:scale(1)}
.cos-departure .camera-scene{z-index:1}
#universe.cos-departure .world.selected .art{transform:none;scale:1;filter:none}
#universe.cos-departure .world:not(.selected){opacity:.65}
.world-arrival[data-world=COS] .world-intro{animation:cos-arrival .9s ease-out}
.environment.cos .field{background:radial-gradient(ellipse at 50% 35%,#327dc321,transparent 50%)}
@keyframes warp-speed{0%{opacity:0;transform:rotate(var(--angle)) translateX(8px) scaleX(1)}20%{opacity:.8}70%{opacity:.9;transform:rotate(var(--angle)) translateX(var(--distance)) scaleX(55)}100%{opacity:0;transform:rotate(var(--angle)) translateX(100vmax) scaleX(90)}}
@keyframes departure-flash{0%,45%{opacity:0}58%{opacity:.6}100%{opacity:0}}
@keyframes retro-title{0%,8%{opacity:0;transform:scale(.025)}25%{opacity:.35;transform:scale(.12)}52%{opacity:1;transform:scale(.48)}82%{opacity:1;transform:scale(.9)}100%{opacity:1;transform:scale(1)}}
@keyframes quiet-twinkle{0%,100%{opacity:.18;scale:.8}50%{opacity:.75;scale:1.3}}
@keyframes cos-arrival{from{opacity:0;transform:scale(1.15)}to{opacity:1;transform:scale(1)}}
@media(max-width:900px){.launch-title button{width:94vw;gap:25px}.title-logo{max-height:52svh}.launch-invite{font-size:9px;letter-spacing:3px}.milky-way{filter:blur(8px)}.cos-reveal img{width:98%;height:75%}}
@media(prefers-reduced-motion:reduce){.speed-field,.launch-flash{display:none}.quiet-star,.intro-running .launch-title button{animation:none!important}.cos-reveal{transition:none}.launch-title,.opening-galaxy{will-change:auto}}

.cos-departure .camera-scene{animation:cos-fold .58s ease-in forwards}
.cos-departure .cos-reveal img{animation:cos-house .58s ease-out forwards}
@keyframes cos-fold{0%,48%{opacity:1}82%{opacity:.6}100%{opacity:0}}
@keyframes cos-house{from{transform:scale(.88);filter:brightness(.75)}to{transform:scale(1.1);filter:brightness(1.2)}}
@media(prefers-reduced-motion:reduce){.cos-departure .camera-scene,.cos-departure .cos-reveal img{animation:none!important}}

/* Branding is shared with the opening; controls describe their action. */
header{align-items:center}
.brand-heading{margin:0;line-height:0;flex-shrink:0}
.brand-heading img{display:block;width:190px;height:auto}
header nav{align-items:center}
#motion,#replay-intro{width:auto;min-width:64px;min-height:44px;padding:10px 14px;font-size:9px;letter-spacing:1.5px}
.launch-title button:focus-visible{outline:none}
.launch-title button:focus-visible .title-logo{filter:drop-shadow(0 0 10px #64d7ffa0) drop-shadow(0 0 22px #ff71c75c)}
.launch-title button:focus-visible .launch-invite{color:#fff;opacity:1;text-decoration:underline;text-underline-offset:6px}
@media(max-width:900px){header{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand-heading img{width:140px}header nav{position:static;margin:0;gap:5px;flex-wrap:nowrap}#motion,#replay-intro{min-width:55px;padding:8px 9px;font-size:8px;letter-spacing:1px}}
@media(max-width:360px){.brand-heading img{width:120px}header{gap:8px}}

.brand-heading button{background:none;border:0;padding:0;display:block;line-height:0;border-radius:0}
.brand-heading button:focus-visible{outline:none;filter:drop-shadow(0 0 7px #65d5ff)}
header nav[hidden]{display:none!important}
.page-inactive *,#universe.scene-inactive *, .world.offscreen *{animation-play-state:paused!important}

.intro-unfolding .launch-title button{animation:none;transform:scale(1)}
.intro-unfolding .speed-star{animation:warp-speed .7s var(--delay) ease-in both}

/* Start on the finished logo; the velocity burst belongs to the tap. */
.intro-waiting .launch-title button{animation:none;opacity:1;transform:none}
.intro-unfolding .launch-flash{animation:departure-flash .75s ease-out both}
