/* BOTNET site (Site chat). Look "LIME INK NOC", premium pass 10-30: a full-bleed lit globe is the hero; the chrome is type, not boxes.
   Graphite ink page #131614 (lifted off black: designreg), acid lime #C5FF3D = the botnet (machines, its buys + burns), signal red
   #FF3D2E = dips (someone sold), white = burns + fees. Type: Sofia Sans Condensed (numbers, the headline), Overpass (copy, labels,
   nav), Overpass Mono (addresses, timestamps; base58 has no zero, so its dotted zero never shows there). Numbers are always Sofia Sans
   Condensed tabular (plain zero). No blend modes, no blur, no endless CSS animation over the globe, and NOTHING fully opaque may sit over
   the WebGL canvas (the pod's Chrome culled the canvas by the size of an opaque layer over it): overlays are type + translucent scrims. */
@font-face { font-family: 'Sofia Sans Condensed'; src: url(/fonts/sofia-sans-condensed.woff2) format('woff2'); font-weight: 1 1000; font-display: swap; }
@font-face { font-family: 'Overpass'; src: url(/fonts/overpass.woff2) format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Overpass Mono'; src: url(/fonts/overpass-mono.woff2) format('woff2'); font-weight: 300 700; font-display: swap; }
:root {
  --bg: #131614; --bg-deep: #0f1110; --rail: #171a18; --rail2: #1d211e; --line: #232825; --line2: #2f3531; --line3: #414843;
  --ink: #f3f6f1; --ink2: #b9c0b8; --dim: #848c85; --mute: #5b635d;
  --g: #c5ff3d; --g2: #b8f03a; --g-dim: #56701e;
  --r: #ff3d2e; --r2: #ff6b5e;
  --disp: 'Sofia Sans Condensed', 'Arial Narrow', sans-serif; --ui: 'Overpass', system-ui, sans-serif; --mono: 'Overpass Mono', ui-monospace, monospace;
  --hdr: 64px; --hero-w: 430px; --feed-w: 344px; --pad: 52px;
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); color: var(--ink); -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 400 15px/1.5 var(--ui); background: var(--bg); color: var(--ink); min-height: 100svh; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.is-hidden { display: none !important; }
.num { font-family: var(--disp); font-variant-numeric: tabular-nums; }
.mono { font-family: var(--mono); }
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: 90ms ease-out both vt-out; }
::view-transition-new(root) { animation: 170ms ease-out both vt-in; }
::view-transition-old(bar), ::view-transition-new(bar) { animation: none; }
@keyframes vt-out { to { opacity: 0; } }
@keyframes vt-in { from { opacity: 0; } }

/* ---------------------------------------------------------------- header: quiet, type-led */
.bar { view-transition-name: bar; position: sticky; top: 0; z-index: 30; height: var(--hdr); display: flex; align-items: center; gap: 40px;
  padding: 0 var(--pad); background: rgba(19, 22, 20, .92); border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; flex: none; }
.brand-mark { width: 32px; height: 32px; border-radius: 50%; display: block; background: #0a0c0b; }
.brand-name { font: 800 23px/1 var(--disp); letter-spacing: .07em; text-transform: uppercase; }
.brand-tick { font: 500 12px/1 var(--mono); color: var(--g); letter-spacing: .02em; margin-left: 2px; }
.nav { display: flex; gap: 28px; height: 100%; }
.nav a { display: flex; align-items: center; height: 100%; font: 500 14.5px/1 var(--ui); color: var(--dim); border-bottom: 1.5px solid transparent; margin-bottom: -1px; padding-top: 2px; }
.nav a:hover { color: var(--ink); }
.nav a.on { color: var(--ink); border-bottom-color: var(--g); }
.bar-r { margin-left: auto; display: flex; align-items: center; gap: 12px; min-width: 0; }
.live { display: flex; align-items: center; gap: 8px; font: 500 13px/1 var(--ui); color: var(--dim); padding: 0 6px; white-space: nowrap; }
.live i { width: 7px; height: 7px; border-radius: 50%; background: var(--mute); display: block; }
.live.is-on { color: var(--ink2); } .live.is-on i { background: var(--g); box-shadow: 0 0 0 4px rgba(197, 255, 61, .14); }
.live.is-paper i { background: var(--ink2); }
.live.is-down i { background: var(--r); }
.ca { display: flex; align-items: stretch; height: 34px; border: 1px solid var(--line3); background: rgba(23, 26, 24, .82); border-radius: 17px; overflow: hidden; min-width: 0; }
.ca-lab { display: flex; align-items: center; padding: 0 10px 0 13px; font: 600 11px/1 var(--mono); color: var(--g); letter-spacing: .08em; }
.ca-addr { display: flex; align-items: center; gap: 10px; padding: 0 12px 0 0; font: 500 12px/1 var(--mono); color: var(--ink); min-width: 0; }
.ca-addr span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ca-addr:hover span { color: #fff; }
.ca-copy { font: 600 12px/1 var(--ui); color: var(--g); font-style: normal; flex: none; }
.ca-link { display: flex; align-items: center; padding: 0 12px; border-left: 1px solid var(--line2); font: 500 12.5px/1 var(--ui); color: var(--ink2); white-space: nowrap; }
.ca-link:hover { color: var(--ink); }
.xbtn { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid var(--line3); background: rgba(23, 26, 24, .82); border-radius: 50%; color: var(--ink); flex: none; }
.xbtn:hover { border-color: var(--ink2); }

/* ---------------------------------------------------------------- the globe page: full-bleed hero */
.p-globe { overflow: hidden; background: #111412; }
.p-globe .stage { background: #111412; }
.p-globe .bar { position: absolute; left: 0; right: 0; background: transparent; border-bottom: 0; }
.stage { position: relative; height: 100svh; min-height: 640px; }
/* the canvas fills only the free middle: no type over it, and the backdrop ends at the page colour, so its edge is invisible */
.view { position: absolute; top: 0; bottom: 0; left: calc(var(--hero-w) + var(--pad) + 12px); right: calc(var(--feed-w) + var(--pad) + 12px); overflow: hidden; background: #111412; }
.view canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: pan-y; cursor: grab; }
.view canvas.is-drag { cursor: grabbing; }
.scrim { position: absolute; top: 0; bottom: 0; pointer-events: none; }
.scrim-l { left: 0; width: calc(var(--hero-w) + var(--pad) + 140px); background: linear-gradient(90deg, rgba(17, 20, 18, .78), rgba(17, 20, 18, .5) 55%, rgba(17, 20, 18, 0)); }
.scrim-r { right: 0; width: calc(var(--feed-w) + 160px); background: linear-gradient(270deg, rgba(17, 20, 18, .78), rgba(17, 20, 18, .45) 60%, rgba(17, 20, 18, 0)); }
.top-c { position: absolute; bottom: 26px; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 10px; pointer-events: none; z-index: 3; }
.pill { display: inline-flex; align-items: center; gap: 8px; font: 500 12.5px/1 var(--ui); color: var(--ink2); padding: 8px 13px 7px; border: 1px solid var(--line3); border-radius: 16px; background: rgba(19, 22, 20, .55); white-space: nowrap; }
.pill i { width: 6px; height: 6px; border-radius: 50%; background: var(--mute); }
.pill.live i { background: var(--g); } .pill.paper i { background: var(--ink2); }
.hold { font: 600 12.5px/1 var(--ui); color: var(--ink); padding: 8px 14px 7px; border: 1px solid rgba(255, 61, 46, .6); border-radius: 16px; background: rgba(19, 22, 20, .6); white-space: nowrap; }
.hold::before { content: ''; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--r); margin-right: 8px; vertical-align: 1px; }
/* the headline column */
.hero { position: absolute; left: var(--pad); top: calc(var(--hdr) + 46px); width: var(--hero-w); z-index: 2; }
.eyebrow { display: flex; align-items: center; gap: 9px; font: 500 13.5px/1 var(--ui); color: var(--ink2); letter-spacing: .01em; }
.eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--g); box-shadow: 0 0 0 4px rgba(197, 255, 61, .13); }
.hl { margin-top: 18px; font: 800 168px/.8 var(--disp); letter-spacing: -.025em; color: var(--ink); }
.hl-l { margin-top: 14px; font: 400 22px/1.2 var(--ui); color: var(--ink2); letter-spacing: -.005em; }
.lede { margin: 18px 0 0; font: 400 15.5px/1.6 var(--ui); color: var(--dim); max-width: 392px; }
.next { margin-top: 30px; max-width: 392px; }
.next-r { display: flex; justify-content: space-between; align-items: baseline; font: 400 13.5px/1 var(--ui); color: var(--dim); }
.next-r b { font-weight: 700; font-size: 18px; color: var(--ink); letter-spacing: .01em; margin-left: 4px; }
.next-r span:last-child b { margin: 0 3px 0 0; font-size: 15px; color: var(--ink2); }
.meter { position: relative; height: 2px; margin-top: 11px; background: rgba(243, 246, 241, .12); }
.meter i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--g); transition: width .8s cubic-bezier(.2, .7, .2, 1); }
.meter i::after { content: ''; position: absolute; right: -3px; top: -2px; width: 6px; height: 6px; border-radius: 50%; background: var(--g); }
.kpis { margin: 32px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 18px; max-width: 400px; }
.kpis div { min-width: 0; }
.kpis dt { font: 400 12.5px/1.2 var(--ui); color: var(--dim); display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.kpis dt i { width: 6px; height: 6px; border-radius: 50%; }
.k-on { background: var(--g); } .k-off { background: transparent; border: 1px solid #8a928b; }
.kpis dd { margin: 7px 0 0; font: 700 31px/1 var(--disp); color: var(--ink); letter-spacing: .005em; }
.kpis dd.g { color: var(--g); }
.how { display: inline-flex; gap: 8px; margin-top: 30px; font: 500 14px/1 var(--ui); color: var(--ink2); padding-bottom: 4px; border-bottom: 1px solid var(--line3); }
.how:hover { color: var(--ink); border-color: var(--g); } .how span { color: var(--g); }
/* the market cap, bottom left */
.mcbox { position: absolute; left: var(--pad); bottom: 30px; width: var(--hero-w); z-index: 2; }
.mc-h { display: flex; justify-content: space-between; align-items: center; font: 400 12.5px/1 var(--ui); color: var(--dim); }
.cb-tf { display: flex; gap: 2px; }
.cb-tf button { font: 500 11.5px/1 var(--mono); color: var(--mute); padding: 4px 6px; border-radius: 9px; }
.cb-tf button.on { color: var(--ink); background: rgba(243, 246, 241, .08); }
.mc-v { display: flex; align-items: baseline; gap: 12px; margin-top: 7px; }
.mc-v b { font: 700 30px/1 var(--disp); letter-spacing: .005em; }
.cb-ch { font: 600 14px/1 var(--disp); letter-spacing: .02em; color: var(--dim); }
.cb-ch.up { color: var(--g); } .cb-ch.dn { color: var(--r2); }
.cb-c { position: relative; height: 92px; margin-top: 10px; }
.cb-c canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.cb-empty { position: absolute; inset: 0; display: flex; align-items: center; color: var(--mute); font: 400 13px/1.4 var(--ui); border-top: 1px dashed var(--line2); }
.cb-leg { display: flex; gap: 18px; margin-top: 8px; font: 400 12px/1 var(--ui); color: var(--mute); }
.cb-leg i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }
.lg-dip { background: var(--r); } .lg-str { background: var(--g); }
.cb-hit { position: absolute; width: 30px; height: 30px; margin: -15px 0 0 -15px; border: 1.5px solid var(--r); border-radius: 50%; pointer-events: none; animation: cbhit .9s ease-out forwards; }
@keyframes cbhit { from { transform: scale(.2); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
/* the feed: a quiet column */
.feedcol { position: absolute; right: var(--pad); top: calc(var(--hdr) + 40px); bottom: 26px; width: var(--feed-w); display: flex; flex-direction: column; z-index: 2; }
.feed-h { display: flex; justify-content: space-between; align-items: baseline; padding-bottom: 12px; border-bottom: 1px solid var(--line2); }
.feed-h b { font: 600 14px/1 var(--ui); color: var(--ink); }
.chips { display: flex; gap: 2px; }
.chip { font: 500 12px/1 var(--ui); color: var(--mute); padding: 5px 7px; border-radius: 10px; }
.chip:hover { color: var(--ink2); }
.chip.on { color: var(--ink); background: rgba(243, 246, 241, .08); }
.feed { flex: 1; overflow-y: auto; overflow-x: hidden; scrollbar-width: none; contain: strict;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 90px), transparent); mask-image: linear-gradient(180deg, #000 0, #000 calc(100% - 90px), transparent); }
.feed::-webkit-scrollbar { display: none; }
.ev { display: grid; grid-template-columns: 14px 1fr auto; gap: 0 10px; align-items: start; padding: 11px 0 11px; border-bottom: 1px solid rgba(243, 246, 241, .055); transition: opacity .6s; }
.ev.fresh { opacity: .25; }
.ev-dot { width: 7px; height: 7px; border-radius: 50%; margin-top: 6px; background: var(--mute); }
.e-strike .ev-dot { background: var(--g); } .e-dip .ev-dot { background: var(--r); } .e-machine .ev-dot { background: transparent; border: 1.5px solid var(--g); }
.e-offline .ev-dot { background: transparent; border: 1px solid #8a928b; } .e-burn .ev-dot { background: var(--ink); } .e-claim .ev-dot { background: var(--ink2); opacity: .55; } .e-hold .ev-dot { background: var(--r); }
.ev-b { min-width: 0; }
.ev-b .l1 { font: 400 13.5px/1.4 var(--ui); color: var(--ink2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-b .who { font: 500 12.5px/1 var(--mono); color: var(--ink); margin-right: 6px; }
.ev-b .sub { font: 400 12px/1.3 var(--ui); color: var(--mute); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ev-a { text-align: right; font: 700 15px/1.3 var(--disp); font-variant-numeric: tabular-nums; color: var(--ink); white-space: nowrap; letter-spacing: .01em; }
.ev-a small, .ev-a a { display: block; font: 500 11px/1.4 var(--ui); color: var(--mute); letter-spacing: 0; }
.ev-a a:hover { color: var(--ink); }
.ev-a.g { color: var(--g); } .ev-a.r { color: var(--r2); }
.feed-empty { padding: 22px 0; color: var(--dim); font: 400 14px/1.55 var(--ui); }
/* the empty state */
.empty { position: absolute; left: 50%; bottom: 76px; transform: translateX(-50%); text-align: center; z-index: 2; pointer-events: none; }
.empty b { display: block; font: 700 26px/1.1 var(--disp); letter-spacing: .02em; color: var(--ink); }
.empty span { display: block; margin-top: 8px; font: 400 15px/1.45 var(--ui); color: var(--ink2); }
/* labels that ride the globe (placed by transform only) */
.tags { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.tag { position: absolute; left: 0; top: 0; will-change: transform; white-space: nowrap; color: var(--ink); opacity: 0; transition: opacity .3s; }
.tag.is-on { opacity: 1; }
.tag-m { font: 500 12px/1 var(--mono); padding: 6px 10px 5px 10px; background: rgba(15, 17, 16, .72); border: 1px solid rgba(197, 255, 61, .35); border-radius: 12px; }
.tag-m b { color: var(--g); font: 600 12px/1 var(--ui); margin-left: 8px; }
.tag-m em { font: 700 13px/1 var(--disp); font-style: normal; color: var(--ink2); margin-left: 6px; letter-spacing: .02em; }
.tag-core { text-align: left; }
.tag-core .k { font: 600 13px/1 var(--ui); color: var(--ink); letter-spacing: .01em; }
.tag-core .k i { font-style: normal; color: var(--g); font-family: var(--mono); font-weight: 500; }
.tag-core .v { margin-top: 6px; font: 400 12px/1 var(--ui); color: var(--dim); }
.tag-core .v b { color: var(--ink); font: 700 14px/1 var(--disp); letter-spacing: .02em; }
.tag-hover { padding: 10px 12px; background: rgba(15, 17, 16, .9); border: 1px solid var(--line3); border-radius: 10px; font: 400 12.5px/1.55 var(--ui); color: var(--ink2); min-width: 200px; transition: none; }
.tag-hover .h { font: 500 12.5px/1 var(--mono); color: var(--ink); margin-bottom: 8px; }
.tag-hover .h i { font-style: normal; color: var(--g); margin-right: 6px; }
.tag-hover .r { display: flex; justify-content: space-between; gap: 14px; }
.tag-hover .r b { font: 700 14px/1.5 var(--disp); color: var(--ink); letter-spacing: .02em; }

/* ---------------------------------------------------------------- other pages: type first, hairlines only */
.page { max-width: 1280px; margin: 0 auto; padding: 56px var(--pad) 90px; }
.page-bg { background: var(--bg); }
.pg-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; padding-bottom: 28px; flex-wrap: wrap; }
.pg-h h1 { margin: 0; font: 800 76px/.88 var(--disp); letter-spacing: -.015em; }
.pg-h p { margin: 16px 0 0; color: var(--dim); max-width: 640px; font-size: 16px; line-height: 1.6; }
.vp-mode { display: inline-flex; align-items: center; gap: 8px; font: 500 12.5px/1 var(--ui); color: var(--ink2); padding: 8px 13px 7px; border: 1px solid var(--line3); border-radius: 16px; white-space: nowrap; }
.vp-mode::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--mute); }
.vp-mode.live::before { background: var(--g); } .vp-mode.paper::before { background: var(--ink2); }
.strip { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0 28px; border-top: 1px solid var(--line2); padding-top: 22px; }
.strip > div { padding: 0; }
.kv-l { font: 400 12.5px/1.2 var(--ui); color: var(--dim); display: flex; align-items: center; gap: 6px; }
.kv-v { margin-top: 8px; font: 700 34px/1 var(--disp); font-variant-numeric: tabular-nums; color: var(--ink); letter-spacing: .005em; }
.kv-v small { font: 600 14px/1 var(--disp); color: var(--dim); margin-left: 4px; }
.dot-on { background: var(--g); }
.tools { display: flex; gap: 10px; align-items: center; justify-content: space-between; margin: 46px 0 12px; flex-wrap: wrap; }
.search { height: 36px; width: 300px; max-width: 100%; background: transparent; border: 1px solid var(--line2); border-radius: 18px; color: var(--ink); padding: 0 16px; font: 400 13.5px var(--ui); outline: none; }
.search:focus { border-color: var(--ink2); }
.tbl-wrap { overflow-x: auto; border-top: 1px solid var(--line2); }
table.tbl { width: 100%; border-collapse: collapse; font-size: 14px; }
.tbl th { text-align: left; font: 500 12.5px/1 var(--ui); color: var(--dim); padding: 16px 12px 12px; border-bottom: 1px solid var(--line2); white-space: nowrap; position: sticky; top: 0; background: var(--bg); cursor: default; }
.tbl th:first-child, .tbl td:first-child { padding-left: 0; } .tbl th:last-child, .tbl td:last-child { padding-right: 0; }
.tbl th.sort { cursor: pointer; } .tbl th.sort:hover { color: var(--ink); } .tbl th.on { color: var(--ink); }
.tbl th.r, .tbl td.r { text-align: right; }
.tbl td { padding: 0 12px; height: 46px; border-bottom: 1px solid rgba(243, 246, 241, .055); white-space: nowrap; color: var(--ink2); }
.tbl tr:hover td { background: rgba(243, 246, 241, .025); }
.tbl td.n { font: 700 16px/1 var(--disp); font-variant-numeric: tabular-nums; color: var(--ink); }
.tbl td.m { font: 400 12.5px/1 var(--mono); color: var(--dim); }
.tbl td.m a:hover, .tbl td a.lnk:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.tbl td.nm { font: 500 13px/1 var(--mono); color: var(--ink); }
.tbl td.tm { font: 500 15px/1 var(--disp); font-variant-numeric: tabular-nums; color: var(--dim); letter-spacing: .02em; }
.st { font: 500 12px/1 var(--ui); display: inline-flex; align-items: center; gap: 7px; }
.st::before { content: ''; width: 7px; height: 7px; border-radius: 50%; }
.st-online { color: var(--ink); } .st-online::before { background: var(--g); }
.st-offline { color: var(--dim); } .st-offline::before { border: 1px solid #8a928b; width: 6px; height: 6px; }
.tbl .g { color: var(--g); } .tbl .rd { color: var(--r2); }
.tbl-empty { padding: 48px 0; color: var(--dim); }
.ev-k { display: inline-flex; align-items: center; gap: 7px; font: 500 12.5px/1 var(--ui); color: var(--ink2); }
.ev-k::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--mute); }
.k-strike::before { background: var(--g); } .k-dip::before { background: var(--r); } .k-machine::before { background: transparent; border: 1.5px solid var(--g); width: 5px; height: 5px; }
.k-offline::before { background: transparent; border: 1px solid #8a928b; width: 6px; height: 6px; } .k-burn::before { background: var(--ink); } .k-claim::before { background: var(--ink2); opacity: .55; } .k-hold::before { background: var(--r); }
.more { display: block; margin: 22px auto 0; font: 500 13.5px/1 var(--ui); color: var(--ink2); padding: 12px 20px; border: 1px solid var(--line3); border-radius: 20px; }
.more:hover { color: var(--ink); border-color: var(--ink2); }
.chips-p { display: flex; gap: 4px; flex-wrap: wrap; }
/* rules */
.rules { display: grid; grid-template-columns: 1fr 360px; gap: 0 72px; margin-top: 18px; }
.steps { counter-reset: s; }
.step { display: grid; grid-template-columns: 72px 1fr; gap: 0 20px; padding: 30px 0 32px; border-top: 1px solid var(--line2); }
.step::before { counter-increment: s; content: '0' counter(s); font: 700 34px/1 var(--disp); color: var(--g); font-variant-numeric: tabular-nums; }
.step h2 { margin: 0 0 10px; font: 700 30px/1.05 var(--disp); letter-spacing: .005em; }
.step p { margin: 0 0 10px; color: var(--dim); max-width: 660px; font-size: 16px; line-height: 1.65; }
.step p b { color: var(--ink); font-weight: 600; }
.step .num { color: var(--ink); font-weight: 700; font-size: 18px; }
.side { align-self: start; position: sticky; top: calc(var(--hdr) + 24px); }
.side .pnl { padding: 0 0 26px; margin-bottom: 26px; border-bottom: 1px solid var(--line2); }
.side .pnl:last-child { border-bottom: 0; }
.pnl-h { display: flex; align-items: baseline; justify-content: space-between; font: 600 14px/1 var(--ui); color: var(--ink); margin-bottom: 14px; }
.pnl-h .s { font: 400 12.5px/1 var(--ui); color: var(--dim); }
.rows { display: flex; flex-direction: column; }
.rows > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 9px 0; border-bottom: 1px solid rgba(243, 246, 241, .055); font-size: 14px; color: var(--dim); }
.rows > div:last-child { border-bottom: 0; }
.rows b { font: 700 18px/1 var(--disp); font-variant-numeric: tabular-nums; color: var(--ink); letter-spacing: .02em; }
.rows b a { color: var(--ink); } .rows b a:hover { color: var(--g); }
.honest { margin-top: 10px; padding: 24px 0 0 24px; border-left: 2px solid var(--g); color: var(--dim); max-width: 740px; font-size: 15.5px; line-height: 1.65; }
.honest b { color: var(--ink); }
.foot { border-top: 1px solid var(--line); margin-top: 72px; padding-top: 22px; display: flex; justify-content: space-between; gap: 20px; flex-wrap: wrap; color: var(--mute); font: 400 13px/1.5 var(--ui); }
.e404 { min-height: 60vh; display: grid; place-items: center; text-align: center; }
.e404 b { font: 800 140px/1 var(--disp); color: var(--line3); display: block; }

/* ---------------------------------------------------------------- fps meter (?fps=1), clean frame (?clean=1) */
.fps { position: fixed; left: 8px; bottom: 8px; z-index: 50; font: 600 11px/1.4 var(--mono); color: var(--g); background: rgba(0, 0, 0, .7); padding: 6px 8px; pointer-events: none; white-space: pre; }
.clean .hero, .clean .mcbox, .clean .feedcol, .clean .top-c, .clean .scrim, .clean .bar { display: none !important; }
.clean .view { left: 0; right: 0; }

/* ---------------------------------------------------------------- narrower screens */
@media (max-width: 1500px) { :root { --hero-w: 380px; --feed-w: 312px; --pad: 40px; } .hl { font-size: 140px; } .kpis dd { font-size: 28px; } }
@media (max-width: 1360px) {
  .bar { gap: 26px; } .nav { gap: 20px; }
  .ca-addr span { max-width: 132px; }
  .ca-link[id="t-ca-chart"] { display: none; }
}
@media (min-width: 861px) and (max-height: 860px) { .hl { font-size: 118px; } .hero { top: calc(var(--hdr) + 26px); } .lede { display: none; } .next { margin-top: 22px; } .kpis { margin-top: 22px; gap: 16px 16px; } .how { display: none; } .cb-c { height: 70px; } .cb-leg { display: none; } }
@media (max-width: 1180px) { :root { --hero-w: 320px; --feed-w: 280px; --pad: 28px; } .hl { font-size: 112px; } .kpis dd { font-size: 24px; } .live span { display: none; } .scrim-l { width: calc(var(--hero-w) + 90px); } }
@media (max-width: 1000px) { .ca-link { display: none; } .ca-addr span { max-width: 96px; } }
/* phone / small tablet: the globe on top, the story stacked under it, the page scrolls */
@media (max-width: 860px) {
  :root { --hdr: 56px; --pad: 18px; }
  .p-globe { overflow: auto; }
  .bar { gap: 10px; padding: 0 14px; }
  .brand-name { font-size: 20px; } .brand-tick { display: none; } .brand-mark { width: 30px; height: 30px; }
  .nav { position: fixed; left: 0; right: 0; bottom: 0; height: 54px; background: rgba(15, 17, 16, .96); border-top: 1px solid var(--line); z-index: 40; justify-content: space-around; gap: 0; padding-bottom: env(safe-area-inset-bottom); }
  .nav a { border-bottom: 0; border-top: 1.5px solid transparent; margin: -1px 0 0; font-size: 14px; padding: 0 8px; }
  .nav a.on { border-top-color: var(--g); }
  body { padding-bottom: 54px; }
  .live { display: none; }
  .ca-lab { padding: 0 6px 0 11px; } .ca-addr { gap: 8px; } .ca-addr span { max-width: 74px; }
  .stage { height: auto; min-height: 0; display: flex; flex-direction: column; }
  .view { position: relative; inset: auto; left: auto; right: auto; height: 66svh; min-height: 420px; max-height: 620px; }
  .scrim { display: none; }
  .top-c { bottom: 12px; }
  .pill { font-size: 11.5px; padding: 6px 10px 5px; }
  .hero, .mcbox, .feedcol { position: relative; inset: auto; left: auto; right: auto; top: auto; bottom: auto; width: auto; padding: 0 var(--pad); }
  .hero { order: 1; margin-top: 8px; }
  .hl { font-size: 104px; margin-top: 14px; } .hl-l { font-size: 19px; }
  .lede { font-size: 15px; }
  .kpis { grid-template-columns: repeat(3, 1fr); gap: 18px 12px; } .kpis dd { font-size: 26px; }
  .how { display: none; }
  .mcbox { order: 2; margin-top: 34px; }
  .feedcol { order: 3; margin-top: 34px; height: 520px; }
  .empty { bottom: auto; top: calc(66svh - 70px); width: 90%; }
  .empty b { font-size: 21px; } .empty span { font-size: 13.5px; }
  .tag-m { font-size: 10.5px; padding: 5px 8px 4px; } .tag-m b { font-size: 10.5px; margin-left: 6px; } .tag-m em { font-size: 11.5px; }
  .tag-core .v { display: none; }
  .page { padding: 28px var(--pad) 70px; } .pg-h h1 { font-size: 52px; }
  .rules { grid-template-columns: 1fr; } .side { position: static; margin-top: 30px; }
  .step { grid-template-columns: 48px 1fr; } .step::before { font-size: 26px; } .step h2 { font-size: 24px; }
  .tbl .hide-s { display: none; }
}
@media (prefers-reduced-motion: reduce) { .meter i { transition: none; } .cb-hit { animation: none; display: none; } }