/* === pollard-mode-global.css — universal dual-mode CSS for studio + library sub-pages
   Targets common token names + tag-level fallbacks so the toggle works even
   on pages that use their own design system (odd.css, etc.).
   ============================================================================= */

body.pollard-mode {
  /* Common tokens — kobow, ODD, generic */
  --bg:#ffffff !important;
  --bg-2:#f7f8fa !important;
  --bg-3:#f0f2f5 !important;
  --bg-4:#e6e8eb !important;
  --fg:#333333 !important;
  --fg-2:#4a4d52 !important;
  --fg-muted:#888888 !important;
  --ink:#333333 !important;
  --paper:#ffffff !important;
  --line:#e6e8eb !important;
  --border:#e6e8eb !important;
  --gold:#2c3e63 !important;
  --gold-soft:#445576 !important;
  --accent:#2c3e63 !important;
  --kbw-paper:#ffffff !important;
  --kbw-card:#ffffff !important;
  --kbw-soft:#f7f8fa !important;
  --kbw-ink:#333333 !important;
  --kbw-line:#e6e8eb !important;
  --kbw-muted:#888888 !important;
  --kbw-accent:#2c3e63 !important;
  --kbw-accent-2:#445576 !important;
  --kbw-accent-soft:rgba(44,62,99,.10) !important;
  --pbc-blue:#2c3e63 !important;
  --pbc-blue-deep:#1a2849 !important;
  --pbc-blue-soft:rgba(44,62,99,.10) !important;
  --pbc-blue-surf:rgba(44,62,99,.04) !important;

  background:#0a0a0c !important;
  color:#e9e9ea !important;
  font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;
}

/* Force-light all common dark-themed elements */
body.pollard-mode * {
  border-color:#e6e8eb !important;
}
body.pollard-mode h1, body.pollard-mode h2, body.pollard-mode h3, body.pollard-mode h4 {
  color:#2c3e63 !important;
  font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;
  font-weight:400 !important;
}
body.pollard-mode h3, body.pollard-mode h4 { font-weight:600 !important; }
body.pollard-mode p, body.pollard-mode .body, body.pollard-mode .text { color:#4a4d52 !important; }
body.pollard-mode .muted, body.pollard-mode .sub, body.pollard-mode small { color:#888888 !important; }
body.pollard-mode a { color:#2c3e63 !important; }
body.pollard-mode a:hover { color:#cc3366 !important; }

/* Topbars / headers / nav */
body.pollard-mode header,
body.pollard-mode .header,
body.pollard-mode .topbar,
body.pollard-mode .top,
body.pollard-mode .pbc-topbar,
body.pollard-mode .odd-top,
body.pollard-mode .psn,
body.pollard-mode .stage-top,
body.pollard-mode nav.psn,
body.pollard-mode .site-header {
  background:#0a0a0c !important;
  border-color:#e6e8eb !important;
  color:#e9e9ea !important;
}
body.pollard-mode header *,
body.pollard-mode .header *,
body.pollard-mode .topbar *,
body.pollard-mode .pbc-topbar *,
body.pollard-mode .psn * {
  color:inherit !important;
}

/* Cards / panels */
body.pollard-mode .card,
body.pollard-mode .panel,
body.pollard-mode .tile,
body.pollard-mode .box,
body.pollard-mode .spec-card,
body.pollard-mode .thumb-card,
body.pollard-mode .item,
body.pollard-mode article,
body.pollard-mode aside,
body.pollard-mode section {
  background-color:#ffffff !important;
  color:#e9e9ea !important;
}

/* Buttons */
body.pollard-mode button,
body.pollard-mode .btn,
body.pollard-mode .button {
  background:#ffffff;
  color:#2c3e63;
  border:1px solid #d4d7dc;
  font-family:-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif !important;
}
body.pollard-mode .btn-primary,
body.pollard-mode .primary,
body.pollard-mode .cta {
  background:#2c3e63 !important;
  color:#ffffff !important;
  border-color:#2c3e63 !important;
}
body.pollard-mode .btn-primary:hover,
body.pollard-mode .primary:hover,
body.pollard-mode .cta:hover { background:#445576 !important; }

/* Inputs */
body.pollard-mode input, body.pollard-mode textarea, body.pollard-mode select {
  background:#0a0a0c !important;
  color:#e9e9ea !important;
  border:1px solid #d4d7dc !important;
}
body.pollard-mode input::placeholder, body.pollard-mode textarea::placeholder { color:#888888 !important; }

/* Code / mono blocks */
body.pollard-mode code, body.pollard-mode pre, body.pollard-mode kbd {
  background:#f7f8fa !important;
  color:#2c3e63 !important;
  border-color:#e6e8eb !important;
}

/* Status pills */
body.pollard-mode .badge, body.pollard-mode .pill, body.pollard-mode .chip {
  background:#f7f8fa !important;
  color:#2c3e63 !important;
  border-color:#e6e8eb !important;
}

/* Hide leftover dark gradients on body backgrounds */
body.pollard-mode { background-image:none !important; }

/* Toggle button — light style override */
body.pollard-mode .pbc-theme-toggle,
body.pollard-mode #pbc-theme-toggle-std {
  background:rgba(44,62,99,.06) !important;
  color:#2c3e63 !important;
  border-color:rgba(44,62,99,.20) !important;
}

/* === STRONGER OVERRIDES — target inline-styled dark elements aggressively === */
body.pollard-mode { background:#0a0a0c !important; color:#e9e9ea !important; }

/* Common dark backgrounds → white/grey */
body.pollard-mode .controls,
body.pollard-mode .theme,
body.pollard-mode .frame-wrap,
body.pollard-mode .chip,
body.pollard-mode .stat,
body.pollard-mode .links a,
body.pollard-mode .fmt,
body.pollard-mode .panel,
body.pollard-mode .card,
body.pollard-mode .box,
body.pollard-mode .wrap,
body.pollard-mode .container,
body.pollard-mode .row,
body.pollard-mode aside,
body.pollard-mode section,
body.pollard-mode article,
body.pollard-mode header,
body.pollard-mode footer,
body.pollard-mode nav { background:#0a0a0c !important; color:#e9e9ea !important; border-color:#e6e8eb !important; }

body.pollard-mode .chip { background:#f7f8fa !important; border-color:#e6e8eb !important; color:#4a4d52 !important; }
body.pollard-mode .chip:hover, body.pollard-mode .chip.active { background:rgba(44,62,99,.08) !important; border-color:#2c3e63 !important; color:#2c3e63 !important; }
body.pollard-mode .stat { background:#f7f8fa !important; border-color:#e6e8eb !important; color:#4a4d52 !important; }
body.pollard-mode .stat b { color:#2c3e63 !important; }
body.pollard-mode .links a { background:#f7f8fa !important; border-color:#e6e8eb !important; color:#2c3e63 !important; }
body.pollard-mode .theme { background:#0a0a0c !important; border-color:#e6e8eb !important; }
body.pollard-mode .theme h2 { color:#2c3e63 !important; }
body.pollard-mode .frame-wrap { background:#f7f8fa !important; border-color:#e6e8eb !important; }

/* gold/yellow accent → navy */
body.pollard-mode .badge,
body.pollard-mode .ribbon { background:#2c3e63 !important; color:#ffffff !important; }
body.pollard-mode [class*='gold'],
body.pollard-mode [class*='yellow'] { color:#2c3e63 !important; }

/* dark text → readable navy */
body.pollard-mode h1, body.pollard-mode h2, body.pollard-mode h3, body.pollard-mode h4 { color:#2c3e63 !important; }
body.pollard-mode .fmt h3 { color:#2c3e63 !important; opacity:1 !important; }
body.pollard-mode .fmt h3 .badge { background:rgba(44,62,99,.10) !important; color:#2c3e63 !important; border-color:rgba(44,62,99,.2) !important; }

/* Send to studio CTA */
body.pollard-mode .send-to-studio { background:#2c3e63 !important; color:#ffffff !important; border-color:#2c3e63 !important; }
body.pollard-mode .send-to-studio:hover { background:#1a2849 !important; }
body.pollard-mode .frame-wrap:hover { border-color:#2c3e63 !important; }

/* Generic <a> color stays navy unless on bg */
body.pollard-mode a { color:#2c3e63; }
body.pollard-mode a:hover { color:#cc3366; }

/* Force light for any element with style="background:#0a..." (we can't target inline style attr cleanly, but we cover the common class hooks) */
body.pollard-mode [style*="background:#0a0a0a"],
body.pollard-mode [style*="background: #0a0a0a"],
body.pollard-mode [style*="background:#0d0d0d"],
body.pollard-mode [style*="background: #0d0d0d"],
body.pollard-mode [style*="background:#1a1a1a"],
body.pollard-mode [style*="background: #1a1a1a"] { background:#0a0a0c !important; }

body.pollard-mode [style*="color:#fff"],
body.pollard-mode [style*="color: #fff"],
body.pollard-mode [style*="color:#eee"],
body.pollard-mode [style*="color: #eee"],
body.pollard-mode [style*="color:#f4c645"],
body.pollard-mode [style*="color: #f4c645"] { color:#2c3e63 !important; }


/* === Pollard light default / BLACK on demand === */
html:not(.black-mode):not(.preload-pollard.black-mode), body:not(.black-mode) { background:#0a0a0c !important; }
html.preload-pollard, html.preload-pollard body, body.pollard-mode { background:#0a0a0c !important; color:#e9e9ea !important; }
html.black-mode, html.black-mode body, body.black-mode { background:#0a0a0a !important; color:#eaeaea !important; }
html.black-mode body.pollard-mode { background:#0a0a0c !important; color:#e9e9ea !important; }


/* === UNIVERSAL DARK→LIGHT (Pollard mode) — covers all studio sub-pages === */
body.pollard-mode, html.pollard-mode body {
  background:#0a0a0c !important; color:#e9e9ea !important;
}
/* Most common dark backgrounds in sub-pages */
body.pollard-mode .ca-banner,
body.pollard-mode .stat,
body.pollard-mode .stats,
body.pollard-mode .game-block,
body.pollard-mode .variant,
body.pollard-mode .deck,
body.pollard-mode .head,
body.pollard-mode .meta,
body.pollard-mode .img-wrap,
body.pollard-mode .panel,
body.pollard-mode .card,
body.pollard-mode .box,
body.pollard-mode .container,
body.pollard-mode .frame-wrap,
body.pollard-mode .game-card,
body.pollard-mode .spec-card,
body.pollard-mode .theme,
body.pollard-mode .row,
body.pollard-mode .col,
body.pollard-mode .section,
body.pollard-mode .first-banner,
body.pollard-mode aside,
body.pollard-mode header,
body.pollard-mode nav,
body.pollard-mode footer,
body.pollard-mode .topbar,
body.pollard-mode .header,
body.pollard-mode .nav,
body.pollard-mode .footer { 
  background:#0a0a0c !important; 
  border-color:rgba(44,62,99,0.12) !important; 
  color:#e9e9ea !important;
}

/* Banners/eyebrows/badges */
body.pollard-mode .badge,
body.pollard-mode .ribbon,
body.pollard-mode .pill,
body.pollard-mode .eyebrow { 
  background:rgba(44,62,99,0.08) !important; 
  color:#2c3e63 !important; 
  border-color:rgba(44,62,99,0.2) !important;
}
body.pollard-mode .pill.live,
body.pollard-mode .badge.live { background:#2c3e63 !important; color:#ffffff !important; }
body.pollard-mode .pill.coming { background:rgba(204,51,102,0.08) !important; color:#cc3366 !important; }
body.pollard-mode .pill.playbook { background:rgba(44,62,99,0.08) !important; color:#2c3e63 !important; }

/* Game block / card titles in gold → navy */
body.pollard-mode .title,
body.pollard-mode .game-block .head,
body.pollard-mode .game-block .title,
body.pollard-mode .game-block .name,
body.pollard-mode h1, body.pollard-mode h2, body.pollard-mode h3, body.pollard-mode h4 { 
  color:#2c3e63 !important;
}
body.pollard-mode .mechanic { color:#4a4d52 !important; }
body.pollard-mode .meta .name, body.pollard-mode .meta .desc { color:#e9e9ea !important; }
body.pollard-mode .price { color:#cc3366 !important; }
body.pollard-mode .n, body.pollard-mode .l { color:#7a7d82 !important; }
body.pollard-mode .replaces, body.pollard-mode .ca-banner > div { color:#4a4d52 !important; }
body.pollard-mode .ca-banner .badge { background:#2c3e63 !important; color:#ffffff !important; }

/* "back" links and arrows */
body.pollard-mode .back { color:#2c3e63 !important; }
body.pollard-mode .back:hover { color:#cc3366 !important; }

/* Inputs */
body.pollard-mode input, body.pollard-mode textarea, body.pollard-mode select {
  background:#0a0a0c !important; color:#e9e9ea !important; border:1px solid #e6e8eb !important;
}
body.pollard-mode input::placeholder { color:#9a9da2 !important; }

/* Compare / Mood boards / CA Playbook links (chip style) */
body.pollard-mode a[class*="pill"]:hover,
body.pollard-mode .deck a,
body.pollard-mode a.button { color:#2c3e63 !important; }

/* Variant cards in /paper/ca/ */
body.pollard-mode .variant { background:#f7f8fa !important; border-color:#e6e8eb !important; }
body.pollard-mode .variant .img-wrap { background:#eef0f3 !important; }
body.pollard-mode .variant .name { color:#2c3e63 !important; }
body.pollard-mode .variant.final { background:#0a0a0c !important; border-color:#2c3e63 !important; }

/* Specific MN-style PSN labels */
body.pollard-mode .psn, body.pollard-mode .psn-prod { background:#f7f8fa !important; color:#4a4d52 !important; border-color:#e6e8eb !important; }

/* Generic dark inline style overrides (most cover the cases) */
body.pollard-mode [style*="background:#0a"],
body.pollard-mode [style*="background: #0a"],
body.pollard-mode [style*="background:#13"],
body.pollard-mode [style*="background: #13"],
body.pollard-mode [style*="background:#1a"],
body.pollard-mode [style*="background: #1a"],
body.pollard-mode [style*="background:#000"],
body.pollard-mode [style*="background: #000"] { background:#0a0a0c !important; }

body.pollard-mode [style*="color:#f4c645"],
body.pollard-mode [style*="color: #f4c645"],
body.pollard-mode [style*="color:#d4af37"],
body.pollard-mode [style*="color: #d4af37"],
body.pollard-mode [style*="color:#e8e5dc"],
body.pollard-mode [style*="color: #e8e5dc"] { color:#2c3e63 !important; }


/* === Override :root !important tokens for ODD Intel pages === */
html.pollard-mode, html.pollard-mode body, body.pollard-mode {
  --bg:#ffffff !important;
  --bg-top:#ffffff !important;
  --bg-bot:#f7f8fa !important;
  --card:#ffffff !important;
  --card-hi:#f7f8fa !important;
  --border:#e6e8eb !important;
  --ink:#262626 !important;
  --ink-2:#4a4d52 !important;
  --mute:#7a7d82 !important;
  --accent:#2c3e63 !important;
  --accent-2:#1a2849 !important;
  --accent-dim:#445576 !important;
  --gold:#cc3366 !important;
  --info:#2c3e63 !important;
  --success:#2c8e3e !important;
  --danger:#cc3366 !important;
}

/* Force-set body bg/color since :root rule uses gradient !important */
body.pollard-mode {
  background:#0a0a0c !important;
  background-attachment:scroll !important;
  color:#e9e9ea !important;
}

/* Headings */
body.pollard-mode h1, body.pollard-mode h2, body.pollard-mode h3, body.pollard-mode h4,
body.pollard-mode .hero h1, body.pollard-mode .section h2, body.pollard-mode .modal-title {
  color:#2c3e63 !important;
}

/* Framework cards */
body.pollard-mode .framework { border-bottom-color:#e6e8eb !important; }
body.pollard-mode .fw-col { background:#0a0a0c !important; border:1px solid #e6e8eb !important; }
body.pollard-mode .fw-col h4 { color:#cc3366 !important; border-bottom-color:#e6e8eb !important; }
body.pollard-mode .fw-col li { color:#e9e9ea !important; }
body.pollard-mode .fw-col b { color:#2c3e63 !important; }
body.pollard-mode .framework .lede { color:#4a4d52 !important; }
body.pollard-mode .framework .lede b { color:#2c3e63 !important; }

/* Section/anchors */
body.pollard-mode .anchors a { background:#f7f8fa !important; color:#2c3e63 !important; border:1px solid #e6e8eb !important; }
body.pollard-mode .anchors a:hover { background:#2c3e63 !important; color:#ffffff !important; border-color:#2c3e63 !important; }
body.pollard-mode .layout-card { background:#0a0a0c !important; border:1px solid #e6e8eb !important; }
body.pollard-mode .source-modal-card { background:#0a0a0c !important; border:1px solid #e6e8eb !important; color:#e9e9ea !important; }
body.pollard-mode section[style*="background:#13"] { background:#0a0a0c !important; border-top-color:#2c3e63 !important; }
body.pollard-mode section[style*="background:#0a"] { background:#0a0a0c !important; }
body.pollard-mode a[style*="background:#0a0a08"] { background:#f7f8fa !important; border-color:#2c3e63 !important; }
body.pollard-mode a[style*="background:#0a0a08"] div[style*="background:#000"] { background:#eef0f3 !important; }


/* === PBC Topbar — sticky + mode-aware === */
.pbc-topbar { background:#0a0a0a; color:#eaeaea; border-bottom-color:#222 !important; font-family:'IBM Plex Mono',monospace; }
.pbc-topbar .pbc-brand-mk { background:linear-gradient(135deg,#d4af37,#a8862a); color:#0a1628; }
.pbc-topbar .pbc-nav-link { color:#cdcdcd; text-decoration:none; padding:8px 12px; border-radius:6px; transition:all .15s; }
.pbc-topbar .pbc-nav-link:hover { background:rgba(255,255,255,0.06); color:#fff; }
.pbc-topbar .pbc-nav-link.active { background:#d4af37; color:#0a1628; }
.pbc-topbar .pbc-nav-link.pbc-council.active { background:#cc3366; color:#fff; }

/* Pollard mode topbar */
body.pollard-mode .pbc-topbar, html.pollard-mode .pbc-topbar { background:#0a0a0c !important; color:#e9e9ea !important; border-bottom:1px solid #e6e8eb !important; }
body.pollard-mode .pbc-topbar .pbc-brand-mk { background:linear-gradient(135deg,#2c3e63,#1a2849) !important; color:#ffffff !important; }
body.pollard-mode .pbc-topbar .pbc-brand-nm { color:#2c3e63 !important; }
body.pollard-mode .pbc-topbar .pbc-brand-sub { color:#7a7d82 !important; }
body.pollard-mode .pbc-topbar .pbc-nav-link { color:#4a4d52 !important; }
body.pollard-mode .pbc-topbar .pbc-nav-link:hover { background:#f7f8fa !important; color:#2c3e63 !important; }
body.pollard-mode .pbc-topbar .pbc-nav-link.active { background:#2c3e63 !important; color:#ffffff !important; }
body.pollard-mode .pbc-topbar .pbc-nav-link.pbc-council.active { background:#cc3366 !important; color:#ffffff !important; }
body.pollard-mode .pbc-topbar .pbc-theme-toggle { border-color:#e6e8eb !important; color:#2c3e63 !important; }


/* === TYPOGRAPHY UNIFICATION across studio pages === */
/* Force consistent h1 size + Cormorant Garamond italic */
body main > h1:first-of-type,
main.odd-accountiner > h1,
body > main > section h1,
.hero h1, .odd-hero h1 {
  font-family:'Cormorant Garamond',Georgia,serif !important;
  font-style:italic !important;
  font-weight:600 !important;
  font-size:clamp(40px, 5vw, 56px) !important;
  line-height:1.05 !important;
  letter-spacing:-0.015em !important;
  margin:0 0 14px !important;
}

/* Subtitle / lede */
body main > h1:first-of-type + p,
main.odd-accountiner > h1 + p,
.hero p, .odd-hero .lede, .lede {
  font-family:'IBM Plex Mono',monospace !important;
  font-size:13px !important;
  letter-spacing:0.04em !important;
  line-height:1.6 !important;
  max-width:680px !important;
  margin:0 0 32px !important;
}

/* Pollard mode title color */
body.pollard-mode main > h1:first-of-type,
body.pollard-mode main.odd-accountiner > h1,
body.pollard-mode .hero h1, body.pollard-mode .odd-hero h1 {
  color:#2c3e63 !important;
}
body.pollard-mode .lede, body.pollard-mode .hero p {
  color:#4a4d52 !important;
}

/* Black mode: cream/gold serif look */
body.black-mode main > h1:first-of-type,
body.black-mode main.odd-accountiner > h1,
body.black-mode .hero h1, body.black-mode .odd-hero h1 {
  color:#f4c645 !important;
}
body.black-mode .lede, body.black-mode .hero p {
  color:rgba(255,255,255,0.7) !important;
}

/* Module eyebrow consistent */
.badge[class*=module],
.eyebrow,
.odd-section-h::before {
  font-family:'IBM Plex Mono',monospace !important;
  font-size:11px !important;
  letter-spacing:0.18em !important;
  text-transform:uppercase !important;
  font-weight:600 !important;
}

/* Section-level H2 consistent */
body main h2,
main.odd-accountiner h2,
.odd-section-h {
  font-family:'Cormorant Garamond',Georgia,serif !important;
  font-style:italic !important;
  font-weight:500 !important;
  font-size:clamp(28px, 3vw, 36px) !important;
  line-height:1.15 !important;
  letter-spacing:-0.01em !important;
  margin:48px 0 12px !important;
}
body.pollard-mode main h2, body.pollard-mode .odd-section-h { color:#2c3e63 !important; }
body.black-mode main h2, body.black-mode .odd-section-h { color:#f4c645 !important; }


/* === Hide page-specific topbars when global pbc-topbar is loaded === */
body:has(.pbc-topbar) > .topbar,
body:has(.pbc-topbar) .nav-shell,
body .topbar:not(.pbc-topbar),
.topbar:not(.pbc-topbar) {
  display:none !important;
}
/* Also hide any leftover floating toggles when topbar is loaded */
body:has(.pbc-topbar) #pbc-theme-toggle-std {
  display:none !important;
}