:root {
  --color-sky-blue: #4AA8F0;
  --color-sun-gold: #F7C63D;
  --color-rainbow-pink: #F472B6;
  --color-rainbow-green: #5BC96D;
  --color-learning-purple: #8E6AD9;
  --color-cloud-white: #F8FBFF;
  --color-warm-orange: #F59E42;
  --color-trust-blue: #2563EB;
  --color-garden-green: #79C85A;
  --color-deep-navy: #243B53;
  --color-primary: var(--tstp-accent, #1565C0);
  --color-primary-dark: color-mix(in srgb, var(--tstp-accent, #1565C0) 80%, black);
  --color-accent: #F7C63D;
  --color-cta: #F59E42;
  --color-text: var(--tstp-text, #1A2B3C);
  --color-bg: var(--tstp-bg, #F0F4F8);
  --color-surface: var(--tstp-surface, #FFFFFF);
  --font-display: 'Nunito', 'Fredoka One', sans-serif;
  --font-ui: 'Nunito Sans', 'Poppins', sans-serif;
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 2rem;
  --spacing-xl: 4rem;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 9999px;
  --shadow-sm: 0 1px 3px rgba(36,59,83,0.08);
  --shadow-md: 0 4px 16px rgba(36,59,83,0.12);
  --shadow-lg: 0 8px 32px rgba(36,59,83,0.16);
  --color-text-muted: var(--tstp-text_muted, #5A7080);
  --color-border: var(--tstp-border, #CBD5E0);
  --color-link: var(--tstp-accent, #1565C0);
  --color-focus-ring: var(--tstp-focus_ring, #1565C0);
  --color-focus: var(--tstp-focus_ring, #1565C0);
  --color-secondary: var(--tstp-surface, #2196F3);
  --color-secondary-dark: color-mix(in srgb, var(--tstp-accent, #1565C0) 60%, black);
}