/* DailyQuest — Design tokens (CSS custom properties) */
:root {
  /* Core brand */
  --color-primary:        #6C3CE1;
  --color-primary-dark:   #4A28A8;
  --color-primary-light:  #EDE8FF;

  /* Accent */
  --color-accent:         #FF6B35;
  --color-accent-light:   #FFF0EB;

  /* Semantic */
  --color-success:        #22C55E;
  --color-warning:        #F59E0B;
  --color-danger:         #EF4444;
  --color-info:           #3B82F6;

  /* Gold economy */
  --color-coin:           #F5C518;
  --color-coin-bg:        #FFFBEB;
  --color-xp:             #A855F7;
  --color-xp-bg:          #F5F0FF;

  /* Minutes */
  --color-minutes:        #0EA5E9;
  --color-minutes-bg:     #F0F9FF;

  /* Neutrals */
  --color-surface:        #FFFFFF;
  --color-surface-alt:    #F8F7FF;
  --color-border:         #E5E0F8;
  --color-text:           #1A1033;
  --color-text-muted:     #6B6388;
  --color-text-on-primary: #FFFFFF;

  /* Shadows */
  --shadow-sm:  0 1px 3px rgba(108,60,225,.08);
  --shadow-md:  0 4px 16px rgba(108,60,225,.12);
  --shadow-lg:  0 8px 32px rgba(108,60,225,.18);
  --shadow-xl:  0 16px 48px rgba(108,60,225,.22);

  /* Radii */
  --radius-sm:   8px;
  --radius-md:   14px;
  --radius-lg:   20px;
  --radius-xl:   28px;
  --radius-full: 9999px;

  /* Spacing (8pt grid) */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Typography */
  --font-display: 'Plus Jakarta Sans', 'SF Pro Display', -apple-system, sans-serif;
  --font-body:    'Plus Jakarta Sans', 'SF Pro Text', -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'SF Mono', monospace;

  --text-xs:   11px;
  --text-sm:   13px;
  --text-base: 15px;
  --text-md:   17px;
  --text-lg:   20px;
  --text-xl:   24px;
  --text-2xl:  30px;
  --text-3xl:  38px;

  /* Transitions */
  --transition-fast:   150ms ease;
  --transition-base:   200ms ease;
  --transition-slow:   350ms ease;

  /* Z-index layers */
  --z-base:    1;
  --z-sticky:  100;
  --z-modal:   200;
  --z-toast:   300;
  --z-overlay: 400;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}