/* Токены дизайн-системы (ТЗ §8.2). Светлая тема по умолчанию; тёмная — по системе или вручную. */
:root {
  color-scheme: light dark;

  /* Цвета: поверхности и текст */
  --bg: #f7f8fa;
  --surface: #ffffff;
  --surface-2: #eef1f5;
  --text: #161a20;
  --text-2: #566070;
  --border: #dfe3ea;
  --border-strong: #8a94a3;
  --overlay: rgba(16, 19, 24, 0.5);

  /* Акцент: спокойный синий */
  --accent: #2b5fd9;
  --accent-hover: #234fb8;
  --accent-soft: #e8eefc;
  --on-accent: #ffffff;
  --link: #2450c0;
  --focus: #2b5fd9;

  /* Семантика: только для статусов и ошибок */
  --success: #14633a;
  --success-bg: #e3f4ea;
  --warning: #7a4b00;
  --warning-bg: #fdf0d3;
  --danger: #a82a21;
  --danger-bg: #fdeceb;
  --danger-solid: #c0352b;
  --info: #1f4bb0;
  --info-bg: #e8eefc;
  --neutral: #3d4655;
  --neutral-bg: #eceff3;

  /* Отступы */
  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;

  /* Радиусы и тени */
  --r-1: 8px;
  --r-2: 12px;
  --shadow-1: 0 1px 2px rgba(16, 19, 24, 0.08);
  --shadow-2: 0 8px 24px rgba(16, 19, 24, 0.16);

  /* Шрифт и размеры текста */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-12: 0.75rem;
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-22: 1.375rem;
  --fs-28: 1.75rem;
  --lh: 1.5;

  /* Анимация */
  --dur: 150ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  /* Размеры оболочки */
  --nav-h: 64px;
  --nav-w: 96px;
  --topbar-h: 56px;
  --tap: 44px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #101318;
    --surface: #181c23;
    --surface-2: #1f2430;
    --text: #e8ebf0;
    --text-2: #a3adbb;
    --border: #2a303c;
    --border-strong: #7c8798;
    --overlay: rgba(0, 0, 0, 0.6);
    --accent: #7aa2ff;
    --accent-hover: #96b4ff;
    --accent-soft: #1b2a4d;
    --on-accent: #0b1020;
    --link: #8fb0ff;
    --focus: #96b4ff;
    --success: #7fe0ac;
    --success-bg: #14301f;
    --warning: #f0c969;
    --warning-bg: #3a2d0b;
    --danger: #ff9d94;
    --danger-bg: #3d1714;
    --danger-solid: #ff8a80;
    --info: #9db9ff;
    --info-bg: #17254a;
    --neutral: #c7cfdb;
    --neutral-bg: #272d39;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.5);
  }
}

:root[data-theme="dark"] {
  --bg: #101318;
  --surface: #181c23;
  --surface-2: #1f2430;
  --text: #e8ebf0;
  --text-2: #a3adbb;
  --border: #2a303c;
  --border-strong: #7c8798;
  --overlay: rgba(0, 0, 0, 0.6);
  --accent: #7aa2ff;
  --accent-hover: #96b4ff;
  --accent-soft: #1b2a4d;
  --on-accent: #0b1020;
  --link: #8fb0ff;
  --focus: #96b4ff;
  --success: #7fe0ac;
  --success-bg: #14301f;
  --warning: #f0c969;
  --warning-bg: #3a2d0b;
  --danger: #ff9d94;
  --danger-bg: #3d1714;
  --danger-solid: #ff8a80;
  --info: #9db9ff;
  --info-bg: #17254a;
  --neutral: #c7cfdb;
  --neutral-bg: #272d39;
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.5);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur: 0ms;
  }
}