@font-face{font-family:"Geist";src:url("assets/fonts/geist/Geist-VariableFont_wght.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Geist Mono";src:url("assets/fonts/geist-mono/GeistMono-VariableFont_wght.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  --bds-bg-default:#000000; --bds-bg-subtle:#171717; --bds-bg-raised:#262626; --bds-bg-highlight:#404040;
  --bds-text-primary:#ffffff; --bds-text-secondary:#a3a3a3; --bds-text-subtle:#737373;
  --bds-text-disabled:rgba(255,255,255,.25);
  --bds-border-subtle:#262626; --bds-border-default:#404040;
  --bds-status-success:#22c55e; --bds-status-warning:#f59e0b; --bds-status-error:#ef4444;
  --bds-brand:#00ffa3; --bds-brand-hover:#00c07b; --bds-brand-press:#009661;
  --bds-green-soft:#70ffcb; --bds-teal-deep:#003726;
  --bds-radius-sm:2px; --bds-radius-md:4px; --bds-radius-lg:8px; --bds-radius-full:9999px;
  --font-sans:"Geist",system-ui,sans-serif; --font-mono:"Geist Mono",ui-monospace,monospace;
  --page-padding:90px; --nav-height:68px;
  --text-xs:9px; --text-sm:12px; --text-md:14px; --text-base:15px; --text-lg:16px;
  --text-xl:20px; --text-2xl:32px; --text-3xl:48px;
}
*{box-sizing:border-box}
html{background:var(--bds-bg-default)}
body{
  margin:0;
  background:radial-gradient(circle at 76% 7%,rgba(0,55,38,.34),transparent 32rem),var(--bds-bg-default);
  color:var(--bds-text-primary); font-family:var(--font-sans); font-size:var(--text-base);
  line-height:1.35; -webkit-font-smoothing:antialiased;
}
body,button,input{font-family:var(--font-sans)}
button,a,input{-webkit-tap-highlight-color:transparent}
:focus-visible{outline:2px solid var(--bds-brand);outline-offset:3px}
.page-shell{max-width:1440px;margin:0 auto;padding:0 var(--page-padding)}

/* nav */
.site-nav{height:var(--nav-height);display:flex;align-items:center;gap:24px;
  border-bottom:1px solid var(--bds-border-subtle);position:sticky;top:0;z-index:20;
  background:var(--bds-bg-default)}
.brand-link{display:flex;align-items:center}
.brand-link img{height:24px;display:block}
.site-nav nav{display:flex;gap:20px;margin-left:8px}
.site-nav nav a{color:var(--bds-text-secondary);text-decoration:none;font-size:var(--text-md);
  padding:6px 8px;border-radius:var(--bds-radius-md)}
.site-nav nav a:hover{color:var(--bds-text-primary);background:var(--bds-bg-subtle)}
.nav-actions{margin-left:auto;display:flex;align-items:center;gap:12px}

/* freshness pill */
.freshness{display:inline-flex;align-items:center;gap:8px;height:28px;padding:6px 12px;
  border:1px solid var(--bds-border-default);border-radius:var(--bds-radius-full);
  font-size:var(--text-sm);color:var(--bds-text-secondary);font-family:var(--font-mono);
  white-space:nowrap;max-width:100%;overflow:hidden}
.fresh-short,.fresh-age{display:none}
.brand-link .brand-mark{display:none}
.freshness i{width:6px;height:6px;border-radius:50%;background:var(--bds-status-success);flex:none}
.freshness[data-state=stale] i{background:var(--bds-status-warning)}
.freshness[data-state=error] i{background:var(--bds-status-error)}
.freshness[data-state=loading] i{background:var(--bds-text-subtle)}

/* buttons */
.btn{height:32px;padding:8px 12px;border-radius:var(--bds-radius-md);font-size:var(--text-md);
  font-weight:600;cursor:pointer;border:1px solid transparent;transition:background 140ms,border-color 140ms,color 140ms}
.btn-primary{background:var(--bds-brand);color:#00110b;border-color:var(--bds-brand)}
.btn-primary:hover:not(:disabled){background:var(--bds-brand-hover);border-color:var(--bds-brand-hover)}
.btn-primary:active:not(:disabled){background:var(--bds-brand-press)}
.btn-secondary{background:var(--bds-bg-raised);color:var(--bds-text-primary);border-color:var(--bds-border-default);font-weight:500}
.btn-secondary:hover:not(:disabled){background:var(--bds-bg-highlight)}
.btn:disabled{background:var(--bds-bg-subtle);color:var(--bds-text-disabled);
  border-color:var(--bds-border-subtle);cursor:not-allowed}
.btn.is-loading{color:var(--bds-text-secondary)}
.btn-lg{height:40px;padding:8px 24px}

/* hero + resolver */
.hero{padding:56px 0 40px;display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
.section-index{display:inline-block;font-size:var(--text-sm);letter-spacing:.08em;text-transform:uppercase;
  color:var(--bds-brand);font-weight:600;margin-bottom:12px}
h1{font-size:var(--text-3xl);line-height:1.2;font-weight:600;margin:0 0 12px;letter-spacing:-.02em;max-width:20ch;text-wrap:balance}
.hero p.lede{margin:0;color:var(--bds-text-secondary);font-size:var(--text-lg);max-width:68ch;line-height:1.5}

/* KPI strip - shared borders, never one card per metric (design rules 6.3 / 8.4) */
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;
  background:var(--bds-border-subtle);border:1px solid var(--bds-border-subtle);
  border-radius:var(--bds-radius-lg);overflow:hidden}
.kpi{background:var(--bds-bg-subtle);padding:20px;min-width:0;
  display:flex;flex-direction:column;justify-content:center}
.kpi .v{font-family:var(--font-mono);font-size:var(--text-2xl);font-weight:600;
  line-height:1;font-variant-numeric:tabular-nums;
  /* no negative tracking: it fights the mono advance grid and the digits read uneven */
  letter-spacing:0;font-feature-settings:"tnum" 1;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .v .cur{color:var(--bds-text-secondary);margin-right:.06em}
.kpi:first-child .v .cur{color:inherit;opacity:.55}
.kpi:first-child .v{color:var(--bds-brand)}
.kpi .l{font-size:var(--text-sm);color:var(--bds-text-subtle);margin:6px 0 0}
.kpi .v.pending{color:var(--bds-text-subtle);font-size:var(--text-xl)}
.kpi-note{margin:-16px 0 0;font-size:var(--text-sm);color:var(--bds-text-subtle)}
.kpi-note[hidden]{display:none}

.resolver{border:1px solid var(--bds-border-default);border-radius:var(--bds-radius-lg);
  background:var(--bds-bg-subtle);padding:24px}
.resolver label{display:block;font-size:var(--text-md);font-weight:500;margin-bottom:10px}
.resolver .row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}
.resolver input{height:40px;padding:8px 12px;background:var(--bds-bg-default);
  border:1px solid var(--bds-border-default);border-radius:var(--bds-radius-md);
  color:var(--bds-text-primary);font-family:var(--font-mono);font-size:var(--text-md);min-width:0}
.resolver input::placeholder{color:var(--bds-text-subtle)}
.resolver input[aria-invalid=true]{border-color:var(--bds-status-error)}
.resolver small{display:block;margin-top:10px;font-size:var(--text-sm);color:var(--bds-text-subtle)}
.resolver small.err{color:var(--bds-status-error)}

.result{margin-top:20px;border-top:1px solid var(--bds-border-subtle);padding-top:20px}
.result[hidden]{display:none}
.result-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px;margin-bottom:16px}
.result-addr{font-family:var(--font-mono);font-size:var(--text-md);color:var(--bds-text-secondary);
  text-decoration:none;border-bottom:1px solid var(--bds-border-default);word-break:break-all}
.result-addr:hover{color:var(--bds-brand);border-bottom-color:var(--bds-brand)}
.badge{display:inline-flex;align-items:center;gap:6px;height:28px;padding:6px 12px;
  border-radius:16px;font-size:var(--text-sm);font-weight:600;border:1px solid var(--bds-border-default);
  color:var(--bds-text-secondary)}
.badge.ok{border-color:var(--bds-brand);color:var(--bds-brand)}
.badge.none{border-color:var(--bds-border-default);color:var(--bds-text-subtle)}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:1px;
  background:var(--bds-border-subtle);border:1px solid var(--bds-border-subtle);border-radius:var(--bds-radius-md);overflow:hidden}
.fact{background:var(--bds-bg-default);padding:16px 20px;min-width:0}
.fact .k{font-size:var(--text-sm);color:var(--bds-text-subtle);margin-bottom:8px}
.fact .v{font-family:var(--font-mono);font-size:var(--text-xl);font-weight:600;font-variant-numeric:tabular-nums}
.fact .v.brand{color:var(--bds-brand)}
.fact .v.na{color:var(--bds-text-subtle);font-size:var(--text-lg)}

/* section head */
.sec{padding:40px 0 24px}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:20px}
.sec-head h2{font-size:var(--text-2xl);font-weight:600;margin:0;letter-spacing:-.01em}
.sec-head p{margin:6px 0 0;color:var(--bds-text-secondary);font-size:var(--text-md);max-width:70ch}
.sec-actions{margin-left:auto;display:flex;align-items:center;gap:10px}
input[type=search]{height:32px;padding:8px 12px;background:var(--bds-bg-subtle);
  border:1px solid var(--bds-border-default);border-radius:var(--bds-radius-md);
  color:var(--bds-text-primary);font-size:var(--text-md);
  /* wide enough that the placeholder is never clipped mid-word */
  width:clamp(272px,24vw,340px);min-width:272px}

/* table */
.table-wrap{border:1px solid var(--bds-border-subtle);border-radius:var(--bds-radius-lg);overflow:hidden}
.table-scroll{overflow:auto;max-height:min(70vh,720px);overscroll-behavior:contain}
table{border-collapse:collapse;width:100%;min-width:900px}
thead th{position:sticky;top:0;z-index:5;background:var(--bds-bg-subtle);
  text-align:left;font-size:var(--text-sm);font-weight:600;color:var(--bds-text-secondary);
  padding:12px 16px;border-bottom:1px solid var(--bds-border-default);white-space:nowrap}
thead th.num{text-align:right}
thead th button{background:none;border:0;color:inherit;font:inherit;cursor:pointer;padding:0;
  display:inline-flex;align-items:center;gap:6px}
thead th button:hover{color:var(--bds-text-primary)}
thead th[aria-sort] button{color:var(--bds-brand)}
thead th button .arrow{font-size:9px;opacity:0}
thead th[aria-sort] button .arrow{opacity:1}
tbody td{padding:12px 16px;border-bottom:1px solid var(--bds-border-subtle);vertical-align:middle}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--bds-bg-subtle)}
td.rank{font-family:var(--font-mono);color:var(--bds-text-subtle);text-align:right;width:1%;
  font-variant-numeric:tabular-nums;font-size:var(--text-md)}
.who{display:flex;flex-direction:column;gap:2px;min-width:0}
.who .nm{font-weight:500;font-size:var(--text-md);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.who a{color:var(--bds-brand);text-decoration:none;font-size:var(--text-sm);font-family:var(--font-mono)}
.who a:hover{text-decoration:underline}
.addr{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--bds-text-subtle)}
a.addr-link{text-decoration:none;border-bottom:1px solid transparent}
a.addr-link:hover{color:var(--bds-brand);border-bottom-color:var(--bds-brand)}
td.num{text-align:right;font-family:var(--font-mono);font-variant-numeric:tabular-nums;white-space:nowrap}
td.usd{font-size:var(--text-md);font-weight:500}
td.usd.bump{color:var(--bds-brand);transition:color 900ms}
.tags{display:flex;flex-wrap:wrap;gap:4px}
.tag{font-size:var(--text-sm);padding:2px 8px;border-radius:16px;border:1px solid var(--bds-border-default);
  color:var(--bds-text-subtle);white-space:nowrap}
.tag.kol{border-color:var(--bds-brand);color:var(--bds-brand)}
.spark{display:block}
.state-row td{padding:40px 16px;text-align:center;color:var(--bds-text-subtle);font-size:var(--text-md)}

footer{border-top:1px solid var(--bds-border-subtle);margin-top:48px;padding:32px 0 64px;
  color:var(--bds-text-subtle);font-size:var(--text-md);max-width:82ch}
footer p{margin:0 0 12px;line-height:1.5}
footer b{color:var(--bds-text-secondary);font-weight:500}
footer code{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--bds-text-secondary)}

@media (max-width:1120px){:root{--page-padding:48px}h1{font-size:var(--text-2xl)}}
@media (max-width:900px){
  :root{--page-padding:32px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kpi .v{font-size:var(--text-xl)}
  .site-nav nav{display:none}
  .fresh-long{display:none}
  .fresh-short,.fresh-age{display:inline}
  .hero{padding:36px 0 28px}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:680px){
  :root{--page-padding:20px}
  .kpis{grid-template-columns:minmax(0,1fr)}
  .table-scroll{max-height:none}
  .brand-link .brand-full{display:none}
  .brand-link .brand-mark{display:block;height:22px}
  .fresh-age{display:none}
  .site-nav{gap:12px}
  .nav-actions{gap:8px}
  .resolver .row{grid-template-columns:minmax(0,1fr)}
  .sec-actions{margin-left:0;width:100%}
  input[type=search]{flex:1;min-width:0}
  .facts{grid-template-columns:minmax(0,1fr)}
  thead th{position:sticky;top:0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}}