/* Refined Wolds design tokens. Legacy palette names retain their original meanings. */

:root {
  /* Existing brand names remain compatible with all current screens. */
  --navy: #1d303e;
  --teal: #80aeb1;
  --teal-dark: #35676c;
  --blue: #85a7c5;
  --sage: #bdc8ba;
  --gold: #bea77d;
  --page: #f8f7f5;
  --line: #dce4e3;

  /* Semantic aliases for newly adopted components. */
  --color-primary: var(--teal-dark);
  --color-primary-hover: #284f55;
  --color-on-primary: #fff;
  --color-back-background: var(--gold);
  --color-back-hover: #b39a6d;
  --color-back-text: var(--navy);
  --color-surface: #fff;
  --color-field-border: #94a3b8;
  --color-danger: #b23b42;
  --color-danger-surface: #fff1f2;
  --color-danger-border: #f3d9dc;
  --font-family-body: system-ui;
  --font-family-brand: Georgia, serif;
  --font-size-body: 16px;
  --line-height-body: 1.5;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --control-size: 44px;
  --radius-field: 5px;
  --radius-control: 6px;
  --radius-panel: 12px;
  --focus-ring: 3px solid var(--gold);
  --shadow-panel: 0 3px 14px #1d303e06;
}