:root {
  color-scheme: dark;
  background: #000;
  color: #f2eee5;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100svh; display: flex; flex-direction: column; }
main { flex: 1; display: grid; place-items: center; padding: 64px 24px; }
.announcement { width: min(100%, 1040px); text-align: center; }
h1 { margin: 0; font-size: clamp(40px, 10.3vw, 140px); font-weight: 300; line-height: 1.15; letter-spacing: .035em; text-transform: uppercase; }
.coming { margin: 48px 0 0; color: #b8b0d7; font-size: 15px; letter-spacing: .045em; }
footer { padding: 0 20px 28px; text-align: center; }
.studio-mark { display: flex; align-items: center; justify-content: center; gap: clamp(16px, 1.3vw, 24px); margin: 0 auto 20px; }
.studio-emblem, .studio-wordmark { position: relative; overflow: hidden; flex: none; }
.studio-mark img { position: absolute; display: block; max-width: none; height: auto; }
.studio-emblem { width: clamp(44px, 3.6vw, 64px); aspect-ratio: 44 / 54; }
.studio-emblem img { width: 295.4545%; left: -97.7273%; top: -38.8889%; }
.studio-wordmark { width: clamp(220px, 18vw, 320px); aspect-ratio: 220 / 62; }
.studio-wordmark img { width: 140.9091%; left: -19.5455%; top: -345.1613%; }
footer p { margin: 0; color: #8c929c; font-size: 11px; }
@media (max-width: 480px) {
  main { padding: 72px 20px; }
  .coming { margin-top: 36px; font-size: 14px; }
}

.game-title { position: relative; aspect-ratio: 10 / 1; }
.game-logo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 44%; }

/* Match the raster logos’ near-black backgrounds to the page. */
.studio-mark img, .game-logo { filter: brightness(.97) contrast(1.08); }