/* Olbrain Color Palette, approved 7 October 2026.
   Category accents and evidence statuses have separate roles. */
:root {
  --bg: #FFFFFF;
  --bg-subtle: #F4F5F6;
  --bg-card: rgba(0,0,0,0.02);
  --bg-invert: #000000;
  --fg-1: #000000;
  --fg-2: #4A4E54;
  --fg-3: #8A8F96;
  --fg-invert: #FFFFFF;
  --fg-invert-secondary: #DFE1E4;
  --border: rgba(0,0,0,0.10);
  --border-hover: rgba(0,0,0,0.25);
  --border-strong: #000000;
  --brand-light: #006D7F;
  --brand-dark: var(--brand-light);
  --brand-hover: #005969;
  --brand-tint: #EDF5F6;
  --brand-surface: #EDF5F6;
  --accent-blue: #4777C8;
  --accent-blue-surface: #F0F4FC;
  --accent-blue-text: #2F5796;
  --accent-green: #35866B;
  --accent-green-surface: #F0F7F3;
  --accent-green-text: #23684F;
  --accent-amber: #C39732;
  --accent-amber-surface: #FCF7E9;
  --accent-amber-text: #795B16;
  --accent-coral: #C76D60;
  --accent-coral-surface: #FCF1EF;
  --accent-coral-text: #94483F;
  --state-current: #2E9C80;
  --state-current-text: #1E7A62;
  --state-current-surface: #B6DCD0;
  --state-future: #4A8CB8;
  --state-future-text: #4A4E54;
  --state-future-surface: #E7F1F8;
  --state-neutral-surface: #DFE1E4;
  --color-canvas: var(--bg);
  --color-surface-subtle: var(--bg-subtle);
  --color-text-primary: var(--fg-1);
  --color-text-secondary: var(--fg-2);
  --color-text-muted: var(--fg-3);
  --color-border: var(--border);
  --color-border-hover: var(--border-hover);
  --color-border-strong: var(--border-strong);
  --color-brand: var(--brand-light);
  --color-brand-surface: var(--brand-surface);
  --color-build: var(--accent-blue);
  --color-build-surface: var(--accent-blue-surface);
  --color-build-text: var(--accent-blue-text);
  --color-run: var(--accent-green);
  --color-run-surface: var(--accent-green-surface);
  --color-run-text: var(--accent-green-text);
  --color-govern: var(--accent-amber);
  --color-govern-surface: var(--accent-amber-surface);
  --color-govern-text: var(--accent-amber-text);
  --color-attention: var(--accent-coral);
  --color-attention-surface: var(--accent-coral-surface);
  --color-attention-text: var(--accent-coral-text);
  --color-current: var(--state-current);
  --color-current-text: var(--state-current-text);
  --color-current-surface: var(--state-current-surface);
  --color-future: var(--state-future);
  --color-future-text: var(--state-future-text);
  --color-future-surface: var(--state-future-surface);
  --color-neutral-surface: var(--state-neutral-surface);
  --color-error: var(--accent-coral-text);
  --color-error-surface: var(--accent-coral-surface);
  --text-primary: var(--fg-1);
  --text-secondary: var(--fg-2);
  --text-muted: var(--fg-3);
}

/* Shared primary actions; page-specific inverted/ghost treatments retain priority. */
.btn-primary,
.button {
  background: var(--brand-light);
  border-color: var(--brand-light);
  color: var(--fg-invert);
}
.cta-band > a {
  background: var(--brand-light);
  border-color: var(--brand-light);
  color: var(--fg-invert);
}
.cta-links a {
  color: var(--brand-light);
}

/* Small recurring accents leave editorial headings and large surfaces neutral. */
.doc-wrap .doc-section > .section-num,
.doc-hero .eyebrow,
.blog-hero .eyebrow,
.page-hero .updated,
.post .post-header .eyebrow,
.paper-kicker,
.definition-card .num,
.process-step .step-num {
  color: var(--brand-light);
}
.doc-wrap .doc-section a,
.post .post-content a,
.post .post-back,
.paper-card .paper-more,
.forecast-story-link {
  color: var(--brand-light);
}
.post .post-content blockquote {
  border-left-color: var(--accent-blue);
}
.btn-primary:hover,
.cta-band > a:hover {
  background: var(--brand-hover);
  border-color: var(--brand-hover);
}
.enterprise-hero .enterprise-hero-actions .button:not(.ghost) {
  background: var(--bg);
  border-color: var(--bg);
  color: var(--fg-1);
}
.enterprise-hero .enterprise-hero-actions .button:not(.ghost):hover {
  background: var(--bg-subtle);
  border-color: var(--bg-subtle);
  color: var(--fg-1);
}
.slide.inverted .eyebrow,
.slide.space .eyebrow {
  color: var(--fg-invert-secondary);
}

[data-palette="build"] {
  --component-accent: var(--color-build);
  --component-text: var(--color-build-text);
  --component-surface: var(--color-build-surface);
}
[data-palette="run"] {
  --component-accent: var(--color-run);
  --component-text: var(--color-run-text);
  --component-surface: var(--color-run-surface);
}
[data-palette="govern"] {
  --component-accent: var(--color-govern);
  --component-text: var(--color-govern-text);
  --component-surface: var(--color-govern-surface);
}
[data-palette="attention"] {
  --component-accent: var(--color-attention);
  --component-text: var(--color-attention-text);
  --component-surface: var(--color-attention-surface);
}
.palette-card[data-palette] {
  border-top-color: var(--component-accent);
  border-top-width: 2px;
}
.slide .stage.palette-card[data-palette] {
  border-left-color: var(--component-accent);
}
.palette-card[data-palette] > :is(.eyebrow, .section-label, .label, .mono-lbl, .step-no, .num),
.doc-wrap .doc-section[data-palette] > .section-num {
  color: var(--component-text);
}
.section .three .card.palette-card[data-palette] {
  background: var(--component-surface) !important;
  border-color: var(--border) !important;
  border-top-color: var(--component-accent) !important;
}
.section .three .card.palette-card[data-palette] .h {
  color: var(--fg-1) !important;
}
.foundation-grid article.palette-card[data-palette],
.strategy-card.palette-card[data-palette] {
  background: var(--component-surface);
  border-radius: 0;
  box-shadow: none;
}
.inverted .palette-card[data-palette] > :is(.label, .mono-lbl, .num),
.section.dark .palette-card[data-palette] > :is(.label, .step-no, .num) {
  color: var(--component-surface);
}

/* Workflow colors describe the visible input/review state, not product maturity. */
.forecast-demo {
  border-color: var(--border);
  border-radius: 0;
  box-shadow: none;
}
.forecast-demo .forecast-toolbar {
  background: var(--bg-subtle);
  border-bottom-color: var(--border);
}
.forecast-demo .forecast-steps {
  border-color: var(--border);
}
.forecast-demo .forecast-step:hover {
  background: var(--brand-surface);
}
.forecast-demo .forecast-step[aria-pressed="true"] {
  border-color: var(--brand-light);
  box-shadow: none;
}
.forecast-demo :is(.forecast-step[data-step="0"], .forecast-panel[data-panel="0"]) {
  --workflow-accent: var(--accent-blue);
  --workflow-text: var(--accent-blue-text);
  --workflow-surface: var(--accent-blue-surface);
}
.forecast-demo :is(.forecast-step[data-step="1"], .forecast-panel[data-panel="1"]) {
  --workflow-accent: var(--accent-amber);
  --workflow-text: var(--accent-amber-text);
  --workflow-surface: var(--accent-amber-surface);
}
.forecast-demo :is(.forecast-step[data-step="2"], .forecast-panel[data-panel="2"]) {
  --workflow-accent: var(--accent-green);
  --workflow-text: var(--accent-green-text);
  --workflow-surface: var(--accent-green-surface);
}
.forecast-demo .forecast-step[aria-pressed="true"]:is([data-step="0"], [data-step="1"], [data-step="2"]) {
  border-color: var(--workflow-accent);
  background: var(--workflow-surface);
}
.forecast-demo .forecast-step:is([data-step="0"], [data-step="1"], [data-step="2"]) span,
.forecast-demo .forecast-panel:is([data-panel="0"], [data-panel="1"], [data-panel="2"]) .forecast-screen-label {
  color: var(--workflow-text);
}
.forecast-demo .forecast-panel:is([data-panel="0"], [data-panel="1"], [data-panel="2"]) .forecast-receipt {
  border-color: var(--border);
  border-left: 2px solid var(--workflow-accent);
  background: var(--workflow-surface);
  color: var(--fg-2);
}
.fpna-boundary {
  border-left-color: var(--accent-amber);
  background: var(--accent-amber-surface);
}
.color-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
.color-strip .color-swatch {
  min-width: 0;
  height: 64px;
}
.color-strip .color-swatch span {
  font-size: 11px;
  text-align: center;
  opacity: 1;
}