:root {
  /* Chart series — assign strictly in order 1..7. Order encodes lightness separation. */
  --color-cat-1: #1E3751;
  --color-cat-2: #572E1F;
  --color-cat-3: #CAABD2;
  --color-cat-4: #39767F;
  --color-cat-5: #8E8456;
  --color-cat-6: #405277;
  --color-cat-7: #80AB8B;

  /* Semantic — reserved meanings. Never used as ordinary series colours. */
  --color-positive: #487F4A;
  --color-negative: #A9392C;
  --color-warning: #C89251;
  --color-neutral: #8B857D;
  --color-accent: #1E3751;
  --color-accent-soft: #DAEAFA;

  /* Brand orange — from the wslr wordmark bar. Emphasis only: rules, underlines, the mark,
     active-state markers. Never a status colour (it reads as warning/negative next to
     #C89251 and #A9392C) and never a chart series. */
  --color-brand: #E8663C;
  --color-brand-soft: #FBE4DB;
  --color-brand-ink: #A8401E;

  /* Surfaces */
  --color-surface-base: #FAF6EF;
  --color-surface-subtle: #F2ECE3;
  --color-surface-sunken: #E6DFD3;
  --color-surface-border: #D8D0C3;

  /* Text */
  --color-text-primary: #29211A;
  --color-text-secondary: #6A615A;
  --color-text-inverse: #FCFAF6;
  --color-text-link: #245F8C;

  /* Diverging / conditional formatting scale */
  --color-scale-min: #A9392C;
  --color-scale-center: #F2ECE3;
  --color-scale-max: #1E3751;
  --color-scale-null: #D8D0C3;

  /* Chart roles */
  --color-chart-emphasis: #1E3751;
  --color-chart-emphasis-soft: #DAEAFA;
  --color-chart-context: #BBB7B0;
  --color-chart-context-edge: #96918A;
  /* One called-out mark in an otherwise grey chart. Not a series colour — never appears
     more than once per chart, and never in a chart that carries status/conditional colour. */
  --color-chart-highlight: var(--color-brand);

  /* Semantic aliases — prefer these in component code */
  --page-bg: var(--color-surface-subtle);
  --surface-card: var(--color-surface-base);
  --surface-slide-body: var(--color-surface-base);
  --surface-inset: var(--color-surface-sunken);
  --border-default: var(--color-surface-border);
  --border-strong: var(--color-chart-context-edge);
  --text-body-color: var(--color-text-primary);
  --text-muted: var(--color-text-secondary);
  --text-on-accent: var(--color-text-inverse);
  --link: var(--color-text-link);
  --focus-ring: var(--color-accent);
  --rule-brand: var(--color-brand);
  --surface-brand-tint: var(--color-brand-soft);
  --text-on-brand-tint: var(--color-brand-ink);
}
