/* IT-Кузница: токены стиля (источник правды). После каждого значения в комментарии пишите, где его применять:
   по этим пояснениям собирается DESIGN.md и брендбук. Правьте здесь, затем запустите: python tools/build_brand.py.
   Сайт и другие проекты получают копию этого файла. */
:root {
  color-scheme: light;
  /* Цвета */
  --bg: #fffaf4; /* Фон страницы, тёплый кремовый. На нём читаются text, muted и ember-deep */
  --bg-soft: #fff1e3; /* Чередующиеся полосы секций, мягкие плитки, лента показателей */
  --bg-card: #ffffff; /* Карточки, поля ввода, окна-примеры, второстепенные кнопки */
  --line: #ecdccb; /* Тонкие границы карточек и разделители, только оформление */
  --line-strong: #dcc7b2; /* Границы управляющих элементов: кнопки, чипы, поля. Контраст ниже 3:1, поэтому состояние дублируйте заливкой и подписью */
  --text: #2b1d14; /* Основной текст и заголовки на bg, bg-soft и bg-card (не ниже 14,7:1) */
  --muted: #6f5d4f; /* Вторичный текст и подписи на bg, bg-soft и bg-card (не ниже 5,6:1) */
  --ember: #f0522d; /* Жар: фирменная заливка (точки, полосы, рамка выбранного, второй цвет градиента). Не для обычного текста */
  --ember-deep: #c9360f; /* Акцентный текст и ссылки (не ниже 4,7:1), слово «Кузница» в логотипе, кольцо фокуса */
  --glow: #ff9a3c; /* Светлый конец жара: градиенты, полосы, искры. Не для текста */
  --on-ember: #2b0f05; /* Текст на заливках жара: основная кнопка и плитки с градиентом (5,1:1 и выше). Белый на них не ставим */
  --ok: #17703f; /* Положительный статус: текст и значок (не ниже 5,5:1) */
  --ok-bg: rgba(31, 138, 85, 0.12); /* Подложка положительного статуса, под текстом ok */
  --warn: #9a5b00; /* Предупреждение: текст на warn-bg (4,8:1), всегда со словом */
  --warn-bg: #fff0d6; /* Подложка предупреждения */
  --bad: #b3321a; /* Ошибка или просрочка: текст на bad-bg (5,1:1), всегда со словом или знаком */
  --bad-bg: #fde3dd; /* Подложка ошибки */
  --info: #2c4f9e; /* Нейтральный статус «в процессе»: текст на info-bg (6,7:1). Единственный холодный цвет */
  --info-bg: #e8f0ff; /* Подложка нейтрального статуса */
  /* Скругления */
  --radius: 14px; /* Плитки значков, лента показателей, вопросы */
  --radius-lg: 22px; /* Карточки, окна-примеры, диалоги */
  --radius-pill: 999px; /* Кнопки, чипы, пункты выбора, плашки, переключатели */
  /* Тени */
  --shadow: 0 30px 60px -32px rgba(120, 60, 20, 0.45), 0 2px 6px rgba(120, 60, 20, 0.06); /* Окно-пример на первом экране */
  --shadow-lift: 0 18px 36px -22px rgba(120, 60, 20, 0.45); /* Карточка при наведении, вместе со сдвигом на 3px вверх */
  --shadow-ember: 0 10px 26px -10px rgba(240, 82, 45, 0.7); /* Основная кнопка в покое */
  --shadow-ember-hover: 0 12px 32px -8px rgba(240, 82, 45, 0.85); /* Основная кнопка при наведении */
  /* Раскладка */
  --gutter: 16px; /* Боковое поле страницы на телефоне (с 1360px 32px и больше) */
  --max: 1160px; /* Ширина контейнера по умолчанию (на больших экранах растёт по ступеням) */
  /* Шрифт */
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* Шкала отступов */
  --space-1: 4px; /* Зазор между мелкими частями (точка и подпись) */
  --space-2: 8px; /* Зазор между чипами и пунктами выбора, внутри кнопки */
  --space-3: 12px; /* Зазор между рядами в списках */
  --space-4: 16px; /* Боковое поле страницы на телефоне, зазор сетки карточек */
  --space-5: 24px; /* Внутренний отступ карточки, горизонтальный отступ кнопки */
  --space-6: 32px; /* Зазор между заголовком секции и содержимым */
  --space-7: 40px; /* Зазор между колонками первого экрана на планшете */
  --space-8: 64px; /* Вертикальный отступ секции (с 1600px 84px, с 1920px 100px) */
}