:root{--paper:#eef1ed;--card:#f9faf8;--ink:#17232b;--muted:#5b6a71;--rule:#d3dad5;--teal:#0e6b63;--teal-soft:#d5e8e4;
--ok:#1f8a5b;--warn:#b7791f;--bad:#be3b2f;--bot:#a8b3ad;--serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
--sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
@media (prefers-color-scheme:dark){:root{--paper:#11191d;--card:#172126;--ink:#e3ebe8;--muted:#8d9fa5;--rule:#26353b;--teal:#45c2b1;--teal-soft:#1c3a38;
--ok:#4cc48a;--warn:#e0a844;--bad:#ef6f61;--bot:#4b5b60}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 var(--sans);font-variant-numeric:tabular-nums}
a{color:var(--teal)}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.muted{color:var(--muted)}
.top{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px max(16px,calc((100% - 1180px)/2)) 10px}
.brand{display:flex;align-items:baseline;gap:10px}
.mark{font:700 22px/1 var(--serif);letter-spacing:.01em}
.sub{color:var(--muted);font-size:14px}
.who{display:flex;align-items:center;gap:14px;font-size:13px}
.who form{margin:0}
button,.btn{font:inherit;cursor:pointer;border-radius:6px;border:1px solid var(--teal);background:var(--teal);color:#fff;padding:8px 16px}
button.ghost{background:transparent;color:var(--ink);border-color:var(--rule);padding:5px 12px;font-size:13px}
.tabs{display:flex;gap:2px;overflow-x:auto;padding:0 max(16px,calc((100% - 1180px)/2));border-bottom:1px solid var(--rule);position:sticky;top:0;background:var(--paper);z-index:2}
.tabs a{padding:10px 14px;text-decoration:none;color:var(--muted);white-space:nowrap;border-bottom:3px solid transparent;margin-bottom:-1px}
.tabs a[aria-current=true]{color:var(--ink);border-bottom-color:var(--teal);font-weight:600}
main{max-width:1180px;margin:0 auto;padding:22px 16px 60px}
section>h2{font:600 22px/1.2 var(--serif);margin:34px 0 4px}
section>h2:first-child{margin-top:0}
.hint{color:var(--muted);margin:0 0 14px;max-width:70ch}
.hero{font:600 34px/1.15 var(--serif);margin:6px 0 2px;letter-spacing:-.01em}
.hero.warn{color:var(--warn)}.hero.crit{color:var(--bad)}
.lede{color:var(--muted);margin:0 0 20px}
.figs{display:flex;flex-wrap:wrap;gap:6px 34px;margin:0 0 26px;padding:14px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.fig b{display:block;font:600 28px/1.1 var(--serif)}
.fig span{font-size:13px;color:var(--muted)}
.fig.bad b{color:var(--bad)}
.notice{border-left:4px solid var(--warn);background:var(--card);padding:10px 14px;margin:0 0 10px;border-radius:0 6px 6px 0}
.notice.crit{border-left-color:var(--bad)}
.notice b{display:block}
.notice span{color:var(--muted);font-size:14px;white-space:pre-line}
.site{display:grid;grid-template-columns:minmax(200px,1.1fr) minmax(220px,1.4fr) repeat(4,minmax(70px,.5fr));gap:8px 18px;align-items:center;padding:14px 12px;border-bottom:1px solid var(--rule);background:var(--card)}
.site:first-of-type{border-top:1px solid var(--rule)}
.site .name{display:flex;gap:10px;align-items:center;min-width:0}
.site .name div{min-width:0}
.site .name strong{display:block;overflow:hidden;text-overflow:ellipsis}
.dot{width:12px;height:12px;border-radius:50%;flex:none;background:var(--bot)}
.dot.up{background:var(--ok)}.dot.slow,.dot.cert-invalid{background:var(--warn)}.dot.down,.dot.route-missing{background:var(--bad)}
.state{font-size:13px;color:var(--muted)}
.state.bad{color:var(--bad)}.state.warn{color:var(--warn)}
.m{font-size:13px;color:var(--muted)}
.m b{display:block;color:var(--ink);font-size:15px;font-weight:600}
svg.strip{width:100%;height:22px;display:block}
.strip .o{fill:var(--ok)}.strip .s{fill:var(--warn)}.strip .x{fill:var(--bad)}.strip .n{fill:var(--rule)}
.sitehead{display:grid;grid-template-columns:minmax(200px,1.1fr) minmax(220px,1.4fr) repeat(4,minmax(70px,.5fr));gap:18px;padding:0 12px 6px;font-size:13px;color:var(--muted)}
.bar{width:100%;height:8px;display:block}
.bar .bg{fill:var(--rule)}.bar .fg{fill:var(--teal)}.bar.warn .fg{fill:var(--warn)}.bar.bad .fg{fill:var(--bad)}
.panel{background:var(--card);border:1px solid var(--rule);border-radius:8px;padding:14px 16px;margin:0 0 16px}
.panel h3{font:600 16px/1.3 var(--serif);margin:0 0 8px}
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px}
.cols>.panel{margin:0}
table.t{width:100%;border-collapse:collapse;font-size:14px}
.t th{font-weight:600;color:var(--muted);text-align:left;padding:6px 8px;border-bottom:1px solid var(--rule);font-size:13px}
.t td{padding:7px 8px;border-bottom:1px solid var(--rule);vertical-align:top}
.t .n{text-align:right;white-space:nowrap}.t th.n{text-align:right}
.t tr:last-child td{border-bottom:0}
.scroll{overflow-x:auto}
.code{font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break:break-all}
.seg{display:inline-flex;border:1px solid var(--rule);border-radius:6px;overflow:hidden;margin:0 8px 12px 0}
.seg button{background:transparent;color:var(--muted);border:0;border-radius:0;padding:6px 12px;font-size:13px}
.seg button[aria-pressed=true]{background:var(--teal);color:#fff}
select{font:inherit;padding:6px 8px;border-radius:6px;border:1px solid var(--rule);background:var(--card);color:var(--ink);margin-bottom:12px}
svg.chart{width:100%;height:auto;display:block;overflow:visible}
.chart text{font:11px var(--sans);fill:var(--muted)}
.chart .grid{stroke:var(--rule);stroke-width:1}
.chart .hum{fill:var(--teal)}.chart .bot{fill:var(--bot)}.chart .att{fill:var(--bad)}.chart .h5{fill:var(--warn)}
.chart .ln{fill:none;stroke:var(--teal);stroke-width:2}.chart .ln.b{stroke:var(--warn)}.chart .ln.c{stroke:var(--bad)}
.chart .c0{fill:var(--bad)}.chart .c1{fill:var(--warn)}.chart .c2{fill:var(--teal)}.chart .c3{fill:#7b6bb0}.chart .c4{fill:var(--bot)}.chart .c5{fill:#3b82a0}.chart .c6{fill:#a35a8c}.chart .c7{fill:var(--ok)}
.legend{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:13px;color:var(--muted);margin:6px 0 0}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}
.legend .hum{background:var(--teal)}.legend .bot{background:var(--bot)}.legend .att{background:var(--bad)}
.pill{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;background:var(--teal-soft);color:var(--ink)}
.pill.crit{background:var(--bad);color:#fff}.pill.warn{background:var(--warn);color:#fff}.pill.ok{background:var(--ok);color:#fff}
.up{color:var(--ok)}.down{color:var(--bad)}
.empty{color:var(--muted);padding:10px 0}
.plain{display:grid;place-items:center;min-height:100vh}
.signin{width:min(380px,92vw);background:var(--card);border:1px solid var(--rule);border-radius:10px;padding:28px}
.signin h1{font:700 30px/1 var(--serif);margin:0 0 6px}
.signin .sub{margin:0 0 18px;display:block}
.signin label{display:block;margin:0 0 14px;font-size:14px;color:var(--muted)}
.signin input{display:block;width:100%;margin-top:4px;padding:10px;font:inherit;border:1px solid var(--rule);border-radius:6px;background:var(--paper);color:var(--ink)}
.signin button{width:100%;padding:10px}
.err{color:var(--bad);margin:0 0 12px}
@media (max-width:860px){
 .site{grid-template-columns:1fr 1fr 1fr 1fr}.site .name,.site .stripbox{grid-column:1/-1}.sitehead{display:none}
 .hero{font-size:27px}
}

.w34{width:34%}.w25{width:25%}.w170{min-width:170px}
.cols{margin-bottom:16px}