/**
 * ALMAX design tokens — colors + type from the brand book.
 * Light is the site default; dark is html[data-prc-theme="dark"].
 * Components should use semantic tokens, not raw --n-* / --orange-*.
 */

:root {
  --orange-500: #F26722;
  --orange-600: #C4571E;
  --orange-700: #B34D18;

  --n-950: #0E0E0E;
  --n-900: #111418;
  --n-800: #1C1F24;
  --n-700: #2A2F37;
  --n-600: #363C45;
  --n-500: #6B6F76;
  --n-450: #5F646B;
  --n-400: #A6ACB5;
  --n-300: #C7CCD1;
  --n-200: #D7D9DC;
  --n-150: #E9EBEE;
  --n-100: #F4F5F6;
  --n-000: #FFFFFF;

  --font-display: "Barlow Condensed", "Barlow", system-ui, sans-serif;
  --font-copy: "Barlow", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --almax-font-family: var(--font-copy);

  --size-display: 72px;
  --size-numeral: 36px;
  --size-h2: 30px;
  --size-h3: 20px;
  --size-lede: 18px;
  --size-body: 14px;
  --size-label: 12px;
  --size-meta: 12px;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;

  --line-display: 0.95;
  --line-heading: 1.05;
  --line-tight: 1;
  --line-body: 1.5;
  --line-compact: 1.4;
  --line-meta: 1.3;

  --track-display: 0.02em;
  --track-h3: 0.03em;
  --track-label: 0.12em;
  --track-label-wide: 0.16em;
  --track-label-bold: 0.06em;
  --track-mono: 0.04em;
  --track-mono-wide: 0.08em;

  --type-display: 700 72px/0.95 var(--font-display);
  --type-numeral: 700 36px/1 var(--font-display);
  --type-h2: 700 30px/1.05 var(--font-display);
  --type-h3: 700 20px/1 var(--font-display);
  --type-lede: 400 18px/1.5 var(--font-copy);
  --type-body: 400 14px/1.5 var(--font-copy);
  --type-body-compact: 400 12px/1.4 var(--font-copy);
  --type-label: 500 12px/1 var(--font-copy);
  --type-label-bold: 700 14px/1.1 var(--font-copy);
  --type-chip: 500 12px/1 var(--font-copy);
  --type-meta: 400 12px/1.3 var(--font-mono);
  --type-meta-medium: 500 12px/1 var(--font-mono);

  --header-ink: var(--n-000);
}

/* Light regime (site default) */
:root {
  color-scheme: light;
  --regime: light;

  --bg-canvas: #e8e9e3;
  --bg-panel: var(--n-100);
  --bg-raised: var(--n-150);
  --bg-imagery: var(--n-950);
  --bg-accent: var(--orange-500);

  --border-rule: var(--n-200);
  --border-quiet: var(--n-400);
  --border-accent: var(--orange-500);
  --border-silver: #8A9098;

  --grid-line: #E6E8EB;
  --grid-dot: #CFD3D8;

  --text-primary: var(--n-900);
  --text-body: var(--n-700);
  --text-secondary: var(--n-450);
  --text-accent: var(--orange-700);
  --text-on-accent: var(--n-900);
  --text-disabled: var(--n-400);

  --icon-ink: var(--n-700);
  --badge-ink: var(--n-450);

  --accent: var(--orange-500);
  --accent-hover: var(--orange-600);
  --accent-pressed: var(--orange-700);
  --focus-ring: 0 0 0 2px var(--bg-canvas), 0 0 0 4px var(--orange-500);

  --status-ok: var(--n-500);
  --status-attention: var(--orange-500);
  --status-off: var(--n-400);

  --almax-background-color: var(--bg-canvas);
  --almax-footer-background: var(--bg-canvas);
  --almax-text-color: var(--text-body);
  --almax-text-muted-color: var(--text-secondary);
  --almax-clip-bg: var(--bg-panel);
  --color-background: var(--bg-canvas);
  --color-surface: var(--bg-panel);
  --color-text: var(--text-body);
  --color-muted: var(--text-secondary);
  --color-accent: var(--almax-primary-color, var(--accent));
  --color-accent-dark: var(--almax-secondary-color, var(--accent-hover));
  --color-link: var(--almax-link-color, var(--text-accent));
  --color-link-hover: var(--almax-link-hover-color, var(--text-primary));
}

html[data-prc-theme="dark"] {
  color-scheme: dark;
  --regime: dark;

  --bg-canvas: #25282d;
  --bg-panel: var(--n-800);
  --bg-raised: var(--n-700);
  --bg-imagery: var(--n-950);
  --bg-accent: var(--orange-500);

  --border-rule: var(--n-600);
  --border-quiet: var(--n-500);
  --border-accent: var(--orange-500);
  --border-silver: var(--n-300);

  --grid-line: #292C31;
  --grid-dot: #3B3E43;

  --text-primary: var(--n-000);
  --text-body: var(--n-200);
  --text-secondary: var(--n-400);
  --text-accent: var(--orange-500);
  --text-on-accent: var(--n-900);
  --text-disabled: var(--n-500);

  --icon-ink: var(--n-200);
  --badge-ink: var(--n-400);

  --accent: var(--orange-500);
  --accent-hover: var(--orange-600);
  --accent-pressed: var(--orange-700);
  --focus-ring: 0 0 0 2px var(--bg-canvas), 0 0 0 4px var(--orange-500);

  --status-ok: var(--n-300);
  --status-attention: var(--orange-500);
  --status-off: var(--n-500);

  --almax-background-color: var(--bg-canvas);
  --almax-footer-background: var(--bg-canvas);
  --almax-text-color: var(--text-body);
  --almax-text-muted-color: var(--text-secondary);
  --almax-clip-bg: var(--bg-panel);
  --color-background: var(--bg-canvas);
  --color-surface: var(--bg-panel);
  --color-text: var(--text-body);
  --color-muted: var(--text-secondary);
  --color-accent: var(--almax-primary-color, var(--accent));
  --color-accent-dark: var(--almax-secondary-color, var(--accent-hover));
  --color-link: var(--almax-link-color, var(--text-accent));
  --color-link-hover: var(--almax-link-hover-color, var(--text-primary));
}