:root { --bg:#0b0c10; --card:#15171c; --text:#e6e6e6; --muted:#a1a1aa; --accent:#58c4ff; }
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; height:100%; font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial; background:radial-gradient(1200px 800px at 20% -10%, #112 0%, #0b0c10 60%); color:var(--text); }
.container{ max-width:760px; margin:0 auto; padding:24px; }
.card{ background:var(--card); border:1px solid #22262e; border-radius:20px; padding:24px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.row{ display:flex; gap:12px; align-items:center; justify-content:space-between; flex-wrap:wrap; }
h1{ margin:0; font-weight:800; letter-spacing:-.02em; }
.sub{ color:var(--muted); margin:6px 0 18px 0; }
.btn{ cursor:pointer; border:1px solid #2a2f37; background:#1b1f27; color:var(--text); padding:12px 16px; border-radius:12px; font-weight:600; }
.btn.primary{ background:linear-gradient(180deg,#66d1ff,#2aa4ff); color:#001018; border:none; }
.btn[disabled]{ opacity:.6; cursor:not-allowed; }
.pill{ padding:6px 10px; border-radius:999px; background:#101318; border:1px solid #242a33; color:var(--muted); font-size:12px; }
.small{ font-size:12px; color:var(--muted); }
.hero{ text-align:center; padding:26px 0; }
.statusbox{ border:1px solid #2a2f37; border-radius:16px; padding:18px; text-align:center; }
.statusnum{ font-size:64px; font-weight:900; letter-spacing:-.03em; }
.statusname{ font-size:18px; color:var(--muted); margin-top:4px; }
.link{ color:#8fd2ff; text-decoration:underline; }
.code{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--accent); }
.hr{ height:1px; background:#1e222a; margin:16px 0; border:none; }