/*
  Modern theme (default) — colours and fonts only.
  Black/white surfaces and sans-serif type; brown is reserved for small
  elements: buttons, chips, step numbers, list markers, active-item bar.
  Switch themes with: python tools/build.py --theme tools/theme/coffee.css

  Light is the default; dark is used only when chosen with the header toggle
  (stored as data-theme="dark" on <html>).
*/
:root {
  color-scheme: light;
  --cn-bg: #fafafa;
  --cn-surface: #ffffff;
  --cn-surface-2: #f4f4f5;
  --cn-text: #0a0a0a;
  --cn-muted: #6b6b70;
  --cn-border: #e4e4e7;

  /* brown accents: buttons and small elements only */
  --cn-accent: #9a6233;
  --cn-accent-strong: #6f4527;
  --cn-accent-contrast: #ffffff;
  --cn-focus: #9a6233;
  --cn-highlight: #f3ebe2;

  /* large surfaces stay black / neutral */
  --cn-header-bg: #0a0a0a;
  --cn-header-text: #ffffff;
  --cn-header-border: #0a0a0a;
  --cn-heading: #0a0a0a;
  --cn-heading-weight: 700;
  --cn-heading-tracking: -.02em;
  --cn-link: #0a0a0a;
  --cn-link-hover: #9a6233;
  --cn-active-bg: #f4f4f5;
  --cn-active-text: #0a0a0a;
  --cn-active-bar: #9a6233;

  /* topic types (dots and badges) */
  --cn-type-concept: #5b7f68;
  --cn-type-task: #9a6233;
  --cn-type-reference: #4f6f8f;
  --cn-type-troubleshooting: #b04a3a;
  --cn-type-other: #71717a;

  --cn-font-body: Inter, "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --cn-font-heading: Inter, "Segoe UI Variable Display", "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  --cn-radius: 12px;
  --cn-shadow: 0 1px 2px rgba(0, 0, 0, .04), 0 6px 24px rgba(0, 0, 0, .04);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --cn-bg: #09090b;
  --cn-surface: #121214;
  --cn-surface-2: #1b1b1f;
  --cn-text: #ededed;
  --cn-muted: #a1a1aa;
  --cn-border: #27272a;
  --cn-accent: #c58b57;
  --cn-accent-strong: #dba476;
  --cn-accent-contrast: #09090b;
  --cn-focus: #c58b57;
  --cn-highlight: #2a2119;
  --cn-header-bg: #000000;
  --cn-header-text: #ffffff;
  --cn-header-border: #27272a;
  --cn-heading: #ffffff;
  --cn-link: #ededed;
  --cn-link-hover: #dba476;
  --cn-active-bg: #1b1b1f;
  --cn-active-text: #ffffff;
  --cn-active-bar: #c58b57;
  --cn-type-concept: #8fb79c;
  --cn-type-task: #c58b57;
  --cn-type-reference: #8eaccc;
  --cn-type-troubleshooting: #e0806f;
  --cn-type-other: #a1a1aa;
  --cn-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 24px rgba(0, 0, 0, .3);
}