/* /status — the public status page (status.php, public/status.js). One calm column: the verdict, FloodRadar's own
   parts, the feeds, the live chart, the hiccups. Colours are the v4 palette's (public/home-v4/chrome.css); the font is
   the site's own Manrope. Light only, like the site's other information pages. */
@font-face{font-family:Manrope;src:url('/public/home-v4/manrope-regular.ttf') format('truetype');font-weight:400 500;font-display:swap}
@font-face{font-family:Manrope;src:url('/public/home-v4/manrope-semibold.ttf') format('truetype');font-weight:600 700;font-display:swap}
@font-face{font-family:Manrope;src:url('/public/home-v4/manrope-extrabold.ttf') format('truetype');font-weight:800;font-display:swap}

.st-body{
  --st-bg:#f3f6fb; --st-panel:#ffffff; --st-panel-2:#eef3fa; --st-line:#d6e0ee;
  --st-fg:#0d1e38; --st-muted:#4f6584; --st-faint:#7a8ca7; --st-accent:#0f8fc4;
  --st-ok:#1f9d63; --st-ok-soft:#d9f2e5; --st-lag:#b97f00; --st-lag-bar:#e3a600; --st-lag-soft:#fff1cc;
  --st-down:#d8414b; --st-down-soft:#fde0e2; --st-none:#c9d4e3; --st-quiet:#a9dcc2;
  --st-font:Manrope,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --st-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  background:var(--st-bg);
}
.st-wrap{max-width:860px;margin:0 auto;padding-block:24px 48px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));
  display:flex;flex-direction:column;gap:28px;font-family:var(--st-font);color:var(--st-fg);font-size:15px;line-height:1.5}
.st-wrap *{box-sizing:border-box}
.st-top{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.st-brand{font-weight:800;font-size:19px;letter-spacing:-.01em}
.st-brand span{color:var(--st-muted);font-weight:500}
.st-updated{font-size:13px;color:var(--st-muted);display:flex;align-items:center;gap:8px}
.st-pulse{width:8px;height:8px;border-radius:50%;background:var(--st-ok);animation:st-p 2.4s infinite}
@keyframes st-p{0%{box-shadow:0 0 0 0 rgba(31,157,99,.55)}70%{box-shadow:0 0 0 8px rgba(31,157,99,0)}100%{box-shadow:0 0 0 0 rgba(31,157,99,0)}}
@media (prefers-reduced-motion:reduce){.st-pulse{animation:none}}

.st-verdict{background:var(--st-panel);border:1px solid var(--st-line);border-radius:16px;padding:22px 22px 18px;display:grid;grid-template-columns:auto 1fr;gap:4px 16px;align-items:center}
.st-lamp{grid-row:span 2;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--st-ok-soft)}
.st-lamp i{width:18px;height:18px;border-radius:50%;background:var(--st-ok)}
.st-verdict.lag .st-lamp{background:var(--st-lag-soft)} .st-verdict.lag .st-lamp i{background:var(--st-lag-bar)}
.st-verdict.down .st-lamp{background:var(--st-down-soft)} .st-verdict.down .st-lamp i{background:var(--st-down)}
.st-verdict.unk .st-lamp{background:var(--st-panel-2)} .st-verdict.unk .st-lamp i{background:var(--st-none)}
.st-verdict h1{margin:0;font-size:clamp(20px,4.4vw,26px);font-weight:800;letter-spacing:-.015em;text-wrap:balance;color:var(--st-fg)}
.st-verdict p{margin:0;color:var(--st-muted)}
.st-lagnote{grid-column:1/-1;margin-top:12px;display:flex;gap:10px;align-items:flex-start;background:var(--st-lag-soft);border-radius:10px;padding:10px 12px;font-size:14px}
.st-lagnote+.st-lagnote{margin-top:6px}
.st-lagnote i{flex:none;margin-top:6px;width:10px;height:10px;border-radius:50%;background:var(--st-lag-bar)}

.st-wrap section h2{margin:0 0 4px;font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--st-muted)}
.st-sub{margin:0 0 12px;font-size:14px;color:var(--st-muted)}
.st-small{margin:8px 0 0;font-size:12px;color:var(--st-faint)}
.st-list{background:var(--st-panel);border:1px solid var(--st-line);border-radius:14px;overflow:hidden}
.st-group{padding:10px 18px 6px;font-size:12px;font-weight:700;color:var(--st-faint);letter-spacing:.06em;text-transform:uppercase;border-top:1px solid var(--st-line);background:var(--st-panel-2)}
.st-group:first-child{border-top:0}
.st-row{padding:14px 18px;border-top:1px solid var(--st-line);display:flex;flex-direction:column;gap:10px}
.st-group+.st-row{border-top:0}
.st-rhead{display:flex;align-items:center;gap:12px;min-width:0}
.st-dot{flex:none;width:12px;height:12px;border-radius:50%;background:var(--st-none)}
.st-dot.ok{background:var(--st-ok);box-shadow:0 0 0 4px var(--st-ok-soft)}
.st-dot.lag{background:var(--st-lag-bar);box-shadow:0 0 0 4px var(--st-lag-soft)}
.st-dot.down{background:var(--st-down);box-shadow:0 0 0 4px var(--st-down-soft)}
.st-rname{font-weight:700;min-width:0}
.st-rname small{display:block;font-weight:500;color:var(--st-muted);font-size:13px}
.st-rstate{margin-left:auto;text-align:right;font-size:13px;font-weight:700;white-space:nowrap;color:var(--st-faint)}
.st-rstate.ok{color:var(--st-ok)} .st-rstate.lag{color:var(--st-lag)} .st-rstate.down{color:var(--st-down)}
.st-rstate small{display:block;font-weight:500;color:var(--st-muted);font-size:12px}
.st-who{margin-left:6px;font-size:11px;font-weight:700;padding:1px 7px;border-radius:999px;background:var(--st-panel-2);color:var(--st-muted)}
.st-strip{display:grid;grid-template-columns:repeat(90,1fr);gap:2px;height:28px}
.st-strip b{border-radius:2px;background:var(--st-ok);opacity:.85;cursor:pointer}
.st-strip b:hover,.st-strip b:focus-visible{opacity:1;outline:2px solid var(--st-accent);outline-offset:1px}
.st-strip b.lag{background:var(--st-lag-bar);opacity:1}
.st-strip b.down{background:var(--st-down);opacity:1}
.st-strip b.none{background:var(--st-none);opacity:1}
.st-strip b.quiet{background:var(--st-quiet);opacity:1}
.st-stripfoot{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--st-faint);font-family:var(--st-mono)}
.st-count{color:var(--st-muted)}
.st-old45{display:none}
@media (max-width:560px){
  .st-strip{grid-template-columns:repeat(45,1fr)}
  .st-strip b:nth-child(-n+45){display:none}
  .st-old{display:none} .st-old45{display:inline}
  .st-row{padding:14px}
}
.st-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:13px;color:var(--st-muted);margin-top:10px}
.st-legend span{display:flex;align-items:center;gap:6px}
.st-legend i{width:10px;height:10px;border-radius:2px;display:inline-block;background:var(--st-ok)}
.st-legend i.lag{background:var(--st-lag-bar)} .st-legend i.down{background:var(--st-down)} .st-legend i.none{background:var(--st-none)} .st-legend i.quiet{background:var(--st-quiet)}

.st-live{background:var(--st-panel);border:1px solid var(--st-line);border-radius:14px;padding:16px 18px 12px}
.st-lh{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.st-tabs{display:flex;gap:6px;flex-wrap:wrap}
.st-tabs button{font:inherit;font-size:13px;font-weight:600;border:1px solid var(--st-line);background:var(--st-panel-2);color:var(--st-muted);padding:5px 11px;border-radius:999px;cursor:pointer}
.st-tabs button[aria-pressed="true"]{background:var(--st-accent);border-color:var(--st-accent);color:#fff}
.st-tabs button:focus-visible{outline:2px solid var(--st-accent);outline-offset:2px}
.st-chartbox{overflow-x:auto}
.st-chart{display:block;width:100%;height:auto;min-width:300px}
.st-chart .g{stroke:var(--st-line);stroke-width:1}
.st-chart .ax{fill:var(--st-faint);font:11px var(--st-mono)}
.st-chart .bar{fill:var(--st-accent);opacity:.75}
.st-chart .gap{fill:var(--st-lag-soft)}
.st-chart .gapl{fill:var(--st-lag);font:600 11px var(--st-font)}
.st-chart .miss{fill:var(--st-none)}
.st-livecap{font-size:13px;color:var(--st-muted);margin:6px 0 0}

.st-inc{background:var(--st-panel);border:1px solid var(--st-line);border-radius:14px;overflow:hidden}
.st-inc article{padding:14px 18px;border-top:1px solid var(--st-line);display:grid;grid-template-columns:120px 1fr;gap:4px 14px}
.st-inc article:first-child{border-top:0}
.st-when{font-family:var(--st-mono);font-size:12px;color:var(--st-muted);padding-top:2px}
.st-inc h3{margin:0;font-size:15px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.st-inc p{margin:0;grid-column:2;font-size:14px;color:var(--st-muted)}
.st-none{margin:0;padding:14px 18px;color:var(--st-muted)}
.st-tag{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:2px 8px;border-radius:999px}
.st-tag.src{background:var(--st-lag-soft);color:var(--st-lag)}
.st-tag.ours{background:var(--st-down-soft);color:var(--st-down)}
.st-tag.done{background:var(--st-ok-soft);color:var(--st-ok)}
.st-tag.open{background:var(--st-panel-2);color:var(--st-muted)}
@media (max-width:480px){.st-inc article{grid-template-columns:1fr}.st-inc p{grid-column:1}}
.st-foot{font-size:13px;color:var(--st-faint);text-align:center;margin:0}
.st-foot a{color:var(--st-accent)}
#st-tip{position:fixed;z-index:50;pointer-events:none;background:var(--st-fg,#0d1e38);color:#fff;font:12px/1.4 Manrope,system-ui,sans-serif;padding:7px 10px;border-radius:8px;max-width:240px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
