/* ============================================================
   /paper/ STYLE LOCK
   Forces all /paper/intel/ pages to match the visual identity of
   https://studio.odd.games/paper/ exactly.

   Palette (matches /paper/):
     bg dark      #0a0a08
     bg card      #0c0d0e / #13130f
     border       #2a2a25 / rgba(255,255,255,.12)
     text         #ffffff / #ece8df / rgba(255,255,255,.7)
     mute         #8a857d
     accent gold  #c9a662
     accent g+    #f4c645  (hover gold)
     pill green   #86efac
     pill orange  #ffb88a  (sparingly)

   Loaded AFTER kobow-intel-v2.css so these values win.
   ============================================================ */

:root {
  --bg:        #0a0a08 !important;
  --bg-top:    #0a0a08 !important;
  --bg-bot:    #0a0a08 !important;
  --card:      #0c0d0e !important;
  --card-hi:   #13130f !important;
  --border:    #2a2a25 !important;
  --ink:       #ece8df !important;
  --ink-2:     rgba(255,255,255,.7) !important;
  --mute:      #8a857d !important;
  --dim:       #5a564d !important;
  --accent:    #c9a662 !important;
  --accent-2:  #f4c645 !important;
  --accent-dim:#a8895a !important;
  --gold:      #c9a662 !important;
  --info:      #86efac !important;
  --success:   #86efac !important;
  --danger:    #ffb88a !important;
  --purple:    #c9a662 !important;  /* collapse purple → gold */
  --blood:     #ffb88a !important;
  --warning:   #ffb88a !important;
}

/* === BODY: flat dark, no gradients === */
html, body {
  background: #0a0a08 !important;
  background-attachment: initial !important;
  color: #ece8df !important;
  font-family: 'Inter', sans-serif !important;
}

/* === Headings always gold italic display === */
h1, h2, h3, h4, h5,
.h1, .h2, .h3,
.eyebrow + h1, .deck + h2 {
  color: #c9a662 !important;
}
h1 {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 500 !important;
}
h2 { font-family: 'Cormorant Garamond', Georgia, serif !important; font-style: italic !important; }
h3 { font-family: 'Cormorant Garamond', Georgia, serif !important; font-style: italic !important; }

/* Mute / micro labels stay mono */
.eyebrow, .meta, .section-sub, .pill, .juri,
.lbl, .stat .lbl, .sh-count {
  font-family: 'IBM Plex Mono', monospace !important;
}

/* === CARDS: collapse the rainbow into one card style === */
.card, .grid > .card, .cell, .playbook-card, .game-card,
.framework-note, .ref-row, .info-card, .vrow,
.kbw-card, .kbw-tile, .panel, .game-tile,
.stat, .play-col, .data-card, .why-card {
  background: #13130f !important;
  border: 1px solid #2a2a25 !important;
  color: #ece8df !important;
  box-shadow: none !important;
}

.card:hover, .cell:hover, .playbook-card:hover, .game-card:hover {
  border-color: #c9a662 !important;
}

/* === LINKS / BUTTONS === */
a { color: #c9a662 !important; }
a:hover { color: #f4c645 !important; }
button, .btn, .primary, .secondary, .tab,
.cta, .nav-link, .play-btn {
  font-family: 'IBM Plex Mono', monospace !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
}
.primary, .btn-primary, .cta-primary {
  background: rgba(201,166,98,.12) !important;
  border: 1px solid #c9a662 !important;
  color: #c9a662 !important;
}
.primary:hover, .btn-primary:hover {
  background: rgba(201,166,98,.22) !important;
}
.secondary, .btn-secondary {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.7) !important;
}

/* === PILLS / BADGES — collapse to one of 4 colors === */
.pill, .badge, .tag, .chip,
.badge-flip, .pill-price, .pill-risk, .pill-tier {
  font-family: 'IBM Plex Mono', monospace !important;
  font-size: 9px !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #ece8df !important;
  border-radius: 999px !important;
  padding: 3px 9px !important;
}
.pill.live, .pill.success, .badge.live, .badge.green,
.tag.verified, .badge-flip.green {
  background: rgba(134,239,172,.14) !important;
  border-color: #86efac !important;
  color: #86efac !important;
}
.pill.gold, .pill.playbook, .badge.gold, .tag.gold,
.pill-tier.gold, .badge-flip.gold {
  background: rgba(201,166,98,.12) !important;
  border-color: rgba(201,166,98,.45) !important;
  color: #c9a662 !important;
}
.pill.coming, .pill.warning, .pill.orange,
.badge.warning, .tag.warning, .badge-flip.warning {
  background: rgba(232,90,26,.14) !important;
  border-color: #ffb88a !important;
  color: #ffb88a !important;
}
.pill.danger, .pill.red, .badge.red, .tag.danger,
.badge-flip.red {
  background: rgba(255,184,138,.10) !important;
  border-color: #ffb88a !important;
  color: #ffb88a !important;
}

/* === KILL stray hard-coded colors that pollute intel pages === */
[style*="#9d4edd"], [style*="#c77dff"] { color: #c9a662 !important; }
[style*="#cf3a3a"], [style*="#dc2626"], [style*="#c8431f"] { color: #ffb88a !important; }
[style*="#a8b86a"], [style*="#d4e08c"] { color: #c9a662 !important; }
[style*="background:#0c1a14"], [style*="background:#162d22"],
[style*="background:#3a2410"], [style*="background:#221a0d"],
[style*="background:#1d1808"], [style*="background:#2e1f10"] {
  background: #13130f !important;
}

/* Border accents that were colored — neutralize */
[style*="border-color:#9d4edd"], [style*="border:1px solid #9d4edd"],
[style*="border-color:#c77dff"], [style*="border:1px solid #c77dff"],
[style*="border-color:#cf3a3a"], [style*="border:1px solid #cf3a3a"],
[style*="border-color:#c8431f"], [style*="border:1px solid #c8431f"] {
  border-color: #2a2a25 !important;
}

/* Stat boxes (KPI bar) */
.stats, .stat-bar, .kpi-bar { gap: 12px !important }
.stat, .kpi {
  background: #13130f !important;
  border: 1px solid #2a2a25 !important;
}
.stat b, .stat .val, .kpi-value {
  color: #c9a662 !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-style: italic !important;
  font-weight: 500 !important;
}

/* Framework note / callout boxes */
.framework-note, .callout, .alert, .notice {
  background: #13130f !important;
  border: 1px solid #2a2a25 !important;
  color: #b9b4a9 !important;
}
.framework-note b, .callout b { color: #ece8df !important; }

/* Tables */
table { background: transparent !important }
th { color: #8a857d !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 10px !important; letter-spacing: .14em !important; text-transform: uppercase !important; border-bottom: 1px solid #2a2a25 !important; }
td { color: #ece8df !important; border-bottom: 1px solid #1f1f1a !important; }

/* Top-bar / subnav harmonized */
.psn { background: rgba(10,10,8,.96) !important; border-bottom: 1px solid #2a2a25 !important }
.psn a { color: #8a857d !important }
.psn a:hover, .psn a.active { color: #c9a662 !important }

/* Suppress unwanted decorative gradients */
.hero, .banner, [class*="gradient"] {
  background-image: none !important;
}

/* Footer */
footer, .footer, .footnote {
  background: rgba(201,166,98,.04) !important;
  border-top: 1px solid #2a2a25 !important;
  color: #8a857d !important;
  font-family: 'IBM Plex Mono', monospace !important;
}

/* ============================================================
   HOME / ODD-* COMPONENT OVERRIDES
   The studio root index.html uses odd.css which defines its own
   --ink (#0c0d0e dark) and applies it as card BACKGROUND. Our
   :root override above remaps --ink to cream foreground, which
   makes .odd-mod cards cream-on-cream (invisible). Restore them
   here with explicit, scoped colors.
   ============================================================ */
.odd-top {
  background: #0a0a08 !important;
  border-bottom: 1px solid #2a2a25 !important;
}
.odd-top .brand { color: #c9a662 !important }
.odd-top .brand .dot { background: #c9a662 !important }
.odd-top .module-tag { color: #8a857d !important; border-left-color: #2a2a25 !important }
.odd-top .module-tag b { color: #ece8df !important }
.odd-top nav a { color: #8a857d !important }
.odd-top nav a:hover { background: #13130f !important; color: #c9a662 !important }
.odd-top nav a.active { background: #c9a662 !important; color: #0a0a08 !important }

.odd-hero {
  background: #0a0a08 !important;
  background-image:
    radial-gradient(ellipse at 15% 30%, rgba(201,166,98,.08) 0%, transparent 60%),
    radial-gradient(ellipse at 85% 70%, rgba(255,255,255,.04) 0%, transparent 50%),
    linear-gradient(180deg, #050505 0%, #0c0d0e 100%) !important;
  color: #ece8df !important;
}
.odd-hero .badge {
  background: rgba(201,166,98,.10) !important;
  border-color: rgba(201,166,98,.35) !important;
  color: #c9a662 !important;
}
.odd-hero .badge::before { background: #86efac !important; box-shadow: 0 0 12px #86efac !important }
.odd-hero h1 { color: #ece8df !important }
.odd-hero h1 em { color: rgba(255,255,255,.5) !important }
.odd-hero .lede { color: rgba(255,255,255,.7) !important }

.odd-mod {
  background: #13130f !important;
  border: 1px solid #2a2a25 !important;
  color: #ece8df !important;
}
.odd-mod:hover { border-color: #c9a662 !important; box-shadow: 0 16px 40px rgba(0,0,0,.4) !important }
.odd-mod .num { color: rgba(201,166,98,.55) !important }
.odd-mod h4 { color: #c9a662 !important }
.odd-mod p { color: rgba(255,255,255,.7) !important }
.odd-mod .arrow { color: #c9a662 !important }
.odd-mod .pill {
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #ece8df !important;
}

.odd-section-h { color: #c9a662 !important; font-family: 'Cormorant Garamond', serif !important; font-style: italic !important }
.odd-section-sub { color: #8a857d !important; font-family: 'IBM Plex Mono', monospace !important; font-size: 11px !important; letter-spacing: .14em !important; text-transform: uppercase !important }
.odd-accountiner, .odd-container { background: #0a0a08 !important }
