:root{
  --bg:#f6f7f9;--panel:#fff;--ink:#1c2430;--muted:#5d6b7c;--line:#dde2e8;--brand:#1f3a5f;--brand-ink:#fff;--accent:#2b6cb0;
  --ok-bg:#c6efce;--ok-ink:#0b5a1a;--part-bg:#ffeb9c;--part-ink:#6b5200;--bad-bg:#ffc7ce;--bad-ink:#8a0f1c;--un-bg:#eceff3;--un-ink:#5d6b7c;--na-bg:#d9e1f2;--na-ink:#1f3a5f;
  --shadow:0 4px 18px rgba(20,30,50,.15);
}
@media (prefers-color-scheme:dark){
  :root{--bg:#12161c;--panel:#1b222b;--ink:#e6ebf1;--muted:#9aa8b8;--line:#2d3743;--brand:#0f2540;--accent:#6aa9ec;
  --ok-bg:#1d4a2a;--ok-ink:#b9f0c5;--part-bg:#5a4a10;--part-ink:#ffe9a0;--bad-bg:#5c1d26;--bad-ink:#ffc4cb;--un-bg:#262e38;--un-ink:#9aa8b8;--na-bg:#25354f;--na-ink:#c8d8f5;--shadow:0 4px 18px rgba(0,0,0,.5);}
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}
a,.link{color:var(--accent);cursor:pointer;text-decoration:none;background:none;border:0;padding:0}
a:hover,.link:hover{text-decoration:underline}
.top{display:flex;align-items:center;gap:20px;padding:0 16px;height:52px;background:var(--brand);color:var(--brand-ink);position:sticky;top:0;z-index:30}
.brand{font-weight:700;font-size:16px;white-space:nowrap}.brand .sub{font-weight:400;opacity:.75;margin-left:4px}
#nav{display:flex;gap:2px;flex:1;overflow-x:auto}
#nav a{color:#fff;padding:6px 12px;border-radius:6px;opacity:.8;white-space:nowrap}
#nav a:hover{background:rgba(255,255,255,.12);text-decoration:none}
#nav a[aria-current=page]{background:rgba(255,255,255,.2);opacity:1;font-weight:600}
.who{font-size:12px;opacity:.9;white-space:nowrap}.who .link{color:#cfe2ff}
main{padding:16px;max-width:none}
main:focus{outline:none}
h1{font-size:20px;margin:0 0 4px}h2{font-size:16px;margin:0}h3{font-size:14px;margin:16px 0 6px}
.muted{color:var(--muted)}.small{font-size:12px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 14px}
.toolbar .grow{flex:1}
input[type=search],input[type=text],input[type=password],input[type=email],input[type=date],input[type=number],select,textarea{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:6px 8px;min-width:0}
textarea{width:100%;resize:vertical}
:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
.btn{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:6px 12px;cursor:pointer}
.btn:hover{border-color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.danger{color:var(--bad-ink);border-color:var(--bad-ink)}
.btn.sm{padding:2px 8px;font-size:12px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:8px}
.kpis{display:flex;flex-wrap:wrap;gap:10px;margin:10px 0 16px}
.kpi{padding:10px 14px;min-width:150px}.kpi b{display:block;font-size:22px}
.badge{display:inline-block;padding:1px 7px;border-radius:10px;font-size:11px;background:var(--un-bg);color:var(--un-ink);white-space:nowrap}
.badge.ok{background:var(--ok-bg);color:var(--ok-ink)}.badge.part{background:var(--part-bg);color:var(--part-ink)}.badge.bad{background:var(--bad-bg);color:var(--bad-ink)}.badge.na{background:var(--na-bg);color:var(--na-ink)}
/* sections */
.seg{margin:0 0 18px}
.seg-head{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:10px 14px;background:var(--panel);border:1px solid var(--line);border-radius:8px;cursor:pointer}
.seg-head .t{font-weight:700}.seg-head .d{color:var(--muted);font-size:12px;flex:1}
.seg-head .chev{display:inline-block;transition:transform .15s}.seg.open .chev{transform:rotate(90deg)}
.seg-body{display:none;margin-top:6px}.seg.open .seg-body{display:block}
.bar{display:inline-block;width:90px;height:8px;background:var(--un-bg);border-radius:4px;overflow:hidden;vertical-align:middle}.bar>i{display:block;height:100%;background:#3aa655}
.scroll{overflow:auto;border:1px solid var(--line);border-radius:8px;background:var(--panel);max-height:75vh}
table{border-collapse:separate;border-spacing:0;width:100%}
.mx th,.mx td{padding:2px 3px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap}
.mx thead th{position:sticky;top:0;background:var(--panel);z-index:3;font-weight:600;font-size:11px;vertical-align:bottom}
.mx thead tr.grp th{top:0;color:#fff;font-size:11px;background:var(--brand);border-left:1px solid var(--panel)}
.mx thead tr.grp th.ext{background:#6b4e9b}
.mx thead tr.cols th{top:24px}
.mx th.vert{height:128px;width:34px;min-width:34px;padding:4px 0}
.mx th.vert span{writing-mode:vertical-rl;transform:rotate(180deg);display:inline-block;max-height:118px;overflow:hidden;text-overflow:ellipsis}
.mx th.vert small{display:block;color:var(--muted);font-weight:400;margin-bottom:3px}
.mx th.ext{background:#efe9f6}@media (prefers-color-scheme:dark){.mx th.ext{background:#2f2640}}
.mx td.name,.mx th.name{position:sticky;left:0;background:var(--panel);z-index:2;text-align:left;min-width:210px;max-width:260px;padding-left:10px;border-right:1px solid var(--line)}
.mx thead th.name{z-index:4}
.mx td.name{overflow:hidden;text-overflow:ellipsis}
.mx tr:hover td{background:color-mix(in srgb,var(--accent) 6%,var(--panel))}.mx tr:hover td.name{background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
.mx td.meta{text-align:left;font-size:11px;color:var(--muted);padding:2px 8px}
.cell{width:30px;height:26px;border:1px solid transparent;border-radius:5px;cursor:pointer;font-size:13px;line-height:1;position:relative;padding:0}
.cell.s0{background:var(--un-bg);color:var(--un-ink)}.cell.s1{background:var(--bad-bg);color:var(--bad-ink)}.cell.s2{background:var(--part-bg);color:var(--part-ink)}.cell.s3{background:var(--ok-bg);color:var(--ok-ink)}.cell.s4{background:var(--na-bg);color:var(--na-ink)}
.cell.has-note::after{content:"";position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:var(--accent)}
.cell:hover{border-color:var(--accent)}
.legend{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:12px}
.legend .cell{width:22px;height:20px;cursor:default;pointer-events:none}
/* popover */
.pop{position:fixed;z-index:60;width:340px;background:var(--panel);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:12px}
.pop h4{margin:0 0 2px;font-size:13px}.pop .opts{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:8px 0}
.pop .opts button{white-space:nowrap;display:flex;gap:6px;align-items:center;padding:5px 8px;border-radius:6px;border:1px solid var(--line);background:var(--panel);cursor:pointer;text-align:left}
.pop .opts button[aria-pressed=true]{outline:2px solid var(--accent)}
.pop .opts kbd{margin-left:auto;font-size:10px;color:var(--muted)}
/* tables */
.tbl th,.tbl td{padding:6px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{font-size:12px;color:var(--muted);font-weight:600;background:var(--panel);position:sticky;top:0}
.tbl tr.clickable{cursor:pointer}.tbl tr.clickable:hover td{background:color-mix(in srgb,var(--accent) 6%,var(--panel))}
.tbl .over{color:var(--bad-ink);font-weight:600}
.stack{display:flex;height:14px;border-radius:3px;overflow:hidden;min-width:180px;background:var(--un-bg)}
.stack i{display:block;height:100%}
.stack .s3{background:#3aa655}.stack .s2{background:#e6b422}.stack .s1{background:#d9534f}.stack .s0{background:#b8c0cb}.stack .s4{background:#8fa6d0}
/* client page */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin:12px 0}
.tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:8px 14px;cursor:pointer;color:var(--muted)}
.tabs button[aria-selected=true]{color:var(--ink);border-color:var(--accent);font-weight:600}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 16px}
.field label{display:block;font-size:12px;color:var(--muted);margin-bottom:2px}.field input,.field select,.field textarea{width:100%}
.trow{display:grid;grid-template-columns:54px 1fr 150px 1fr;gap:8px;align-items:start;padding:8px 10px;border-bottom:1px solid var(--line)}
.trow .id{font-weight:700;color:var(--brand)}@media (prefers-color-scheme:dark){.trow .id{color:var(--accent)}}
.trow details{grid-column:2 / -1}.trow summary{cursor:pointer;color:var(--accent);font-size:12px}
.guide{font-size:12px;background:var(--un-bg);border-radius:6px;padding:8px 10px;margin-top:6px;white-space:pre-wrap}
.guide b{display:block;margin-top:6px}
dialog{border:1px solid var(--line);border-radius:10px;padding:0;background:var(--panel);color:var(--ink);box-shadow:var(--shadow);max-width:min(760px,94vw);width:100%}
dialog::backdrop{background:rgba(10,15,25,.5)}
.dlg-h{padding:12px 16px;border-bottom:1px solid var(--line);font-weight:700}.dlg-b{padding:14px 16px;max-height:70vh;overflow:auto}.dlg-f{padding:12px 16px;border-top:1px solid var(--line);display:flex;gap:8px;justify-content:flex-end}
.toasts{position:fixed;bottom:16px;right:16px;display:flex;flex-direction:column;gap:8px;z-index:90}
.toast{background:var(--brand);color:#fff;padding:8px 14px;border-radius:8px;box-shadow:var(--shadow);max-width:360px}.toast.err{background:#a12b35}
.empty{padding:28px;text-align:center;color:var(--muted)}
.plain{display:grid;place-items:center;min-height:100vh}.plain-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:24px 28px;max-width:480px}
.acc{border:1px solid var(--line);border-radius:8px;background:var(--panel);margin-bottom:8px}.acc summary{padding:10px 14px;cursor:pointer;font-weight:600}.acc .in{padding:0 14px 12px;font-size:13px}.acc .in p{white-space:pre-wrap;margin:6px 0}
@media (max-width:760px){.trow{grid-template-columns:1fr}.top{flex-wrap:wrap;height:auto;padding:8px 12px}}
.login{width:min(420px,92vw)}.login .field{margin:10px 0}.login .btn{width:100%;margin-top:6px}.err{background:var(--bad-bg);color:var(--bad-ink);padding:8px 10px;border-radius:6px;margin:8px 0}
code{background:var(--un-bg);padding:1px 5px;border-radius:4px;word-break:break-all}
.plain-card .field input{width:100%}
.center{text-align:center}h1 .muted{font-weight:400}

:root{color-scheme:light dark}
input:-webkit-autofill,input:-webkit-autofill:focus{-webkit-text-fill-color:var(--ink);box-shadow:0 0 0 1000px var(--panel) inset;caret-color:var(--ink)}
.showpw{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);margin:-4px 0 10px}
.facts{background:var(--un-bg);border-left:3px solid var(--accent);padding:6px 10px;margin-bottom:8px}.facts .small{margin-top:2px}