:root {
  --white: #f8f8f8;
  --light: #d4d6d3;
  --dark: #15181B;
  --shade: #d4d6d312;
  --primary: #c62223;
  --secondary: #08168a;
  --accent: #F58220;

  /* Legacy aliases mapped to the new generic palette */
  --color-white: var(--white);
  --color-navy-900: var(--dark);
  --color-navy-800: var(--dark);
  --color-navy-700: color-mix(in srgb, var(--secondary) 65%, var(--dark));
  --color-gold: var(--accent);
  --color-gold-light: color-mix(in srgb, var(--accent) 65%, var(--white));
  --color-slate-100: color-mix(in srgb, var(--light) 35%, var(--white));
  --color-slate-500: color-mix(in srgb, var(--secondary) 60%, var(--light));
  --color-gray-100: color-mix(in srgb, var(--light) 20%, var(--white));
  --color-gray-200: color-mix(in srgb, var(--light) 45%, var(--white));
  --color-gray-300: color-mix(in srgb, var(--light) 75%, var(--white));
  --color-gray-400: color-mix(in srgb, var(--light) 82%, var(--dark));
  --color-gray-500: color-mix(in srgb, var(--light) 64%, var(--dark));
  --color-gray-600: color-mix(in srgb, var(--light) 46%, var(--dark));
  --color-red-500: var(--primary);

  --surface-page: var(--white);
  --surface-muted: color-mix(in srgb, var(--light) 35%, var(--white));
  --surface-dark: var(--dark);

  --text-body: color-mix(in srgb, var(--dark) 92%, var(--light));
  --text-heading: var(--dark);
  --text-on-dark: var(--white);
  --text-muted: color-mix(in srgb, var(--dark) 65%, var(--light));

  /* Alpha and state helpers built only from generic colors */
  --tone-white-95: color-mix(in srgb, var(--white) 95%, transparent);
  --tone-white-80: color-mix(in srgb, var(--white) 80%, transparent);
  --tone-white-70: color-mix(in srgb, var(--white) 70%, transparent);
  --tone-white-50: color-mix(in srgb, var(--white) 50%, transparent);
  --tone-white-30: color-mix(in srgb, var(--white) 30%, transparent);
  --tone-white-20: color-mix(in srgb, var(--white) 20%, transparent);
  --tone-white-15: color-mix(in srgb, var(--white) 15%, transparent);
  --tone-white-10: color-mix(in srgb, var(--white) 10%, transparent);
  --tone-white-8: color-mix(in srgb, var(--white) 8%, transparent);
  --tone-white-5: color-mix(in srgb, var(--white) 5%, transparent);
  --tone-dark-80: color-mix(in srgb, var(--dark) 80%, transparent);
  --tone-dark-75: color-mix(in srgb, var(--dark) 75%, transparent);
  --tone-dark-16: color-mix(in srgb, var(--dark) 16%, transparent);
  --tone-dark-12: color-mix(in srgb, var(--dark) 12%, transparent);
  --tone-dark-8: color-mix(in srgb, var(--dark) 8%, transparent);
  --tone-accent-80: color-mix(in srgb, var(--accent) 80%, transparent);
  --tone-accent-40: color-mix(in srgb, var(--accent) 40%, transparent);
  --tone-accent-30: color-mix(in srgb, var(--accent) 30%, transparent);
  --tone-primary-70: color-mix(in srgb, var(--primary) 70%, var(--white));
  --tone-primary-35: color-mix(in srgb, var(--primary) 35%, var(--white));
  --tone-primary-18: color-mix(in srgb, var(--primary) 18%, var(--white));
  --tone-accent-20: color-mix(in srgb, var(--accent) 20%, var(--white));

  --font-sans: "Inter", system-ui, sans-serif;
  --font-display: "TASA Explorer", Georgia, serif;

  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: 1.25rem;
  --font-size-2xl: 1.5rem;
  --font-size-3xl: 1.875rem;

  --line-tight: 1.2;
  --line-base: 1.5;
  --line-relaxed: 1.7;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 4rem;
  --space-16: 6rem;
  --space-20: 8rem;

  --radius-sm: 0.5rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-xl: 1.25rem;
  --radius-pill: 999rem;

  --shadow-soft: 0 0.75rem 1.875rem color-mix(in srgb, var(--dark) 18%, transparent);
  --shadow-menu: 0 1.25rem 2.813rem color-mix(in srgb, var(--dark) 20%, transparent);

  --transition-fast: 160ms ease;
  --transition-base: 240ms ease;

  --container-wide: calc(100% - 20rem);
  --container-default: 80rem;
  --container-narrow: 48rem;

  --nav-offset-mobile: 7rem;
  --nav-offset-desktop: 6rem;
}