/* ============================================================
   WC26 · MODERN PIXEL-ART THEME  (additive layer, loaded LAST)
   ------------------------------------------------------------
   Reskins the editorial black/white/gold look (style.css +
   theme-nike.css) into a clean, modern pixel-art / arcade UI:
   chunky square panels, hard offset shadows, notched corners,
   pixel fonts, a Sweetie-16-derived night-stadium palette.
   REVERSIBLE: remove the theme-pixel.css <link> to restore.
   Fonts: Pixelify Sans (UI/body) + Press Start 2P (numbers/labels).
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&family=Pixelify+Sans:wght@400;500;600;700&display=swap');

/* ---------- palette: night-stadium arcade (dark = default) ---------- */
:root{
  --px-bg:#000000; --px-bg2:#000000; --px-ink:#000000;
  --px-surface:#000000; --px-surface2:#0c0c12; --px-raise:#17171f;
  --px-line:#ffffff; --px-line2:#ffffff;
  --px-txt:#f4f4f4; --px-muted:#a6aabe;
  --px-gold:#ffcd75; --px-gold2:#ef9a3d; --px-orange:#ef7d57;
  --px-green:#a7f070; --px-green2:#3fbf6b; --px-red:#ff5277; --px-red2:#e23b5a;
  --px-cyan:#73eff7; --px-blue:#41a6f6; --px-purple:#b08bff;

  /* re-point the inherited design tokens so var()-driven rules recolor too */
  --bg:var(--px-bg); --bg2:var(--px-bg2); --surface:var(--px-surface); --surface2:var(--px-surface2);
  --ink:var(--px-ink); --card:var(--px-surface); --card2:var(--px-surface2);
  --line:var(--px-line); --line2:var(--px-line2);
  --txt:var(--px-txt); --muted:var(--px-muted);
  --gold:var(--px-gold); --gold2:var(--px-gold2);
  --pos:var(--px-green); --neg:var(--px-red); --up:var(--px-green); --down:var(--px-red);
  --purple:var(--px-gold); --purple2:var(--px-gold2);

  /* hard pixel drop shadow */
  --px-sh:5px 5px 0 0 rgba(255,255,255,.10);
  --px-sh-sm:3px 3px 0 0 rgba(255,255,255,.12);
  --px-sh-lift:8px 8px 0 0 rgba(255,255,255,.16);
}
:root[data-theme="light"]{
  --px-bg:#e9e6da; --px-bg2:#dad6c6; --px-ink:#b7b09a;
  --px-surface:#fffdf4; --px-surface2:#f3efe0; --px-raise:#fffbe9;
  --px-line:#2b2a3f; --px-line2:#4a4866;
  --px-txt:#1c1b2a; --px-muted:#5b586f;
  --px-gold:#c98a1e; --px-gold2:#a86a12;
  --px-sh:6px 6px 0 0 rgba(43,42,63,.85);
  --px-sh-sm:4px 4px 0 0 rgba(43,42,63,.85);
  --px-sh-lift:9px 9px 0 0 rgba(43,42,63,.85);
}

/* ============================================================
   1 · GLOBAL RESET — square corners, crisp pixels, flat fills
   ============================================================ */
*{ image-rendering:pixelated; }
*, *::before, *::after{ border-radius:0 !important; }
svg, svg *{ image-rendering:auto; }                 /* keep vector icons smooth */
img, .crest, .crest img, .flag img, .fl img{ image-rendering:pixelated; }

html{ color-scheme:dark; }
:root[data-theme="light"]{ color-scheme:light; }
body{
  background:var(--px-bg) !important; color:var(--px-txt) !important;
  font-family:'Pixelify Sans', ui-sans-serif, sans-serif !important;
  -webkit-font-smoothing:none; -moz-osx-font-smoothing:unset;
  letter-spacing:.2px;
}
/* base font on every element (pixel everywhere); per-glyph fallback covers arrows/symbols */
[class]{ font-family:'Pixelify Sans', ui-sans-serif, sans-serif !important; }

/* kill the soft/glassy treatments that fight a pixel look */
*{ backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
.hero-shine, .spot, .glow, .net, .waves,
.scard::before, .scard::after, .chart-panel::after,
.kpi-mid::before, .hl-tile::after, .hl-tile.trez::before{ display:none !important; }

/* ---------- pixel background: faint grid + scanlines + vignette ---------- */
body::before{
  content:""; position:fixed; inset:0; z-index:-5; pointer-events:none;
  background:
    radial-gradient(120% 85% at 50% -12%, rgba(255,205,117,.05), transparent 55%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.022) 0 1px, transparent 1px 4px),
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px),
    var(--px-bg) !important;
  background-size:auto, auto, 32px 32px, 32px 32px, auto !important;
}
:root[data-theme="light"] body::before{
  background:
    radial-gradient(120% 85% at 50% -12%, rgba(201,138,30,.08), transparent 55%),
    repeating-linear-gradient(0deg, rgba(0,0,0,.05) 0 1px, transparent 1px 4px),
    linear-gradient(rgba(43,42,63,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43,42,63,.05) 1px, transparent 1px),
    var(--px-bg) !important;
  background-size:auto, auto, 32px 32px, 32px 32px, auto !important;
}

/* ============================================================
   2 · TYPOGRAPHY — Pixelify headings + Press Start 2P accents
   ============================================================ */
/* big display headings → Pixelify 700, chunky pixel text-shadow */
.hero h2, .shead h3, .pagehead h2, .nextcard .nm-title, .tk-flowh, .ts-t,
.movers-intro h3, .matches-intro h3, .rm-title, .chart-title, .fc-name h4,
.live-banner, .fp-big, .tk-tagline, .tk-h, .vf-srcname{
  font-family:'Pixelify Sans', ui-sans-serif, sans-serif !important;
  font-weight:700 !important; letter-spacing:.5px !important;
}
.hero h2, .shead h3, .pagehead h2{ text-shadow:4px 4px 0 var(--px-ink) !important; }
:root[data-theme="light"] .hero h2{ text-shadow:4px 4px 0 rgba(43,42,63,.35) !important; }

/* Press Start 2P → brand, eyebrows, tiny labels, tags, nav, scoreboard numbers */
.brand h1,
.kick, .mv-kick, .hero-kicker, .hr-title, .hr-sub, .fc-badge, .vf-tag,
.kpi-k, .hs-l, .sb-cell .k, .sb-main .k, .scard .k, .hl-k, .hl-tile .hl-k,
.ca-label, .nm-label, .count-cap, .rm-step, .rmb-title, .tbadge .tb-tag,
.fx-tag, .mtime .grp, .chip, .seg button, .mainnav a, .nav a, .pill,
.kpi-v, .hs-v, .sb-cell .v, .sb-main .v, .ctile .n, .fc-price, .mv .big,
.fx-vs .score, .kb-n, .kb-burnv, .rmb-p, .hca-label{
  font-family:'Press Start 2P', 'Pixelify Sans', ui-sans-serif, sans-serif !important;
  letter-spacing:0 !important;
}
/* Press Start 2P renders ~1.6× wider/taller → shrink + give it room */
.brand h1{ font-size:16px !important; line-height:1.1 !important; font-style:normal !important; }
.kick, .mv-kick, .hero-kicker, .hr-title, .hr-sub{ font-size:9px !important; line-height:1.7 !important; }
.kpi-k, .hs-l, .sb-cell .k, .sb-main .k, .scard .k, .hl-k, .hl-tile .hl-k,
.ca-label, .nm-label, .count-cap, .rm-step, .rmb-title, .vf-tag, .hca-label{ font-size:8px !important; line-height:1.7 !important; }
.fc-badge, .tbadge .tb-tag, .fx-tag, .mtime .grp, .chip, .seg button, .pill{ font-size:8.5px !important; line-height:1.5 !important; }
.mainnav a, .nav a{ font-size:9px !important; }
/* scoreboard numbers a touch smaller so Press Start 2P doesn't overflow */
.kpi-v{ font-size:clamp(20px,2.4vw,34px) !important; line-height:1.1 !important; }
.kpi-mid .kpi-v{ font-size:clamp(26px,3.4vw,46px) !important; }
.hs-v{ font-size:clamp(13px,1.4vw,19px) !important; line-height:1.2 !important; }
.hs-v.hs-count{ font-size:clamp(11px,1.15vw,16px) !important; }
.sb-cell .v{ font-size:18px !important; } .sb-main .v{ font-size:clamp(24px,3.4vw,38px) !important; }
.ctile .n{ font-size:18px !important; } .fc-price{ font-size:26px !important; }
.mv .big{ font-size:22px !important; } .fx-vs .score{ font-size:18px !important; }
.kb-n{ font-size:clamp(30px,4.6vw,54px) !important; } .kb-burnv{ font-size:clamp(20px,2.4vw,30px) !important; }
.rmb-p{ font-size:12px !important; }

/* ============================================================
   3 · PANELS / CARDS — flat fill, 3px pixel border, hard shadow
   ============================================================ */
.kpi, .hstrip, .movers-stage, .matches-stage, .hiw-card,
.fixtures .fx, .fx, .mv, .mrow, .scard, .stats .scard, .flag-card, .chart-panel,
.ca-bar, .hl-tile, .vibe, .nextcard, .trust, .allmatches, .adm-sec, .hcard,
.tk-flowcol, .tk-card, .tk-txt, .board, .note, .cointicker, .search, .seg,
.adm-tbl, .adm-scroll, .am-row, .chartbox, .chart-box, .fc-r{
  background:var(--px-surface) !important;
  background-image:none !important;
  border:3px solid var(--px-line) !important;
  box-shadow:var(--px-sh) !important;
  color:var(--px-txt);
}
/* raised inner tiles a shade lighter for depth */
.ctile, .vf-node, .am-row, .tbadge, .vrow, .adm-f input, .adm-tbl input,
.search, .seg{ background:var(--px-surface2) !important; }

/* the big "stage" sections get a thicker frame + bigger shadow */
.movers-stage, .matches-stage, .hiw-card{
  border-width:4px !important; box-shadow:var(--px-sh-lift) !important;
}

/* Total-Treasury hero card → gold pixel frame */
.kpi-mid{
  border-color:#fff !important;
  box-shadow:var(--px-sh-lift), 0 0 30px -6px rgba(255,205,117,.4) !important;
  background:var(--px-surface2) !important;
}
.kpi-mid .kpi-v{ color:var(--px-gold) !important; text-shadow:3px 3px 0 var(--px-ink) !important; }

/* card hover → snap up-left (no smooth blur) */
.kpi:hover, .scard:hover, .stats .scard:hover, .fixtures .fx:hover, .fx:hover, .mv:hover,
.hl-tile:hover, .chart-panel:hover, .flag-card:hover, .tk-card:hover, .tk-txt:hover, .vibe:hover, .ca-bar:hover{
  transform:translate(-3px,-3px) !important;
  border-color:var(--px-gold) !important;
  box-shadow:var(--px-sh-lift) !important;
  transition:transform .06s steps(2,end), box-shadow .06s steps(2,end), border-color .06s steps(2,end) !important;
}
.mrow:hover{ transform:translate(-2px,-2px) !important; border-color:var(--px-gold) !important; box-shadow:var(--px-sh) !important; }

/* edge-lit border bars / brackets from the old theme → gone (handled by reset) */
.vf-node::before{ width:4px !important; background:var(--c,var(--px-gold)) !important; }

/* ============================================================
   4 · BUTTONS — chunky, notched corners, satisfying press
   ============================================================ */
.btn, .hero-btn, .mini-buy, .soc, .vr-btn, .ca-copy, .hca-copy, .m-btn,
.chart-range button, .theme-toggle{
  border:0 !important;
  font-family:'Pixelify Sans', ui-sans-serif, sans-serif !important;
  font-weight:700 !important; letter-spacing:.4px !important;
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.32), var(--px-sh-sm) !important;
  transition:transform .05s steps(1), box-shadow .05s steps(1), background .1s steps(2) !important;
}
.btn{ padding:14px 22px !important; font-size:12px !important; text-transform:uppercase; }
.btn:hover, .hero-btn:hover, .mini-buy:hover, .soc:hover, .vr-btn:hover, .ca-copy:hover,
.hca-copy:hover, .chart-range button:hover{
  transform:translate(2px,2px) !important;
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.32), 2px 2px 0 0 var(--px-ink) !important;
}
.btn:active{ transform:translate(4px,4px) !important; box-shadow:inset 0 0 0 3px rgba(0,0,0,.32), 0 0 0 0 var(--px-ink) !important; }

/* primary (gold) button */
.btn-gold, .btn-gold.btn-buy{
  background:var(--px-gold) !important; color:#241400 !important;
  box-shadow:inset 0 0 0 3px rgba(120,70,0,.4), var(--px-sh-sm) !important;
}
.btn-gold:hover, .btn-gold.btn-buy:hover{
  background:var(--px-gold) !important; color:#241400 !important; filter:none !important;
  transform:translate(2px,2px) !important;
  box-shadow:inset 0 0 0 3px rgba(120,70,0,.4), 2px 2px 0 0 var(--px-ink) !important;
}
/* ghost / secondary buttons */
.btn-ghost, .hero .btn-ghost, .movers-intro .btn-ghost, .matches-intro .btn-ghost{
  background:var(--px-surface2) !important; color:var(--px-txt) !important;
  box-shadow:inset 0 0 0 3px rgba(0,0,0,.3), var(--px-sh-sm) !important;
}
.btn-ghost:hover, .hero .btn-ghost:hover{ background:var(--px-raise) !important; transform:translate(2px,2px) !important; }
.btn.dis, .mini-buy.dis, .hero-btn.dis{ opacity:.4 !important; box-shadow:inset 0 0 0 3px rgba(0,0,0,.3) !important; transform:none !important; }

/* small buttons / pills / tags → flat pixel chips, no offset shadow */
.mini-buy, .soc, .hero-btn, .vr-btn, .ca-copy, .hca-copy, .chart-range button,
.chip, .seg button, .fx-tag, .mtime .grp, .tbadge .tb-tag, .pill, .fc-badge, .vf-trigger{
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.3) !important;
}
.chip, .seg button{ background:var(--px-surface2) !important; color:var(--px-muted) !important; padding:9px 11px !important; }
.chip.on, .seg button.on{ background:var(--px-gold) !important; color:#241400 !important; box-shadow:inset 0 0 0 2px rgba(120,70,0,.4) !important; }
.theme-toggle{ box-shadow:inset 0 0 0 3px var(--px-line) !important; background:var(--px-surface2) !important; color:var(--px-txt) !important; }
.theme-toggle:hover{ background:var(--px-raise) !important; color:var(--px-gold) !important; }

/* ============================================================
   5 · HEADER / NAV
   ============================================================ */
header{
  background:var(--px-bg2) !important;
  border-bottom:3px solid var(--px-line) !important;
  box-shadow:0 4px 0 0 rgba(0,0,0,.4) !important;
}
.brand h1{ color:var(--px-gold) !important; -webkit-text-fill-color:var(--px-gold) !important; text-shadow:2px 2px 0 var(--px-ink); }
.brand span{ color:var(--px-muted) !important; font-size:8px !important; letter-spacing:2px !important; }
.crest{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 3px var(--px-line) !important; }
.crest:hover, .brand:hover .crest{ transform:translateY(-2px) !important; }
.mainnav a, .nav a{ color:var(--px-txt) !important; opacity:1 !important; padding:9px 11px !important; box-shadow:inset 0 0 0 2px transparent !important; }
.mainnav a:hover{ color:var(--px-gold) !important; background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; }
.mainnav a.active{ color:#241400 !important; background:var(--px-gold) !important; box-shadow:inset 0 0 0 2px rgba(120,70,0,.4) !important; border:0 !important; }
.pill{ color:var(--px-green) !important; background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; }
.dot{ background:var(--px-green) !important; box-shadow:0 0 0 2px rgba(167,240,112,.4) !important; animation:pxBlink 1s steps(1) infinite !important; }

/* ============================================================
   6 · HERO — keep stadium photo, add pixel crunch + arcade type
   ============================================================ */
.hero{ background:var(--px-bg2) !important; box-shadow:inset 0 -4px 0 0 var(--px-line) !important; }
.hero .hero-bg{ filter:contrast(1.12) saturate(1.18) brightness(.96) !important; image-rendering:pixelated; }
.hero .hero-bg::before{ background:radial-gradient(circle, rgba(255,231,170,.8) 0%, rgba(255,205,117,.34) 26%, rgba(255,205,117,0) 62%) !important; }
.hero-img{ image-rendering:pixelated; filter:drop-shadow(5px 6px 0 rgba(0,0,0,.45)) contrast(1.08) saturate(1.1) !important; }
.hero h2{ color:#fff !important; -webkit-text-fill-color:#fff !important; }
.hero h2 .gold-text{ -webkit-text-fill-color:var(--px-gold) !important; background:none !important; color:var(--px-gold) !important; text-shadow:4px 4px 0 var(--px-ink); }
/* giant translucent 2 · 6 → arcade pixel digits */
.hero-26{ font-family:'Press Start 2P','Pixelify Sans',sans-serif !important; font-weight:400 !important;
  font-size:clamp(120px,26vh,300px) !important; color:rgba(255,205,117,.16) !important;
  gap:clamp(50px,11vw,200px) !important; text-shadow:none !important; }
/* hero kicker pill → solid pixel chip */
.hero .kick{ background:var(--px-bg2) !important; color:var(--px-gold) !important;
  box-shadow:inset 0 0 0 3px var(--px-line) !important; text-shadow:none !important; }
.hr-line{ height:4px !important; background:var(--px-gold) !important; width:48px !important; }

/* ============================================================
   7 · KPI numbers / changes / sparkline / strip
   ============================================================ */
.kpi-v{ color:var(--px-txt) !important; text-shadow:2px 2px 0 var(--px-ink); }
.kpi-k, .kpi-secure, .kpi-chg, .hs-l, .kpi-chg b{ color:var(--px-muted) !important; }
.kpi-chg.up b, .kpi-chg.up .kpi-arr, .kpi-arr{ color:var(--px-green) !important; }
.kpi-chg.down b, .kpi-chg.down .kpi-arr{ color:var(--px-red) !important; }
.kpi-spark{ color:var(--px-cyan) !important; }
.spk-dot{ background:var(--px-cyan) !important; box-shadow:0 0 0 2px rgba(115,239,247,.4) !important; border-radius:0 !important; }
.kpi-shield{ color:var(--px-gold) !important; }
.hs-ic{ color:var(--px-gold) !important; }
.hs-ic-fire{ color:var(--px-orange) !important; }
.hs-v{ color:var(--px-txt) !important; }
.hs-btn{ background:var(--px-surface2) !important; color:var(--px-txt) !important; box-shadow:inset 0 0 0 3px var(--px-line) !important; border:0 !important; font-family:'Pixelify Sans',sans-serif !important; font-weight:700 !important; }
.hs-btn:hover{ background:var(--px-raise) !important; transform:translate(2px,2px) !important; }

/* ============================================================
   8 · TABLES / MATCHES / MOVERS / FIXTURES recolor
   ============================================================ */
.thead{ background:var(--px-surface2) !important; box-shadow:inset 0 -3px 0 0 var(--px-line) !important; }
.thead div, .scard .k, .team .meta, .fx-meta, .mven, .mside .pr, .kb-l, .kb-sub, .vf-lbl, .rm-list li, .rmb-l{ color:var(--px-muted) !important; }
.thead div.act{ color:var(--px-gold) !important; }
.trow{ box-shadow:inset 0 -2px 0 0 rgba(255,255,255,.18) !important; }
.trow:hover{ background:var(--px-surface2) !important; }
.rank.top, .team .tkr, .trow .tkr, .tkr, .trez .v, .mside .tk, .fc-name .tk, .mv .tk, .fx-team .tk, .ct-item b{ color:var(--px-gold) !important; -webkit-text-fill-color:var(--px-gold) !important; }
.cell-num, .fc-name h4, .fc-price, .mv .nm, .mv .big, .fx-team .nm, .fx-team .pr, .fx-vs .score{ color:var(--px-txt) !important; -webkit-text-fill-color:var(--px-txt) !important; }
.fx-vs .v, .mmid:not(.live){ color:var(--px-gold) !important; }
.flag, .fl, .fx-team .fl, .mside .fl{ filter:drop-shadow(2px 2px 0 rgba(0,0,0,.5)) !important; }

/* movers gain/lose accents */
.mv .ov{ background:linear-gradient(120deg, rgba(16,17,29,.94) 40%, rgba(16,17,29,.74)) !important; }
.mv.gain .tag, .wl.W, .chg.up, .up, .ct-item .up{ color:var(--px-green) !important; }
.mv.lose .tag, .wl.L, .chg.down, .down, .ct-item .down{ color:var(--px-red) !important; }
.wl{ box-shadow:inset 0 0 0 2px rgba(0,0,0,.35) !important; }
.wl.W{ background:var(--px-green) !important; color:#06200f !important; }
.wl.L{ background:var(--px-red) !important; color:#2a0008 !important; }
.wl.D{ background:var(--px-muted) !important; color:#10111d !important; }
.chg.up{ background:rgba(167,240,112,.16) !important; }
.chg.down{ background:rgba(255,82,119,.16) !important; }

/* fixtures / match tags */
.fx-tag, .mtime .grp{ background:var(--px-surface2) !important; color:var(--px-txt) !important; }
.fx-tag.live, .mmid.live{ color:var(--px-green) !important; }
.fx-tag.live{ background:rgba(167,240,112,.14) !important; box-shadow:inset 0 0 0 2px rgba(167,240,112,.5) !important; }
.mmid.live .ll{ color:var(--px-green) !important; }
.fx-team .ov, .fx-team{ background-color:rgba(16,17,29,.55) !important; }
.dayhdr{ color:var(--px-gold) !important; box-shadow:inset 0 -3px 0 0 var(--px-line) !important; border:0 !important; }
.mrow.soon{ border-color:var(--px-gold) !important; box-shadow:var(--px-sh), 0 0 0 1px var(--px-gold) !important; }
.mrow.done{ opacity:.55 !important; } .mrow.done .fl{ filter:grayscale(1) !important; }

/* ============================================================
   9 · HIGHLIGHT TILES / TOKENOMICS / ROADMAP / FLOW
   ============================================================ */
.hl-tile .hl-v, .stats .scard .v{ color:var(--px-txt) !important; -webkit-text-fill-color:var(--px-txt) !important; background:none !important; }
.hl-tile.trez .hl-v{ color:var(--px-gold) !important; -webkit-text-fill-color:var(--px-gold) !important; }
.hl-tile.burn .hl-v, .hs-ic-fire{ color:var(--px-orange) !important; -webkit-text-fill-color:var(--px-orange) !important; }
.hl-tile.air .hl-v{ color:var(--px-cyan) !important; -webkit-text-fill-color:var(--px-cyan) !important; }
.hl-tile .hl-ic{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 3px var(--px-line) !important; color:var(--px-gold) !important; }
.hl-tile.burn .hl-ic{ color:var(--px-orange) !important; }
.hl-tile .hl-k, .hl-tile .hl-sub, .stats .scard .k, .vibe, .vibe *{ color:var(--px-muted) !important; }
/* tokenomics gradients/donuts → flat pixel accents */
.tk-num{ background:var(--px-gold) !important; color:#241400 !important; box-shadow:inset 0 0 0 2px rgba(120,70,0,.4) !important; }
.tk-list li::before, .ts-list li::before{ color:var(--px-gold) !important; }
.vf-node.gold .vf-pct{ color:var(--px-gold) !important; -webkit-text-fill-color:var(--px-gold) !important; background:none !important; }
.vf-node.alt{ --c:var(--px-red) !important; }
.vf-source, .vf-trigger{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; }
.vf-source{ box-shadow:inset 0 0 0 3px var(--px-gold) !important; }
.vf-srcname{ color:var(--px-txt) !important; -webkit-text-fill-color:var(--px-txt) !important; }
.vf-tag{ color:var(--px-gold) !important; }
/* roadmap timeline */
.rm-dot{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 3px var(--px-line) !important; color:var(--px-gold) !important; }
.rm-title{ color:var(--px-txt) !important; }
.rmap-line{ background:repeating-linear-gradient(90deg, var(--px-line) 0 6px, transparent 6px 12px) !important; height:4px !important; }
.rm-list li::before{ background:var(--px-gold) !important; border-radius:0 !important; }
/* ecosystem % bars → flat pixel fill, stepped grow */
.rmb-track{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; height:14px !important; }
.rmb-fill{ background:var(--px-gold) !important; box-shadow:none !important; animation:rmbGrow 1s steps(12,end) both !important; }
.rmb-p{ color:var(--px-txt) !important; }
/* section-heading marker → chunky gold pixel block */
.shead h3::before{ width:18px !important; height:18px !important; background:var(--px-gold) !important; box-shadow:3px 0 0 0 var(--px-gold), -3px 0 0 0 var(--px-gold) !important; }

/* trust / badges / chain pills */
.tbadge.ok, .tk-chain, .ts-chain{ color:var(--px-green) !important; }
.tbadge.ok .ico{ color:var(--px-green) !important; }
.tbadge.ok .tb-tag{ color:#06200f !important; background:var(--px-green) !important; }
.tbadge.bad .tb-tag{ color:#fff !important; background:var(--px-red) !important; }
.tbadge.wait .tb-tag, #tokenomics .tbadge.wait .tb-tag{ color:#241400 !important; background:var(--px-gold) !important; }
.vr-addr{ color:var(--px-gold) !important; background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; }

/* ============================================================
   10 · BANNER PAGEHEADS (Flagship / Nations / Match / How-it-works)
   keep the cinematic photo; add a pixel frame + crunch
   ============================================================ */
.pagehead-wc{
  filter:contrast(1.08) saturate(1.14) !important; image-rendering:pixelated;
  box-shadow:inset 0 -4px 0 0 var(--px-line) !important;
}
.pagehead-wc h2, .pagehead-wc h2 .gold-text{ color:#fff !important; -webkit-text-fill-color:#fff !important; text-shadow:4px 4px 0 rgba(0,0,0,.6) !important; }
.pagehead-wc p{ color:#fff !important; text-shadow:2px 2px 0 rgba(0,0,0,.55) !important; }
.fp-big, .fp-big.gold-text{ color:var(--px-gold) !important; -webkit-text-fill-color:var(--px-gold) !important; text-shadow:4px 4px 0 var(--px-ink) !important; }
.fp-mark{ box-shadow:inset 3px 0 0 0 var(--px-line) !important; background:var(--px-surface2) !important; }

/* CA bar + chart controls */
.ca-label{ color:var(--px-muted) !important; }
.ca-addr{ color:var(--px-gold) !important; }
.ca-copy{ background:var(--px-surface2) !important; color:var(--px-txt) !important; }
.chart-range{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; padding:4px !important; }
.chart-range button{ color:var(--px-txt) !important; box-shadow:none !important; }
.chart-range button.on{ background:var(--px-gold) !important; color:#241400 !important; box-shadow:inset 0 0 0 2px rgba(120,70,0,.4) !important; }
.chart-src{ color:var(--px-cyan) !important; }
.hca-label{ color:var(--px-muted) !important; }
.hca-addr{ color:var(--px-txt) !important; }
.hca-copy{ background:var(--px-surface2) !important; color:var(--px-txt) !important; }
.hero-ca, .hero-btn{ background:var(--px-bg2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; }

/* leaderboard flag-wave → crisp pixel flags */
.lb-flags img{ box-shadow:2px 2px 0 0 rgba(0,0,0,.5) !important; image-rendering:pixelated; }

/* ============================================================
   11 · MISC — vibe widget, equalizer, ticker, music, footer, notes
   ============================================================ */
.vibe.up{ box-shadow:var(--px-sh), inset 0 0 0 3px var(--px-green) !important; }
.vibe.down{ box-shadow:var(--px-sh), inset 0 0 0 3px var(--px-red) !important; }
.vibe-head{ color:var(--px-gold) !important; }
.pulse{ background:var(--px-green) !important; border-radius:0 !important; animation:pxBlink 1s steps(1) infinite !important; }
.vibe.down .pulse{ background:var(--px-red) !important; }
.eq-bar{ background:var(--px-gold) !important; }
.vibe.up .eq-bar{ background:var(--px-green) !important; }
.vibe.down .eq-bar{ background:var(--px-red) !important; }
.tk-i b{ color:var(--px-gold) !important; }

/* music player */
.music{ background:var(--px-bg2) !important; box-shadow:inset 0 0 0 3px var(--px-line), var(--px-sh-sm) !important; }
.music .m-btn{ background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; color:var(--px-txt) !important; }
.music .m-play{ background:var(--px-gold) !important; color:#241400 !important; box-shadow:inset 0 0 0 2px rgba(120,70,0,.4) !important; }
.music .m-play svg, .music .m-play svg *{ fill:#241400 !important; color:#241400 !important; }
.music .m-vol{ background:var(--px-line) !important; }
.music .m-vol::-webkit-slider-thumb{ background:var(--px-gold) !important; border-radius:0 !important; }
.music .m-vol::-moz-range-thumb{ background:var(--px-gold) !important; border-radius:0 !important; }
.music .m-title{ color:var(--px-muted) !important; }

/* footer + social */
footer{ background:var(--px-bg2) !important; color:var(--px-muted) !important; border-top:3px solid var(--px-line) !important; }
footer p, footer span, footer small, footer .soc-empty, footer .disclaimer{ color:var(--px-muted) !important; }
footer b{ color:var(--px-txt) !important; } footer a{ color:var(--px-cyan) !important; }
.soc{ background:var(--px-surface2) !important; color:var(--px-txt) !important; }
.soc:hover{ background:var(--px-raise) !important; color:var(--px-gold) !important; }

/* dashed demo note → pixel dashed frame */
.note{ box-shadow:inset 0 0 0 3px rgba(255,255,255,.16) !important; border:3px dashed #fff !important; color:var(--px-txt) !important; }
.note b{ color:var(--px-gold) !important; }

/* inputs */
.search input, .adm-f input, .adm-tbl input{ color:var(--px-txt) !important; font-family:'Pixelify Sans',sans-serif !important; }
.search input::placeholder{ color:var(--px-muted) !important; }
.search, .seg{ box-shadow:inset 0 0 0 2px var(--px-line) !important; }

/* generic gold-text accent → solid gold (no gradient) */
.gold-text{ -webkit-text-fill-color:var(--px-gold) !important; background:none !important; color:var(--px-gold) !important; }
::selection{ background:var(--px-gold); color:#241400; }

/* ============================================================
   12 · ANIMATIONS — stepped (pixel) timing, blink, reduced-motion
   ============================================================ */
@keyframes pxBlink{ 0%,60%{opacity:1} 61%,100%{opacity:.25} }
.eq-bar{ animation:eq 1s steps(4,end) infinite !important; }
.ct-track{ animation:ctScroll 48s linear infinite !important; }
.ticker-track{ animation:tscroll 22s linear infinite !important; }
.skel{ animation:none !important; background:var(--px-surface2) !important; box-shadow:inset 0 0 0 2px var(--px-line) !important; -webkit-text-fill-color:transparent !important; }
.flash-up{ animation:pxFlashUp .5s steps(2,end) !important; }
.flash-down{ animation:pxFlashDown .5s steps(2,end) !important; }
@keyframes pxFlashUp{ 0%{ text-shadow:0 0 0 var(--px-green); filter:brightness(1.6) } 100%{ filter:none } }
@keyframes pxFlashDown{ 0%{ filter:brightness(1.6) saturate(1.4) } 100%{ filter:none } }
@media(prefers-reduced-motion:reduce){
  .eq-bar, .ct-track, .ticker-track, .pulse, .dot, .rmb-fill{ animation:none !important; }
}

/* ============================================================
   13 · RESPONSIVE — keep pixel fonts legible on small screens
   ============================================================ */
@media(max-width:760px){
  .brand h1{ font-size:14px !important; }
  .mainnav a, .nav a{ font-size:8px !important; padding:7px 8px !important; }
  .hero h2, .shead h3, .pagehead h2{ text-shadow:3px 3px 0 var(--px-ink) !important; }
  .kpi-v{ font-size:clamp(18px,5vw,28px) !important; }
}