/* ============================================================================
   if you did nothing — PRISM application layer

   prism-tokens.css is the design language, copied in verbatim and never edited.
   This file maps the site's existing class vocabulary onto it, so all fifteen
   pages adopt the look without their markup, behaviour, data or copy changing.

   Per REBRAND.md:
   - #050505 ground, every panel a #161616→#0a0a0a gradient, radius 0 everywhere
   - ALL structure framed 2px acid #ccff00; no grey hairlines
   - no small skinny grey text: every label/subtext is white, >=12px, weight >=700
   - Archivo 900 UPPERCASE display + JetBrains Mono for everything else
   - exactly one inverted acid block per page: the hero scoreboard (.hero/.live)
   - secondary metrics are the dark strip (.row)
   - buttons and tabs INVERT on hover; cards lift
   - fixed acid ticker on every page, body padded 52px for it

   Load-bearing rules carried across every reskin — do not "tidy":
   - .fill and .hb-fill are display:block. They sit inside flex ITEMS, and an
     inline fill silently ignores width, so every bar renders as nothing.
   - .soon is flex + nowrap so the badge never tears across two lines.
   - body is a column flex container and .wrap absorbs spare height; that is
     the sticky footer. The footer is a sibling of .wrap, never inside it.
   - --neg --pos --dim --fg --rule-strong --s5 are written from JS as inline
     styles. Those names must keep existing whatever the palette becomes.
   ========================================================================== */
@import url("./prism-tokens.css");

:root{
  /* legacy names the JS still writes inline, remapped onto PRISM accents */
  --fg:var(--ink);
  --dim:var(--ink);
  --faint:var(--ink-quiet);
  --bg:#050505;
  --neg:var(--hot);
  --pos:var(--acid);
  --rule:rgba(204,255,0,.55);
  --rule-strong:#ccff00;

  /* loss/gain that still read on the acid slab, where --hot cannot */
  --hot-on-acid:#7a1400;
  --pos-on-acid:#0f3d00;

  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:72px; --s9:104px;

  --sans:var(--font-mono);
  --mono:var(--font-mono);
  --measure:1360px;
}

/* prism-tokens.css does not reset the box model, and every full-bleed element
   here is width:100% PLUS padding. Without this the footer computes 3801px wide
   on a 2560px screen and its last column (TOKEN / CA) falls off the right edge,
   where body{overflow-x:hidden} makes it unreachable. */
*,*::before,*::after{box-sizing:border-box}

/* tokens pad html AND body; one is enough or the ticker gap doubles */
html{padding-bottom:0}
body{
  min-height:100vh; display:flex; flex-direction:column;
  font-size:14px; line-height:1.6; font-weight:var(--w-body);
  overflow-x:hidden;
}
::selection{background:var(--acid); color:#000}
:focus-visible{outline:2px solid var(--acid); outline-offset:2px}

.wrap{
  flex:1 0 auto; width:100%; max-width:var(--measure); margin:0 auto;
  padding:0 var(--pad-x) var(--s8);
}
.hidden{display:none}

/* ---------- shell: header ------------------------------------------------ */
.masthead{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  margin:0 calc(50% - 50vw) 46px;
  padding:14px max(var(--pad-x), calc(50vw - var(--measure) / 2 + var(--pad-x)));
  border-bottom:var(--border);
  background:linear-gradient(180deg,#151515 0%,#0a0a0a 100%);
  box-shadow:0 6px 18px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.07);
}
.mark{display:flex; align-items:center; gap:14px; color:var(--ink); text-decoration:none; white-space:nowrap}
.mark::before{content:""; width:16px; height:16px; flex:none; background:var(--acid); box-shadow:0 0 0 3px rgba(204,255,0,.18)}
.mark b{font-family:var(--font-display); font-weight:900; font-size:18px; letter-spacing:.06em}
.mark span{font-size:12px; font-weight:700; letter-spacing:.2em; color:var(--ink)}
.masthead nav{display:flex; align-items:center; gap:20px; font-size:12px; font-weight:700; letter-spacing:.16em; color:var(--ink); text-transform:uppercase; white-space:nowrap}
.masthead nav a{color:var(--ink)}
.masthead nav a:hover{color:var(--acid)}
.masthead .here{color:var(--acid)}
.netdot{display:flex; align-items:center; gap:8px}

/* ---------- page head ---------------------------------------------------- */
.marker{display:flex; align-items:center; gap:10px; font-size:13px; font-weight:800; letter-spacing:.22em; color:var(--ink); text-transform:uppercase; margin-bottom:16px}
.marker::before{content:""; width:12px; height:12px; flex:none; background:var(--acid); box-shadow:0 0 0 3px rgba(204,255,0,.18)}

h1{
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-hero);
  line-height:.88; letter-spacing:-.02em; text-transform:uppercase; margin:0;
  max-width:1180px; text-shadow:0 6px 0 rgba(0,0,0,.9);
}
.sub{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  margin:22px 0 0; font-size:13px; font-weight:800; letter-spacing:.14em;
  color:var(--ink); text-transform:uppercase;
}
h2{
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-h2);
  line-height:.9; letter-spacing:-.02em; text-transform:uppercase;
  margin:56px 0 0; padding-bottom:16px; border-bottom:var(--border);
  text-shadow:0 5px 0 rgba(0,0,0,.9);
}

/* detail pages: title at display-h2, and their sub is a real sentence, so it
   keeps sentence case instead of the index's uppercase spec row */
.toolpage h1{font-size:var(--fs-h2); line-height:.9; text-shadow:0 5px 0 rgba(0,0,0,.9)}
.toolpage .sub{display:block; text-transform:none; letter-spacing:.02em; font-size:14px; font-weight:700; max-width:80ch; line-height:1.6}

/* ---------- forms -------------------------------------------------------- */
form{display:flex; gap:10px; flex-wrap:wrap; align-items:stretch; margin-top:26px}
input[type=text],input:not([type]){flex:1 1 320px; min-width:0}

button{
  background:#0a0a0a; border:var(--border); color:var(--acid); padding:11px 18px;
  font-family:var(--font-mono); font-weight:800; font-size:var(--fs-meta);
  letter-spacing:.16em; text-transform:uppercase; cursor:pointer;
  box-shadow:0 3px 0 rgba(90,120,0,.6);
  transition:background 110ms ease, color 110ms ease;
}
button:hover{background:var(--acid); color:#000; box-shadow:var(--btn-drop)}
button:active{transform:translateY(2px); box-shadow:0 1px 0 rgba(90,120,0,.9)}
button:disabled{opacity:.45; cursor:default; transform:none}
.ghost{background:#101010; color:var(--ink); border:var(--border-in); box-shadow:none}
.ghost:hover{background:var(--acid); color:#000}

.status{
  margin-top:16px; min-height:20px; color:var(--ink);
  font-size:12.5px; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.err{color:var(--hot)}

/* ---------- THE ONE INVERTED BLOCK: hero scoreboard ---------------------- */
/* the number and its reading share the slab, so a one-figure hero fills the
   board the way the five-cell index board does instead of leaving dead acid */
.hero{
  margin-top:36px; padding:22px 24px 24px;
  background:var(--acid); color:#000; border:0;
  box-shadow:0 12px 0 rgba(70,95,0,.95), 0 22px 34px rgba(0,0,0,.75);
  display:grid; grid-template-columns:auto minmax(0,1fr); gap:0 32px; align-items:end;
}
.hero .label{grid-column:1 / -1; justify-self:start}
.hero .note{padding-bottom:10px; border-left:3px solid #000; padding-left:24px}
.hero .label{
  display:inline-block; background:#000; color:var(--acid); padding:4px 9px;
  font-size:12px; font-weight:800; letter-spacing:.18em; text-transform:uppercase;
}
.big{
  display:block; margin-top:14px;
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-hero);
  line-height:.92; letter-spacing:-.02em; color:#000;
  font-variant-numeric:tabular-nums;
}
.big.bad{color:var(--hot-on-acid)} .big.good{color:var(--pos-on-acid)}
.note{margin:14px 0 0; font-size:14px; font-weight:800; letter-spacing:.04em; line-height:1.5; color:#000; max-width:60ch}

/* ---------- secondary metrics: the dark strip ---------------------------- */
.row{
  display:grid; grid-auto-flow:column; grid-auto-columns:1fr; margin-top:14px;
  border:var(--border); background:var(--panel-flat);
  box-shadow:0 8px 20px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.05);
}
.card{padding:15px 22px; border-right:var(--border-in); display:flex; flex-direction:column; gap:10px; justify-content:center}
.card:last-child{border-right:0}
.card .k{font-size:12.5px; font-weight:800; letter-spacing:.16em; color:var(--ink); text-transform:uppercase}
.card .v{font-family:var(--font-display); font-weight:900; font-size:var(--fs-stat); letter-spacing:-.01em; color:var(--acid); text-shadow:var(--text-emboss); font-variant-numeric:tabular-nums}

/* ---------- tables: full-bleed, acid frame, mono ------------------------- */
.scroll{overflow-x:auto; margin-top:14px}
table{width:100%; border-collapse:collapse; border:var(--border); background:var(--panel-flat); font-family:var(--font-mono); font-size:12.5px; font-weight:700}
td{padding:11px 14px; border-top:var(--border-in); color:var(--ink); vertical-align:middle}
tr:first-child td{border-top:0}
tbody tr:hover td{background:rgba(204,255,0,.09)}
td:first-child{white-space:nowrap; font-weight:800; color:var(--hot); font-variant-numeric:tabular-nums}
td:last-child{text-align:right}
td a{color:var(--acid); font-weight:700}
td a:hover{color:#fff}

/* ---------- disclosure panels ------------------------------------------- */
.foot{
  margin-top:56px; padding:26px 24px;
  border:var(--border); background:var(--panel);
  box-shadow:0 8px 0 rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.07);
  font-size:15px; font-weight:600; line-height:1.65; color:var(--ink); max-width:none;
}
.foot b{color:var(--acid); font-weight:800}

/* ---------- share card --------------------------------------------------- */
.actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:32px}
.actions button{flex:0 0 auto}
#cardwrap{margin-top:22px}
#card{width:100%; max-width:660px; display:block; border:var(--border); box-shadow:var(--lift)}
#cardwrap .actions{margin-top:14px}

/* ---------- credit score gauge ------------------------------------------ */
.gauge{margin-top:22px; height:22px; border:var(--border); background:var(--hatch); overflow:hidden}
.gauge-fill{display:block; height:100%; width:0; min-width:4px; background:var(--acid); box-shadow:var(--btn-drop)}
.gauge-scale{display:flex; justify-content:space-between; margin-top:10px; font-size:12px; font-weight:800; letter-spacing:.14em; color:var(--ink)}

/* ---------- wage: benchmark bars ---------------------------------------- */
.bench{margin-top:22px; border:var(--border); background:var(--panel); box-shadow:var(--lift); padding:0 22px}
.barrow{display:flex; align-items:center; gap:18px; padding:14px 0; border-top:var(--border-in); font-size:12.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase}
.barrow:first-child{border-top:0}
.who{width:150px; flex:none; color:var(--ink)}
.barrow.me{margin:0 -22px; padding-left:22px; padding-right:22px; background:rgba(204,255,0,.10)}
.barrow.me .who{color:var(--acid)}
.track{flex:1; height:14px; background:#000; border:var(--border-in)}
.fill{display:block; height:100%; min-width:3px; background:var(--acid)}
.amt{width:110px; flex:none; text-align:right; color:var(--acid); font-family:var(--font-display); font-weight:900; font-size:15px; font-variant-numeric:tabular-nums}
.barrow.me .amt{color:#fff}

.knob{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:14px; padding:15px 22px; border:var(--border); background:var(--panel-flat); box-shadow:var(--lift-strip); font-size:12.5px; font-weight:800; letter-spacing:.14em; color:var(--ink); text-transform:uppercase}
.knob label{flex:0 0 auto}
.knob input[type=range]{flex:1 1 220px; accent-color:var(--acid); height:2px; padding:0; border:0; background:transparent; box-shadow:none}
.knob output{flex:0 0 auto; width:80px; text-align:right; color:var(--acid); font-family:var(--font-display); font-weight:900; font-size:16px; font-variant-numeric:tabular-nums}

/* ---------- autopsy: findings as lifted cells --------------------------- */
.findings{margin-top:22px; display:grid; gap:var(--grid-gap)}
.finding{padding:22px 22px 20px; border:var(--border); background:var(--panel); box-shadow:var(--lift); transition:transform 120ms ease, box-shadow 120ms ease}
.finding:hover{transform:translateY(-4px); box-shadow:var(--lift-hover)}
.f-head{display:flex; align-items:center; justify-content:space-between; gap:18px}
.f-title{font-size:12.5px; font-weight:800; letter-spacing:.16em; color:var(--ink); text-transform:uppercase}
.f-value{font-family:var(--font-display); font-weight:900; font-size:var(--fs-stat); letter-spacing:-.01em; color:var(--acid); text-shadow:var(--text-emboss); white-space:nowrap; font-variant-numeric:tabular-nums}
.f-value.bad{color:var(--hot)} .f-value.good{color:var(--acid)}
.f-line{margin-top:14px; font-size:14px; font-weight:600; line-height:1.55; color:var(--ink)}

/* ---------- autopsy: 24h clock ------------------------------------------ */
.clock{display:flex; gap:3px; align-items:flex-end; height:150px; margin-top:14px; padding:18px 18px 8px; border:var(--border); background:var(--panel-flat); box-shadow:var(--lift-strip)}
.hourbar{flex:1; display:flex; flex-direction:column; align-items:center; height:100%}
.hb-track{flex:1; width:100%; display:flex; align-items:flex-end}
.hb-fill{display:block; width:100%; min-height:2px; background:var(--acid)}
.hb-label{font-size:12px; font-weight:800; color:var(--ink); height:20px; line-height:20px; font-variant-numeric:tabular-nums}

/* ---------- wallet connect ---------------------------------------------- */
.wallet{position:relative; display:inline-block}
.wbtn{background:#0a0a0a; border:var(--border); color:var(--acid); padding:8px 16px; font-family:var(--font-mono); font-weight:800; font-size:var(--fs-meta); letter-spacing:.16em; text-transform:uppercase; cursor:pointer; box-shadow:0 3px 0 rgba(90,120,0,.6)}
.wbtn:hover{background:var(--acid); color:#000; box-shadow:var(--btn-drop)}
.wbtn.on{background:var(--acid); color:#000; box-shadow:var(--btn-drop)}
.wdot{display:inline-block; width:9px; height:9px; margin-right:9px; background:#000; vertical-align:middle}
.wpick{position:absolute; right:0; top:calc(100% + 10px); z-index:60; min-width:260px; background:#0a0a0a; border:var(--border); padding:8px; box-shadow:var(--lift)}
.wpick button{display:flex; align-items:center; gap:12px; width:100%; padding:11px 12px; background:#101010; border:var(--border-in); color:var(--ink); font-weight:800; font-size:12.5px; letter-spacing:.12em; text-align:left; cursor:pointer; box-shadow:none; margin-bottom:6px}
.wpick button:hover{background:var(--acid); color:#000}
.wpick img{width:20px; height:20px}
.wnoicon{width:20px; height:20px; border:var(--border-in)}
.wnote{margin:8px 0 2px; padding:0 4px; color:var(--ink); font-size:12px; font-weight:700; line-height:1.5; letter-spacing:.04em}

/* ---------- hub ---------------------------------------------------------- */
/* the live chain line is the home scoreboard: same inverted acid slab */
.live{margin-top:36px; background:var(--acid); color:#000; padding:0; box-shadow:0 12px 0 rgba(70,95,0,.95), 0 22px 34px rgba(0,0,0,.75)}
.live-k{display:flex; align-items:center; gap:10px; padding:11px 22px; background:#000; border-bottom:3px solid var(--acid); font-size:13px; font-weight:800; letter-spacing:.22em; color:var(--acid); text-transform:uppercase}
.live-k::before{content:""; width:9px; height:9px; flex:none; background:var(--acid); animation:p-blink 1.6s steps(1,end) infinite}
.live-k i{margin-left:auto; font-style:normal; font-size:12.5px; font-weight:800; letter-spacing:.18em; color:#fff}
.live-v{padding:22px; font-family:var(--font-display); font-weight:900; font-size:26px; line-height:1.25; letter-spacing:-.01em; color:#000; text-transform:uppercase; font-variant-numeric:tabular-nums}

.tabs{display:flex; margin-top:0}
.tab{border:var(--border-in); border-left:0; padding:10px 18px; background:#101010; font-family:var(--font-mono); font-weight:800; font-size:12.5px; letter-spacing:.14em; color:var(--ink); text-transform:uppercase; cursor:pointer; box-shadow:none; transition:background 110ms ease, color 110ms ease}
.tab:first-child{border-left:var(--border-in)}
.tab:hover{background:var(--acid); color:#000}
.tab.on,.tab.active{background:var(--acid); color:#000; border-color:var(--acid); box-shadow:var(--btn-drop)}

.gridclip{margin-top:22px}
.toolgrid{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--grid-gap)}
.tool{
  display:flex; flex-direction:column; gap:14px; padding:22px 22px 20px; min-height:192px;
  border:var(--border); background:var(--panel); color:var(--ink); text-decoration:none;
  box-shadow:var(--lift); transition:transform 120ms ease, box-shadow 120ms ease;
}
.tool:hover{transform:translateY(-4px); box-shadow:var(--lift-hover); color:var(--ink)}
.tool-meta{display:flex; justify-content:space-between; align-items:center; font-size:12px; font-weight:800; letter-spacing:.16em}
.tool-meta b{font-weight:800; color:var(--ink)}
.tool-meta span{background:var(--acid); color:#000; padding:4px 9px}
.tool-name{display:block; font-family:var(--font-display); font-weight:900; font-size:var(--fs-card); letter-spacing:.01em; text-transform:uppercase; line-height:1.05; text-shadow:0 3px 0 rgba(0,0,0,.85)}
.tool-blurb{display:block; font-size:14px; font-weight:600; line-height:1.55; color:var(--ink); text-wrap:pretty}
.tool-cta{margin-top:auto; font-size:12.5px; font-weight:800; letter-spacing:.2em; color:var(--acid)}
.tool-empty{background:var(--hatch); box-shadow:none; border:var(--border)}

/* ---------- fumble feed --------------------------------------------------- */
.feed{margin-top:22px; display:grid; gap:var(--grid-gap)}
.fumble{display:flex; gap:22px; align-items:center; padding:18px 22px; border:var(--border); background:var(--panel); box-shadow:var(--lift); transition:transform 120ms ease, box-shadow 120ms ease}
.fumble:hover{transform:translateY(-4px); box-shadow:var(--lift-hover)}
.fu-amt{flex:0 0 170px; text-align:right; font-family:var(--font-display); font-weight:900; font-size:32px; line-height:1; color:var(--hot); text-shadow:var(--text-emboss); font-variant-numeric:tabular-nums}
.fu-body{flex:1; min-width:0}
.fu-line{font-size:14px; font-weight:600; line-height:1.5; color:var(--ink)}
.fu-line b{font-weight:800; color:var(--acid)}
.fu-meta{margin-top:8px; font-size:12px; font-weight:700; letter-spacing:.1em; color:var(--ink); text-transform:uppercase}
.fu-meta a{color:var(--acid)}
.fu-x{color:var(--ink)}

/* ---------- who took it --------------------------------------------------- */
.winners{margin-top:14px}
.winners td{text-align:left}
.winners td:last-child{text-align:right}
.w-gain{color:var(--acid); font-weight:800; white-space:nowrap; font-variant-numeric:tabular-nums}
.w-bad{color:var(--hot)}
.w-dim{color:var(--ink)}
.winners a{color:var(--acid)}
.dimmer{color:var(--ink-quiet); font-weight:700}

/* ---------- rug check ------------------------------------------------------ */
.checks{margin:14px 0 0; padding:0; list-style:none; display:grid; gap:var(--grid-gap)}
.checks li{position:relative; padding:18px 22px 18px 62px; border:var(--border); background:var(--panel); box-shadow:var(--lift); color:var(--ink); font-size:14px; font-weight:600; line-height:1.55}
.checks li::before{position:absolute; left:18px; top:50%; transform:translateY(-50%); width:26px; height:26px; background:var(--acid); color:#000; font-family:var(--font-display); font-weight:900; font-size:15px; line-height:26px; text-align:center; content:"?"}
.checks li.bad{border-color:var(--hot)}
.checks li.bad::before{content:"X"; background:var(--hot); color:#fff}
.checks li.good::before{content:"OK"; font-size:12px; letter-spacing:.02em}

/* ---------- leaderboard ----------------------------------------------------- */
.lb-rank{width:56px; color:var(--ink); font-family:var(--font-display); font-weight:900; font-size:15px; font-variant-numeric:tabular-nums}
table td.lb-rank:first-child{color:var(--ink); font-weight:900}
.lb-addr a{color:var(--acid); font-weight:700}
.lb-main{font-family:var(--font-display); font-weight:900; font-size:20px; text-align:right; white-space:nowrap; color:var(--acid); font-variant-numeric:tabular-nums}
.lb-main.good{color:var(--acid)} .lb-main.bad{color:var(--hot)}
.lb-dim{color:var(--ink); font-size:12px; font-weight:700}
.lb-dim a{color:var(--acid)}

/* ---------- chips (token pickers) ------------------------------------------- */
.chips{display:flex; flex-wrap:wrap; gap:10px; margin-top:14px}
.chip{padding:9px 15px; background:#101010; border:var(--border-in); color:var(--ink); font-family:var(--font-mono); font-weight:800; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; cursor:pointer; box-shadow:none}
.chip:hover{background:var(--acid); color:#000}
.chip span{margin-left:9px; color:var(--acid); font-weight:800}
.chip:hover span{color:#000}

/* ---------- graveyard / misc tables ----------------------------------------- */
.g-name{color:var(--ink); font-weight:800; text-transform:uppercase}
table td:first-child.g-name{color:var(--ink)}
.g-num{color:var(--acid); font-weight:800; text-align:right; font-variant-numeric:tabular-nums}
.g-dim{color:var(--ink); font-weight:700}
.lookup{margin-top:56px; padding:26px 24px; border:var(--border); background:var(--panel); box-shadow:0 8px 0 rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.07); font-size:14px; font-weight:700}
.lookup a{color:var(--acid)}

/* ---------- wrapped (card story) --------------------------------------------- */
.slides{margin-top:22px; display:grid; gap:var(--grid-gap)}
.slide{padding:36px 26px; border:var(--border); background:var(--panel); box-shadow:var(--lift)}
.slide .label{display:inline-block; background:var(--acid); color:#000; padding:5px 11px; font-size:12.5px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; box-shadow:var(--btn-drop)}
.slide .figure{display:block; margin-top:18px; font-family:var(--font-display); font-weight:900; font-size:var(--fs-h2); line-height:.95; letter-spacing:-.02em; color:var(--acid); text-shadow:0 5px 0 rgba(0,0,0,.9); font-variant-numeric:tabular-nums}
.slide .figure.bad{color:var(--hot)} .slide .figure.good{color:var(--acid)}
.slide .say{margin-top:16px; font-size:15px; font-weight:600; line-height:1.65; color:var(--ink)}

/* ---------- battle ------------------------------------------------------------ */
.vs{display:grid; grid-template-columns:1fr auto 1fr; gap:0 18px; align-items:center; margin-top:22px; padding:6px 22px; border:var(--border); background:var(--panel-flat); box-shadow:var(--lift-strip)}
.vs-mid{color:var(--acid); font-weight:800; font-size:13px; letter-spacing:.2em}
.vs-row{display:contents}
.vs-cell{padding:14px 0; border-bottom:var(--border-in); font-family:var(--font-display); font-weight:900; font-size:17px; color:var(--ink); font-variant-numeric:tabular-nums}
.vs-cell.l{text-align:right} .vs-cell.r{text-align:left}
.vs-cell.win{color:var(--acid)}
.vs-cell.lose{color:var(--ink-quiet)}
.vs-k{text-align:center; padding:14px 0; border-bottom:var(--border-in); font-size:12px; font-weight:800; letter-spacing:.16em; color:var(--ink); text-transform:uppercase}

/* ---------- alt-life anchors ---------------------------------------------------- */
.anchors{margin-top:22px; border:var(--border); background:var(--panel); box-shadow:var(--lift); padding:0 22px}
.anchor{display:flex; justify-content:space-between; gap:18px; align-items:center; padding:15px 0; border-top:var(--border-in)}
.anchor:first-child{border-top:0}
.anchor .what{font-size:12.5px; font-weight:800; letter-spacing:.12em; color:var(--ink); text-transform:uppercase}
.anchor .howmany{font-family:var(--font-display); font-weight:900; font-size:20px; color:var(--acid); font-variant-numeric:tabular-nums}

/* ---------- shell: footer + ticker ---------------------------------------------- */
.sitefoot{
  flex:none; width:100%; margin:56px 0 0;
  padding:36px max(var(--pad-x), calc(50vw - var(--measure) / 2 + var(--pad-x))) 44px;
  border-top:var(--border);
  background:linear-gradient(180deg,#101010 0%,#050505 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
.foot-cols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:32px}
.foot-col{display:flex; flex-direction:column; align-items:flex-start; gap:12px; font-size:13.5px; font-weight:700; letter-spacing:.08em; color:var(--ink); text-transform:uppercase}
.foot-col a{color:var(--ink)}
.foot-col a:hover{color:var(--acid)}
.foot-k{display:inline-block; background:var(--acid); color:#000; padding:5px 10px; font-size:12px; font-weight:800; letter-spacing:.18em; margin-bottom:6px}
.foot-mark{display:flex; align-items:center; gap:12px; font-family:var(--font-display); font-weight:900; font-size:15px; letter-spacing:.06em; color:var(--ink)}
.foot-mark::before{content:""; width:14px; height:14px; flex:none; background:var(--acid); box-shadow:0 0 0 3px rgba(204,255,0,.18)}
.foot-brand p{margin:0; font-size:13.5px; font-weight:700; line-height:1.7; letter-spacing:.04em; color:var(--ink); text-transform:uppercase}
.foot-year{font-size:12.5px; font-weight:700; letter-spacing:.18em; color:var(--ink-quiet)}
.soon{display:flex; flex-wrap:nowrap; align-items:center; gap:9px; color:var(--ink)}
.soon em{flex:none; white-space:nowrap; font-style:normal; border:var(--border-in); padding:2px 7px; font-size:12px; font-weight:800; letter-spacing:.14em; color:var(--acid); text-transform:uppercase}
/* the footer token cell is only the ticker; clicking it jumps to the CA strip */
.foot-tick{
  display:inline-flex; align-items:center; gap:9px; padding:9px 14px;
  background:#101010; border:var(--border-in); color:var(--acid);
  font-family:var(--font-display); font-weight:900; font-size:18px; letter-spacing:.04em;
}
.foot-tick:hover{background:var(--acid); color:#000}
.foot-tick em{
  font-style:normal; font-family:var(--font-mono); font-size:12px; font-weight:800;
  letter-spacing:.14em; border:var(--border-in); padding:2px 7px; text-transform:uppercase;
}
.foot-tick:hover em{border-color:#000}
.foot-addr{color:var(--acid); font-size:12px; font-weight:700}

/* ---------- sticky contract-address strip -------------------------------- */
/* sits under the masthead on every page, above page content, never over the
   header. scroll-margin keeps the #ca anchor clear of the sticky header. */
.p-ca{
  position:sticky; top:0; z-index:40; display:flex; align-items:stretch;
  margin:-46px calc(50% - 50vw) 46px;
  padding:0 max(var(--pad-x), calc(50vw - var(--measure) / 2 + var(--pad-x)));
  background:#0a0a0a; border-bottom:var(--border);
  box-shadow:0 6px 16px rgba(0,0,0,.8);
  scroll-margin-top:80px;
}
.p-ca__tag{
  display:flex; align-items:center; gap:10px; padding:11px 20px;
  background:var(--acid); color:#000;
  font-size:12.5px; font-weight:800; letter-spacing:.2em; white-space:nowrap;
}
.p-ca__tag em{font-style:normal; border:2px solid rgba(0,0,0,.55); padding:1px 6px; font-size:12px; text-transform:uppercase}
.p-ca__addr{
  flex:1; display:flex; align-items:center; padding:0 18px; min-width:0; color:#fff;
  font-family:var(--font-mono); font-size:13.5px; font-weight:700; letter-spacing:.06em;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.p-ca__btn{
  display:flex; align-items:center; padding:0 20px; border:0;
  border-left:var(--border-in); background:#0a0a0a; color:var(--acid);
  font-family:var(--font-mono); font-size:12.5px; font-weight:800; letter-spacing:.18em;
  cursor:pointer; text-decoration:none; white-space:nowrap; box-shadow:none;
  transition:background 110ms ease, color 110ms ease;
}
.p-ca__btn:hover{background:var(--acid); color:#000}
.p-ca__btn--ghost{color:#fff}
/* flash when the footer ticker jumps here, so the destination is obvious */
.p-ca--flash{animation:p-ca-flash 1.1s ease}
@keyframes p-ca-flash{
  0%,100%{background:#0a0a0a}
  15%,45%{background:rgba(204,255,0,.22)}
}
@media (max-width:700px){
  .p-ca{flex-wrap:wrap; padding:0}
  .p-ca__addr{order:3; width:100%; padding:10px 16px; font-size:12px; border-top:2px solid rgba(204,255,0,.25)}
}

.ticker{position:fixed; inset:auto 0 0 0; height:38px; background:var(--acid); color:#000; overflow:hidden; display:flex; align-items:center; border-top:2px solid #000; box-shadow:0 -10px 24px rgba(0,0,0,.7); z-index:50}
.ticker-track{display:flex; width:200%; white-space:nowrap; font-size:13px; font-weight:800; letter-spacing:.16em; animation:p-ticker 38s linear infinite}
.ticker-track span{padding:0 22px}
@keyframes p-ticker{from{transform:translateX(0)} to{transform:translateX(-50%)}}


/* ---------- home: scoreboard cells, strip, tool head, panels -------------- */
.board{display:grid; grid-template-columns:repeat(5,1fr)}
.board-cell{padding:22px 22px 20px; border-right:3px solid #000}
.board-cell:last-child{border-right:0}
.board-k{display:inline-block; background:#000; color:var(--acid); padding:4px 9px; font-size:12px; font-weight:800; letter-spacing:.18em; margin-bottom:14px}
.board-v{display:flex; align-items:baseline; gap:8px; font-family:var(--font-display); font-weight:900; font-size:42px; line-height:.95; letter-spacing:-.02em; color:#000; font-variant-numeric:tabular-nums}
.board-v i{font-family:var(--font-mono); font-style:normal; font-size:13px; font-weight:800; letter-spacing:.12em; color:rgba(0,0,0,.7)}
.board-s{font-size:12.5px; font-weight:800; letter-spacing:.08em; color:#000; margin-top:10px}

.strip{display:grid; grid-auto-flow:column; grid-auto-columns:1fr; margin-top:14px; border:var(--border); background:var(--panel-flat); box-shadow:0 8px 20px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.05)}
.strip > div{padding:15px 22px; border-right:var(--border-in); display:flex; justify-content:space-between; gap:16px; align-items:center}
.strip > div:last-child{border-right:0}
.strip span{font-size:12.5px; font-weight:800; letter-spacing:.16em; color:var(--ink); text-transform:uppercase}
.strip b{font-family:var(--font-display); font-weight:900; font-size:15px; letter-spacing:.03em; color:var(--hot)}

.toolhead{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; border-bottom:var(--border); padding-bottom:16px; margin-top:8px}
.toolhead h2{margin:0; padding:0; border-bottom:0}

/* the hero spec row: acid chips then one white spec string */
.sub b{background:var(--acid); color:#000; padding:6px 12px; font-weight:800; box-shadow:var(--btn-drop)}
.sub i{font-style:normal; font-weight:700; letter-spacing:.08em; padding-left:6px; color:var(--ink)}

.panels{display:grid; grid-template-columns:1fr 1fr; gap:var(--grid-gap); margin-top:56px}
.panels .foot{margin-top:0}
.panels .foot p{margin:16px 0 0}
.foot .foot-k{margin-bottom:0}
.foot--hot .foot-k{background:var(--hot); color:#fff}

@media (max-width:1200px){ .board{grid-template-columns:repeat(2,1fr)} .board-cell{border-bottom:3px solid #000} }
@media (max-width:700px){
  .board,.panels{grid-template-columns:1fr}
  .strip{grid-auto-flow:row}
  .toolhead{flex-direction:column; align-items:flex-start; gap:16px}
  .tabs{flex-wrap:wrap}
}

/* ---------- responsive ------------------------------------------------------------ */
@media (max-width:1200px){
  .toolgrid{grid-template-columns:repeat(2,1fr)}
  .foot-cols{grid-template-columns:1fr 1fr}
  .row{grid-auto-flow:row}
  .card{border-right:0; border-bottom:var(--border-in)}
  .card:last-child{border-bottom:0}
}
@media (max-width:700px){
  .hero{grid-template-columns:1fr}
  .hero .note{border-left:0; padding-left:0; padding-bottom:0}
  .toolgrid,.foot-cols{grid-template-columns:1fr}
  .masthead{flex-wrap:wrap; gap:12px}
  .masthead nav{gap:12px; font-size:12px}
  .fumble{flex-direction:column; align-items:flex-start; gap:12px}
  .fu-amt{flex:none; text-align:left}
  .who{width:110px}
  .amt{width:88px}
  td{padding:10px}
  .scroll td{white-space:nowrap}
  .vs{grid-template-columns:1fr auto 1fr; padding:6px 12px}
  .live-v{font-size:19px; padding:18px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important; transition:none !important}
}