/* ════════════════════════════════════════════════════════════════════
   MotivSvelte Design System — CSS Custom Properties
   Source: motivsveltepalettev2.pdf
   ════════════════════════════════════════════════════════════════════ */
:root {
  /* Primary — Deep Navy */
  --ms-navy-900: #0F1E2B;
  --ms-navy-800: #1A2F3F;
  --ms-navy-700: #253D50;
  --ms-navy-600: #345369;
  --ms-navy-100: #D6E2EB;

  /* Accent — Aqua Stream */
  --ms-aqua-700: #2E8FAD;
  --ms-aqua-600: #3BA3C4;
  --ms-aqua-500: #52B8D6;
  --ms-aqua-300: #8ED4E8;
  --ms-aqua-100: #D4F0F8;

  /* Dim 1 — Glycemic Gold */
  --ms-gold-800: #7A5A1A;
  --ms-gold-600: #B8861E;
  --ms-gold-500: #D4A232;
  --ms-gold-300: #E8C86E;
  --ms-gold-100: #FBF0D4;

  /* Dim 2 — Structure Indigo */
  --ms-indigo-800: #352A6B;
  --ms-indigo-600: #5548A0;
  --ms-indigo-500: #6E5FBF;
  --ms-indigo-300: #A89ED6;
  --ms-indigo-100: #ECEAF7;

  /* Dim 3 — Quality Green */
  --ms-green-800: #1E5A3A;
  --ms-green-600: #2D7A50;
  --ms-green-500: #3E9B65;
  --ms-green-300: #7DC4A0;
  --ms-green-100: #D4EDDF;

  /* Surface — Warm Neutrals */
  --ms-cream-50: #F7F4EF;
  --ms-cream-100: #EDE8E0;
  --ms-cream-200: #DDD7CC;
  --ms-cream-300: #C4BCB0;

  /* Semantic */
  --ms-warning: #D4933D;
  --ms-warning-light: #FBF0DE;
  --ms-error: #C74B4B;
  --ms-error-light: #FADEDE;

  /* Shortcuts */
  --fg: var(--ms-navy-900);
  --fg-muted: var(--ms-navy-600);
  --bg: var(--ms-cream-50);
  --bg-warm: var(--ms-cream-100);
  --accent: var(--ms-aqua-500);
  --accent-hover: var(--ms-aqua-600);
  --accent-active: var(--ms-aqua-700);
  --accent-pale: var(--ms-aqua-100);

  --serif: 'DM Serif Display', Georgia, serif;
  --sans: 'DM Sans', -apple-system, sans-serif;
}