:root{
  --bg:#070b14;--bg2:#0b1120;--panel:rgba(15,23,42,.82);--card:#0f172a;
  --line:rgba(148,163,184,.22);--text:#e5e7eb;--muted:#94a3b8;--soft:#cbd5e1;
  --cyan:#22d3ee;--green:#34d399;--amber:#fbbf24;--rose:#fb7185;
  --violet:#a78bfa;--blue:#38bdf8;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;min-height:100vh;color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif;
  background:radial-gradient(circle at 8% 0%,rgba(56,189,248,.16),transparent 30%),radial-gradient(circle at 95% 8%,rgba(167,139,250,.14),transparent 32%),linear-gradient(180deg,var(--bg),var(--bg2) 45%,#020617)}
a{color:var(--cyan);text-decoration:none}
a:hover{text-decoration:underline}
.wrap{max-width:1080px;margin:0 auto;padding:0 22px}
.banner{background:linear-gradient(90deg,rgba(251,191,36,.12),rgba(251,113,133,.10));border:1px solid rgba(251,191,36,.35);color:#fde68a;
  font-size:13px;padding:9px 18px;text-align:center;border-radius:10px;margin:18px auto;max-width:1080px}
nav.top{display:flex;align-items:center;gap:18px;padding:16px 22px;max-width:1080px;margin:0 auto;flex-wrap:wrap}
nav.top .logo{font-weight:800;font-size:17px;color:#fff;letter-spacing:.5px}
nav.top .logo span{color:var(--cyan)}
nav.top .links{margin-left:auto;display:flex;gap:16px;font-size:14px}
nav.top .links a{color:var(--soft)}
nav.top .links a.on{color:var(--cyan);font-weight:700}
h1{font-size:clamp(1.6rem,3.6vw,2.4rem);margin:.4em 0 .3em}
h2{font-size:1.25rem;margin:1.4em 0 .5em;color:#fff}
p{line-height:1.8;color:var(--soft)}
.sub{color:var(--muted);font-size:15px}
.hero{padding:34px 0 10px;text-align:center}
.hero .tag{display:inline-block;font-size:12px;letter-spacing:2px;color:var(--cyan);border:1px solid rgba(34,211,238,.4);border-radius:999px;padding:4px 14px;margin-bottom:10px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px;margin:22px 0}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px;transition:.2s}
.card:hover{border-color:var(--cyan);transform:translateY(-3px)}
.card h3{margin:.2em 0 .4em;font-size:17px;color:#fff}
.card .pill{display:inline-block;font-size:11px;border-radius:999px;padding:3px 10px;margin-bottom:8px}
.pill.pending{background:rgba(148,163,184,.15);color:var(--muted)}
.pill.live{background:rgba(52,211,153,.15);color:var(--green)}
.legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin:14px 0}
.dot{width:11px;height:11px;border-radius:50%;display:inline-block;margin-right:5px;vertical-align:-1px}
footer{border-top:1px solid var(--line);margin-top:44px;padding:22px;font-size:12.5px;color:var(--muted);text-align:center;line-height:1.9}
table.tb{width:100%;border-collapse:collapse;font-size:13.5px;margin:14px 0}
table.tb th,table.tb td{border:1px solid var(--line);padding:9px 12px;text-align:left}
table.tb th{background:rgba(148,163,184,.08);color:#fff}
.mono{font-family:Consolas,Menlo,monospace;font-size:12.5px}
.note{background:rgba(56,189,248,.07);border:1px solid rgba(56,189,248,.3);border-radius:10px;padding:12px 16px;font-size:13.5px;color:var(--soft);margin:14px 0}
.steps{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.steps .st{flex:1;min-width:130px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:12.5px}
.steps .st b{display:block;color:#fff;font-size:13px;margin-bottom:2px}
.steps .st .g{color:var(--muted)}
