:root {
  --theme-transition-duration: 180ms;
  --theme-transition-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --color-bg: #f7f7f7;
  --color-card-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-strong: #ffffff;
  --color-surface-soft: #f3f5f8;
  --color-text-main: #1f2329;
  --color-text-secondary: #3f4752;
  --color-text-tertiary: #707984;
  --color-border: #e0e0e0;
  --color-border-strong: #d2d8e0;
  --color-accent-primary: #fe7040;
  --color-accent-soft: #fff0ea;
  --color-accent-text: #d95f33;
  --color-danger: #c62828;
  --color-danger-soft: #ffeceb;
  --color-danger-border: #f4b8b5;
  --color-success: #2e7d32;
  --color-success-soft: #e8f5e9;
  --color-warning: #ff9800;
  --color-warning-soft: #fff3e0;
  --color-info: #2196f3;
  --color-info-soft: #f0f4ff;
  --color-accent: var(--color-accent-primary);
  --overlay-bg: rgba(0, 0, 0, 0.5);
  --shadow-1: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-2: 0 6px 18px rgba(15, 23, 42, 0.1);
  --shadow-3: 0 20px 48px rgba(15, 23, 42, 0.2);
  --focus-ring: 0 0 0 3px rgba(254, 112, 64, 0.22);
  --ac-bg: var(--color-bg);
  --ac-surface: var(--color-card-bg);
  --ac-surface-soft: var(--color-surface-soft);
  --ac-text: var(--color-text-main);
  --ac-text-soft: var(--color-text-secondary);
  --ac-border: var(--color-border);
  --ac-border-strong: var(--color-border-strong);
  --ac-accent: var(--color-accent-primary);
  --ac-accent-soft: var(--color-accent-soft);
  --ac-accent-text: var(--color-accent-text);
  --ac-danger: var(--color-danger);
  --ac-shadow-1: var(--shadow-1);
  --ac-shadow-2: var(--shadow-2);
  --ac-radius-lg: 20px;
  --ac-radius-md: 14px;
  --ac-radius-sm: 10px;
  --ac-focus-ring: var(--focus-ring);
}

html {
  color-scheme: light;
}

html[data-theme='dark'] {
  --color-bg: #0d1117;
  --color-card-bg: #111827;
  --color-surface: #111827;
  --color-surface-strong: #161c27;
  --color-surface-soft: #182233;
  --color-text-main: #e5edf7;
  --color-text-secondary: #b0bfd0;
  --color-text-tertiary: #7d8ca1;
  --color-border: #263244;
  --color-border-strong: #324154;
  --color-accent-soft: rgba(254, 112, 64, 0.16);
  --color-accent-text: #ff9a72;
  --color-danger: #ff8d8d;
  --color-danger-soft: rgba(198, 40, 40, 0.18);
  --color-danger-border: rgba(198, 40, 40, 0.34);
  --color-success: #79d07f;
  --color-success-soft: rgba(46, 125, 50, 0.18);
  --color-warning: #ffbe5c;
  --color-warning-soft: rgba(255, 152, 0, 0.16);
  --color-info: #6eb7ff;
  --color-info-soft: rgba(33, 150, 243, 0.16);
  --overlay-bg: rgba(3, 6, 12, 0.66);
  --shadow-1: 0 2px 12px rgba(0, 0, 0, 0.3);
  --shadow-2: 0 10px 24px rgba(0, 0, 0, 0.34);
  --shadow-3: 0 24px 60px rgba(0, 0, 0, 0.42);
  --focus-ring: 0 0 0 3px rgba(254, 112, 64, 0.28);
  color-scheme: dark;
}

html[data-theme='light'] {
  color-scheme: light;
}

body,
body::before,
body::after,
input,
textarea,
select,
button,
a,
svg,
svg *,
[class*='card'],
[class*='panel'],
[class*='modal'],
[class*='dialog'],
[class*='drawer'],
[class*='sheet'],
[class*='surface'],
[class*='overlay'],
[class*='chip'],
[class*='badge'],
[class*='pill'],
[class*='tag'],
[class*='header'],
[class*='footer'],
[class*='nav'],
[class*='list'],
[class*='item'],
[class*='btn'],
[class*='button'],
[class*='input'],
[class*='select'],
[class*='textarea'] {
  transition:
    background-color var(--theme-transition-duration) var(--theme-transition-ease),
    color var(--theme-transition-duration) var(--theme-transition-ease),
    border-color var(--theme-transition-duration) var(--theme-transition-ease),
    box-shadow var(--theme-transition-duration) var(--theme-transition-ease),
    fill var(--theme-transition-duration) var(--theme-transition-ease),
    stroke var(--theme-transition-duration) var(--theme-transition-ease);
}

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