/* Shared design tokens: the one place the brand palette and spacing scale are defined.
   Loaded before every other stylesheet (see packages/core/src/document.tsx). Surface files add only their own tokens. */
:root {
  /* Brand palette */
  --charcoal: #282727;
  --maroon: #4a140e;
  --maroon-deep: #36100b;
  --gold: #e9bc54;
  /* Secondary text: 6.2:1 on white, 5.2:1 on cream. */
  --muted: #6b5e55;
  /* Focus ring: maroon on light surfaces; surfaces with dark bands switch to --gold there. */
  --focus: var(--maroon);

  /* Spacing scale, 4px steps */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
}