/* Approved site palette. Templates use roles, never custom color values. */
:root {
  --palette-black: #191B1E;
  --palette-white: #E7E5DF;
  --palette-gray: #A3A6AA;
  --palette-blue: #74899B;
  --palette-gold: #B6A17F;

  /* RGB channels allow glass, shadows and subtle rules without new hues. */
  --palette-black-rgb: 25, 27, 30;
  --palette-white-rgb: 231, 229, 223;
  --palette-gray-rgb: 163, 166, 170;
  --palette-blue-rgb: 116, 137, 155;
  --palette-gold-rgb: 182, 161, 127;

  --bg: var(--palette-black);
  --text-strong: var(--palette-white);
  --text-primary: var(--palette-white);
  --text-mid: var(--palette-gray);
  --text-secondary: var(--palette-gray);
  --accent: var(--palette-blue);
  --accent-rgb: var(--palette-blue-rgb);
  --gold: var(--palette-gold);
  --danger: var(--palette-gold);
  --success: var(--palette-blue);
  --on-accent: var(--palette-black);
  --accent-hover: color-mix(in srgb, var(--palette-blue) 85%, var(--palette-white));
  --line-faint: rgba(var(--palette-gray-rgb), .3);
  --surface: var(--palette-black);
  --surface-raised: color-mix(in srgb, var(--palette-black) 98%, var(--palette-white));
  --surface-hover: rgba(var(--palette-white-rgb), .08);
  --surface-border: rgba(var(--palette-gray-rgb), .25);
  --bg-gradient: linear-gradient(135deg, var(--palette-black), var(--surface));
  --text-muted: rgba(var(--palette-gray-rgb), .75);
  --text-faint: rgba(var(--palette-gray-rgb), .55);
  color-scheme: dark;
  accent-color: var(--palette-blue);
}

/* Explicit template choices take precedence over component defaults. */
[data-tone="primary"] { color: var(--text-strong) !important; }
[data-tone="secondary"] { color: var(--text-secondary) !important; }
[data-tone="interactive"] { color: var(--accent) !important; }
[data-tone="detail"] { color: var(--gold) !important; }
[data-surface="base"] { background: var(--bg) !important; }
[data-surface="panel"] { background: var(--surface) !important; }
[data-surface="raised"] { background: var(--surface-raised) !important; }