:root { color-scheme: dark; --bg:#08080b; --text:#f5f6f8; --muted:#9ca0ad; --line:rgba(255,255,255,.12); --positive:#63e99a; }
* { box-sizing: border-box; }
html, body { min-width: 320px; min-height: 100%; margin: 0; background: var(--bg); color: var(--text); font-family: -apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",sans-serif; }
body { background: radial-gradient(circle at 25% 0%,rgba(154,130,255,.13),transparent 35%),linear-gradient(180deg,#08080b,#050507); }
a { color: inherit; }
.status-shell { width: min(980px,calc(100% - 36px)); margin: 0 auto; padding: max(32px,calc(22px + env(safe-area-inset-top))) 0 max(60px,calc(40px + env(safe-area-inset-bottom))); }
.status-nav { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:72px; }
.brand-link { color:#fff; font-weight:750; text-decoration:none; }
.status-actions { display:flex; gap:8px; }
.glass { border:1px solid var(--line); background:rgba(255,255,255,.055); -webkit-backdrop-filter:blur(22px); backdrop-filter:blur(22px); }
.status-hero { margin-bottom:34px; }
.status-hero .label { color:#9a82ff; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; }
.status-hero h1 { max-width:760px; margin:14px 0; font-size:clamp(45px,8vw,86px); line-height:.98; letter-spacing:-.06em; }
.status-hero p { max-width:680px; color:var(--muted); font-size:18px; line-height:1.65; }
.status-summary { display:flex; align-items:center; gap:11px; width:max-content; max-width:100%; margin-top:26px; padding:12px 16px; border-radius:999px; }
.status-summary::before { content:""; width:9px; height:9px; border-radius:50%; background:var(--positive); box-shadow:0 0 16px rgba(99,233,154,.7); }
.status-summary[data-status="offline"]::before { background:#ff819e; }
.status-list { display:grid; gap:12px; }
.status-item { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:22px; border-radius:22px; }
.status-item h2 { margin:0; font-size:18px; }
.status-item p { margin:7px 0 0; color:var(--muted); line-height:1.55; }
.status-badge { flex:0 0 auto; display:inline-flex; align-items:center; gap:7px; padding:8px 11px; border-radius:999px; background:rgba(255,255,255,.06); font-size:12px; }
.status-badge::before { content:""; width:7px; height:7px; border-radius:50%; background:#63e99a; }
.status-badge[data-status="external"]::before { background:#68c9ff; }
.status-badge[data-status="development"]::before { background:#ffca68; }
.status-footer { display:flex; justify-content:space-between; gap:18px; margin-top:28px; color:var(--muted); font-size:13px; }
@media(max-width:620px){.status-nav{margin-bottom:48px}.status-item{align-items:flex-start;flex-direction:column}.status-footer{flex-direction:column}.status-hero h1{font-size:49px}}
