/* First-paint shell: independent of the game bundle and its font downloads. */
html, body { margin: 0; }
body:has(> #launch-splash) { background: #fbfaff; }
#launch-splash {
  position: fixed; inset: 0; z-index: 2147483000; overflow: auto;
  display: grid; place-items: center; box-sizing: border-box;
  min-height: 100%; padding: max(32px, env(safe-area-inset-top)) 24px max(76px, env(safe-area-inset-bottom));
  color: #282044; background: #fbfaff;
  font-family: 'DM Sans', ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  transition: opacity 220ms ease, visibility 220ms ease;
}
#launch-splash::before {
  content: ''; position: absolute; width: min(88vw, 520px); aspect-ratio: 1;
  top: 50%; left: 50%; transform: translate(-50%, -64%); pointer-events: none;
  background: radial-gradient(ellipse, #e6e0ff 0%, #f2eeff 38%, #fbfaff00 70%);
}
.launch-brand { position: relative; text-align: center; margin: auto; padding: 28px 0; }
.launch-logo { width: 112px; height: 112px; margin: 0 auto 25px; animation: launch-arrive 600ms cubic-bezier(.16,1,.3,1) both; }
.launch-logo img { display: block; width: 100%; height: 100%; filter: drop-shadow(0 15px 19px #6650d32b); }
.launch-brand h1 { font-size: clamp(40px, 11vw, 54px); line-height: 1.12; font-weight: 750; letter-spacing: -2.6px; margin: 0; }
.launch-brand h1 span { color: #7661f4; }
.launch-tagline { font-size: 17px; line-height: 1.5; letter-spacing: .2px; margin: 13px 0 33px; color: #756c8b; }
.launch-track { height: 3px; width: 78px; overflow: hidden; border-radius: 10px; background: #e4def8; margin: auto; }
.launch-track span { display: block; width: 36px; height: 100%; border-radius: inherit; background: #7963ef; animation: launch-flow 1450ms ease-in-out infinite; }
#launch-message { max-width: 270px; margin: 17px auto 0; font-size: 12px; line-height: 1.65; color: #827891; }
.launch-footer { position: absolute; bottom: max(30px, env(safe-area-inset-bottom)); left: 24px; right: 24px; margin: 0; text-align: center; font-size: 10px; font-weight: 650; letter-spacing: 2.3px; color: #9389a6; }
.launch-retry { display: inline-block; margin-top: 18px; padding: 12px 22px; border-radius: 18px; background: #6752e8; color: white; font-size: 14px; font-weight: 650; text-decoration: none; }
.launch-retry[hidden] { display: none; }
.launch-retry:focus-visible { outline: 3px solid #33265f; outline-offset: 5px; }
#launch-splash.launch-leaving { opacity: 0; visibility: hidden; pointer-events: none; }
.launch-noscript { font: 18px/1.6 system-ui, sans-serif; padding: 40px; color: #282044; }
@keyframes launch-arrive { from { opacity: 0; transform: translateY(9px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes launch-flow { 0%,100% { transform: translateX(-22px); opacity: .5; } 50% { transform: translateX(64px); opacity: 1; } }
@media (max-height: 430px) {
  #launch-splash { padding-top: 12px; padding-bottom: 38px; }
  .launch-brand { padding: 8px 0; }
  .launch-logo { width: 64px; height: 64px; margin-bottom: 12px; }
  .launch-brand h1 { font-size: 34px; }
  .launch-tagline { margin: 7px 0 15px; font-size: 14px; }
  #launch-message { margin-top: 8px; }
  .launch-footer { bottom: 12px; font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  #launch-splash { transition: none; }
  .launch-logo, .launch-track span { animation: none; }
  .launch-track span { width: 100%; opacity: .7; }
}