:root {
  color-scheme: light dark;

  /* palette:light «Бетон и охра» — основная.
     Подложки холодные, в один наклон с текстовыми токенами (#15181B, #54595F):
     тёплый крем под холодным текстом читался как рассогласование, а вместе с
     антиквой в заголовках и охрой давал самое частое сочетание ИИ-вёрстки.
     Тепло на странице остаётся ровно одно — акцент. */
  --bg-light: #ECEEEF;
  --surface-light: #DEE1E3;
  --text-light: #15181B;
  --text-muted-light: #54595F;
  --accent-light: #8A4B0F;
  /* Ховер уводит акцент в больший контраст, а не в меньший: 6.79 → 9.16.
     Правило одно на все три палитры — тогда ни одно наведение не может
     опустить пару ниже уже проверенного значения. */
  --accent-hover-light: #6E3B0B;
  --ai-light: #0B4FD8;
  --focus-light: #0B4FD8;
  --hairline-light: #C2C6C9;
  --on-accent-light: #FFFFFF;

  /* palette:dark «Сталь» — по системной настройке */
  --bg-dark: #0E1214;
  --surface-dark: #181D21;
  --text-dark: #E8EAEB;
  --text-muted-dark: #98A2A8;
  --accent-dark: #E0A44A;
  --accent-hover-dark: #EFBE72;   /* 8.59 → 11.01 */
  --ai-dark: #4FC3E8;
  --focus-dark: #4FC3E8;
  --hairline-dark: #2A3238;
  --on-accent-dark: #0E1214;

  --bg: light-dark(var(--bg-light), var(--bg-dark));
  --surface: light-dark(var(--surface-light), var(--surface-dark));
  --text: light-dark(var(--text-light), var(--text-dark));
  --text-muted: light-dark(var(--text-muted-light), var(--text-muted-dark));
  --accent: light-dark(var(--accent-light), var(--accent-dark));
  --accent-hover: light-dark(var(--accent-hover-light), var(--accent-hover-dark));
  --ai: light-dark(var(--ai-light), var(--ai-dark));
  /* Фокус — отдельный токен, а не переиспользованный --ai: --ai означает
     «зона данных и AI» (блок про приложение, блок про NDA), и обводка фокуса
     этого значения не несёт. Совпадение значений в светлой и тёмной теме
     намеренное — расходятся они только на графитовом экране. */
  --focus: light-dark(var(--focus-light), var(--focus-dark));
  --hairline: light-dark(var(--hairline-light), var(--hairline-dark));
  --on-accent: light-dark(var(--on-accent-light), var(--on-accent-dark));

  /* Флюидная шкала: 360px → 1440px, без брейкпоинтов */
  --step--1: clamp(0.875rem, 0.84rem + 0.16vw, 0.9375rem);
  --step-0: clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --step-1: clamp(1.2rem, 1.13rem + 0.32vw, 1.4rem);
  --step-2: clamp(1.44rem, 1.32rem + 0.53vw, 1.75rem);
  --step-3: clamp(1.73rem, 1.54rem + 0.85vw, 2.19rem);
  --step-4: clamp(2.07rem, 1.78rem + 1.31vw, 2.73rem);
  --step-5: clamp(2.49rem, 2.03rem + 2.03vw, 3.42rem);

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6rem;

  --measure: 62ch;
  --header-h: 4rem;
  --sticky-h: 4rem;

  /* Встроенные ease/ease-out слишком вялые: движение начинается не сразу,
     и та же длительность ощущается медленнее. Кривая берёт с места.
     ease-in не используется нигде — он тормозит именно в тот момент,
     когда пользователь смотрит внимательнее всего. */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --t-press: 160ms;   /* отклик на нажатие */
  --t-state: 200ms;   /* смена цвета и поворот шеврона */
}

/* Ручной переключатель перекрывает системную настройку */
:root[data-theme="light"] { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }

/* palette:graphite «Графит и сигнальный» — только финальный экран */
.theme-graphite {
  --bg-graphite: #12100E;
  --surface-graphite: #1C1A17;
  --text-graphite: #F0EDE8;
  --text-muted-graphite: #A39C92;
  --accent-graphite: #FF6A1A;
  --accent-hover-graphite: #FF8B4D;   /* 6.63 → 8.18 */
  /* Мятный: обводка фокуса на этом экране. AI-семантики здесь нет —
     ни одного элемента с --ai в секции #cta не встречается. */
  --focus-graphite: #7DF2C4;
  --hairline-graphite: #2E2A25;
  --on-accent-graphite: #12100E;

  --bg: var(--bg-graphite);
  --surface: var(--surface-graphite);
  --text: var(--text-graphite);
  --text-muted: var(--text-muted-graphite);
  --accent: var(--accent-graphite);
  --accent-hover: var(--accent-hover-graphite);
  --focus: var(--focus-graphite);
  --hairline: var(--hairline-graphite);
  --on-accent: var(--on-accent-graphite);

  background: var(--bg);
  color: var(--text);
}