.status-page { background:radial-gradient(circle at 20% 8%,rgba(0,255,136,.08),transparent 30%),#06070b; }
.status-main { min-height:calc(100vh - 190px); padding-top:clamp(72px,11vw,132px); }
.status-main h1 { max-width:820px; }
.availability { display:grid; grid-template-columns:auto 1fr; align-items:center; gap:24px; margin:52px 0 44px; padding:30px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.availability-mark { width:72px; height:72px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:rgba(255,255,255,.02); }
.availability-mark span { width:18px; height:18px; border-radius:50%; background:var(--muted); box-shadow:0 0 0 9px rgba(152,163,183,.08); }
.availability:has(.operational) .availability-mark span { background:var(--green); box-shadow:0 0 0 9px rgba(0,255,136,.08),0 0 28px rgba(0,255,136,.42); }
.availability:has(.degraded) .availability-mark span { background:var(--amber); }
.availability:has(.outage) .availability-mark span { background:var(--red); }
.availability-message { margin:14px 0 0; color:var(--text); font-size:20px; }
.availability-time { margin:2px 0 0; font-size:13px; }
.status-boundary { display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,6vw,72px); max-width:820px; }
.status-boundary p { margin:0; }
.status-boundary strong { color:var(--text); font-size:13px; letter-spacing:.04em; }
@media (max-width:620px) {
  .availability { grid-template-columns:1fr; gap:18px; margin-top:38px; }
  .availability-mark { width:56px; height:56px; }
  .status-boundary { grid-template-columns:1fr; }
}