:root{--bg:#f6f7f9;--card:#fff;--fg:#1b1f24;--mut:#667085;--line:#e3e6eb;--acc:#2563eb;--good:#0f8a4b;--bad:#c2312d;--hl:#e8f7ee;--band:#2563eb33}
@media(prefers-color-scheme:dark){:root{--bg:#0f1216;--card:#171b21;--fg:#e6e9ee;--mut:#98a2b3;--line:#2a313a;--acc:#6ea0ff;--good:#3ddc84;--bad:#ff7b72;--hl:#12301f;--band:#6ea0ff33}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.45 -apple-system,system-ui,sans-serif;padding:0 16px 24px}
a{color:var(--acc)}
h1{font-size:20px;margin:12px 0}
h2{font-size:16px;margin:20px 0 8px}
nav{display:flex;flex-wrap:wrap;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);margin-bottom:8px}
nav a{text-decoration:none;color:var(--mut);font-weight:600}
nav a.on{color:var(--fg)}
nav form{margin:0 0 0 auto}
nav button{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:8px;padding:4px 10px;cursor:pointer}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.card .l{color:var(--mut);font-size:12px}
.card .v{font-size:20px;font-weight:600}
.card.big .v{font-size:24px}
.narrow{max-width:360px;margin:12vh auto 0}
progress{width:100%;height:8px;margin-top:6px;accent-color:var(--acc)}
.mut,small{color:var(--mut)}
.pos{color:var(--good)}.neg{color:var(--bad)}
.ctl{display:flex;flex-wrap:wrap;gap:6px;margin:12px 0;align-items:center}
button.f,input,select{font:inherit;border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:8px;padding:6px 10px}
button.f{cursor:pointer}
button.f.on,button.primary{background:var(--acc);color:#fff;border-color:var(--acc)}
button.primary{font:inherit;border-radius:8px;padding:8px 12px;cursor:pointer;width:100%;margin-top:12px}
input{min-width:200px;flex:1}
.wrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);border-radius:10px}
table{border-collapse:collapse;width:100%;white-space:nowrap}
th,td{padding:6px 9px;text-align:right;border-bottom:1px solid var(--line)}
th{position:sticky;top:0;background:var(--card);cursor:pointer;user-select:none;font-size:12px;color:var(--mut)}
th.s{color:var(--fg)}
td.a,th.a{text-align:left}
tr.hl td{background:var(--hl)}
tbody tr.go{cursor:pointer}
tbody tr.go:hover td{filter:brightness(.97)}
#fp{background:var(--card);border:1px solid var(--line);border-radius:10px;margin:0 0 12px;padding:8px 12px}
#fp>summary{cursor:pointer;font-weight:600}
#fp .fg{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px 14px;margin:10px 0}
#fp .fr{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
#fp .fr>span{flex:1 1 100%;color:var(--mut);font-size:12px}
#fp input{min-width:0;width:100px;flex:0 1 110px}
.chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:6px 0}
.chip{background:var(--hl);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:12px;cursor:pointer}
.chip:after{content:" \00d7";color:var(--mut)}
@media(max-width:600px){#fp input{width:42%;flex:1 1 42%}}
label{display:block;margin-top:10px;color:var(--mut);font-size:12px}
label input{display:block;width:100%;margin-top:4px;color:var(--fg);font-size:14px}
.err{color:var(--bad)}
dl.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px 12px;margin:0}
dl.kv div{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 12px}
dl.kv dt{color:var(--mut);font-size:12px}
dl.kv dd{margin:0;font-size:18px;font-weight:600}
.addr{word-break:break-all;font-size:13px;color:var(--mut)}
svg.chart{width:100%;height:auto;display:block;background:var(--card);border:1px solid var(--line);border-radius:10px}
svg.chart text{fill:var(--mut);font-size:11px}
#readout{min-height:1.4em;color:var(--mut);margin:6px 0}
.legend{color:var(--mut);font-size:12px}
.more{margin:10px 0}
