:root{
  --ink:#17202a;
  --muted:#647180;
  --line:#dbe3e7;
  --soft:#f3f7f8;
  --white:#fff;
  --accent:#0e5b76;
  --accent-dark:#093f52;
  --accent-soft:#e5f1f4;
  --gold:#b08a57;
  --gold-soft:#eadfce;
  --positive:#1f7a55;
  --negative:#b34848;
  --shadow:0 18px 55px rgba(24,43,54,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f4f7f8;color:var(--ink);font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5}
button,select,input{font:inherit}
button{cursor:pointer}
.shell{width:min(1450px,calc(100% - 48px));margin:auto}
.topbar{height:72px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center}
.topbar-inner{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-weight:850}
.mark{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:var(--accent);color:#fff;font-size:14px}
.back-link{color:var(--accent);font-size:14px;font-weight:750;text-decoration:none}
.page{padding-bottom:64px}
.hero{padding:42px 0 28px;display:flex;align-items:flex-end;justify-content:space-between;gap:30px}
.eyebrow{margin:0 0 7px;color:var(--accent);font-size:12px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.hero h1{margin:0;font-size:clamp(42px,5vw,70px);line-height:1;letter-spacing:-.055em}
.intro{max-width:830px;margin:18px 0 0;color:var(--muted);font-size:18px;line-height:1.65}
.live-status{min-width:270px;padding:15px 17px;border:1px solid var(--line);border-radius:14px;background:#fff;display:flex;align-items:center;gap:12px;box-shadow:0 10px 30px rgba(24,43,54,.05)}
.live-status strong,.live-status small{display:block}
.live-status small{margin-top:2px;color:var(--muted)}
.status-dot{width:11px;height:11px;border-radius:50%;background:#d79d43;box-shadow:0 0 0 6px rgba(215,157,67,.14)}
.live-status.ready .status-dot{background:var(--positive);box-shadow:0 0 0 6px rgba(31,122,85,.13)}
.live-status.error .status-dot{background:var(--negative);box-shadow:0 0 0 6px rgba(179,72,72,.13)}
.panel{background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)}
.filters-panel{position:relative;z-index:5;padding:20px}
.filter-grid{display:grid;grid-template-columns:repeat(4,minmax(170px,1fr)) repeat(3,minmax(140px,.78fr));gap:12px}
.filter-menu,.select-control{position:relative;min-width:0}
.filter-menu summary,.select-control{height:66px;padding:10px 13px;border:1px solid var(--line);border-radius:12px;background:#fbfcfc}
.filter-menu summary{display:flex;align-items:center;justify-content:space-between;list-style:none;cursor:pointer}
.filter-menu summary::-webkit-details-marker{display:none}
.filter-menu small,.select-control small{display:block;color:var(--muted);font-size:11px;font-weight:750;letter-spacing:.04em;text-transform:uppercase}
.filter-menu strong{display:block;max-width:220px;margin-top:4px;overflow:hidden;color:var(--ink);font-size:14px;text-overflow:ellipsis;white-space:nowrap}
.chevron{color:var(--muted);font-size:20px;transition:transform .2s ease}
.filter-menu[open] .chevron{transform:rotate(180deg)}
.menu-popover{position:absolute;top:72px;left:0;width:min(350px,84vw);max-height:410px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 24px 55px rgba(24,43,54,.18);overflow:auto;z-index:20}
.menu-actions{display:flex;justify-content:flex-end;gap:7px;padding-bottom:9px;border-bottom:1px solid var(--line)}
.menu-actions button{border:0;background:transparent;color:var(--accent);font-size:12px;font-weight:800}
.option-list{display:grid;gap:2px;padding-top:8px}
.option-item{display:flex;align-items:center;gap:9px;padding:8px;border-radius:8px;color:var(--ink);font-size:14px}
.option-item:hover{background:var(--soft)}
.option-item input{width:16px;height:16px;accent-color:var(--accent)}
.empty-option{padding:14px 8px;color:var(--muted);font-size:13px}
.select-control{display:flex;flex-direction:column;justify-content:center}
.select-control select{width:100%;margin-top:3px;border:0;background:transparent;color:var(--ink);font-weight:750;outline:none}
.filter-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:18px;padding-top:17px;border-top:1px solid var(--line)}
.sample-control{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:13px;font-weight:700}
.sample-control input{width:170px;accent-color:var(--accent)}
.sample-control output{display:grid;place-items:center;min-width:32px;height:32px;border-radius:9px;background:var(--accent-soft);color:var(--accent);font-weight:850}
.button-row{display:flex;gap:9px;flex-wrap:wrap}
.button{min-height:42px;padding:0 16px;border-radius:10px;font-weight:800}
.button.primary{border:1px solid var(--accent);background:var(--accent);color:#fff}
.button.primary:hover{background:var(--accent-dark)}
.button.secondary{border:1px solid var(--line);background:#fff;color:var(--ink)}
.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0}
.kpi{min-height:148px;padding:20px;background:#fff;border:1px solid var(--line);border-radius:17px;box-shadow:0 12px 36px rgba(24,43,54,.055)}
.kpi span,.kpi small{display:block;color:var(--muted)}
.kpi span{font-size:12px;font-weight:850;letter-spacing:.07em;text-transform:uppercase}
.kpi strong{display:block;margin:14px 0 8px;font-size:29px;line-height:1;letter-spacing:-.035em}
.kpi small{font-size:12px}
.chart-panel,.table-panel,.source-panel{margin-top:18px;padding:22px}
.panel-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.panel-heading h2{margin:0;font-size:25px;letter-spacing:-.025em}
.selection-note{max-width:620px;color:var(--muted);font-size:13px;text-align:right}
.chart{height:560px;margin-top:12px}
.chart-empty{min-height:360px;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;color:var(--muted)}
.chart-empty strong{color:var(--ink);font-size:20px}
.chart-empty span{margin-top:5px}
.table-wrap{margin-top:18px;overflow:auto;border:1px solid var(--line);border-radius:13px}
table{width:100%;min-width:1080px;border-collapse:collapse;background:#fff}
th,td{padding:13px 14px;border-bottom:1px solid var(--line);text-align:left;font-size:13px}
th{position:sticky;top:0;background:#f7f9fa;color:var(--muted);font-size:11px;letter-spacing:.06em;text-transform:uppercase;z-index:1}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:#fbfcfc}
td.numeric{font-variant-numeric:tabular-nums;white-space:nowrap}
td.address{min-width:290px;font-weight:700}
td.address a{color:var(--ink);text-decoration:none}
td.address a:hover{color:var(--accent);text-decoration:underline}
.delta-positive{color:var(--positive);font-weight:800}
.delta-negative{color:var(--negative);font-weight:800}
.loading-cell{height:130px;color:var(--muted);text-align:center}
.method-note{max-width:1050px;margin:18px 2px 0;color:var(--muted);font-size:12px;line-height:1.6}
.source-toolbar{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr)) minmax(220px,1.4fr);gap:12px;margin-top:18px}
.source-control{display:flex;flex-direction:column;gap:5px}
.source-control span{color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.source-control select,.source-control input{height:44px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:#fbfcfc;color:var(--ink)}
.source-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;flex-wrap:wrap}
.pagination{display:flex;align-items:center;gap:10px}
.pagination span{color:var(--muted);font-size:13px}
.source-table table{min-width:1450px}
.source-table td.address{min-width:340px}
.footer{border-top:1px solid var(--line);background:#fff}
.footer .shell{min-height:72px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:13px}
@media(max-width:1320px){.filter-grid{grid-template-columns:repeat(4,1fr)}.source-toolbar{grid-template-columns:repeat(3,1fr)}}
@media(max-width:920px){.filter-grid{grid-template-columns:repeat(2,1fr)}.source-toolbar{grid-template-columns:repeat(2,1fr)}.kpi-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.shell{width:min(100% - 24px,1450px)}.hero{align-items:flex-start;flex-direction:column}.live-status{width:100%}.filter-grid,.source-toolbar{grid-template-columns:1fr}.filter-footer{align-items:stretch;flex-direction:column}.sample-control{justify-content:space-between}.sample-control input{flex:1}.button-row{display:grid;grid-template-columns:1fr}.kpi-grid{grid-template-columns:1fr 1fr;gap:10px}.kpi{min-height:130px;padding:16px}.kpi strong{font-size:24px}.panel-heading{align-items:flex-start;flex-direction:column}.selection-note{text-align:left}.chart{height:460px}.footer .shell{align-items:flex-start;justify-content:center;flex-direction:column;gap:4px}}
@media(max-width:480px){.kpi-grid{grid-template-columns:1fr}.hero h1{font-size:43px}.chart-panel,.table-panel,.source-panel{padding:16px}.chart{height:420px}}
