:root { color-scheme: dark; --bg: #040d2a; --text: #f2f6fb; --muted: rgba(235, 240, 250, .66); --glow: #5ab2ff; --line: rgba(190, 215, 255, .18); }
* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0; min-height: 100vh; color: var(--text);
  font: 17px/1.6 -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, sans-serif;
  background: radial-gradient(120% 80% at 50% 0%, #174a9e 0%, #0b2462 45%, #040d2a 100%) fixed;
  padding: 0 max(20px, env(safe-area-inset-left)) 64px max(20px, env(safe-area-inset-right));
}
a { color: var(--glow); }
header { max-width: 720px; margin: 0 auto; padding: 28px 0; display: flex; align-items: center; gap: 14px; }
header a.home { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--text); }
header svg { width: 54px; height: auto; }
.wordmark { font-family: ui-rounded, "SF Pro Rounded", -apple-system, system-ui, sans-serif; font-weight: 600; letter-spacing: -.02em; }
.wordmark .tv { color: var(--glow); }
header .wordmark { font-size: 26px; }
main { max-width: 720px; margin: 0 auto; }
h1 { font-size: 34px; line-height: 1.2; margin: 24px 0 8px; letter-spacing: -.02em; text-wrap: balance; }
h2 { font-size: 21px; margin: 36px 0 8px; }
p, li { color: var(--muted); }
p strong, li strong { color: var(--text); font-weight: 600; }
.updated { font-size: 14px; }
footer { max-width: 720px; margin: 56px auto 0; padding-top: 20px; border-top: 1px solid var(--line); font-size: 14px; color: var(--muted); display: flex; flex-wrap: wrap; justify-content: center; text-align: center; gap: 8px 20px; }
footer a { color: var(--muted); }

.hero { text-align: center; padding: 10vh 0 4vh; }
.hero svg { width: min(300px, 70vw); height: auto; filter: drop-shadow(0 18px 40px rgba(0, 0, 0, .45)); }
.hero .wordmark { display: block; font-size: clamp(56px, 12vw, 104px); line-height: 1; margin-top: 28px; }
.hero p { font-size: 20px; max-width: 34ch; margin: 18px auto 0; text-wrap: balance; }
.links { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; margin-top: 34px; }
.links a { padding: 12px 24px; border-radius: 999px; text-decoration: none; color: var(--text); background: rgba(255, 255, 255, .1); border: 1px solid var(--line); }
.links a:hover, .links a:focus-visible { background: rgba(255, 255, 255, .18); }
.soon { font-size: 15px; margin-top: 18px; }