:root {
    color-scheme: dark;
    --bg: #07111f;
    --panel: #101d2d;
    --border: #263b52;
    --text: #eaf2fa;
    --muted: #91a4b8;
    --accent: #51d5ad;
    --danger: #ff6b7a;
}

* { box-sizing: border-box; }

body {
    min-height: 100vh;
    margin: 0;
    display: grid;
    place-items: center;
    padding: 24px;
    background: radial-gradient(circle at top, #132b43, var(--bg) 55%);
    color: var(--text);
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

.panel {
    width: min(560px, 100%);
    padding: 40px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: rgba(16, 29, 45, .96);
    box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
}

.panel-wide { width: min(880px, 100%); }
h1 { margin: 6px 0 18px; font-size: clamp(28px, 5vw, 42px); }
.eyebrow { margin: 0; color: var(--accent); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.muted { color: var(--muted); }
.summary { margin: 22px 0; padding: 14px 16px; border-left: 4px solid; background: #0b1725; }
.ok { color: var(--accent); }
.error { color: var(--danger); }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 12px; border-bottom: 1px solid var(--border); text-align: left; }
th { color: var(--muted); font-size: 12px; text-transform: uppercase; }
.badge { font-weight: 800; }

@media (max-width: 640px) {
    .panel { padding: 24px; }
    th:nth-child(3), td:nth-child(3) { display: none; }
}
