/* Единственное место, где заданы цвета, шрифты, отступы и радиусы.
   Правило 5 в CLAUDE.md: в разметке и компонентах — только ссылки
   на переменные отсюда. Источник значений — docs/design-system.md,
   задано владельцем 24.08.2026. */

:root {
    /* фон */
    --bg-app: #D6CAED;
    --bg-canvas: #F8F9F2;
    --bg-surface: #FFFFFF;
    --bg-inverse: #1A1D1F;

    /* текст */
    --text-primary: #1A1D1F;
    --text-secondary: #6B6F73;
    --text-muted: #9AA0A6;
    --text-on-inverse: #F8F9F2;

    /* акценты */
    --accent-lime: #E2FF83;
    --accent-violet: #785DE3;
    --accent-magenta: #BE00C8;

    /* пастель */
    --pastel-blue: #CCDDF9;
    --pastel-purple: #CDB1E3;
    --pastel-lilac: #DECAFA;
    --pastel-lilac-2: #DAD1FF;
    --pastel-pink: #F9C6F2;
    --pastel-pink-2: #FDB7F2;
    --pastel-yellow: #FFFEBC;

    /* таблицы/состояния — из докс, docs/design-system.md */
    --state-good-text: #3D5A1E;
    --state-good-bg: var(--accent-lime);
    --state-bad-text: #8A1D5B;
    /* Пометка о незрелых данных: предупреждение, а не ошибка */
    --state-warn-bg: var(--pastel-yellow);
    --state-warn-text: #6B5A00;
    --state-bad-bg: var(--pastel-pink-2);

    /* полоска спроса по кластерам на экране «Логистика»: каждому
       кластеру свой цвет, соседние обязаны различаться (владелец,
       25.08.2026 — салатовые Москва и Питер сливались в одно пятно).
       Не оттенки одного цвета, а разные цвета палитры. */
    --logistics-c1: var(--accent-violet);
    --logistics-c2: var(--accent-lime);
    --logistics-c3: var(--accent-magenta);
    --logistics-c4: var(--pastel-blue);
    --logistics-c5: var(--color-average);
    --logistics-c6: var(--pastel-pink);
    --logistics-other: var(--border-strong);

    /* линии */
    --line: #E8E9E4;
    --border: #EFEFEA;
    --border-strong: #E4E4DE;

    /* радиусы */
    --r-window: 40px;
    --r-card: 24px;
    --r-sm: 20px;
    --r-pill: 999px;

    /* отступы, заданные владельцем */
    --pad-card: 28px;
    --gap: 24px;
    /* вспомогательный мелкий шаг — не задан владельцем явно, подобран
       под общий воздух системы для мест, которые --gap/--pad-card
       не описывают (поля формы, зазоры внутри кнопки) */
    --space-2xs: 4px;
    --space-xs: 8px;
    --space-sm: 12px;
    --space-md: var(--gap);
    --space-lg: 32px;

    /* тени */
    --shadow-card: 0 1px 2px rgba(26,29,31,.04);
    --shadow-window: 0 40px 80px rgba(90,70,140,.18);
    --shadow-pop: 0 8px 24px rgba(26,29,31,.10);

    /* шрифт */
    --font: Inter, "SF Pro Display", system-ui, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, monospace;
    --font-size-base: 15px;
    --font-size-small: 13px;
    --font-size-title: 32px;
    --font-size-card-title: 24px;
    --font-size-metric: 26px;
    --font-size-table-head: 12px;

    --border-width: 1px;
    --color-average: #B45309; /* порог «средне» для ДРР — среднее между позитивом и негативом,
                                  вне палитры владельца, значение не менялось */

    /* Закупки: строка горит, когда товар кончится раньше поставки.
       Заливка бледная намеренно — читается число, а не цвет. */
    --zakupki-gorit: #FEF2F2;
    --zakupki-vpritok: #FFFBEB;

    /* Сводка разделами: расхождения — оранжевым, чтобы не терялись
       среди главного; решённые дела плана — приглушённым серым
       (обратная связь 21.09.2026, п. 1 и п. 6). */
    --svodka-rashozhdeniya-bg: #FFF1E3;
    --svodka-rashozhdeniya-line: var(--color-average);
    --svodka-gotovo-text: var(--text-muted);

    /* СПП: тепловая карта — пять уровней фиолетового по величине
       процента, от бледного (провал) к насыщенному (обычный день).
       Один цвет палитры, чтобы читалась величина, а не категория.
       Ширины колонок — чтобы сразу было видно 14 дней (владелец,
       30.09.2026), остальное — прокруткой. */
    --spp-u1: #F1EDFF;
    --spp-u2: var(--pastel-lilac-2);
    --spp-u3: #B9A8F1;
    --spp-u4: #9A82EA;
    --spp-u5: var(--accent-violet);
    --spp-tekst-temnyj: var(--text-primary);
    --spp-tekst-svetlyj: var(--text-on-inverse);
    --spp-pusto: var(--bg-canvas);
    --spp-imya: 260px;
    --spp-imya-tekst: 200px;  /* имя модели после галочки и стрелки */
    --spp-kletka: 48px;
    --spp-sr: 88px;
    --spp-vysota: 28px;
    --spp-shag: 3px;  /* зазор между клетками карты */
    /* Размеры отличаются от моделей с одного взгляда (владелец, 30.09.2026):
       строка ниже и на бледном фоне; раскрытая группа — полоса слева. */
    --spp-vysota-razmer: 22px;
    --spp-razmer-fon: var(--bg-canvas);
    --spp-polosa: 3px;
    --spp-liniya: var(--border-strong);
    --spp-otstup-razmera: 40px;
    --spp-polosa-cvet: var(--accent-violet);
    --spp-skryta-tekst: var(--text-muted);
    --spp-skryta-prozrachnost: .45;
    --spp-dney-vidno: 14;
    --r-kletka: 6px;  /* клетка карты: радиусы системы (от 20px) для неё велики */

    /* А/Б тесты фото (владелец, 30.09.2026): цвета вариантов на графике —
       разные цвета палитры, соседние обязаны различаться. */
    --ab-v1: var(--accent-violet);
    --ab-v2: var(--accent-magenta);
    --ab-v3: var(--pastel-blue);
    --ab-v4: var(--accent-lime);
    --ab-v5: var(--pastel-pink-2);
    --ab-v6: var(--color-average);
    --ab-v-drugoy: var(--border-strong);
    --ab-luchshiy-fon: var(--accent-lime);
    --ab-mini: 28px;
    --ab-variant: 56px;
    --ab-foto: 140px;
    --ab-grafik: 160px;
    --ab-stolbec: 14px;
    --ab-knopka: 28px;
    --ab-kartochka: 180px;
    --ab-podcherk: 2px;
    --ab-grafik-shirina: 900px;
    --ab-spravka: 640px;
    --ab-zatemnenie: rgba(26, 29, 31, .35);
    /* Хронология теста: точки на линии (06.10.2026) */
    --ab-hron-tochka: 14px;
    --ab-hron-tochka-seychas: 20px;
    --ab-hron-liniya: 2px;
    --ab-hron-romb: 2px;  /* значок проблемы — ромб: радиус системы (20px) сделал бы круг */
    --ab-hron-vremya: 9.5em;
}