/*
 * theme.css - khurram.online dark mode ("The Study at Night")
 * Loaded LAST on every page (after page <style> blocks) so its rules win ties.
 *
 * Architecture: the palette lives in CSS variables, so [data-theme="dark"]
 * flips them. var(--ink) was split 2026-06-12: text stays --ink (flips to
 * light), surfaces use --ink-surface (stays dark in both themes).
 * Hardcoded #fff / grey-text components get explicit overrides below.
 */

/* ── Light defaults for the new tokens ─────────────────── */
:root {
  --ink-surface: #1E1E2E;   /* identical to light-mode --ink: zero visual change */
}

/* ── Theme toggle button ───────────────────────────────── */
.theme-toggle {
  background: none; border: 1px solid transparent; cursor: pointer;
  font-size: 1rem; line-height: 1;
  padding: 0.4rem 0.55rem; border-radius: 6px;
  color: var(--ink); opacity: 0.65;
  transition: opacity 0.2s, border-color 0.2s, transform 0.3s;
  flex-shrink: 0;
}
.theme-toggle:hover { opacity: 1; border-color: var(--cream-border); transform: rotate(15deg); }
.theme-toggle .tt-sun  { display: none; }
.theme-toggle .tt-moon { display: inline; }
[data-theme="dark"] .theme-toggle .tt-sun  { display: inline; }
[data-theme="dark"] .theme-toggle .tt-moon { display: none; }

/* ── Nav subscribe button (lives here: the one stylesheet on ALL pages) ── */
.nav-subscribe {
  font-family: var(--font-mono, 'JetBrains Mono', monospace);
  font-size: 0.66rem; letter-spacing: 0.12em; text-transform: uppercase;
  background: var(--amber, #C89B3C); color: #1E1E2E;
  border: none; border-radius: 4px; cursor: pointer;
  padding: 0.5rem 1rem;
  transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
  box-shadow: 0 2px 10px rgba(200, 155, 60, 0.25);
  flex-shrink: 0;
}
.nav-subscribe:hover {
  background: var(--amber-light, #E2BB6A);
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(200, 155, 60, 0.35);
}

/* mobile slots: hidden on desktop (the nav-links copies show there) */
.theme-toggle-mobile-slot, .nav-subscribe-mobile-slot { display: none; }
@media (max-width: 1150px) {
  .nav-subscribe-mobile-slot { display: flex; align-items: center; margin-left: auto; }
  /* Comfortable 44px tap height for the always-visible nav controls (94% of
     traffic is mobile). Grow tap HEIGHT only, not width — the phone nav cluster
     (logo + subscribe + search + toggle + hamburger) is horizontally tight, so
     widening it risks the overflow the trimmed logo was added to prevent. */
  .nav-subscribe-mobile-slot .nav-subscribe { font-size: 0.6rem; padding: 0.45rem 0.85rem; min-height: 44px; display: inline-flex; align-items: center; }
  .theme-toggle-mobile-slot { display: flex; align-items: center; margin-left: 0.55rem; }
  .theme-toggle-mobile-slot .theme-toggle,
  .theme-toggle-mobile-slot .search-trigger { min-height: 44px; min-width: 36px; display: inline-flex; align-items: center; justify-content: center; }
  .m-menu { margin-left: 0.55rem; }   /* shared.css sets auto; subscribe now owns the push */
}

/* smooth the switch */
html.theme-anim, html.theme-anim *, html.theme-anim *::before, html.theme-anim *::after {
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease !important;
}

/* ── THE NIGHT PALETTE ─────────────────────────────────── */
[data-theme="dark"] {
  --linen:        #16161F;   /* page background */
  --warm-paper:   #1F1F2C;   /* card / panel surfaces */
  --ink:          #E9E3D6;   /* text - warm cream */
  --ink-light:    #B6AC9C;
  --cream-border: #30304A;
  --sage:         #93A89A;
  --terracotta:   #CE8A66;
  --amber-dark:   #D9AE54;
  --amber-text:   #D9AE54;   /* AA on the dark surfaces */
  --sage-text:    #97AB9E;
  --ink-surface:  #101018;   /* ink panels go a step darker than the page */
  --ai-blue:      #6FA8D6;   /* AI-series accent, lifted for night (#2A6496 by day) */
}

/* ── Component overrides for hardcoded values ──────────── */

/* nav backdrop (widget pages use nav#navbar; index/root pages bare fixed nav).
   :not(.essay-toc) - the article TOC is semantically a <nav> and must NOT
   inherit the header backdrop. */
[data-theme="dark"] nav:not(.essay-toc),
[data-theme="dark"] nav#navbar {
  background: rgba(18, 18, 26, 0.92);
}
[data-theme="dark"] nav.scrolled,
[data-theme="dark"] nav#navbar.scrolled {
  border-color: var(--cream-border);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.45);
}
[data-theme="dark"] .essay-toc { background: var(--warm-paper); }

/* white card surfaces */
[data-theme="dark"] .article-card,
[data-theme="dark"] .related-card,
[data-theme="dark"] .q-card,
[data-theme="dark"] .r-frontier {
  background: #20202E;
}
[data-theme="dark"] .q-opt:hover { background: #262638; }

/* grey body text on light surfaces */
[data-theme="dark"] .article-content p,
[data-theme="dark"] .article-content ul,
[data-theme="dark"] .article-content ol { color: #CFC8B8; }
[data-theme="dark"] .card-excerpt,
[data-theme="dark"] .read-next-excerpt,
[data-theme="dark"] .related-excerpt,
[data-theme="dark"] .newsletter-card p,
[data-theme="dark"] .r-news p,
[data-theme="dark"] .r-frontier-item span { color: #A9A294; }
[data-theme="dark"] .card-footer { color: #8E897C; border-color: var(--cream-border); }
[data-theme="dark"] .ref-card p,
[data-theme="dark"] .principle-card p,
[data-theme="dark"] .closing-note { color: #C5BEAE; }

/* form fields (covers inline-styled #fff inputs on index too) */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] textarea {
  background: #20202E !important;
  color: var(--ink) !important;
  border-color: var(--cream-border) !important;
}
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder { color: #7A7568; }

/* skip-link sits on ink-surface; --linen is now the dark page bg, so use --ink */
[data-theme="dark"] .skip-link { color: var(--ink); }

/* images: ease the brightness a touch at night */
[data-theme="dark"] img { filter: brightness(0.88); }
[data-theme="dark"] .nav-brand img,
[data-theme="dark"] .lel-avatar { filter: none; }

/* ambient glows read stronger on dark - soften */
[data-theme="dark"] .ambient-glow { opacity: 0.6; }

/* ── DARK POLISH PASS 1 (audit-driven, 2026-06-13) ────── */
/* generic: list items with hardcoded dark ink (AI template et al.) */
[data-theme="dark"] li { color: #CFC8B8; }
[data-theme="dark"] nav li, [data-theme="dark"] .nav-links li { color: inherit; }

/* generic: inline-styled hardcoded light surfaces flip to warm-paper */
[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#FFF"],
[data-theme="dark"] [style*="background:#FAF7F2"],
[data-theme="dark"] [style*="background: #FAF7F2"],
[data-theme="dark"] [style*="background:#F5F0E8"],
[data-theme="dark"] [style*="background: #F5F0E8"],
[data-theme="dark"] [style*="background:var(--warm-paper,#F5F0E8)"] {
  background: var(--warm-paper) !important;
}

/* named components from the audit - dark text on flipped panels */
[data-theme="dark"] .gc-row-text,
[data-theme="dark"] .version-personal,
[data-theme="dark"] .theory-flag,
[data-theme="dark"] .d-line,
[data-theme="dark"] .art-read-time { color: #C5BEAE; }

/* ── DARK POLISH PASS 2 (2026-06-13) ──────────────────── */
/* text that used var(--linen) as "light" - flips dark in dark mode */
[data-theme="dark"] [style*="color:var(--linen)"],
[data-theme="dark"] [style*="color: var(--linen)"] { color: #E9E3D6 !important; }
[data-theme="dark"] .page-hero-title,
[data-theme="dark"] .gave-header { color: #E9E3D6; }

/* page-local text tokens */
[data-theme="dark"] { --text-primary: #E9E3D6; --text-secondary: #C5BEAE; }

/* light class-css cards that did not flip */
[data-theme="dark"] .son-card,
[data-theme="dark"] .series-card { background: #20202E; border-color: var(--cream-border); }
[data-theme="dark"] .series-title { color: #E9E3D6; }
[data-theme="dark"] .series-read,
[data-theme="dark"] .art-min { color: #97AB9E; }

/* named text bumps from audit v4 */
[data-theme="dark"] .version-personal,
[data-theme="dark"] .theory-flag,
[data-theme="dark"] .dream-note,
[data-theme="dark"] .dream-note p,
[data-theme="dark"] .son-desc { color: #C5BEAE; }
[data-theme="dark"] .ey-badge { color: var(--amber-light); }

/* footer small print: dim by design, but keep readable at night */
[data-theme="dark"] .footer-copy,
[data-theme="dark"] .footer-copy span { color: rgba(250,247,242,0.62); }

/* ── DARK POLISH PASS 3 - light class-css containers ──── */
[data-theme="dark"] .art-card, [data-theme="dark"] .book-card,
[data-theme="dark"] .scorecard-body, [data-theme="dark"] .theory-col,
[data-theme="dark"] .card, [data-theme="dark"] .tag,
[data-theme="dark"] .size-card-body, [data-theme="dark"] .version-body,
[data-theme="dark"] .impact-card, [data-theme="dark"] .trend-card-body,
[data-theme="dark"] .force-card, [data-theme="dark"] .force-block,
[data-theme="dark"] .field-card, [data-theme="dark"] .grade-card,
[data-theme="dark"] .series-card {
  background: #20202E !important; border-color: var(--cream-border) !important;
}
[data-theme="dark"] .sr-to { background: #28220F !important; }
[data-theme="dark"] .notice-board { background: #28260F !important; }
[data-theme="dark"] .not-for-you, [data-theme="dark"] .warning-card { background: #2A1F1B !important; }

/* common text inside those cards (hardcoded dark greys) */
[data-theme="dark"] .art-card p, [data-theme="dark"] .art-card span,
[data-theme="dark"] .book-card p, [data-theme="dark"] .book-card span,
[data-theme="dark"] .scorecard-body td, [data-theme="dark"] .theory-col p,
[data-theme="dark"] .card p, [data-theme="dark"] .card span, [data-theme="dark"] .card strong,
[data-theme="dark"] .size-card-body p, [data-theme="dark"] .size-card-body li,
[data-theme="dark"] .version-body p, [data-theme="dark"] .version-body li,
[data-theme="dark"] .impact-card p, [data-theme="dark"] .impact-card span,
[data-theme="dark"] .trend-card-body p, [data-theme="dark"] .trend-card-body li,
[data-theme="dark"] .force-card p, [data-theme="dark"] .force-card li,
[data-theme="dark"] .warning-card p, [data-theme="dark"] .not-for-you p,
[data-theme="dark"] .notice-board p, [data-theme="dark"] .notice-board li,
[data-theme="dark"] td { color: #CFC8B8; }
[data-theme="dark"] .art-card h3, [data-theme="dark"] .book-card h3,
[data-theme="dark"] .card h3, [data-theme="dark"] .card h4,
[data-theme="dark"] .impact-card h3, [data-theme="dark"] .trend-card-body h3,
[data-theme="dark"] .force-card h3, [data-theme="dark"] .warning-card h4,
[data-theme="dark"] .force-card h4 { color: #E9E3D6; }
[data-theme="dark"] .force-area, [data-theme="dark"] .trend-insight,
[data-theme="dark"] .impact-trend-name, [data-theme="dark"] .field-num,
[data-theme="dark"] .trend-num { color: #97AB9E; }

/* ── DARK POLISH PASS 4 - final sweep ─────────────────── */
/* Every intended-light container is darkened by now, so any remaining
   hardcoded-dark heading/emphasis text is dark-on-dark: force light. */
[data-theme="dark"] h3, [data-theme="dark"] h4,
[data-theme="dark"] strong { color: #E9E3D6; }
[data-theme="dark"] em { color: var(--terracotta); }

/* chips, pills & badges flagged by the audit */
[data-theme="dark"] .grade-chip, [data-theme="dark"] .force-nav-label,
[data-theme="dark"] .force-nav-link, [data-theme="dark"] .underrated-badge,
[data-theme="dark"] .inno-pill, [data-theme="dark"] .skill-tag,
[data-theme="dark"] .achievement-chip, [data-theme="dark"] .spectrum-chip {
  color: #D8D2C4;
}
[data-theme="dark"] .btn-ghost { color: #C5BEAE; border-color: var(--cream-border); }

/* ── DARK POLISH PASS 5 - scoped, audit-mirrored ──────── */
/* forces-* tinted headers: dark-tinted h3 on coloured bands */
[data-theme="dark"] .force-header h3 { color: #F2EDE2 !important; }
[data-theme="dark"] .force-header .force-num { filter: brightness(1.15); }

/* dark-grey content classes inside (now dark) cards */
[data-theme="dark"] .tldr-list li, [data-theme="dark"] .unsure-list li,
[data-theme="dark"] .audience-list li, [data-theme="dark"] .lab-steps li,
[data-theme="dark"] .contrast-col--light ul li,
[data-theme="dark"] .stakeholder-spec, [data-theme="dark"] .es-step,
[data-theme="dark"] .gap-text, [data-theme="dark"] .timeline-text,
[data-theme="dark"] .grounded-scene p, [data-theme="dark"] .converge-block p,
[data-theme="dark"] .failure-card p, [data-theme="dark"] .phase-hook,
[data-theme="dark"] .reading-story p,
[data-theme="dark"] .pyramid-title { color: #CFC8B8 !important; }

/* lucky-generation pills & emphasis inside its cards */
[data-theme="dark"] .inno-pill, [data-theme="dark"] .tag {
  background: #2A2A3E !important; color: #D8D2C4 !important;
}
[data-theme="dark"] .card strong, [data-theme="dark"] .sr-to strong,
[data-theme="dark"] .card em, [data-theme="dark"] .sr-to em { color: #E9E3D6 !important; }

/* craft chips: ink-family blues/greens too dark on night surfaces */
[data-theme="dark"] .achievement-chip.metric { color: #7C9CF0 !important; }
[data-theme="dark"] .achievement-chip.award { color: #4BAE8A !important; }
[data-theme="dark"] .skill-tag { color: #E9E3D6 !important; background: rgba(200,155,60,0.18) !important; }

/* index AI-teaser blue accents: lift for night */
[data-theme="dark"] .ai-teaser-heading em, [data-theme="dark"] .ai-preview-arrow,
[data-theme="dark"] .ai-article-preview:hover { color: #7FB7E8 !important; }

/* ── DARK POLISH PASS 6 - inspector-guided finals ─────── */
/* light tinted containers under already-light text */
[data-theme="dark"] .redflag-block { background: #2A1B1B !important; }
[data-theme="dark"] .public-line { background: #24202E !important; }
[data-theme="dark"] .decade-memory { background: #28220F !important; color: #C5BEAE; }

/* nested span inside inline link-cards (ai-adoption) */
[data-theme="dark"] .article-content a span span { color: #CFC8B8 !important; }

/* inline-styled accents that are too dark at night */
[data-theme="dark"] [style*="124, 58, 237"] { color: #A78BFA !important; }
[data-theme="dark"] [style*="#7C3AED"] { color: #A78BFA !important; }
[data-theme="dark"] [style*="color:#2451B7"], [data-theme="dark"] [style*="color: #2451B7"] { color: #7C9CF0 !important; }
[data-theme="dark"] [style*="color:#555"], [data-theme="dark"] [style*="color: #555"] { color: #A9A294 !important; }
[data-theme="dark"] [style*="color:#666"], [data-theme="dark"] [style*="color: #666"] { color: #A9A294 !important; }

/* amber-filled buttons keep ink text in both themes */
[data-theme="dark"] [style*="background:var(--amber)"],
[data-theme="dark"] [style*="background: var(--amber)"] { color: #1E1E2E !important; }

/* index hardcoded nav: Portrait button uses literal ink */
[data-theme="dark"] .nav-portrait-wrap > button { color: var(--ink) !important; }

/* craft tier descriptions (bare #555 paragraphs in grid cells) */
[data-theme="dark"] .tier p, [data-theme="dark"] .tier-desc,
[data-theme="dark"] .levels p { color: #A9A294 !important; }

[data-theme="dark"] [style*="124,58,237"] { color: #A78BFA !important; }

/* ── ai-guide dark fixes (live-site report 2026-06-13) ── */
[data-theme="dark"] .mission-inner p,
[data-theme="dark"] .clarity-list li { color: #C5BEAE !important; }
[data-theme="dark"] .path-route { color: #97AB9E !important; }

/* ── AI-ARTICLES DARK READABILITY (generated 2026-06-13) ──
   Auto-derived from every faint text rule across articles/ai/* + ai-guide.
   Semantic hues lightened (red stays red); greys lifted by tier;
   ghost numerals become light ghosts. */
[data-theme="dark"] .force-nav-link.fn02,
[data-theme="dark"] .grade-ahead,
[data-theme="dark"] .tier-chip.exists { color: #2FBF9E !important; }
[data-theme="dark"] .force-header.f03 h3,
[data-theme="dark"] .role-col-after .role-col-title { color: #4BAE8A !important; }
[data-theme="dark"] .lc-search .lc-step,
[data-theme="dark"] .lc-search .lc-tech b { color: #5FB9DC !important; }
[data-theme="dark"] .force-nav-link.fn01 { color: #62AECB !important; }
[data-theme="dark"] .force-header.f01 h3 { color: #6FA8C9 !important; }
[data-theme="dark"] .force-header.f08 .force-num,
[data-theme="dark"] .force-header.f08 h3 { color: #6FAE6F !important; }
[data-theme="dark"] .data-layer:nth-child(1) .dl-name,
[data-theme="dark"] .when-row:nth-child(1) .when-layer { color: #7CA9F8 !important; }
[data-theme="dark"] .pyramid-layer:nth-child(1) .pyramid-layer-num { color: #9AA6B8 !important; }
[data-theme="dark"] .legend-credit a,
[data-theme="dark"] .scenario-block-label,
[data-theme="dark"] .scenario-src a,
[data-theme="dark"] .scenario-stat-num,
[data-theme="dark"] .source-preview-host,
[data-theme="dark"] .tier-chip.scifi { color: #A78BFA !important; }
[data-theme="dark"] .converge-src,
[data-theme="dark"] .crosslink-excerpt,
[data-theme="dark"] .invest-desc,
[data-theme="dark"] .legend-credit,
[data-theme="dark"] .pyramid-tools,
[data-theme="dark"] .scenario-src,
[data-theme="dark"] .scenario-stat-label,
[data-theme="dark"] .series-excerpt,
[data-theme="dark"] .stack-role,
[data-theme="dark"] .stat-label,
[data-theme="dark"] .tier-note,
[data-theme="dark"] .tier-source-note,
[data-theme="dark"] .tool-chip,
[data-theme="dark"] .xwalk-caveat { color: #A9A294 !important; }
[data-theme="dark"] .force-header.f04 h3 { color: #B08BE8 !important; }
[data-theme="dark"] .artifact-note,
[data-theme="dark"] .check-desc,
[data-theme="dark"] .field-verdict,
[data-theme="dark"] .force-summary,
[data-theme="dark"] .lc-caption,
[data-theme="dark"] .legend-item,
[data-theme="dark"] .lineage-table td:nth-child(2),
[data-theme="dark"] .matrix-table th,
[data-theme="dark"] .path-route,
[data-theme="dark"] .pc-list li,
[data-theme="dark"] .phase-hook,
[data-theme="dark"] .phase-nav-link,
[data-theme="dark"] .pyramid-layer:nth-child(1) .pyramid-title,
[data-theme="dark"] .read-next-excerpt,
[data-theme="dark"] .req-desc,
[data-theme="dark"] .scenario-note,
[data-theme="dark"] .series-card--soon .series-title,
[data-theme="dark"] .signal-why,
[data-theme="dark"] .source-preview-desc,
[data-theme="dark"] .tier-source-note strong,
[data-theme="dark"] .track-note,
[data-theme="dark"] .trend-index-item,
[data-theme="dark"] .trend-summary { color: #B5AE9F !important; }
[data-theme="dark"] .cf4,
[data-theme="dark"] .data-layer:nth-child(3) .dl-name,
[data-theme="dark"] .dl-ai-note,
[data-theme="dark"] .flow-label,
[data-theme="dark"] .insight-block.f04 .insight-label,
[data-theme="dark"] .scenario-row:nth-child(4) .scenario-track,
[data-theme="dark"] .stack-layer:nth-child(3) .stack-name,
[data-theme="dark"] .tool-chip.f04,
[data-theme="dark"] .when-row:nth-child(3) .when-layer { color: #C08BFA !important; }
[data-theme="dark"] .ai-cell-text,
[data-theme="dark"] .article-content p,
[data-theme="dark"] .audience-list li,
[data-theme="dark"] .book-why,
[data-theme="dark"] .cache-desc,
[data-theme="dark"] .cascade-caption,
[data-theme="dark"] .clarity-list li,
[data-theme="dark"] .closing-note,
[data-theme="dark"] .converge-block p,
[data-theme="dark"] .cost-tool,
[data-theme="dark"] .ddd-rule,
[data-theme="dark"] .ddd-use,
[data-theme="dark"] .delegate-list li,
[data-theme="dark"] .dl-solves,
[data-theme="dark"] .dlq-text,
[data-theme="dark"] .es-step,
[data-theme="dark"] .eval-cell,
[data-theme="dark"] .failure-card p,
[data-theme="dark"] .flow-note,
[data-theme="dark"] .force-header.f01 .force-num,
[data-theme="dark"] .force-header.f02 .force-num,
[data-theme="dark"] .force-header.f03 .force-num,
[data-theme="dark"] .force-header.f05 h3,
[data-theme="dark"] .force-header.f07 h3,
[data-theme="dark"] .gap-text,
[data-theme="dark"] .golden-text,
[data-theme="dark"] .grading-table td,
[data-theme="dark"] .grounded-scene p,
[data-theme="dark"] .impact-text,
[data-theme="dark"] .infra-step-desc,
[data-theme="dark"] .lab-steps li,
[data-theme="dark"] .lc-role,
[data-theme="dark"] .mission-inner p,
[data-theme="dark"] .platform-desc,
[data-theme="dark"] .posture-list li,
[data-theme="dark"] .principle-card p,
[data-theme="dark"] .queue-value,
[data-theme="dark"] .redflag-list li,
[data-theme="dark"] .role-col-desc,
[data-theme="dark"] .scenario-action,
[data-theme="dark"] .scenario-block p,
[data-theme="dark"] .series-ref-text,
[data-theme="dark"] .slo-def,
[data-theme="dark"] .stack-desc,
[data-theme="dark"] .stakeholder-spec,
[data-theme="dark"] .startup-block p,
[data-theme="dark"] .tier-ai,
[data-theme="dark"] .tier-cell-text,
[data-theme="dark"] .tier-table td,
[data-theme="dark"] .timeline-text,
[data-theme="dark"] .tldr-list li,
[data-theme="dark"] .trend-insight,
[data-theme="dark"] .unsure-list li,
[data-theme="dark"] .warning-card p,
[data-theme="dark"] .when-text,
[data-theme="dark"] .xwalk-table td,
[data-theme="dark"] .year-text { color: #C5BEAE !important; }
[data-theme="dark"] .cache-col:last-child .cache-title,
[data-theme="dark"] .force-header.f02 h3,
[data-theme="dark"] .force-header.f06 .force-num,
[data-theme="dark"] .force-header.f06 h3 { color: #D9A05B !important; }
[data-theme="dark"] .cf6,
[data-theme="dark"] .dlq-label,
[data-theme="dark"] .grade-mixed,
[data-theme="dark"] .path-card:nth-child(2) .path-label,
[data-theme="dark"] .tier-chip.emerging,
[data-theme="dark"] .tool-chip.f06,
[data-theme="dark"] .track-card.unsexy .track-name,
[data-theme="dark"] .underrated-badge { color: #D9AE54 !important; }
[data-theme="dark"] .force-nav-link.fn04,
[data-theme="dark"] .grade-behind { color: #E0626C !important; }
[data-theme="dark"] .cf2 { color: #E2954E !important; }
[data-theme="dark"] .force-nav-link.fn03 { color: #E85D96 !important; }
[data-theme="dark"] .bs-blind,
[data-theme="dark"] .cf7,
[data-theme="dark"] .cons-col .pc-label,
[data-theme="dark"] .cons-col .pc-list li::before,
[data-theme="dark"] .eval-metric,
[data-theme="dark"] .gap-badge,
[data-theme="dark"] .golden-label,
[data-theme="dark"] .insight-block.f07 .insight-label,
[data-theme="dark"] .pyramid-layer:nth-child(3) .pyramid-layer-num,
[data-theme="dark"] .pyramid-layer:nth-child(3) .pyramid-title,
[data-theme="dark"] .pyramid-layer:nth-child(4) .pyramid-badge,
[data-theme="dark"] .pyramid-layer:nth-child(4) .pyramid-layer-num,
[data-theme="dark"] .pyramid-layer:nth-child(4) .pyramid-title,
[data-theme="dark"] .tool-chip.f07,
[data-theme="dark"] .warn-icon,
[data-theme="dark"] .warn-label { color: #F26B76 !important; }
[data-theme="dark"] .artifact-tools,
[data-theme="dark"] .cf5,
[data-theme="dark"] .gap-label,
[data-theme="dark"] .insight-block.f05 .insight-label,
[data-theme="dark"] .role-item.role-agents .role-tag,
[data-theme="dark"] .role-sub-item::before,
[data-theme="dark"] .scenario-label,
[data-theme="dark"] .scenario-row:nth-child(6) .scenario-track,
[data-theme="dark"] .stack-layer:nth-child(4) .stack-name,
[data-theme="dark"] .stakeholder-card:nth-child(2) .stakeholder-tag,
[data-theme="dark"] .tool-chip.f05,
[data-theme="dark"] .unsolved-badge { color: #F86FAE !important; }
[data-theme="dark"] .artifact-num,
[data-theme="dark"] .cache-col:first-child .cache-col-label,
[data-theme="dark"] .dl-cloud,
[data-theme="dark"] .field-num,
[data-theme="dark"] .force-area,
[data-theme="dark"] .lc-flowlabel,
[data-theme="dark"] .lineage-label,
[data-theme="dark"] .phase-num,
[data-theme="dark"] .role-col-before .role-col-label,
[data-theme="dark"] .tools-label,
[data-theme="dark"] .track-num,
[data-theme="dark"] .trend-num,
[data-theme="dark"] .year-label { color: rgba(233,227,214,0.22) !important; }
[data-theme="dark"] .bs-monitor,
[data-theme="dark"] .ddd-map-header span:last-child,
[data-theme="dark"] .energy-item-source,
[data-theme="dark"] .leader-quote-role,
[data-theme="dark"] .phase-desc,
[data-theme="dark"] .shift-path span,
[data-theme="dark"] footer.back-nav p { color: rgba(250,247,242,0.62) !important; }

/* AI-series number badges & chips: bright badge bg keeps dark text legible */
[data-theme="dark"] .force-header .force-num {
  background: rgba(0,0,0,0.28) !important; color: #F2EDE2 !important;
}
[data-theme="dark"] .tier-chip { background: rgba(255,255,255,0.10) !important; }
[data-theme="dark"] .matrix-table th { background: #20202E !important; }
[data-theme="dark"] .phase-num { color: rgba(233,227,214,0.4) !important; }

/* ── AI dark: corrections for content mis-tiered as ghosts ── */
[data-theme="dark"] .force-area,
[data-theme="dark"] .lc-flowlabel,
[data-theme="dark"] .role-col-before .role-col-label,
[data-theme="dark"] .lineage-label,
[data-theme="dark"] .year-label,
[data-theme="dark"] .tools-label,
[data-theme="dark"] .cache-col:first-child .cache-col-label {
  color: #A9A294 !important;   /* real labels, not watermarks */
}
/* table headers that flipped to cream now fixed at source (split); keep their
   light text legible on the restored dark surface */
[data-theme="dark"] .xwalk-table thead tr,
[data-theme="dark"] thead tr { background: var(--ink-surface) !important; }

/* small inline ordinal indices: subtle by design, but legible */
[data-theme="dark"] .trend-num,
[data-theme="dark"] .field-num { color: rgba(233,227,214,0.55) !important; }

/* ── Theme-toggle smoke transition (puffs spawned by site-widgets.js) ──── */
.theme-smoke {
  position: fixed; inset: 0; overflow: hidden;
  pointer-events: none; z-index: 99999;
}
.theme-smoke .puff {
  position: absolute; top: 0; border-radius: 50%;
  filter: blur(26px); opacity: 0;
  will-change: transform, opacity;
  animation-name: theme-smoke-fall;
  animation-timing-function: cubic-bezier(.32, .02, .24, 1);
  animation-fill-mode: forwards;
}
/* dark->warm: darker smoke deepens the new cream surface; warm->dark: lighter
   smoke glows on the new night surface. */
.theme-smoke--towarm .puff { mix-blend-mode: multiply; }
.theme-smoke--todark .puff { mix-blend-mode: screen; }
@keyframes theme-smoke-fall {
  0%   { opacity: 0;                transform: translateY(-3vh) scale(.5); }
  28%  { opacity: var(--peak, .2); }
  100% { opacity: 0;                transform: translateY(30vh) scale(1.0); }
}
@media (max-width: 640px) { .theme-smoke .puff { filter: blur(18px); } }
@media (prefers-reduced-motion: reduce) { .theme-smoke { display: none !important; } }

/* ── STATEMENT CARDS: a saturated fill that stays put in BOTH themes (2026-09-02) ────────
   .learn-card / .lead-card / .favourite-card flood-fill with a brand hue and carry cream text.
   They are the opposite case to .warning-card & friends above: those start as a PALE tint and
   flip to a dark one, so the #C5BEAE body ramp is right for them. These four pages keep the
   saturated colour in dark - the colour IS the device - so that same ramp lands beige on brand
   colour and measures 3.36-3.87. Restore the cream the cards already use in light.

   Pages: languages-dont-win-ecosystems-do (.learn-card, var(--learn)) · the-new-builders and
   when-architecture-becomes-a-leadership-problem (.lead-card, var(--lead)) ·
   five-deployment-strategies-one-favourite (.favourite-card, #0A6E55).

   !important is required: the .article-content p lift near line 390 is itself !important, and
   equal-specificity !important ties go to whichever comes later - which is here.
   NOTE .principle-card is deliberately absent. On all 39 pages that use it, the card sits on
   var(--warm-paper), which DOES flip dark, so the standard ramp is correct there. */
[data-theme="dark"] .learn-card p,
[data-theme="dark"] .lead-card p,
[data-theme="dark"] .favourite-card p { color: rgba(250,247,242,0.92) !important; }