:root{color-scheme:dark;--bg:#0b0d12;--surface:#121722;--surface2:#171d29;--border:#2a3140;--text:#eef2f7;--muted:#99a4b3;--accent:#5794f2;--accentSoft:rgba(87,148,242,.19);--good:#73bf69;--bad:#f2495c;--input:#0e131c;--heading:#c7d0dc;--link:#8ab8ff;--warning:#ffd967}
:root[data-theme="light"]{color-scheme:light;--bg:#f3f6fb;--surface:#fff;--surface2:#eaf0f8;--border:#cbd5e1;--text:#172033;--muted:#526079;--accent:#245bb5;--accentSoft:rgba(36,91,181,.12);--good:#246a29;--bad:#b42336;--input:#fff;--heading:#334155;--link:#245bb5;--warning:#855700}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 Inter,system-ui,sans-serif}
button,input,select{font:inherit}.page{width:100%;margin:0;padding:24px clamp(8px,1vw,32px)}
.hero{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:16px}
.eyebrow{color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.16em}h1{margin:5px 0 4px}.subtitle,.muted{color:var(--muted)}
.status-card{display:grid;grid-template-columns:repeat(3,auto);gap:22px;padding:12px 16px;border:1px solid var(--border);background:var(--surface);border-radius:8px}
.status-card div{display:grid;gap:2px}.legend{display:flex;gap:18px;flex-wrap:wrap;padding:10px 14px;margin-bottom:12px;border:1px solid var(--border);background:var(--surface);border-radius:8px;color:var(--muted)}
.legend strong,.legend b{color:var(--text)}
.filters{display:grid;grid-template-columns:2fr repeat(5,minmax(120px,1fr));gap:10px;margin-bottom:14px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:8px}
.filters label{display:grid;gap:5px}.filters label span{color:var(--muted);font-size:12px}.filters .wide{grid-column:span 2}
input,select,button{color:var(--text);background:#0e131c;border:1px solid var(--border);border-radius:5px;padding:8px 10px;min-height:36px}
.table-card{border:1px solid var(--border);background:var(--surface);border-radius:8px;overflow:hidden}.table-toolbar{min-height:46px;display:flex;justify-content:space-between;align-items:center;padding:0 14px;border-bottom:1px solid var(--border)}
.table-wrap{overflow:auto}table{border-collapse:collapse;width:100%;min-width:1700px}th,td{border-bottom:1px solid var(--border);padding:7px 10px;white-space:nowrap}th{position:sticky;top:0;z-index:2;background:var(--surface2);color:#c7d0dc;text-align:left;font-size:12px;cursor:pointer}.num{text-align:right}
th[data-dir=asc]::after{content:" ▲";color:var(--accent)}th[data-dir=desc]::after{content:" ▼";color:var(--accent)}
.wallet{display:inline-block;max-width:235px;overflow:hidden;text-overflow:ellipsis;vertical-align:bottom;color:#8ab8ff;text-decoration:none}.wallet:hover{text-decoration:underline}.validator{max-width:250px;overflow:hidden;text-overflow:ellipsis}
.bar-cell{position:relative;overflow:hidden}.bar-cell .bar{position:absolute;inset:2px auto 2px 0;background:var(--accentSoft);border-radius:2px}.bar-cell .value{position:relative;z-index:1}
.badge{display:inline-flex;min-width:52px;justify-content:center;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700}.badge.mesa{color:#b9efb3;background:rgba(86,166,75,.2)}.badge.pre{color:#ffb6bf;background:rgba(224,47,68,.2)}
.delta-up{color:var(--good);font-weight:700}.delta-down{color:var(--bad);font-weight:700}.stale-high{color:#ff9eaa;font-weight:700}.stale-mid{color:#ffd967}
.pagination{display:flex;justify-content:center;align-items:center;gap:8px;min-height:50px}.pagination button{min-width:38px}.empty-state{text-align:center!important;color:var(--muted);padding:32px!important}
@media(max-width:1100px){.hero{flex-direction:column;align-items:stretch}.filters{grid-template-columns:repeat(2,1fr)}.filters .wide{grid-column:span 2}}
input,select,button{background:var(--input)}
th{color:var(--heading)}
.wallet{color:var(--link)}
.badge.mesa{color:var(--good)}
.badge.pre,.stale-high{color:var(--bad)}
.stale-mid{color:var(--warning)}
#themeToggle{cursor:pointer;white-space:nowrap;border-radius:999px;align-self:center}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
button:disabled{opacity:.45;cursor:default}
/* Use the full viewport; let content determine when horizontal scrolling is needed. */
table{min-width:0;font-size:clamp(12px,.65vw,14px)}
th,td{padding-inline:clamp(4px,.3vw,10px)}
th{white-space:normal;max-width:140px}
.wallet{max-width:clamp(130px,8vw,260px)}
.validator{max-width:clamp(140px,9vw,280px)}
.column-picker{position:relative;align-self:end}
.column-picker summary{cursor:pointer;padding:8px 10px;min-height:36px;border:1px solid var(--border);border-radius:5px;background:var(--input)}
.column-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:10;width:280px;max-width:calc(100vw - 48px);max-height:65vh;overflow:auto;padding:12px;border:1px solid var(--border);border-radius:8px;background:var(--surface);box-shadow:0 8px 24px #0003}
.column-menu button{width:100%;margin-bottom:8px;cursor:pointer}
.filters .column-menu label{display:flex;align-items:center;gap:9px;padding:6px 0;cursor:pointer}
.column-menu input{min-height:0;width:16px;height:16px;margin:0;accent-color:var(--accent)}
.filters .column-menu label span{color:var(--text)}
.filters .checkbox-filter{display:flex;align-items:center;gap:8px}
.filters label{min-width:0}
.filters input:not([type="checkbox"]),.filters select{min-width:0;width:100%}
.checkbox-filter input{min-height:0;width:16px;height:16px;margin:0;accent-color:var(--accent)}
summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
tfoot td{font-weight:700;background:var(--surface2);border-top:2px solid var(--accent)}
[hidden]{display:none!important}
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:24px;padding:20px 0;border-top:1px solid var(--border)}
.footer-copy{min-width:0;flex:1 1 300px}
.footer-copy p{margin:0 0 10px}
.delegation-address{color:var(--link);font-family:ui-monospace,monospace;overflow-wrap:anywhere}
.delegation-qr{margin:0;max-width:240px;text-align:center}
.delegation-qr img{display:block;width:164px;height:164px;margin:auto;background:#fff;border-radius:4px}
.delegation-qr figcaption{font-size:12px;color:var(--muted);margin-top:8px}
/* Fixed-width figures for amounts, percentages, dates and numeric controls. */
td.num,.numeric-text,input[type="number"],input[type="date"],#epoch,#pageSize,
#generatedAt,#archiveHeight,#validatorCount,#filteredCount,#pageLabel,#columnCount,
#epochSummary,#copyrightYear{
  font-family:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-variant-numeric:tabular-nums lining-nums;
}
tbody tr:hover>td,tfoot tr:hover>td{background-color:#202e43}
:root[data-theme="light"] tbody tr:hover>td,:root[data-theme="light"] tfoot tr:hover>td{background-color:#dce9fa}
@media(max-width:600px){
  .page{padding-block:12px}
  .status-card{grid-template-columns:1fr;gap:8px}
  .filters{grid-template-columns:1fr}
  .filters .wide{grid-column:span 1}
  .table-toolbar{gap:10px;flex-wrap:wrap;padding-block:12px}
  .table-toolbar label[for="pageSize"]{display:flex;align-items:center;gap:10px}
  #pageSize{height:32px;min-height:32px;padding:4px 8px}
}
