:root { color-scheme: dark; --bg: #080d16; --fg: #e6edf7; --muted: #9fb0c8; --accent: #5ac8fa; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  background: radial-gradient(ellipse at 50% -10%, #12233d 0%, var(--bg) 60%) no-repeat, var(--bg);
  color: var(--fg);
  font: 1rem/1.6 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  display: grid; place-items: center; min-height: 100vh; padding: 2rem 1rem;
}
main { max-width: 34rem; text-align: center; }
.mark { width: 5rem; height: 5rem; stroke: var(--accent); stroke-width: 3; fill: var(--accent); }
.mark path { fill: none; }
.call { margin: 1rem 0 0; font: 600 0.95rem/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.3em; color: var(--accent); }
h1 { margin: 0.75rem 0 1rem; font-size: clamp(1.75rem, 6vw, 2.5rem); line-height: 1.15; letter-spacing: -0.01em; }
.lead { margin: 0 0 0.5rem; color: var(--muted); }
.note { margin: 0 0 2rem; color: var(--muted); }
.link { color: var(--fg); text-underline-offset: 0.25em; text-decoration-color: var(--accent); }
.link:hover { color: var(--accent); }
.link:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: 2px; }