/* Токены оформления — единственное место, где живут цвета, шрифты и размеры.

   ⚠ ВРЕМЕННЫЕ. Сняты на глаз со снимка нынешнего сайта 15-08-2026 и владельцу
   не нравятся: «стили будут другие». Заменяются правкой ТОЛЬКО этого файла —
   в разметке и в остальных стилях ни одного цвета быть не должно.

   Проверка при сдаче черновика: смена палитры = правка одного файла. */

:root {
  /* ── цвет ─────────────────────────────────────────────────────────────── */
  --фирменный:        #2e4c9e;   /* синий с нынешнего сайта */
  --фирменный-тёмный: #22397a;
  --фирменный-светлый:#eaeefa;
  --акцент:           #e8161f;   /* красный, кнопки действия */
  --акцент-тёмный:    #bf1119;

  --текст:            #16181d;
  --текст-приглушён:  #5b6270;
  --текст-на-тёмном:  #ffffff;

  --фон:              #ffffff;
  --фон-мягкий:       #f5f6f9;
  --фон-тёмный:       var(--фирменный);
  --граница:          #dfe2ea;

  /* Палитра диаграмм витрины ЕГРЗ. Живёт здесь, а не в скрипте: иначе палитра
     сайта и палитра диаграмм разойдутся на первой же правке одной из них. */
  --диаг-1: #2e4c9e;
  --диаг-2: #1baf7a;
  --диаг-3: #e8161f;
  --диаг-4: #b8730f;
  --диаг-5: #7c5cbf;
  --диаг-6: #0f8fa8;

  --успех:            #1a7f4b;
  --внимание:         #b8730f;
  --ошибка:           var(--акцент);

  /* ── шрифт ────────────────────────────────────────────────────────────── */
  --шрифт: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --шрифт-моно: ui-monospace, "Cascadia Mono", Consolas, monospace;

  --кегль-мелкий:  0.875rem;
  --кегль-обычный: 1rem;
  --кегль-крупный: 1.125rem;
  --кегль-h3:      1.375rem;
  --кегль-h2:      1.75rem;
  --кегль-h1:      2.5rem;

  /* ── размеры ──────────────────────────────────────────────────────────── */
  --ширина:     1180px;
  --ширина-текста: 44rem;

  --отступ-0-5: 0.5rem;
  --отступ-1:   1rem;
  --отступ-2:   2rem;
  --отступ-3:   3rem;
  --отступ-4:   4.5rem;

  --скругление:      10px;
  --скругление-мал:  6px;
  --тень:      0 1px 2px rgba(20, 25, 40, .06), 0 4px 16px rgba(20, 25, 40, .06);
  --тень-выше: 0 2px 6px rgba(20, 25, 40, .09), 0 12px 32px rgba(20, 25, 40, .10);

  /* ── стороны матрицы кабинета ─────────────────────────────────────────────
     Три стороны, у каждой свой цвет: работа экспертизы, работа заявителя, итог.
     ⚑ Вынесены сюда 17-08-2026 при заведении тёмной темы. До этого лежали
     числами прямо в `site.css` — 23 цвета мимо правила «ни одного цвета вне
     токенов». В светлой теме это не мешало, и потому не замечалось; тёмная
     обнажила сразу: перекрашивался фон, а плашки оставались светлыми. */
  --сторона-экс:         #eef2fb;
  --сторона-экс-шапка:   #dee6f7;
  --сторона-вы:          #fdf6e6;
  --сторона-вы-шапка:    #f8ecd0;
  --сторона-вы-текст:    #7a5a10;
  --сторона-вы-граница:  #c99a1a;
  --сторона-итог:        #edf7f0;
  --сторона-итог-шапка:  #dcefe2;
  --сторона-итог-липкий: #d7edde;
  --успех-тёмный:        #14653c;

  --фон-тревога:        #fff6f6;   /* строка «висит» */
  --фон-тревога-мягкий: #fdecec;   /* метка срока */
  --фон-внимание:       #fffaf0;   /* оговорка */
  --фон-метки:          #f3f4f7;
  --точки:              #a8b0c2;   /* сетка «даты нет» */
  --на-акценте:         #ffffff;   /* текст на красной кнопке */
  --фон-кнопки-светлой: #ffffff;

  /* Белая подложка под знак заказчика в ночном режиме. Одна и та же в обеих
     темах: знак нарисован для светлого фона, и это его свойство, а не темы. */
  --подложка-знака:     #ffffff;

  /* ⚑ Полоса первого экрана и текст на фирменной заливке заданы ЧИСЛАМИ, а не
     через `--фирменный`. Причина в шраме ниже: ночью фирменный осветляется ради
     читаемости мелких элементов, и всё, что было выведено из него, светлеет
     заодно — включая то, что обязано остаться тёмным. */
  --полоса-от:          #2e4c9e;
  --полоса-до:          #22397a;
  --на-фирменном:       #ffffff;   /* текст поверх заливки фирменным */
  /* Черта внутри тёмной полосы. ⚑ Задаётся полупрозрачным белым, а не своим
     числом: полоса вверху страницы и внизу залита градиентом, и любая
     сплошная черта совпала бы с ним только в одной точке. Значение общее
     для обеих тем — полоса тёмная и днём, и ночью. */
  --черта-на-тёмном:    rgba(255, 255, 255, .22);
  --на-тёмном-приглушён: rgba(255, 255, 255, .78);
  /* Плашка поверх тёмной полосы: карточки второй карусели. Тем же
     полупрозрачным белым, что и черта, — иначе при смене палитры
     плашка осталась бы от прежней. */
  --плашка-на-тёмном:   rgba(255, 255, 255, .07);
  --плашка-на-тёмном-ярче: rgba(255, 255, 255, .14);

  /* ── календарь замечаний ──────────────────────────────────────────────────
     Выходные — розоватый из красного в знаке заказчика `[владелец 17-08-2026]`,
     замечания — фирменный синий. Оба взяты сильно разбавленными: клетка должна
     читаться как отметка, а не как заливка, иначе число в ней теряется. */
  --кал-выходной:       #fdeaec;
  --кал-замечания:      #dbe4fa;
  --кал-замечания-край: #2e4c9e;
  --кал-сегодня:        #b8730f;
}

/* ── тёмная тема ────────────────────────────────────────────────────────────
   `[просьба владельца 17-08-2026]` Переключение на ночной режим.

   ⚑ Умолчание — настройка системы; выбор человека сильнее её и запоминается.
   Оба случая сведены к ОДНОМУ признаку `data-тема` на `<html>`: его ставит
   `tema.js` — либо по сохранённому выбору, либо по системной настройке, и
   следит за её сменой на ходу.

   ⚑ Почему не вторым блоком `@media (prefers-color-scheme: dark)`: тогда весь
   набор значений пришлось бы держать дважды — для выбравших и для не
   выбиравших. Две копии тридцати цветов расходятся на первой же правке, и
   расхождение видно только тому, у кого система стоит в другом режиме.
   Цена решения: **без JavaScript сайт всегда светлый.** Приемлемо — ночной
   режим это удобство, а не содержание.

   ⛔ Правится ТОЛЬКО этот файл. Ни одного цвета в разметке и в `site.css`.

   ⚠ Значения подобраны к нынешней временной палитре. Владельцу она не нравится
   («стили будут другие»), и при её смене тёмные цвета подбираются заново —
   а вот механизм переключения останется. */
:root[data-тема="ночь"] {
  --фирменный:        #8aa8ff;   /* осветлён: исходный #2e4c9e на тёмном не читается */
  --фирменный-тёмный: #a8bfff;   /* на тёмном «темнее» значит светлее: это наведение */
  --фирменный-светлый:#1e2740;
  --акцент:           #ff5057;
  --акцент-тёмный:    #ff7c81;

  --текст:            #e8eaf0;
  --текст-приглушён:  #9aa3b5;

  --фон:              #12151c;
  --фон-мягкий:       #1a1f29;
  --граница:          #2b3242;

  /* ⚠ Задаётся отдельно, а не через `--фирменный`, как днём.
     Шрам `[17-08-2026]`: днём `--фон-тёмный: var(--фирменный)` — и это верно,
     фирменный синий тёмный. Ночью фирменный осветлён ради читаемости текста,
     и «тёмный фон» первого экрана стал светло-голубым: белые буквы по светлому.
     ⚑ Урок шире случая: токен, определённый ЧЕРЕЗ другой токен, меняет смысл
     вместе с ним. Имя обещало тёмное, значение пришло светлое — и проверить
     это можно было только глазами, потому что формально всё сходилось. */
  --фон-тёмный:       #1b2440;
  --полоса-от:        #1b2440;
  --полоса-до:        #131a2e;
  /* Кнопки с фирменной заливкой ночью светлые — текст на них тёмный. */
  --на-фирменном:     #12151c;

  --кал-выходной:     #3a1f24;
  --кал-замечания:    #22305a;
  --кал-замечания-край: #8aa8ff;
  --кал-сегодня:      #e0a94f;

  /* Те же шесть, но осветлённые: на тёмном фоне дневные глухие. */
  --диаг-1: #7b9bf0;
  --диаг-2: #4fbf85;
  --диаг-3: #ff6b73;
  --диаг-4: #e0a94f;
  --диаг-5: #b39af0;
  --диаг-6: #4fc3dc;

  --успех:            #4fbf85;
  --внимание:         #e0a94f;
  --ошибка:           var(--акцент);

  --сторона-экс:         #1a2136;
  --сторона-экс-шапка:   #223055;
  --сторона-вы:          #2a2314;
  --сторона-вы-шапка:    #3d3115;
  --сторона-вы-текст:    #e0bf6a;
  --сторона-вы-граница:  #b08a1f;
  --сторона-итог:        #142a1e;
  --сторона-итог-шапка:  #1c3b2a;
  --сторона-итог-липкий: #1c3b2a;
  --успех-тёмный:        #6fd3a0;

  --фон-тревога:        #2a1719;
  --фон-тревога-мягкий: #3a1c1f;
  --фон-внимание:       #2b2314;
  --фон-метки:          #1f242f;
  --точки:              #4a5568;
  --на-акценте:         #16181d;
  --фон-кнопки-светлой: #1a1f29;

  --тень:      0 1px 2px rgba(0, 0, 0, .4), 0 4px 16px rgba(0, 0, 0, .35);
  --тень-выше: 0 2px 6px rgba(0, 0, 0, .5), 0 12px 32px rgba(0, 0, 0, .45);
}