/* Shared by the initial HTML and React so the first paint survives JS loading. */
.launch-screen {
  position: fixed;
  inset: 0;
  z-index: 1000;
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: max(28px, env(safe-area-inset-top)) 24px max(28px, env(safe-area-inset-bottom));
  overflow: auto;
  background: radial-gradient(ellipse at 50% 25%, #163e35 0%, #0b1919 55%, #081112 100%);
  color: #f0faf5;
  text-align: center;
  font-family: "Pretendard", "Apple SD Gothic Neo", "Segoe UI", system-ui, sans-serif;
}
.launch-mark {
  position: relative;
  width: 88px;
  height: 88px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  margin-bottom: 26px;
  border: 1px solid #81e8b35c;
  border-radius: 26px;
  background: linear-gradient(145deg, #2e7659, #13332b);
  box-shadow: 0 14px 50px #4ade801a, inset 0 1px 0 #ffffff26;
  color: #a5f3c7;
  font-size: 54px;
  font-weight: 800;
  font-style: italic;
  line-height: 1;
}
.launch-mark::after {
  content: "";
  position: absolute;
  width: 13px;
  height: 13px;
  right: 10px;
  top: 10px;
  border-radius: 50%;
  background: #d9f88b;
}
.launch-screen h1 { margin: 0; font-size: clamp(32px, 8vw, 42px); font-weight: 750; letter-spacing: -.04em; }
.launch-name { margin: 8px 0 0; color: #9fbdb0; font-size: 14px; letter-spacing: .22em; }
.launch-tagline { margin: 26px 0 42px; color: #bcd4c9; font-size: 15px; line-height: 1.8; word-break: keep-all; }
.launch-loader { width: min(180px, 60vw); height: 3px; overflow: hidden; border-radius: 3px; background: #ffffff1a; }
.launch-loader::after {
  content: "";
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: #8aebba;
  animation: launch-travel 1.4s ease-in-out infinite;
}
.launch-status { margin: 18px 0 0; font-size: 13px; color: #9fbdb0; line-height: 1.7; }
@keyframes launch-travel { 0% { transform: translateX(-110%); } 100% { transform: translateX(340%); } }
@media (prefers-reduced-motion: reduce) { .launch-loader::after { animation: none; width: 100%; opacity: .7; } }
@media (max-height: 480px) {
  .launch-mark { width: 56px; height: 56px; font-size: 34px; border-radius: 18px; margin-bottom: 12px; }
  .launch-tagline { margin: 14px 0 20px; }
}