/* TheBetsWay board · cinematic-front cohesion skin (2026-07-09)
   Loaded AFTER the board's inline styles, so same-specificity rules win with
   no !important. Goal: the board at /board reads as ONE product with the dark
   editorial front at thebetsway.com. The board already shares the soil world,
   grass, gold, Fredoka and Banker; the loud mismatch is the bright clay nav
   shelf. This darkens the bar to match the front and ties the accents to gold. */

/* ── NAV: bright clay shelf -> dark editorial bar (matches the front) ── */
.wall{
  background:linear-gradient(180deg,rgba(26,18,10,.92),rgba(26,18,10,.80));
  -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(231,169,43,.24);
  box-shadow:0 10px 30px rgba(0,0,0,.45);
}
.wall::after{opacity:.05; mix-blend-mode:overlay;}
.brand .mk{box-shadow:0 3px 10px rgba(0,0,0,.55), 0 0 0 1px rgba(231,169,43,.28);}
.brand .wm b{color:var(--cream);}
.brand .wm span{color:var(--gold);}
.nav a{
  font-family:var(--mono); font-weight:400; font-size:11px;
  text-transform:uppercase; letter-spacing:.2em; color:var(--cream2);
  border:1px solid transparent; border-radius:9px; padding:8px 13px;
}
.nav a:hover{
  color:var(--cream); background:rgba(231,169,43,.09);
  border-color:rgba(231,169,43,.22); transform:none;
}
.nav a.on{
  color:#241a0d; font-weight:700;
  background:linear-gradient(180deg,var(--gold-br),var(--gold));
  border-color:var(--gold-dk); box-shadow:0 3px 0 var(--gold-dk);
}

/* ── DATA CARDS: light clay tablets -> dark soil slabs, SYSTEM-WIDE ──
   Every clay surface + ink text on every board page draws from these tokens, so
   remapping the tokens darkens all of them at once (baseball .brick, F1/NASCAR
   .dcard, power, record) and flips their text to cream together, no matter each
   page's bespoke class names. Hardcoded-color surfaces get companions below. */
:root{
  --clay:#2a1f12;  --clay2:#1c1409;  --clay-dk:#0c0804;  --clay-edge:#3b2a16;
  --panel:#241a10; --panel2:#1a120a; --panel3:#150d06;
  --decal:#2a1f12; --decal2:#1f1710;
  --ink:#f4ecda;   --ink2:#cbb488;   --dim:#9c855e;
}
/* keep team / driver logo chips light so the crests read */
.badge.logo, .rbadge.logo{ background:linear-gradient(180deg,#f4ecda,#d8c8a8); }
/* accents that were "dark on clay" lift to their bright variants on soil */
.pk .verb em, .whybtn, .pill .v.good, .stat .sv.up, .bubble b, .honest.calm p b{ color:var(--gum-br); }
.pill .v.warn, .stat .sv.down{ color:#ff8a63; }
.pill .v.odds, .stat .sv.gold{ color:var(--gold-br); }
/* hardcoded-color surfaces the tokens do not reach */
.pill{ background:linear-gradient(180deg,#20160c,#160e06); border:1px solid #3a2a16;
  box-shadow:inset 0 1px 3px rgba(0,0,0,.5); }
.pill:hover{ background:linear-gradient(180deg,#281c10,#1d130a); border-color:var(--gold-dk); }
.why{ background:#191106; }
.seg{ background:linear-gradient(180deg,#241a10,#1a120a); box-shadow:inset 0 1px 3px rgba(0,0,0,.5); }
.brick.skip{ background:repeating-linear-gradient(135deg,#241a10 0 16px,#1b130a 16px 32px); }
.empty{ background:linear-gradient(180deg,rgba(42,31,18,.6),rgba(24,15,6,.55)); }
/* grain overlays were multiply (for light clay); overlay reads right on soil */
.step::after, .brick::before, .dcard::after, .dcard::before{ mix-blend-mode:overlay; opacity:.14; }
