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

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #0f0f1a;
    --color-surface: #1a1a2e;
    --color-surface2: #222240;
    --color-border: #2d2d50;
    --color-text: #e8e8f0;
    --color-text2: #a0a0b8;
    --color-text3: #6c6c88;
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
    --shadow: 0 4px 16px rgba(0,0,0,0.4);
    --shadow-lg: 0 8px 32px rgba(0,0,0,0.5);
  }

  /* Make tool-primary brighter in dark mode */
  :root {
    --tool-primary-lighter: color-mix(in srgb, var(--tool-primary) 70%, white);
    --tool-accent-lighter: color-mix(in srgb, var(--tool-accent) 70%, white);
  }
}