:root { --bg:#f6f5f2; --fg:#16161a; --muted:#5d5d66; --card:#ffffff; --line:#e3e1dc; --accent:#0a66d8; }
@media (prefers-color-scheme: dark) { :root { --bg:#121214; --fg:#f2f2f4; --muted:#a4a4ad; --card:#1c1c20; --line:#2c2c32; --accent:#5aa2ff; } }
* { box-sizing: border-box; }
body { margin:0; min-height:100vh; display:flex; flex-direction:column; background:var(--bg); color:var(--fg);
  font: 17px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
main { flex:1; width:100%; max-width:560px; margin:0 auto; padding:56px 16px 24px; }
h1 { font-size:2.2rem; letter-spacing:-0.02em; margin:0 0 8px; }
.lead { color:var(--muted); margin:0 0 32px; }
a { color:var(--accent); }
.card { display:block; padding:18px 20px; background:var(--card); border:1px solid var(--line); border-radius:14px;
  text-decoration:none; color:inherit; }
.card:hover, .card:focus-visible { border-color:var(--accent); }
.card-title { display:block; font-weight:600; font-size:1.1rem; }
.card-sub { display:block; color:var(--muted); font-size:.95rem; margin-top:2px; }
.soon { color:var(--muted); margin-top:28px; font-size:.95rem; }
footer { text-align:center; color:var(--muted); font-size:.85rem; padding:24px 16px; }
.note { display:inline-block; margin-top:6px; font-size:.78rem; }
.servertime { color:var(--muted); font-size:.9rem; margin-top:28px; font-variant-numeric:tabular-nums; }
.card + .card { margin-top:12px; }