:root {
    color-scheme: dark;
    --bg: #071923;
    --panel: #0d2a38;
    --line: #1c4657;
    --text: #f5f8fa;
    --muted: #9db5c0;
    --accent: #17d4c5;
    --accent-dark: #0aa596;
}

* { box-sizing: border-box; }
body {
    margin: 0;
    min-height: 100vh;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: var(--text);
    background:
        radial-gradient(circle at 85% 15%, rgba(23, 212, 197, .14), transparent 30rem),
        linear-gradient(135deg, #05131c, var(--bg));
}
.shell { width: min(1120px, calc(100% - 48px)); margin: 0 auto; padding: 42px 0 64px; }
.brand { display: flex; gap: 9px; align-items: center; font-size: 1.25rem; letter-spacing: .08em; }
.brand strong { color: var(--accent); }
.hero { padding: 13vh 0 9vh; max-width: 820px; }
.eyebrow { color: var(--accent); text-transform: uppercase; letter-spacing: .18em; font-weight: 700; font-size: .78rem; }
h1 { margin: 16px 0 24px; font-size: clamp(2.7rem, 7vw, 6rem); line-height: .98; letter-spacing: -.055em; }
.intro { max-width: 680px; color: var(--muted); font-size: clamp(1rem, 2vw, 1.3rem); line-height: 1.6; }
.status-card { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--line); }
.status-card > div { display: flex; align-items: center; gap: 14px; padding: 22px 24px; background: rgba(13, 42, 56, .92); }
.status-card small, .status-card strong { display: block; }
.status-card small { margin-bottom: 4px; color: var(--muted); }
.status-dot { width: 11px; height: 11px; border-radius: 50%; background: #f6b84a; box-shadow: 0 0 18px currentColor; }
.status-dot.success { background: var(--accent); color: var(--accent); }
.next { margin-top: 22px; color: var(--muted); }
@media (max-width: 720px) {
    .shell { width: min(100% - 30px, 1120px); padding-top: 26px; }
    .hero { padding: 11vh 0 7vh; }
    .status-card { grid-template-columns: 1fr; }
}