
:root{color-scheme:light dark;--bg:#f9f9f7;--surface:#fcfcfb;--ink:#0b0b0b;--ink2:#52514e;--muted:#6b6a65;
--line:#e1e0d9;--edge:#c3c2b7;--link:#0b57d0;--hover:rgba(11,11,11,.04);--good:#0ca30c;--warning:#fab219;
--critical:#d03b3b;--silent:#898781;--on-status:#ffffff;--on-warning:#0b0b0b;--series:#2a78d6;--grid:#e1e0d9;
--axis:#c3c2b7;--cross:#52514e;--shadow:rgba(11,11,11,.10);--s1:#2a78d6;--s2:#eb6834;--s3:#1baf7a}
@media (prefers-color-scheme:dark){:root{--bg:#0d0d0d;--surface:#1a1a19;--ink:#f0efec;--ink2:#c3c2b7;
--muted:#a3a29b;--line:#2c2c2a;--edge:#383835;--link:#8ab4f8;--hover:rgba(255,255,255,.05);--series:#3987e5;
--grid:#2c2c2a;--axis:#383835;--cross:#c3c2b7;--shadow:rgba(255,255,255,.10);--s1:#3987e5;--s2:#d95926;--s3:#199e70}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.4 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--link)}
header.top{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;padding:10px 16px;background:var(--surface);
border-bottom:1px solid var(--line);position:sticky;top:0;z-index:3}
h1{font-size:18px;margin:0;font-weight:600}
h2{font-size:15px;margin:0 0 8px;font-weight:600}
.meta{display:flex;flex-wrap:wrap;gap:6px 16px;align-items:center;color:var(--ink2);font-size:14px}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px}
.num,.mono,.age{font-variant-numeric:tabular-nums}
main{padding:12px 16px 8px}
.banner{margin:0 0 12px;padding:8px 12px;border-left:4px solid var(--critical);background:var(--surface)}
.controls{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;margin:0 0 10px;color:var(--ink2)}
input[type=search]{font:inherit;padding:4px 8px;border:1px solid var(--edge);border-radius:6px;
background:var(--surface);color:var(--ink);width:18em;max-width:100%}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
table{border-collapse:collapse;width:100%}
table.units{min-width:1120px}
table.units td{white-space:nowrap}
table.units td.wrap{white-space:normal;min-width:12em;max-width:22em}
th,td{padding:6px 10px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
th{font-size:12px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;white-space:nowrap}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--hover)}
.st-ok{--st:var(--good)}.st-warn{--st:var(--warning)}.st-crit{--st:var(--critical)}.st-silent{--st:var(--silent)}
.lvl-ok{--st:var(--good)}.lvl-warn{--st:var(--warning)}.lvl-crit{--st:var(--critical)}.lvl-info{--st:var(--silent)}
table.units td:first-child{box-shadow:inset 4px 0 0 var(--st)}
.badge{display:inline-block;min-width:4.6em;padding:1px 6px;border-radius:4px;font-size:12px;font-weight:700;
text-align:center;color:var(--on-status);background:var(--st);letter-spacing:.02em}
.st-warn .badge,.badge.st-warn,.badge.lvl-warn{color:var(--on-warning)}
.cap::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--st);
margin-right:6px}
.hide-silent tr.st-silent,tr.filtered{display:none}
.sub{font-size:12px;color:var(--muted);margin-top:1px}
.name{font-weight:600}
ul.alerts{margin:0;padding:0;list-style:none;font-size:13px}
ul.alerts li::before{color:var(--st);margin-right:4px}
li.lvl-crit::before{content:"\25A0"}li.lvl-warn::before{content:"\25B2"}li.lvl-info::before{content:"\25CB"}
.age{white-space:nowrap}
.bad{color:var(--critical);font-weight:600}
footer{color:var(--muted);font-size:13px;padding:4px 16px 24px}
footer p{margin:4px 0}
section.card{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 16px;
margin:0 0 12px;overflow-x:auto}
dl.facts{display:grid;grid-template-columns:max-content 1fr;gap:3px 16px;margin:0}
dt{color:var(--muted)}dd{margin:0;overflow-wrap:anywhere}
pre.payload{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:12px}
table.small{width:auto}
table.small td,table.small th{padding:3px 8px}
label.bfbox{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;color:var(--ink)}
.bfnote{color:var(--muted);font-size:12px}
.hide-silent tr.st-silent.has-bf{display:table-row}
.hide-silent tr.st-silent.has-bf.filtered{display:none}
.stale{opacity:.55;transition:opacity .2s}
section.plots{overflow:visible;scroll-margin-top:96px}
.plotbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 6px}
.plotbar h2{margin:0}
.seg{display:inline-flex;border:1px solid var(--edge);border-radius:6px;overflow:hidden}
.seg button{font:inherit;font-size:13px;padding:3px 10px;border:0;background:var(--surface);color:var(--ink2);
cursor:pointer}
.seg button+button{border-left:1px solid var(--edge)}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--surface);font-weight:600}
.seg button:focus-visible,figure.chart svg:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.charts{min-height:120px}
figure.chart{position:relative;margin:0 0 4px}
.chead{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 12px;font-size:13px;margin:6px 0 0}
.ctitle{font-weight:600;color:var(--ink)}.cunit,.clatest{color:var(--ink2)}.cnote{color:var(--muted)}
.clatest{font-variant-numeric:tabular-nums}
figure.chart svg{display:block;width:100%;overflow:visible}
svg .grid{stroke:var(--grid);stroke-width:1;shape-rendering:crispEdges}
svg .axis{stroke:var(--axis);stroke-width:1;shape-rendering:crispEdges}
svg .tick{fill:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}
.s1{--c:var(--s1)}.s2{--c:var(--s2)}.s3{--c:var(--s3)}
svg .band{fill:var(--c,var(--series));fill-opacity:.14;stroke:none}
svg .line{fill:none;stroke:var(--c,var(--series));stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
svg .dot{fill:var(--c,var(--series));stroke:var(--surface);stroke-width:2}
svg .dot.pt{stroke:none}
svg .dlabel{fill:var(--ink2);font-size:11px}
svg .cross{stroke:var(--cross);stroke-width:1;shape-rendering:crispEdges}
svg .hit{fill:transparent;cursor:crosshair}
svg .empty{fill:var(--muted);font-size:12px}
.tip{position:absolute;top:22px;z-index:2;pointer-events:none;background:var(--surface);color:var(--ink);
border:1px solid var(--shadow);border-radius:6px;padding:5px 8px;font-size:12px;line-height:1.35;white-space:nowrap;
box-shadow:0 2px 8px var(--shadow)}
.tip strong{font-size:14px;font-variant-numeric:tabular-nums}
.tip .k{display:inline-block;width:12px;height:2px;background:var(--c,var(--series));vertical-align:middle;
margin-right:6px}
.csub{display:flex;flex-wrap:wrap;gap:0 14px;font-size:12px;color:var(--ink2);margin:1px 0 0}
.litem{white-space:nowrap}
.lk{display:inline-block;width:14px;height:2px;background:var(--c);vertical-align:middle;margin-right:5px}
.ogroup{margin:14px 0 0;padding-top:10px;border-top:1px solid var(--line)}
.ogroup h3{font-size:14px;margin:0;font-weight:600}
.ogroup>p.sub{margin:2px 0 2px}
figure.chart.nodata .chead{margin:3px 0 0}
.tip .sub{font-variant-numeric:tabular-nums}
details.ptable summary{cursor:pointer;color:var(--ink2);font-size:13px;margin:6px 0}
details.ptable .tablewrap{max-height:420px;overflow:auto}
details.ptable td,details.ptable th{white-space:nowrap;font-variant-numeric:tabular-nums}
table.nowrap td{white-space:nowrap}
table.nowrap td.wrapcell{white-space:normal;min-width:14em}
figure.chart svg{touch-action:pan-y pinch-zoom;-webkit-user-select:none;user-select:none}
svg .hit{-webkit-tap-highlight-color:transparent}
.navlink{white-space:nowrap}
table.pub{min-width:760px}
table.pub td{white-space:nowrap}
table.pub td.st{font-weight:600}
.pubintro{color:var(--ink2);margin:0 0 10px}
@media (max-width:760px){
header.top{position:static;padding:8px 12px;gap:4px 12px}
main{padding:10px 12px 8px}
footer{padding:4px 12px 24px}
.meta{gap:2px 12px;font-size:13px}
.meta label,.controls label{display:inline-block;padding:10px 0;line-height:24px}
input[type=checkbox]{width:22px;height:22px;margin:0 8px 0 0;vertical-align:middle}
input[type=search]{width:100%;font-size:16px;padding:10px 12px}
.controls{gap:4px 14px}
.tablewrap.cardwrap{border:0;background:none;overflow:visible;border-radius:0}
table.cards{min-width:0}
table.cards thead{display:none}
table.cards,table.cards tbody{display:block}
table.cards tbody tr{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;background:var(--surface);
border:1px solid var(--line);border-radius:8px;padding:8px 12px 12px 16px;margin:0 0 10px}
table.units.cards tbody tr{box-shadow:inset 4px 0 0 var(--st)}
table.cards tbody tr:hover{background:var(--surface)}
table.cards td{display:block;border:0;padding:0;white-space:normal;min-width:0;max-width:none}
table.cards td:first-child{grid-column:1/-1;box-shadow:none}
table.cards td.wrap{grid-column:1/-1;min-width:0;max-width:none}
table.cards td.wrap:has(>ul.alerts:empty){display:none}
table.cards td[data-label]::before{content:attr(data-label);display:block;font-size:11px;font-weight:600;
color:var(--muted);text-transform:uppercase;letter-spacing:.03em;margin-bottom:1px}
table.cards td:first-child::before{content:none}
table.cards a.name{display:inline-block;padding:9px 0;font-size:17px}
table.pub td.st{font-size:17px;padding:4px 0}
table.pub.cards td:nth-child(2){grid-column:1/-1}
table.pub.cards td.none{display:none}
.hide-silent tr.st-silent.has-bf{display:grid}
.seg button{padding:10px 14px;min-height:44px;font-size:14px}
.plotbar a{display:inline-block;padding:10px 4px}
header.top>a{display:inline-block;padding:10px 0}
section.card{padding:10px 12px}
dl.facts{grid-template-columns:1fr;gap:0}
dl.facts dt{margin-top:8px;font-size:13px}
.tip{font-size:13px}
details.ptable summary{padding:10px 0}
}
