/* ─── status.css — network status board (BTCServers charter) ──────────── */
.stat{padding:clamp(26px,4.5vw,52px) 0 84px}
.stat-head{text-align:center;max-width:660px;margin:6px auto 28px}
.stat-h1{font:800 clamp(30px,4.6vw,46px)/1.04 var(--exp);letter-spacing:-.03em;color:var(--ink);margin:12px 0 12px}
.stat-sub{font:400 16px/1.6 var(--disp);color:var(--muted);max-width:560px;margin:0 auto}
.statusboard{max-width:940px;margin:0 auto}

/* overall status banner */
.stb-hero{display:flex;align-items:center;gap:18px;padding:20px 24px;border-radius:var(--r-l);
  background:radial-gradient(130% 180% at 0% 0%,rgba(34,192,122,.12),transparent 58%),linear-gradient(180deg,#fff,var(--card-2));
  box-shadow:var(--sh-2),inset 0 0 0 1px rgba(34,192,122,.16);position:relative;overflow:hidden}
.stb-led{position:relative;display:grid;place-items:center;width:50px;height:50px;flex:none;border-radius:50%;background:rgba(34,192,122,.13)}
.stb-led::before{content:"";position:absolute;inset:0;border-radius:50%;animation:stbpulse 2.6s var(--ease) infinite}
@keyframes stbpulse{0%{box-shadow:0 0 0 0 rgba(61,220,144,.5)}70%{box-shadow:0 0 0 15px rgba(61,220,144,0)}100%{box-shadow:0 0 0 0 rgba(61,220,144,0)}}
.stb-led .led{width:14px;height:14px}
.stb-hero-tx{flex:1;min-width:0}
.stb-hero-tx b{display:block;font:800 20px/1.15 var(--exp);letter-spacing:-.01em;color:var(--ink)}
.stb-hero-tx span{display:block;margin-top:3px;font:500 13px var(--mono);letter-spacing:.02em;color:var(--muted)}
.stb-badge{display:inline-flex;align-items:center;gap:7px;flex:none;font:700 12px var(--mono);letter-spacing:.14em;color:#0f7a4d;
  padding:9px 15px;border-radius:100px;background:rgba(34,192,122,.10);box-shadow:inset 0 0 0 1.5px rgba(34,192,122,.35)}
.stb-badge .led{width:8px;height:8px}

/* headline metrics */
.stb-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:12px}
.stb-metric{background:var(--card);border-radius:var(--r-m);box-shadow:var(--sh-1);padding:17px 18px;text-align:center}
.stb-metric-v{display:block;font:800 25px/1 var(--exp);color:var(--ink);letter-spacing:-.02em}
.stb-metric:first-child .stb-metric-v{color:var(--o)}
.stb-metric-l{display:block;margin-top:7px;font:600 11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--faint)}

/* section captions */
.stb-panel{margin-top:32px}
.stb-panel-cap{font:700 12px var(--mono);letter-spacing:.16em;color:var(--o-ink);text-transform:uppercase;margin-bottom:13px;display:flex;align-items:center;gap:9px}
.stb-cap-note{color:var(--faint);letter-spacing:.03em;font-weight:600;text-transform:none}

/* component list */
.stb-list{background:var(--card);border-radius:var(--r-l);box-shadow:var(--sh-1);overflow:hidden}
.stb-row{display:grid;grid-template-columns:1fr 210px 58px 132px;align-items:center;gap:18px;padding:15px 22px;border-top:1px solid var(--line-3);transition:background .15s var(--ease)}
.stb-row:first-child{border-top:0}
.stb-row:hover{background:var(--card-2)}
.stb-name{display:flex;align-items:center;gap:11px;font:600 15px var(--disp);color:var(--ink)}
.stb-bars{display:flex;gap:2px;align-items:flex-end;height:24px;justify-content:flex-end}
.stb-bars i{width:3px;height:100%;border-radius:1px;background:linear-gradient(180deg,var(--led-glow),var(--led));box-shadow:0 1px 3px rgba(34,192,122,.22)}
.stb-up{font:700 14px var(--mono);color:var(--ink);text-align:right}
.stb-state{display:flex;align-items:center;gap:7px;justify-content:flex-end;font:600 12px var(--mono);letter-spacing:.05em;color:#0f7a4d}
.stb-state .led{width:8px;height:8px}

/* region health grid */
.reg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(158px,1fr));gap:10px}
.reg{display:flex;align-items:center;gap:9px;padding:13px 15px;background:var(--card);border-radius:var(--r-m);box-shadow:var(--sh-1);transition:transform .18s var(--ease),box-shadow .18s var(--ease)}
.reg:hover{transform:translateY(-2px);box-shadow:var(--sh-2)}
.reg .led{width:8px;height:8px;flex:none}
.reg-code{font:700 11.5px var(--mono);letter-spacing:.05em;color:var(--o-ink)}
.reg-city{flex:1;font:600 13.5px var(--disp);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.reg-up{font:700 11px var(--mono);color:#0f7a4d}

@media (max-width:720px){
  .stb-hero{flex-wrap:wrap;gap:14px}
  .stb-metrics{grid-template-columns:1fr 1fr}
  .stb-row{grid-template-columns:1fr auto auto;gap:12px;padding:14px 16px}
  .stb-bars{display:none}
}
@media (max-width:440px){ .stb-metrics{grid-template-columns:1fr} }