:root {
  /* Colors - bright, playful palette */
  --color-bg: #FFF8F0;
  --color-surface: #FFFFFF;
  --color-primary: #FF6B35;
  --color-secondary: #004E89;
  --color-accent: #2EC4B6;
  --color-danger: #E71D36;
  --color-muted: #8D99AE;
  --color-text: #2B2D42;
  --color-text-light: #8D99AE;

  /* Spacing - 4px base unit */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;

  /* Typography */
  --font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-size-sm: 0.875rem;
  --font-size-base: 1rem;
  --font-size-lg: 1.25rem;
  --font-size-xl: 1.5rem;
  --font-size-2xl: 2rem;
  --font-weight-normal: 400;
  --font-weight-bold: 700;

  /* Layout */
  --max-width: 420px;
  --hud-height: 48px;
  --action-panel-height: 45vh;
  --border-radius: 12px;
  --border-radius-sm: 8px;

  /* Tap targets - minimum 48px per WCAG */
  --tap-target-min: 48px;

  /* Transitions */
  --transition-fast: 150ms ease;
  --transition-normal: 300ms ease;
  --transition-slow: 500ms ease;
}