/* Polychrome — design tokens. ЕДИНЫЙ ИСТОЧНИК ПРАВДЫ по цвету, кеглю и ритму.
   Правится здесь и только здесь. md2doc читает этот файл при рендере; любое другое
   приложение студии подключает его 1:1 (скопировать или @import) и пишет свой CSS
   на var(). Самодостаточный CSS: ни сборки, ни зависимостей — светлая, тёмная и
   печатная схемы внутри. Базовая типографика поверх токенов — typography.css рядом.
   Как пользоваться и чего не делать — README.md. Живая спека — md2doc/info/styleguide.html. */

:root {
  /* Палитра спроектирована в OKLCH (перцептивно-равномерное пространство). Все серые —
     ЧИСТО нейтральные (R=G=B, без холодного отлива); цветных ровно три, и каждый со
     смыслом: --link синий, --cwarn розовый (предупреждения и удаления), --cadd зелёный
     (вставки в отслеживании правок). Своя палитра делается переопределением этих
     переменных, а не правкой компонентов.

     Контраст меряется против ХУДШЕЙ из трёх поверхностей, а не против листа. У нас их
     три (--card, --bg, --panel), и текст живёт на всех: --muted был #6c6c6c и давал на
     листе спокойные 5.25, а на плашке — 4.49, то есть мимо AA на волосок и незаметно.
     Правится матрицей: `python plugin/design/contrast.py`, с --suggest выдаёт поправку
     по светлоте в OKLCH. Одно число на одной поверхности доказывает только одно число
     на одной поверхности. */
  --ink: #1a1a1a; --muted: #6b6b6b; --accent: #3d3d3d; --link: #3a5a8c;
  /* Поверхности — 4 роли с честными именами: --card лист · --bg стол/фон страницы
     (ТОЛЬКО фон, ничего больше) · --panel мягкая плашка (кодоблоки, инлайн-код,
     оглавление, плитки) — чуть ТЕМНЕЕ листа, мягкий утоп · --line бордюр.
     Плюс три тона текста выше (ink/accent/muted). */
  --line: #eaeaea; --bg: #f4f4f4; --panel: #ededed;
  --card: #ffffff; --cwarn: #984152; --cadd: #2f7350; --lightbox-bg: rgba(8,8,8,.95);
  /* Замес выносок: заливка --co-tint от цвета типа, кант --co-edge. На графите
     цветной кант читается сильнее, поэтому в тёмной теме он тише (14% против 22%). */
  --co-tint: 7%; --co-edge: 22%;
  /* Семейства. Inter — желаемый первый выбор (для офлайна встраивается woff2),
     дальше надёжный системный фолбэк. Код-шрифт отдельной переменной, чтобы менялся
     так же просто. Заданы ОДИН раз: от темы не зависят, поэтому в тёмной/печатной
     схемах не повторяются — иначе переопределение --font пользователем проигрывало бы
     им по специфичности и молча откатывалось на Inter. */
  --font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --mono: "JetBrains Mono", ui-monospace, "SF Mono", SFMono-Regular, "Cascadia Mono", Consolas, Menlo, monospace;

  /* Типографическая шкала: единый источник размеров — берём токен, не хардкодим кегль.
     Не зависит от темы (одинакова в свете, тьме и печати), поэтому объявлена один раз. */
  --fs-micro: .62rem;   /* микро-меты в плотных блоках: план · таймкод · хрон · «голос/звук» */
  --fs-label: .73rem;   /* заглавные small-caps метки: th, шапки колонок, ярлыки навигатора */
  --fs-dense: .84rem;   /* плотный текст: тело таблиц, промпт, код, слейт-имя, попап */
  --fs-ui:    .92rem;   /* вторичный UI/мета: оглавление, байлайн, doc-meta, обложечная мета */
  --fs-body:  1rem;     /* базовый текст документа (= 16px при root 16px) */
  --fs-lead:  clamp(1.05rem, 2.6vw, 1.2rem);  /* подзаголовок / лид (subtitle, ctag) */
  --fs-h4: 1rem; --fs-h3: clamp(1.05rem, 2.6vw, 1.13rem);
  --fs-h2: clamp(1.3rem, 3.4vw, 1.5rem); --fs-h1: clamp(1.7rem, 5vw, 2.15rem);
  --fs-title: clamp(1.5rem, 5.8vw, 2.5rem);   /* заголовок шапки документа */
  --fs-cover: clamp(1.7rem, 8.6vw, 3.2rem);   /* заголовок обложки */

  /* Скругления: 3 ступени формы + пилюля + круг. Берём токен, радиус не хардкодим.
     Свели ~11 близких радиусов (4·6·7·8·10·11·12·13·14·22·50%): соседние (6–8, 10–14)
     перцептивно неотличимы. Рамка в рамке — концентрично: внешний = calc(--r-N + паддинг). */
  --r-1: 4px; --r-2: 8px; --r-3: 12px; --r-pill: 22px; --r-full: 50%;

  /* Отступы: 5 ступеней в em (8pt-сетка = 4·8·16·24·40px при 16px). Берём токен,
     padding/margin/gap не хардкодим. ~48 близких значений сведены в пять уровней ритма:
     тесно · мелко · база · блок · секция — минимум, при котором сетка ещё осмысленна.
     Значения в em: масштабируются с кеглем ТОГО места, где токен использован. */
  --sp-1: 0.25em; --sp-2: 0.5em; --sp-3: 1em; --sp-4: 1.5em; --sp-5: 2.5em;

  /* Длительности: 3 яруса. Берём токен, длительность анимаций не хардкодим. Разница
     между соседними (.22/.24/.26) в анимации не воспринимается, снап ≤50ms невидим.
     slow = кроссфейд темы (координирован по всем элементам). Задержки и штучные
     animation-длительности в шкалу не входят — остаются литералами. */
  --dur-fast: .15s; --dur-base: .25s; --dur-slow: .4s;

  /* Межстрочный: 4 яруса. 17 близких значений (1.06…1.66) сведены к четырём. Крупный
     дисплей плотнее, тело прозы просторнее — это типографика, а не избыточность;
     свели только near-дубли. Исключения-литералы: line-height:0 (сброс медиа-контейнеров)
     и 1.06 у обложечного заголовка (намеренно плотный крупный дисплей). */
  --lh-tight: 1.2; --lh-snug: 1.35; --lh-normal: 1.5; --lh-relaxed: 1.65;

  /* Трекинг: 5 оптических ярусов (15 значений сведены). Негатив жмёт крупный дисплей
     и заголовки — по кеглю, как и интерлиньяж; позитив разряжает капс-метки. */
  --ls-tight: -0.02em; --ls-snug: -0.01em; --ls-micro: 0.02em;
  --ls-caps: 0.09em; --ls-wide: 0.14em;

  /* Насыщенность: medium/semibold/strong/bold (400 — дефолт браузера, токеном не гоняем).
     Было шесть весов; 450/500/550 — «медиум»-разнобой — сведены в один. 650 оставлен
     отдельным уровнем «акцент»: заголовки h2, strong, бейджи. */
  --fw-medium: 500; --fw-semibold: 600; --fw-strong: 650; --fw-bold: 700;

  /* Высоты (тени): контрол, попап и модалка. Все нейтральные — rgba(0,0,0,…), без
     синевы. У листа и кластера свои выверенные тени: лист — это бумага, а не хром
     интерфейса. --shadow-ui жил в base.css и был объявлен ТОЛЬКО для тёмной темы —
     в светлой плавающие кнопки оставались вообще без края и пропадали над листом.
     Светлое значение вдвое слабее тёмного: на белом та же плотность выглядит грязью. */
  --shadow-ui: 0 1px 2px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.10);
  --shadow-pop: 0 9px 30px rgba(0,0,0,.18); --shadow-modal: 0 24px 70px rgba(0,0,0,.55);

  /* Слои: nav < панель < контролы < приподнятое < тост < модалка. Именованные, чтобы
     порядок наложения был назван, а не выдуман на месте. */
  --z-nav: 40; --z-panel: 45; --z-controls: 50; --z-raised: 60; --z-toast: 70; --z-modal: 200;

  /* Геометрия: мера контента, лист, поля печати. Берём токен, ширину не хардкодим.
     Ограничение: брейкпоинты @media (944/768/560px) остаются литералами — var()
     внутри @media не работает, поэтому при сильном изменении меры они слегка «поплывут». */
  --measure: 41rem;          /* колонка контента на экране, ~66–75 знаков */
  --measure-print: calc(var(--measure) * 36 / 41);  /* печатная мера (мельче кегль → уже; =36rem при дефолте) */
  --sheet-w: 944px;          /* лист на экране (800 внутренней ширины + 2×72 паддинга) */
  --content-pad: 15mm;       /* боковые поля печати — padding main.doc (@page по бокам = 0) */
  --nav-width: 225px;        /* кэп ширины навигатора заголовков (левое поле, ≥1600px). */
                             /* Потолок ~290px: шире — на 1600px наедет на лист (нужно и порог поднимать). */
}

/* Тёмная тема. Оттенки ТЕ ЖЕ, что в светлой (как в Solarized) — меняется только
   светлота под фон. Поверхности не чёрные, а мягкий графит; --panel приподнят НАД
   листом, чтобы кодоблок не был тёмным колодцем. Акцент поднят в светлоте, чтобы
   читался на тёмном. Переопределяются только цвета: размеры и ритм наследуются.

   Авто по системе — пока пользователь не выбрал тему вручную. Только screen: в печать
   тёмная не просачивается ни при каких условиях. */
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme]) {
  --ink: #dadada; --muted: #9d9d9d; --accent: #bcbcbc; --link: #8bafe4;
  --line: #3a3a3a; --bg: #1a1a1a; --panel: #1e1e1e;
  --card: #232323; --cwarn: #db8c99; --cadd: #7cc79b; --lightbox-bg: rgba(8,8,8,.8);
  --co-tint: 7%; --co-edge: 14%;
  --shadow-ui: 0 1px 3px rgba(0,0,0,.3), 0 5px 14px rgba(0,0,0,.24);
  }
}
/* Ручной выбор переключателем перекрывает систему */
:root[data-theme="dark"] {
  --ink: #dadada; --muted: #9d9d9d; --accent: #bcbcbc; --link: #8bafe4;
  --line: #3a3a3a; --bg: #1a1a1a; --panel: #1e1e1e;
  --card: #232323; --cwarn: #db8c99; --cadd: #7cc79b; --lightbox-bg: rgba(8,8,8,.8);
  --co-tint: 7%; --co-edge: 14%;
  --shadow-ui: 0 1px 3px rgba(0,0,0,.3), 0 5px 14px rgba(0,0,0,.24);
}
:root[data-theme="light"] {
  --ink: #1a1a1a; --muted: #6b6b6b; --accent: #3d3d3d; --link: #3a5a8c;
  --line: #eaeaea; --bg: #f4f4f4; --panel: #ededed;
  --card: #ffffff; --cwarn: #984152; --cadd: #2f7350; --lightbox-bg: rgba(8,8,8,.95);
  --co-tint: 7%; --co-edge: 22%;
}
/* Печать/PDF — всегда светлая «бумага», независимо от темы и системы */
@media print {
  :root, :root[data-theme="dark"] {
  --ink: #1a1a1a; --muted: #6b6b6b; --accent: #3d3d3d; --link: #3a5a8c;
  --line: #eaeaea; --bg: #f4f4f4; --panel: #ededed;
  --card: #ffffff; --cwarn: #984152; --cadd: #2f7350; --lightbox-bg: rgba(8,8,8,.95);
  --co-tint: 7%; --co-edge: 22%;
  }
}
