/* === tokens.css — глобальные токены: reset, CSS-переменные (светлая + тёмная тема) === */

/* =========================================================
   Современный русский язык: Креативная лаборатория филолога
   ========================================================= */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

/* ═══════════════════════════════════════════════════════
   Дизайн-система «Академ-культурный» — тёплая литературная,
   обе темы. Шрифты: Literata (чтение) + Golos Text (UI).
   ═══════════════════════════════════════════════════════ */
:root {
  /* Шрифты */
  --font-serif: 'Literata', Georgia, 'Times New Roman', serif;
  --font-sans:  'Golos Text', system-ui, -apple-system, 'Segoe UI', sans-serif;
  /* Дисплейный уровень editorial-страниц: только крупные заголовки, инициалы и числа.
     Literata остаётся текстовой — контраст «высококонтрастная антиква крупно ↔
     спокойная книжная мелко» и есть основной журнальный приём. */
  --font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;

  /* ── Светлая тема (по умолчанию) ── */
  --paper:      #F5F3EF;   /* фон — тёплый off-white, низкая насыщенность (не «крем») */
  --surface:    #FFFFFF;   /* карточки/поверхности */
  --surface-2:  #FBFAF7;   /* приподнятая поверхность */
  --border:     #E6E0D6;   /* тёплая граница */
  --ink:        #26201A;   /* текст — тёплый эспрессо */
  --ink-soft:   #6E6153;   /* приглушённый (контраст ≥4.5:1 на paper) */

  --accent:     #B23A16;   /* терракота — основное действие/вовлечение */
  --accent-ink: #FFFFFF;   /* текст на терракоте */
  --accent-soft:#F7E7DF;   /* терракота-тинт (фоны/hover) */
  --gold:       #A9741A;   /* янтарь/позолота — акцент/прогресс/цитаты */
  --gold-soft:  #F6ECD7;   /* янтарь-тинт */

  --good:       #14795E;   /* верно (тесты) — тёплый изумруд */
  --good-soft:  #E4F3ED;
  --bad:        #C0392B;   /* неверно — тёплый красный */
  --bad-soft:   #FaEAE7;

  --header-bg:  #241D16;   /* шапка/навигация — тёмный эспрессо */
  --header-ink: #F3ECE0;

  --radius:     14px;
  --radius-sm:  9px;
  --shadow:     0 1px 2px rgba(58,42,26,.06), 0 6px 20px rgba(58,42,26,.07);
  --shadow-md:  0 4px 12px rgba(58,42,26,.10), 0 18px 44px rgba(58,42,26,.12);

  /* Единый тёплый scrim для баннеров разделов (см. slides.css .ch-banner) —
     один тон вместо 16 разных оттенков на каждый раздел */
  --banner-scrim: linear-gradient(135deg, rgba(36,28,20,.87), rgba(80,48,26,.82));

  /* Бумажная текстура — общий фон body для всех слайдов, кроме обложки
     (у неё свой видео/фото-фон, см. .slide--cover в cover.css) */
  --content-bg-texture: url('../../images/paper-texture.jpg');

  /* ═══════════════════════════════════════════════════════
     Glassmorphism / Apple UI — единственный источник правды.
     Из этих токенов берут ВСЕ стеклянные поверхности: обвязка
     (header.css), контент слайдов (slides.css, widgets.css) и
     «Содержание» (toc.css). Подгонка под новые референсы
     заказчицы = правка только этого блока.
     ═══════════════════════════════════════════════════════ */
  --glass-bg:        rgba(255,255,255,.55);  /* карточки и виджеты внутри слайдов */
  --glass-bg-strong: rgba(255,255,255,.80);  /* плавающие панели: читаемость важнее прозрачности.
                                                .80 вместо .72 — на .72 нижняя панель сливалась с фоном */
  --glass-bg-soft:   rgba(255,255,255,.38);  /* вложенные поверхности (внутри стеклянной карточки) */
  --glass-blur:      16px;
  --glass-sat:       180%;
  --glass-border:    rgba(255,255,255,.5);
  --glass-border-2:  rgba(120,110,150,.16);  /* тонкая холодная обводка на светлом фоне */
  --glass-gloss:     inset 0 1px 0 rgba(255,255,255,.6);  /* верхний блик — отличает стекло от плашки */
  /* Основная тень пособия: до этого литерал `0 10px 30px rgba(0,0,0,.04) + inset 1px`
     был продублирован в 17 местах и не имел имени. */
  --glass-shadow-card: 0 10px 30px rgba(0,0,0,.04), inset 0 0 0 1px var(--glass-border-2);
  --glass-shadow:    0 8px 32px rgba(31,38,60,.12);
  --glass-shadow-lg: 0 16px 48px rgba(31,38,60,.18);
  --glass-radius:    20px;
  --glass-radius-sm: 14px;
  --ease-glass:      cubic-bezier(.4,0,.2,1);

  /* Место, которое занимают плавающие панели. Слайды отступают на эти
     значения, чтобы контент не начинался под стеклом (см. base.css). */
  --chrome-top:      76px;
  --chrome-bottom:   84px;

  /* Единый фон приложения. Раньше жил только в toc.css — вынесен сюда,
     чтобы стекло везде размывало одно и то же. Зерно не даёт градиентам
     бандиться; его прозрачность запечена в SVG (opacity='.11'). */
  --app-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.11'/%3E%3C/svg%3E");
  --app-mesh:
    radial-gradient(52% 46% at 6% 2%,   #ffe9cf 0%, rgba(255,233,207,0) 62%),
    radial-gradient(44% 40% at 34% 6%,  #dfe4ff 0%, rgba(223,228,255,0) 66%),
    radial-gradient(46% 44% at 74% 14%, #efe0ff 0%, rgba(239,224,255,0) 68%),
    radial-gradient(52% 50% at 4% 74%,  #ffd9ea 0%, rgba(255,217,234,0) 66%),
    radial-gradient(46% 46% at 92% 62%, #e6ecff 0%, rgba(230,236,255,0) 68%),
    radial-gradient(60% 60% at 60% 100%,#f6e6ff 0%, rgba(246,230,255,0) 70%),
    linear-gradient(160deg,#fbf6ff 0%,#f4f1fd 48%,#fdf3f8 100%);
  --app-bg: #f2eef8;

  /* ── Легаси-алиасы (старые компоненты каскадом получают новую палитру) ── */
  --bg:         var(--paper);
  --text:       var(--ink);
  --muted:      var(--ink-soft);
  --navy:       var(--header-bg);
  --indigo:     var(--accent);
  --indigo-lt:  var(--accent-soft);
  --gold-lt:    var(--gold-soft);
  --green:      var(--good);
  --red:        var(--bad);
}