/* Shared design tokens. Change palettes here, not in individual components. */
:root {
  color-scheme: dark;
  --font: Arial, Helvetica, sans-serif;
  --page-width: 1440px;
  --gutter: clamp(20px, 5vw, 80px);
  --surface: #080808;
  --chrome: #080808;
  --text: #ffffff;
  --muted: #b4b4b4;
  --line: #353535;
  --accent: #c6a45c;
  --headline-accent: #c6a45c;
  --focus-dark: #e2c88d;
  --paper: #ffffff;
  --paper-text: #101010;
  --paper-muted: #626262;
  --paper-line: #d8d8d8;
  --action-bg: #c6a45c;
  --action-text: #080808;
  --focus-light: #80601e;
}
:root[data-theme="navy"] {
  --surface: #0b1b33;
  --chrome: #05070a;
  --muted: #b7c3d3;
  --line: #344359;
  --accent: #ffffff;
  --headline-accent: #ffffff;
  --focus-dark: #ffffff;
  --action-bg: #080808;
  --action-text: #ffffff;
  --focus-light: #0b1b33;
}