/* Наряд №139, работа 0 — единый визуальный фундамент (канон наряда №136,
   раздел 3.1/3.7).

   ЧТО ЭТО НЕ ЕСТЬ. Это не редизайн и не новая палитра. Диагностика №136
   насчитала в трёх CSS-файлах ~60 уникальных hex, часть из которых —
   почти-дубли (#2a2a2a/#2e2e2e/#232323/#242424; #9e9e9e/#9a9a9a/#a8a8a8),
   девять кеглей и шесть радиусов. Каждая правка цвета статуса была правкой
   в трёх файлах руками. Этот файл НАЗЫВАЕТ то, что уже сложилось, и убирает
   разнобой — значения взяты из существующих файлов, а не придуманы.

   ГДЕ РАЗНОБОЙ БЫЛ ОШИБКОЙ — и только там — значения сведены:
     · #9a9a9a и #a8a8a8 поглощены --text-dim (#9e9e9e). Три оттенка серого
       на расстоянии в один шаг не различает никто, а различать их обязан был
       каждый, кто правил цвет подписи.
   Остальные значения перенесены один в один.

   ПОДКЛЮЧАЕТСЯ ПЕРВЫМ, до style.css — во ВСЕХ трёх точках входа
   (index.html, trainer.html, admin.html). Причина механическая, а не
   эстетическая: style.css — общее основание всех трёх экранов (admin.html
   подключает style.css + trainer.css + admin.css каскадом), и как только он
   начинает читать var(--…), переменные обязаны существовать на каждой
   странице, которая его грузит. Экраны тренера и админа этим нарядом не
   переделываются — им добавлена ровно одна строка <link>, чтобы общее
   основание не сломалось. Пакеты Б и В канона №136 переиспользуют этот же
   файл, заводить второй не нужно.

   ТЁМНАЯ ТЕМА — ЕДИНСТВЕННАЯ, и это по-прежнему открытый вопрос Р-9 канона
   №136 (очный класс с проектором — тот случай, где светлая выигрывает).
   Здесь она не решается; файл только делает будущее решение дешёвым: светлая
   тема после этого — второй :root-блок, а не переписывание трёх файлов. */

:root {
  /* -- Поверхности: четыре ступени вместо прежних семи ------------------- */
  --bg:            #1e1e1e;   /* фон страницы */
  --surface:       #232323;   /* карточка, плашка */
  --surface-2:     #2a2a2a;   /* поле ввода, реплика штурмана */
  --surface-sunk:  #1a1a1a;   /* панель вывода — «утоплена» под редактор */
  --border:        #3a3a3a;
  --border-strong: #4a4a4a;

  /* -- Текст: три ступени вместо шести ------------------------------------ */
  --text:      #e0e0e0;
  --text-soft: #c8c8c8;   /* определение термина, заголовок корня архива */
  --text-dim:  #9e9e9e;   /* поглощает прежние #9a9a9a, #a8a8a8 и #8a8a8a */
  --text-mute: #7a7a7a;

  /* -- Акцент ------------------------------------------------------------- */
  --accent:      #0e639c;
  --accent-text: #ffffff;

  /* -- Статусы внимания: ровно четыре бакета backend/attention.py --------- */
  /* Экрана ученика не касаются вовсе — живут здесь, потому что бакет обязан
     выглядеть одинаково в счётчике, в строке доски и в карточке (канон №136,
     раздел 3.3), а значит имя у него должно быть одно на все три файла.
     Наряд №148, работа 1 — значения сведены с тем, что реально показывал
     экран после наряда №147 (палитра логобука, без тёплых и красных: канон
     наряда №146 «Табло хода занятия»). Прежние #e05a4a/#e0a952/#5fb85f были
     устаревшей правдой — источник и экран разошлись, экран не менялся.
     -line у трёх активных бакетов равен -fill: trainer.css нигде не читает
     их разными значениями (в отличие от «вне занятия», где дежурная точка
     светлее рамки строки) — вводить несуществующий сегодня разнобой незачем. */
  --st-needed: #8880bc;  --st-needed-line: #8880bc;   /* нужен сейчас */
  --st-check:  #82b5e0;  --st-check-line:  #82b5e0;   /* проверить    */
  --st-work:   #2fb295;  --st-work-line:   #2fb295;   /* работают     */
  --st-quiet:  #9e9e9e;  --st-quiet-line:  #3a3a3a;   /* вне занятия  */

  /* -- Исход попытки ребёнка ---------------------------------------------- */
  --ok:   #4caf50;  --ok-bg:   #1f4d2e;
  --fail: #e05252;  --fail-bg: #4d1f1f;
  --warn: #e0a352;

  /* -- Продвигающее действие ---------------------------------------------- */
  /* «Дальше →», «Следующая задача →» — зелёная заливка, заведена нарядом №113
     и живёт в продукте с наряда №23. Не тот же зелёный, что --ok: исход
     попытки и приглашение идти дальше — разные вещи, и совпадение цвета у них
     было бы случайным, а не смысловым. */
  --go: #2e7d32;

  /* -- Внимание, но не тревога -------------------------------------------- */
  /* Оранжевый в этом интерфейсе занят ровно двумя смыслами и третьего не
     получает (наряд №30, шаг 4): непрочитанная карточка и предупреждение
     «это форма записи, запускать нельзя». */
  --attn:      #ffb020;
  --attn-bg:   #4a3a1a;
  --attn-text: #e0c07a;
  --attn-line: #6a5a2a;
  --question:  #d4a017;   /* рамка и метка обязательного вопроса узла */

  /* -- Шкала отступов: та, что уже сложилась ------------------------------ */
  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s6: 24px; --s8: 32px;

  /* -- Радиусы: три вместо шести ------------------------------------------ */
  --r-sm: 4px; --r-md: 6px; --r-pill: 999px;

  /* -- Кегли детского экрана (канон №136, раздел 3.2) ---------------------
     Ребёнок читает связный текст, часто с расстояния и на чужой машине;
     тренер сканирует список за секунды. Одна шкала на обоих ломает либо
     первое, либо второе — поэтому шкалы две, и взрослая живёт в
     trainer.css/admin.css своими значениями. */
  --fs-h:     20px;   /* заголовок экрана */
  --fs-body:  16px;   /* лента, условие — основной связный текст */
  --fs-sec:   14px;   /* вторичный: метрики, подписи полей, кнопки */
  --fs-label: 13px;   /* мелкая метка: бейдж, контекст */
  --fs-mono:  14px;   /* моноширинный: вывод программы, код */
  --lh-body:  1.55;

  /* Высота кнопки на детском экране. 44 px — промах мыши у ребёнка и
     тачскрин; на взрослых экранах остаётся 32 px (канон №136, раздел 3.4). */
  --h-btn: 44px;

  /* Обводка фокуса — одна на всё. Двойная тень: внутренняя того же цвета, что
     фон, отделяет кольцо от самого элемента на тёмной подложке. */
  --focus: 0 0 0 2px var(--bg), 0 0 0 4px var(--accent);

  /* -- Экранные шрифты (наряд №148, решение brand-system.md 07.09.2026) ---
     Montserrat — заголовки и CAPS, Open Sans — связный текст; оба SIL OFL,
     самохостом (frontend/fonts/, @font-face ниже). Системный стек — не
     фолбэк на случай отказа сети (шрифт грузится с того же хоста, что
     страница), а честный запасной путь на время font-display: swap. */
  --font-heading: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body:    "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* Самохост: подмножество latin + cyrillic, ~65 КБ на четыре насечки
   (ориентир наряда — 60–80 КБ). Файлы получены инстанцированием
   variable-исходников google/fonts (ofl/montserrat, ofl/opensans, SIL OFL —
   лицензии рядом, frontend/fonts/OFL-*.txt) и обрезкой pyftsubset до
   latin+cyrillic; ссылки на fonts.googleapis.com в разметке нет ни одной —
   наряд её запрещает прямо (внешний хост не должен знать IP ребёнка). */
@font-face {
  font-family: "Montserrat";
  src: url("/fonts/montserrat-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("/fonts/montserrat-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  src: url("/fonts/open-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  src: url("/fonts/open-sans-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Наряд №139, работа 0 (канон №136, раздел 3.7). До этой правки во всей
   кодовой базе стоял ОДИН :focus-visible (style.css, подсказка прокрутки):
   остальные элементы получали дефолтную обводку браузера поверх тёмного фона
   либо теряли её вовсе. Правило одно и на все три экрана — оно живёт здесь, а
   не в style.css, чтобы кабинет тренера и админка получили его тем же
   подключением, без правки своих файлов.

   :where() — нулевая специфичность: любое собственное правило элемента
   перебивает это, и ни одна существующая кнопка не меняет вид из-за него. */
:where(a, button, input, textarea, select, summary, [tabindex]):focus-visible {
  outline: none;
  box-shadow: var(--focus);
}

/* Наряд №152, работа 1 (найдено Романом на живом экране, ни разу не
   поймано прибором). Замер редакции 8 наряда: :active — 0 вхождений во
   всей кодовой базе (trainer.css, style.css). Тот же приём и то же место,
   что у :focus-visible выше (наряд №139) — одно правило на все три экрана,
   нулевая специфичность. Список элементов у́же, чем у :focus-visible
   нарочно: текстовые поля и select не сжимаются при клике (выглядело бы
   поломкой ввода), только то, что человек буквально НАЖИМАЕТ — кнопка,
   переключатель, ссылка, раскрывашка.

   Чистая геометрия, без цвета: наряд №152 явно запрещает вводить новые
   цвета («Что этот наряд НЕ делает»), а сжатие само по себе достаточно
   заметно как отклик на нажатие. */
:where(a, button, summary, input[type="checkbox"], input[type="radio"]):active {
  transform: scale(0.96);
}