/* kb-v4.css — что добавляется к слою статьи на внутренних страницах.
 *
 * Слой статьи — `kb.css`, перенятый у соседнего проекта bridge-waf.com
 * (страница /operations/ названа владельцем эталонной). Он подключается
 * поверх общих `tokens.css` и `base.css`, то есть внутренние страницы и
 * главная стоят на одном основании.
 *
 * Здесь только то, чего в эталоне нет и что требует наш проект:
 *   1. отсутствие моноширинного (решение владельца 2026-08-25);
 *   2. плитка иконки — идентика bridge-cdn.com;
 *   3. подпись карточки раздела без заголовочного тега;
 *   4. полоса прогресса чтения;
 *   5. движение: появление при прокрутке и оживление при наведении.
 *
 * Прежняя версия этого файла чинила слой кита (site.css, kb-article.css) и
 * гасила его чрому. Слой кита со страниц снят целиком, поэтому те правила
 * удалены, а не оставлены про запас.
 */

/* ── 1. Моноширинного на сайте нет ──────────────────────────────────────
   Слой эталона набирает инлайновый `code` основной гарнитурой сам. Но
   браузерная таблица стилей ставит monospace на эти элементы без единого
   объявления, и её надо отменить явно; токен приравнен к основной
   гарнитуре, потому что на него ссылаются блоки кода. */
:root {
  --font-mono: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;  /* unslop-ignore: Inter — гарнитура bridge-cdn.com, решение владельца */
}
code, kbd, samp, pre, tt { font-family: var(--font-sans); }

/* Различители 0/O и 1/l/I — свойство, ради которого сеть раньше держала
   IBM Plex. У Inter это начертания cv08 и zero. */
code, kbd, samp, pre, .kb-table td, .kb-table th {
  font-variant-numeric: tabular-nums slashed-zero;
  font-feature-settings: "cv08" 1, "zero" 1;
}

/* ── 2. Плиток иконок на внутренних страницах нет ──────────────────────
   Набор иконок bridge-cdn.com просили на главную; внутреннюю страницу
   ведут заголовок и хлебные крошки. Решение владельца 2026-08-26.
   Компонент `.tile` остаётся объявленным в ssl.css для главной. */

/* ── 3. Витрина с одной карточкой ──────────────────────────────────────
   Слой эталона задаёт витрине жёсткие две колонки: у него в каждом блоке
   четыре и больше карточек. У нас пятнадцать блоков из двадцати содержат
   ровно одну — вторая ячейка оставалась пустой коробкой, потому что фон
   витрины рисует разделители.

   `auto-fit` схлопывает пустую дорожку сам: одна карточка занимает всю
   ширину, две становятся в ряд. Без `:has()` и без завязки на количество,
   поэтому новая карточка ничего не сломает. */
.kb-related-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}

/* Прев/след с одной ссылкой — тот же дефект, что был у витрины. У эталона
   на каждой странице есть и предыдущая, и следующая; у нас восемь статей
   из девяти имеют только одну соседнюю, и вторая ячейка оставалась пустой
   коробкой. Лечится так же и по той же причине. */
.kb-nav {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
}

/* Слой равняет ПОСЛЕДНЮЮ ссылку по правому краю — она у эталона всегда
   «Next». Когда ссылка одна, она же и последняя, и «Previous» уезжал
   вправо. Равняем по правому краю только вторую из двух. */
.kb-nav a:only-child { text-align: left; }

/* ── 4. Подпись карточки раздела ────────────────────────────────────────
   У эталона это <h3>, но его витрина стоит после заголовков второго
   уровня. У нас «в этом разделе» идёт до первого h2, и заголовок дал бы
   скачок h1 → h3 — приёмка это ловит. Тег остаётся абзацем, вид взят из
   правила эталона один в один. */
.kb-related-grid .kb-card-title {
  font-family: var(--font-sans);
  font-size: 16px; line-height: 1.4;
  letter-spacing: var(--ls-card, -0.01em);
  font-weight: 400; color: var(--text); margin: 0;
}
.kb-related-grid .kb-card-title::after {
  content: "\00a0\2192";
  color: var(--dim); display: inline-block;
  transition: transform var(--t-ui, 180ms), color var(--t-ui, 180ms);
}
.kb-related-grid a:hover .kb-card-title::after {
  transform: translateX(4px); color: var(--accent-hover);
}

/* ── 5. Полоса прогресса чтения ─────────────────────────────────────────
   Единственное, что взято от прежнего слоя: она показывает, сколько
   осталось до конца длинной статьи. Ведёт её прокрутка, не скрипт.
   Слои атмосферы прежнего слоя НЕ возвращены: эталон их не использует, а
   у нас дрейф той картинки выталкивал страницу вбок на 95px. */
.kb-progress {
  position: fixed; inset: 0 auto auto 0;
  z-index: 60; height: 2px; width: 100%;
  transform-origin: 0 50%;
  background: var(--accent);
  transform: scaleX(0);
}
@supports (animation-timeline: scroll()) {
  .kb-progress {
    animation: kb-read linear both;
    animation-timeline: scroll(root block);
  }
}
@keyframes kb-read { to { transform: scaleX(1); } }

/* ── 6. Движение ────────────────────────────────────────────────────────
   То же, что на главной, и теми же средствами: ключевые кадры `rise` из
   base.css, таймлайн от прокрутки, ни строки JavaScript.
   Три предохранителя: @supports, prefers-reduced-motion и @media print —
   иначе всё, до чего читатель не долистал, ушло бы в PDF прозрачным. */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .kb-prose > h2, .kb-prose > h3, .kb-prose > p, .kb-prose > ul,
    .kb-table-wrap, .kb-related, .kb-platform, .faq {
      animation: rise linear both;
      animation-timeline: view();
      animation-range: entry 0% entry 34%;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  .kb-progress { animation: none; transform: scaleX(1); opacity: 0.35; }
}
@media print {
  .kb-prose > h2, .kb-prose > h3, .kb-prose > p, .kb-prose > ul,
  .kb-table-wrap, .kb-related, .kb-platform, .faq {
    animation: none !important; opacity: 1 !important; transform: none !important;
  }
  .kb-progress { display: none; }
}

/* Оживление при наведении: каждое показывает то, чего в покое не видно. */
.kb-table tbody tr { transition: background 160ms ease; }
.kb-table tbody tr:hover { background: var(--accent-soft); }


/* ── Что осталось от разметки кита ──────────────────────────────────────
   Сплошная проверка всех восемнадцати страниц нашла классы, которые есть
   в разметке, но не имеют правил ни в одном слое. Часть переведена на
   компоненты эталона (см. scripts/kb_upgrade.py); здесь — то, чему в
   эталоне соответствия нет и что проще одеть, чем переписывать. */

/* Список ключевых точек: у эталона это абзац с полужирным зачином, у нас
   список с отдельной подписью. Структура полезнее, оставляем её. */
.kb-points { list-style: none; margin: var(--space-6) 0 0; padding: 0; }
.kb-point-title {
  font-weight: 550;
  color: var(--text);
  margin: 0 0 var(--space-2);
}
.kb-points .kb-point + .kb-point { margin-top: var(--space-5); }

/* Мета страницы: значения в строке, разделённые пробелом. */
.kb-fact { white-space: nowrap; }
.kb-fact + .kb-fact { margin-left: var(--space-4); }