:root {
  /* ── Dutch palette ─────────────────────────────────── */
  --color-primary:        #1E3A8A;   /* Delft Blue – CTAs, nav, links          */
  --color-primary-hover:  #1e40af;   /* Delft Blue dark – hover                */
  --color-primary-light:  #EFF6FF;   /* Blue tint – card bg, focus ring        */
  --color-accent:         #EA580C;   /* Oranje – premium, streak, achievements */
  --color-accent-light:   #FB923C;   /* Oranje light – dark-bg accent          */
  --color-accent-tint:    #FFF7ED;   /* Oranje tint – streak/premium card bg   */
  --color-success:        #16A34A;   /* Green – correct-answer feedback only   */
  --color-success-light:  #DCFCE7;   /* Green tint – correct feedback bg       */
  --color-danger:         #DC2626;   /* Red – wrong-answer feedback            */
  --color-danger-light:   #FEE2E2;   /* Red tint – wrong feedback bg           */
  --color-warning:        #D97706;   /* Amber – weak spots, partial mastery    */
  --color-page:           #F9F7F4;   /* Warm off-white – page background       */
  --color-surface:        #FFFFFF;   /* Card surfaces                          */
  --color-text:           #0F172A;   /* Primary text                           */
  --color-text-muted:     #64748B;   /* Secondary / placeholder text           */
  --color-border:         #E2E8F0;   /* Card borders, dividers                 */
  --color-nav:            #1E3A8A;   /* Navigation bar                         */
  --color-muted:          #64748B;   /* Muted icons                            */

  /* ── Bootstrap primary override → Delft Blue ──────── */
  --bs-primary:           #1E3A8A;
  --bs-primary-rgb:       30, 58, 138;
  --bs-link-color:        #1E3A8A;
  --bs-link-hover-color:  #1e40af;

  /* ── Difficulty badge colours ──────────────────────── */
  --badge-easy:           #16A34A;
  --badge-medium:         #D97706;
  --badge-hard:           #DC2626;

  /* ── Mastery tier colours ──────────────────────────── */
  --mastery-learning:     #1E3A8A;
  --mastery-familiar:     #D97706;
  --mastery-mastered:     #16A34A;

  /* ── Surface & layout ──────────────────────────────── */
  --surface-card:         #ffffff;
  --surface-page:         #F9F7F4;
  --surface-nav:          #1E3A8A;
  --surface-footer:       #1E3A8A;

  /* ── Typography ────────────────────────────────────── */
  --font-heading: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-body:    system-ui, -apple-system, sans-serif;

  /* ── Spacing scale ──────────────────────────────────── */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;

  /* ── Legacy aliases (keeps old site.css rules working) */
  --color-secondary:      #1E3A8A;
  --color-brand-teal:     #1E3A8A;
  --color-brand-teal-dark:#1e40af;
  --color-brand-lime:     #EA580C;
}