/* Ponzinomics — The Readout. One font, hairline tables, colour only where it means something. */
:root{
  --canvas:#0B0A08; --surface:#12110E; --line:#26221B; --line-quiet:#1C1914; --line-strong:#37312A;
  --text:#F3EFE6; --text-body:#D2CBBD; --text-muted:#A39A8A; --ghost:#6F675B;
  --gold:#E3B04B; --positive:#7FD99A; --caution:#FF8A6B;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gutter:40px; --label:260px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--canvas);color:var(--text);font:15px/1.6 var(--mono);font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none;cursor:pointer}
a.gold{color:var(--gold)} a.muted{color:var(--text-muted)} a:hover{color:var(--text)}
.ul{text-decoration:underline;text-underline-offset:5px}
input{font:inherit;color:inherit}
p{text-wrap:pretty}
.muted{color:var(--text-muted)} .body{color:var(--text-body)} .ghost{color:var(--ghost)} .pos{color:var(--positive)} .gold{color:var(--gold)} .caution{color:var(--caution)}

/* header */
.nav{display:flex;align-items:baseline;justify-content:space-between;padding:18px var(--gutter);border-bottom:1px solid var(--line)}
.nav .left{display:flex;align-items:baseline;gap:40px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:22px;height:auto;display:block}
.nav nav{display:flex;gap:24px;color:var(--text-muted)}
.nav nav a.on{color:var(--text)}
.nav .status{color:var(--text-muted);font-size:13px}
.menu-btn{display:none}

/* hero */
.hero{display:grid;grid-template-columns:1fr 400px;gap:80px;padding:88px var(--gutter) 64px;align-items:start}
h1{margin:0 0 28px;font-size:34px;line-height:1.35;font-weight:400;letter-spacing:0;max-width:30ch}
.hero .lede{margin:0 0 36px;color:var(--text-muted);max-width:52ch}
.hero .links{display:flex;gap:28px;flex-wrap:wrap}
.hero .links a{padding:8px 0}

/* key/value list */
.kv{font-size:14px}
.kv > div{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:10px 0;border-top:1px solid var(--line);color:var(--text-muted)}
.kv > div:last-child{border-bottom:1px solid var(--line)}
.kv b{font-weight:400;color:var(--text)}
.kv .big{font-size:28px;line-height:1}

/* vitals strip */
.vitals{margin:0 var(--gutter);display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:13px}
.vitals > div{padding:16px 20px;border-right:1px solid var(--line)}
.vitals > div:first-child{padding-left:0} .vitals > div:last-child{padding-right:0;border-right:0}
.vitals .v{font-size:20px;margin-top:4px}
.vitals .v small{font-size:13px;color:var(--text-muted)}
.footnote{padding:12px var(--gutter) 0;font-size:13px;color:var(--text-muted)}

/* figures */
.fig{padding:64px var(--gutter) 0}
.fig .art{position:relative}
.fig img{display:block;width:100%;height:auto}
.fig figcaption{display:flex;justify-content:space-between;gap:24px;padding-top:10px;font-size:13px;color:var(--text-muted)}
.coin,.cap{position:absolute;background:var(--gold);border:1px solid var(--text);opacity:0;pointer-events:none}
.coin{width:11px;height:11px;margin:-5.5px 0 0 -5.5px;border-radius:50%}
.cap{width:17px;height:8px;margin:-4px 0 0 -8.5px;border-radius:3px}

/* sections */
.sec{display:grid;grid-template-columns:var(--label) 1fr;gap:40px;padding:88px var(--gutter) 0}
.sec > .label{color:var(--text-muted)}
.sec > .label small{font-size:13px}
.sec > .content{max-width:720px;min-width:0}
.sec p{margin:0 0 20px}
.lead{color:var(--text)}

/* tables */
.tbl{font-size:13px;border-top:1px solid var(--line)}
.tbl.strong{border-top-color:var(--line-strong)}
.row{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:10px 0;border-bottom:1px solid var(--line-quiet);align-items:center}
.row.head{border-bottom:1px solid var(--line-strong);color:var(--text-muted)}
.row .k{color:var(--text-muted)}
.row .r{text-align:right}
.log .row{grid-template-columns:90px 1fr 120px 90px 60px;padding:8px 0;white-space:nowrap}
.tiers .row{grid-template-columns:200px 1fr 60px}
.tiers .row.you{background:var(--surface);margin:0 -12px;padding-left:12px;padding-right:12px}
.bar{height:2px;background:var(--line-strong)} .bar.gold{background:var(--gold)}
.split .row{grid-template-columns:200px 1fr}

/* input row */
.inrow{display:flex;border:1px solid var(--line-strong);font-size:14px}
.inrow input,.inrow .addr{flex:1;min-width:0;background:none;border:0;outline:0;padding:12px 14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inrow a{border-left:1px solid var(--line-strong);padding:12px 16px;color:var(--gold);display:flex;align-items:center}

/* supply */
.track{height:2px;background:var(--line);position:relative}
.track i{position:absolute;left:0;top:0;bottom:0;background:var(--gold)}

/* footer */
footer{display:flex;justify-content:space-between;gap:24px;padding:18px var(--gutter) 32px;border-top:1px solid var(--line);font-size:13px;color:var(--text-muted)}
footer .links{display:flex;gap:20px}

/* FAQ */
.faq-item{display:grid;grid-template-columns:var(--label) 1fr;gap:40px;padding:28px var(--gutter);border-top:1px solid var(--line-quiet)}
.faq-item .content{max-width:720px}
.faq-item .q{margin-bottom:10px}
.faq-item.honest .n{color:var(--caution)}

/* ---------- tablet ---------- */
@media (max-width:1100px){
  .hero{grid-template-columns:1fr;gap:40px}
  h1{font-size:28px}
  .vitals{grid-template-columns:repeat(3,1fr)}
  .vitals > div{border-bottom:1px solid var(--line)}
  .vitals > div:nth-child(3n){border-right:0;padding-right:0} .vitals > div:nth-child(3n+1){padding-left:0}
  .vitals > div:nth-child(4),.vitals > div:nth-child(5){border-bottom:0}
  .log .row{grid-template-columns:80px 1fr 110px 70px 56px}
}

/* ---------- mobile ---------- */
@media (max-width:720px){
  :root{--gutter:20px}
  body{font-size:14px}
  .nav{align-items:center;padding:4px var(--gutter)}
  .nav .left{gap:0}
  .brand{min-height:44px} .brand img{width:18px}
  .nav nav{display:none}
  .nav nav.open{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:53px;background:var(--canvas);border-bottom:1px solid var(--line);gap:0;font-size:16px;z-index:10}
  .nav nav.open a{padding:14px var(--gutter);border-bottom:1px solid var(--line-quiet)}
  .nav .status{display:none}
  .menu-btn{display:flex;align-items:center;min-height:44px;color:var(--text-muted);font-size:13px;padding-left:16px}
  .hero{grid-template-columns:1fr;gap:32px;padding:40px var(--gutter) 32px}
  h1{font-size:22px;line-height:1.4;margin-bottom:20px}
  .hero .lede{margin-bottom:24px}
  .hero .links a{padding:12px 0}
  .kv{font-size:13px} .kv .big{font-size:24px}
  .vitals{grid-template-columns:1fr 1fr;font-size:12px}
  .vitals > div{padding:12px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
  .vitals > div:nth-child(odd){padding-left:0} .vitals > div:nth-child(even){padding-right:0;border-right:0}
  .vitals > div:nth-child(5){display:none}
  .vitals .v{font-size:17px}
  .fig{padding:48px 0 0} .fig figcaption{padding:8px var(--gutter) 0;font-size:12px}
  .coin{width:5px;height:5px;margin:-2.5px 0 0 -2.5px;border:0}
  .cap{width:6px;height:3px;margin:-1.5px 0 0 -3px;border:0;border-radius:1.5px}
  .sec{grid-template-columns:1fr;gap:12px;padding:56px var(--gutter) 0}
  .row{grid-template-columns:120px 1fr;font-size:12px;padding:9px 0}
  .log .row{grid-template-columns:62px 1fr 44px} .log .row .hide-m{display:none}
  .tiers .row{grid-template-columns:1fr 60px 44px}
  .split .row{grid-template-columns:90px 1fr}
  footer{flex-direction:column;gap:6px;font-size:12px;padding:14px var(--gutter) 24px}
  footer .links a{display:flex;align-items:center;min-height:44px}
  .faq-item{grid-template-columns:1fr;gap:8px;padding:20px var(--gutter)}
}
