:root {
  color-scheme: light;
  --bg: #f7f5fa;
  --surface: #ffffff;
  --surface-soft: #f4f1f8;
  --surface-accent-soft: #f8f5ff;
  --text: #2b2632;
  --muted: #746d7b;
  --border: #e6e0eb;
  --purple: #7356ed;
  --purple-strong: #6042d7;
  --purple-soft: #eee9ff;
  --purple-soft-border: #d9cdfb;
  --coral: #c24962;
  --mint: #c8f8ec;
  --blue: #6d75e5;
  --orange: #a86300;
  --danger-border: #efb8c0;
  --danger-surface: #fff4f5;
  --danger-text: #a23f4f;
  --success-text: #226b50;
  --text-on-accent: #ffffff;
  --focus-ring: rgba(115, 86, 237, 0.3);
  --shadow: 0 18px 48px rgba(54, 39, 75, 0.1);
  --shadow-soft: 0 8px 24px rgba(54, 39, 75, 0.065);
  --primary: var(--purple);
  --danger: var(--danger-text);
  --line: var(--border);
  --color-text: var(--text);
  --shadow-sm: var(--shadow-soft);
  --font-sans: Inter, ui-rounded, "SF Pro Rounded", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-size-xs: 0.75rem;
  --font-size-sm: 0.875rem;
  --font-size-md: 1rem;
  --font-size-lg: 1.125rem;
  --font-size-xl: clamp(1.75rem, 3vw, 2.2rem);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 22px;
  --space-6: 32px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 18px;
  --radius-sheet: 24px;
  --control-height: 48px;
  --control-radius: 12px;
  --card-radius: 18px;
  --card-padding: 18px;
  --touch-target: 44px;
  --content-width: 1180px;
  --motion-duration-fast: 140ms;
  --motion-duration-standard: 180ms;
  --motion-duration-slow: 260ms;
  --motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-ease-emphasized: cubic-bezier(0.2, 0, 0, 1.18);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #17141d;
  --surface: #211d29;
  --surface-soft: #2a2533;
  --surface-accent-soft: #2e273b;
  --text: #f4eff7;
  --muted: #bdb4c5;
  --border: #463e50;
  --purple: #b09cff;
  --purple-strong: #c8bbff;
  --purple-soft: #352e4f;
  --purple-soft-border: #5d5082;
  --coral: #ff91a5;
  --mint: #25544c;
  --blue: #a2a9ff;
  --orange: #f2b661;
  --danger-border: #84505a;
  --danger-surface: #3b252c;
  --danger-text: #ffabb9;
  --success-text: #8be0bd;
  --text-on-accent: #17121f;
  --focus-ring: rgba(176, 156, 255, 0.52);
  --shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
  --shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.24);
}