/* ============================================================================
   Новости — эталонный экран этапа 2 (ТЗ §4.3).
   Первая страница на tokens.css: все цвета/кегли/отступы — var(--…).
   Файл в реестре scripts/tokenized-css.txt — Stop hook гоняет stylelint.
   Обвязка сайта и примитивы словаря живут в css/components.css — здесь
   только контент Хроник. Дублировать общее обратно нельзя; подключать
   строго ПОСЛЕ components.css.
   ============================================================================ */




/* Гарнитуры имён, которых нет в словаре и которые принадлежат Хроникам. */
.news-page .news-mast__meta, .news-page .post-rubric,
.news-page .news-lead__art-caption, .news-page .ledger-row__mon {
  font-family: var(--font-label);
}
.news-page .ledger-row__dm, .news-page .ledger-row__no,
.news-page .ledger-row__year, .news-page .release-row__version,
.news-page .release-row__date, .news-page .news-lead__art-no {
  font-family: var(--font-mono);
}

/* ── Каркас страницы ── */
.news-page {
  width: min(1040px, 100%);
  margin-inline: auto;
  padding: var(--s-14) var(--s-4) var(--s-20);
}

/* ── Шапка-экслибрис: печать Гильдии + титул. И всё ──
   Страница — реестр Хроник, который ведёт Гильдия, а не «блог о проекте».
   Печать — золото основателя (--rank-founder), единственное декоративное
   пятно шапки; розовый акцент остаётся только интеракции.
   ⚠️ Третьей строки здесь не будет. Датлайн/счётчик записей под титулом —
   ровно тот шаблон, по которому ИИ-страница узнаётся с одного взгляда:
   дата первой записи уже стоит в ленте на два экрана ниже, а счётчик на
   молодом архиве рекламирует пустоту. Плюс гейт слоп-теста: на одной
   центральной оси допустимы максимум два элемента. */
/* Колонтитул издания (утверждён 2026-08-09): знак над титулом, всё по центру,
   тонкая линейка снизу. Колонки ленты ниже остаются левыми — так и устроен
   газетный разворот: церемониальный колонтитул, дисциплинированный реестр под
   ним. Смелость страницы потрачена здесь и больше нигде. */
.news-mast {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-items: center;
  text-align: center;
  gap: var(--s-3);
  padding-bottom: var(--s-6);
  border-bottom: 1px solid var(--line-subtle);
}
/* Линейка колонтитула уже разделила блоки — рубричной строке второй не нужно. */
.news-mast + .rubric-row { border-top: 0; }

.news-mast__seal {
  display: inline-flex;
  flex-shrink: 0;
  color: var(--rank-founder);
}
.news-mast__seal svg {
  width: var(--s-10);
  height: var(--s-10);
  display: block;
  fill: currentColor;
}


/* ── Рубричная строка: фильтры-рубрики между двойной и тонкой линейками ──
   Активная рубрика подчёркнута акцентом — тот же язык, что у нава сайта. */
/* Рубрики стоят на оси колонтитула, а не у левого края.
   Всё до первой записи — блок издания на центральной оси; реестр ниже живёт
   на левой. Один слом оси вместо двух: раньше центрированный колонтитул
   сменялся прижатыми влево рубриками, и справа зияло пустое поле в пол-строки.
   Три колонки, а не flex со space-between: кнопка staff не должна утаскивать
   рубрики с центра — при её появлении они не двигаются. */
.rubric-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: var(--s-2) var(--s-5);
  margin-top: var(--s-6);
  margin-bottom: var(--s-8);
  padding: var(--s-2) 0;
  border-top: 3px double var(--line-strong);
  border-bottom: 1px solid var(--line-subtle);
}

.rubric-row__filters {
  grid-column: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s-2) var(--s-6);
}

.rubric-row > :not(.rubric-row__filters) {
  grid-column: 3;
  justify-self: end;
}


/* ── Мета-строка (автор · дата) ── */
.post-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  font-size: var(--t--1);
  color: var(--ink-4);
}

/* ── Лид: разворот «текст | вклейка» ──
   Свежая запись без бокса и без текста-на-скриме: текст на бумаге страницы,
   арт — в раме-паспарту. Без арта в раме стоит оттиск печати Гильдии
   (экран обязан выглядеть законченным без арта, ТЗ 0.4). */
.news-lead {
  display: grid;
  grid-template-columns: minmax(0, 8fr) minmax(0, 4fr);
  gap: var(--s-8);
  align-items: start;   /* текст по верхней кромке вклейки, не по центру */
  margin-bottom: var(--s-14);
  cursor: pointer;
}

/* ── Водяной знак реестра ──
   Печать Гильдии за лентой: не рамка и не «плашка с картинкой», а оттиск на
   бумаге. Мотивирован содержанием (реестр ведёт Гильдия), поэтому это не
   декор ради декора; держим настолько бледным, чтобы текст поверх не терял
   контраст, и вырубаем из потока для скринридера. */
.ledger-wrap { position: relative; }
.ledger-wrap__seal {
  position: absolute;
  top: var(--s-10);
  right: 0;              /* за край не выносим: вылет давал h-scroll на 360 px */
  z-index: var(--z-base);
  display: block;
  width: min(clamp(220px, 34vw, 460px), 100%);
  color: var(--rank-founder);
  opacity: 0.035;
  pointer-events: none;
}
.ledger-wrap__seal svg { width: 100%; height: auto; display: block; fill: currentColor; }
.ledger-wrap > :not(.ledger-wrap__seal) {
  position: relative;
  z-index: var(--z-sticky);
}

/* Короткий лид (заголовок без выжимки) — текст встаёт по центру обложки:
   при выключке по верху под ним оставалась дыра в половину разворота. */
.news-lead--brief { align-items: center; }

.news-lead__body .chip { margin-bottom: var(--s-2); }

.news-lead__title {
  font-size: var(--t-4);
  line-height: var(--lh-tight);
  font-variation-settings: 'opsz' 48, 'SOFT' 0, 'WONK' 0;
}

/* Подпись не должна садиться на выносные элементы заголовка. Со стендфёрстом
   зазор даёт он (маржины схлопываются), без него — этот. */
.news-lead .post-meta { margin-top: var(--s-3); }

.news-lead__standfirst {
  font-size: var(--t-1);
  line-height: var(--lh-body);
  color: var(--ink-2);
  max-width: var(--measure);
  margin: var(--s-3) 0 var(--s-4);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.news-lead__art {
  border: 1px solid var(--line);
  background: var(--bg-panel);
  padding: var(--s-2);
}
.news-lead__art img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border: 1px solid var(--line-subtle);
}
/* Вклейка без арта — не «нет картинки», а оттиск печати на бумаге:
   тонированное поле с виньеткой, печать смещена от геометрического центра,
   под ней — подпись оттиска. Экран обязан быть законченным без арта (ТЗ 0.4). */
.news-lead__art-seal { display: block; }
.news-lead__art-no {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  color: var(--ink-3);
}
.news-lead__art--seal {
  position: relative;
  aspect-ratio: 16 / 10;   /* та же пропорция, что у арта: полоса не пляшет */
  display: grid;
  place-items: center;
  align-content: center;
  gap: var(--s-4);
  color: var(--rank-founder);
  background:
    radial-gradient(ellipse 70% 60% at 46% 42%, var(--bg-hover), transparent 70%),
    var(--bg-inset);
  box-shadow: var(--sh-inset);
}
/* Внутренний хайрлайн паспарту. */
.news-lead__art--seal::after {
  content: "";
  position: absolute;
  inset: var(--s-2);
  border: 1px solid var(--line-subtle);
  pointer-events: none;
}
.news-lead__art--seal svg {
  width: 96px;
  height: 96px;
  fill: currentColor;
  opacity: 0.55;
}
/* Подпись обложки — не украшение: номер записи в реестре плюс её род.
   Именно поэтому плашка законна там, где пустая рама была бы дефектом. */
.news-lead__art-caption {
  display: grid;
  justify-items: center;
  gap: var(--s-1);
  font-family: var(--font-label);
  font-size: var(--t--2);
  font-weight: var(--w-semi);
  letter-spacing: var(--ls-kicker);
  text-transform: uppercase;
  color: var(--ink-4);
}

@media (hover: hover) {
  .news-lead:hover .news-lead__art { border-color: var(--line-strong); }
  .news-lead:hover .news-lead__title {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 6px;
    text-decoration-color: var(--ink-4);
  }
}

/* ── Реестр записей: датная марка · запись · мини-вклейка ── */
.ledger {
  border-top: 1px solid var(--line);
}
.ledger:empty { border-top: 0; }

.ledger-row {
  display: flex;
  align-items: flex-start;
  gap: var(--s-5);
  padding: var(--s-5) var(--s-4);
  margin-inline: calc(var(--s-4) * -1);
  border-bottom: 1px solid var(--line-subtle);
  cursor: pointer;
}
@media (hover: hover) {
  .ledger-row:hover { background: var(--bg-hover); }
}

/* Ширина колонки — по содержимому: марка «дд.мм» табличная и моноширинная,
   поэтому все строки встают в одну вертикаль без фиксированной ширины.
   Жёсткое значение здесь однажды уже обрезало дату (колонка считалась под
   двузначный день, а не под пять знаков). */
.ledger-row__date {
  flex: 0 0 auto;
  min-width: 5ch;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--s-1);
  padding-right: var(--s-4);
  border-right: 1px solid var(--line-subtle);
  text-align: center;
}
.ledger-row__dm {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--t-1);
  line-height: var(--lh-tight);
  letter-spacing: 0;
  color: var(--ink-2);
}
.ledger-row__no {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--t--2);
  letter-spacing: 0;
  color: var(--ink-4);
  white-space: nowrap;
}
.ledger-row__year {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--t--2);
  color: var(--ink-4);
}

.ledger-row__body {
  flex: 1;
  min-width: 0;
  max-width: var(--measure);
}
.ledger-row__title {
  font-size: var(--t-2);
  line-height: var(--lh-snug);
  font-variation-settings: 'opsz' 18;
}
.ledger-row__excerpt {
  font-size: var(--t-0);
  line-height: var(--lh-body);
  color: var(--ink-3);
  margin-top: var(--s-1);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ledger-row__meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--s-2);
  margin-top: var(--s-2);
  font-size: var(--t--2);
  color: var(--ink-4);
}

.ledger-row__thumb {
  flex-shrink: 0;
  width: 128px;
  margin-left: auto;
  border: 1px solid var(--line);
  background: var(--bg-panel);
  padding: var(--s-1);
}
.ledger-row__thumb img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--line-subtle);
}
/* Запись без своей обложки получает ту же стандартную, что и лид, только в
   масштабе строки. Иначе правый край реестра рвётся: у одной записи вклейка
   есть, у соседней такой же — нет, и разница читается сбоем, а не иерархией.
   Разный размер лида и строки — это иерархия и она намеренная; разный ЯЗЫК
   внутри одного списка — дефект. */
.ledger-row__thumb--seal {
  display: grid;
  place-items: center;
  aspect-ratio: 4 / 3;
  color: var(--rank-founder);
  background:
    radial-gradient(ellipse 70% 60% at 50% 45%, var(--bg-hover), transparent 70%),
    var(--bg-inset);
  box-shadow: var(--sh-inset);
}
.ledger-row__thumb--seal svg {
  width: 44px;
  height: 44px;
  fill: currentColor;
  opacity: 0.45;
}

.feed-empty {
  padding: var(--s-14) var(--s-4);
  text-align: center;
  font-size: var(--t-0);
  color: var(--ink-4);
}

/* ── Обновления: журнал правок с точечными лидерами, как оглавление тома ── */
.release-strip { margin-top: var(--s-20); }
/* На фильтре «Обновления» лента пуста — журнал не отставляем на всю секцию. */
.ledger:empty + .release-strip { margin-top: var(--s-4); }

.section-label {
  display: flex;
  align-items: center;
  gap: var(--s-4);
  font-family: var(--font-label);
  font-size: var(--t--2);
  font-weight: var(--w-semi);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ink-3);
  margin-bottom: var(--s-4);
}
.section-label::after {
  content: "";
  flex: 1;
  border-top: 1px solid var(--line-subtle);
}

.release-list { display: block; }

.release-row {
  display: flex;
  align-items: baseline;
  gap: var(--s-3);
  width: 100%;
  padding: var(--s-3) var(--s-4);
  margin-inline: calc(var(--s-4) * -1);
  background: transparent;
  border: 0;
  cursor: pointer;
  text-align: left;
  font-family: var(--font-body);
  font-size: var(--t-0); /* у <button> UA-кегль 13.33px — держим шкалу */
  color: inherit;
}
@media (hover: hover) {
  .release-row:hover { background: var(--bg-hover); }
}

.release-row__version {
  flex-shrink: 0;
  min-width: 64px;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--t--1);
  color: var(--info);
}
.release-row__title {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--t-0);
  font-weight: var(--w-normal);   /* полужирный гротеск спорил с серифом реестра */
  color: var(--ink);
}
/* Лидер сидит на базовой линии строки, как в наборном оглавлении. */
.release-row__leader {
  flex: 1 0 var(--s-8);
  align-self: baseline;
  border-bottom: 1px dotted var(--line-strong);
}
.release-row__date {
  flex-shrink: 0;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: var(--t--1);
  color: var(--ink-4);
}

.release-all {
  display: inline-block;
  margin-top: var(--s-3);
  font-family: var(--font-label);
  font-size: var(--t--2);
  font-weight: var(--w-semi);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  text-decoration: underline;
  text-underline-offset: 4px;
}
.release-all { color: var(--accent-text); }
.release-all:hover { color: var(--accent-hover); }

/* ── Форма публикации (staff) ── */
.news-creator {
  display: grid;
  gap: var(--s-4);
  background: var(--bg-panel);
  border: 1px solid var(--line);
  padding: var(--s-6);
  margin-bottom: var(--s-6);
}
.news-creator h2 {
  font-size: var(--t-3);
  font-variation-settings: 'opsz' 24;
}
.creator-modes { display: flex; gap: var(--s-2); }
.creator-hint { font-size: var(--t--1); color: var(--ink-3); }

.creator-input,
.creator-text {
  width: 100%;
  background: var(--bg-inset);
  border: 1px solid var(--line);
  border-radius: var(--r-1);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: var(--t-0);
  line-height: var(--lh-body);
  padding: var(--s-3) var(--s-4);
}
.creator-input::placeholder,
.creator-text::placeholder { color: var(--ink-4); }
.creator-text { min-height: 140px; resize: vertical; }

.creator-drop {
  border: 1px dashed var(--line-strong);
  border-radius: var(--r-1);
  background: var(--bg-inset);
  padding: var(--s-6);
  text-align: center;
  cursor: pointer;
}
.creator-drop:hover { border-color: var(--accent-line); background: var(--bg-hover); }
.creator-drop__title { font-size: var(--t-0); font-weight: var(--w-semi); color: var(--ink); }
.creator-drop__sub { font-size: var(--t--1); color: var(--ink-3); margin-top: var(--s-1); }

.creator-secondary { display: grid; gap: var(--s-3); }
.creator-actions { display: flex; gap: var(--s-3); }

/* .hidden объявлен выше display-правил этих блоков — фиксируем приоритет. */
.news-creator.hidden,
.creator-secondary.hidden { display: none; }

/* ── Деталка: оверлей публикации ── */
.post-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  display: grid;
  place-items: center;
  padding: var(--s-6);
}
.post-overlay.hidden { display: none; }

.post-overlay__backdrop {
  position: absolute;
  inset: 0;
  background: var(--bg-void);
  opacity: 0.82;
}

.post-overlay__dialog {
  position: relative;
  width: min(var(--ov-md), 100%);
  max-height: var(--ov-h);
  overflow-y: auto;
  background: var(--bg-base);
  border: 1px solid var(--line);
  box-shadow: var(--sh-4);
}

.post-overlay__head {
  position: sticky;
  top: 0;
  z-index: var(--z-sticky);
  display: flex;
  justify-content: flex-end;
  padding: var(--s-4);
  pointer-events: none;
}
.post-overlay__close {
  pointer-events: auto;
  width: var(--s-8);
  height: var(--s-8);
  display: grid;
  place-items: center;
  background: var(--bg-raised);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-pill);
  color: var(--ink-2);
  font-size: var(--t-1);
  line-height: var(--lh-tight);
  cursor: pointer;
}
.post-overlay__close { color: var(--ink); }
.post-overlay__close:hover { background: var(--bg-hover); border-color: var(--ink-4); }

/* Поля издательские: текст не жмётся к кромке диалога.
   Тело больше НЕ подтягивается под шапку — арт лежит в паспарту внутри
   полей, поэтому крестик сидит на поверхности диалога, а не на картинке. */
.post-overlay__body {
  padding: 0 var(--s-14) var(--s-10);
  margin-top: calc(var(--s-6) * -1);
}
.post-rubric {
  font-family: var(--font-label);
  font-size: var(--t--2);
  font-weight: var(--w-semi);
  letter-spacing: var(--ls-kicker);
  text-transform: uppercase;
  color: var(--ink-3);
}
.post-overlay__title {
  font-size: var(--t-3);
  font-variation-settings: 'opsz' 24;
  margin: var(--s-2) 0 var(--s-3);
  padding-right: var(--s-10);
}

body.news-modal-open { overflow: hidden; }

.post-overlay__close svg { width: 14px; height: 14px; display: block; fill: currentColor; }
.post-overlay__body .post-meta {
  padding-bottom: var(--s-4);
  border-bottom: 1px solid var(--line-subtle);
  margin-bottom: var(--s-4);
}
.post-text {
  font-size: var(--t-0);
  line-height: var(--lh-loose);
  color: var(--ink-2);
  white-space: pre-line;
  max-width: var(--measure);
  overflow-wrap: break-word;
}
.post-text--rich { white-space: normal; }
.post-text--rich p { margin-bottom: var(--s-3); }
.post-subhead {
  font-family: var(--font-body);
  font-size: var(--t-1);
  font-weight: var(--w-semi);
  color: var(--ink);
  margin: var(--s-4) 0 var(--s-2);
}
.post-list {
  list-style: none;
  display: grid;
  gap: var(--s-1);
  margin: 0 0 var(--s-3);
  padding: 0;
}
.post-list li {
  position: relative;
  padding-left: var(--s-4);
}
.post-list li::before {
  content: "—";
  position: absolute;
  left: 0;
  color: var(--ink-4);
}
.post-actions { margin-top: var(--s-6); display: flex; gap: var(--s-3); }

/* ── Медиа внутри деталки и превью формы ──
   То же паспарту, что у вклеек ленты: рамка + подложка + поле вокруг арта. */
.post-media {
  margin-bottom: var(--s-6);
  border: 1px solid var(--line);
  background: var(--bg-panel);
  padding: var(--s-2);
}
.post-media__frame {
  position: relative;
  background: var(--bg-inset);
  border: 1px solid var(--line-subtle);
}
.post-media__frame img {
  display: block;
  width: 100%;
  max-height: 56vh;
  object-fit: contain;
}
.post-media--inline { margin-bottom: 0; }
.post-media--inline .post-media__frame img { max-height: 300px; }

.post-media__fallback {
  display: grid;
  gap: var(--s-2);
  padding: var(--s-6);
  background:
    radial-gradient(ellipse 500px 300px at 70% 10%, var(--accent-1), transparent 65%),
    linear-gradient(200deg, var(--bg-raised), var(--bg-base) 70%, var(--bg-void));
}
.post-media__fallback-title { font-size: var(--t-1); font-weight: var(--w-semi); color: var(--ink); }
.post-media__fallback-note { font-size: var(--t--1); color: var(--ink-3); }
.post-media__chips { display: flex; gap: var(--s-2); margin-top: var(--s-2); }

/* ── Просмотрщик презентаций (id-контракт с JS сохранён) ── */
.news-pptx-shell { display: grid; }
.news-pptx-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--s-3);
  padding: var(--s-3) var(--s-4);
  background: var(--bg-raised);
  border-bottom: 1px solid var(--line-subtle);
}
.news-pptx-status { display: grid; text-align: center; gap: var(--s-1); }
.news-pptx-label {
  font-family: var(--font-label);
  font-size: var(--t--2);
  font-weight: var(--w-semi);
  letter-spacing: var(--ls-label);
  text-transform: uppercase;
  color: var(--ink-4);
}
.news-pptx-counter { font-family: var(--font-mono); font-size: var(--t--1); color: var(--ink-2); }
.news-pptx-nav {
  width: var(--s-8);
  height: var(--s-8);
  display: grid;
  place-items: center;
  background: transparent;
  border: 1px solid var(--line-strong);
  border-radius: var(--r-1);
  color: var(--ink-2);
  font-size: var(--t-1);
  cursor: pointer;
}
.news-pptx-nav:hover { color: var(--ink); background: var(--bg-hover); }
.news-pptx-nav:disabled { opacity: 0.4; cursor: not-allowed; }

.news-pptx-stage { position: relative; background: var(--bg-inset); min-height: 240px; }
.news-pptx-canvas { display: block; width: 100%; height: auto; }
.news-pptx-canvas:not(.ready) { visibility: hidden; }
.news-pptx-embedded-host.hidden { display: none; }
.news-pptx-loading {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: var(--s-6);
  text-align: center;
  font-size: var(--t--1);
  color: var(--ink-3);
}
.news-pptx-loading.hidden { display: none; }
.news-pptx-loading.error { color: var(--danger); }
.news-pptx-note {
  padding: var(--s-3) var(--s-4);
  font-size: var(--t--2);
  color: var(--ink-4);
}
.news-pptx-fallback-shell { position: relative; }
.news-pptx-fallback-embed { display: block; width: 100%; height: min(58vh, 640px); border: 0; }
.news-pptx-fallback-badge {
  position: absolute;
  left: var(--s-4);
  bottom: var(--s-4);
  font-size: var(--t--2);
  color: var(--ink-3);
  background: var(--bg-raised);
  border: 1px solid var(--line);
  padding: var(--s-1) var(--s-2);
}

/* ── Адаптив ── */
@media (max-width: 760px) {
  .news-page { padding: var(--s-8) var(--s-3) var(--s-14); }

  .news-mast { gap: var(--s-1); padding-bottom: var(--s-4); }
  .news-mast__seal svg { width: var(--s-8); height: var(--s-8); }
  .rubric-row { margin-bottom: var(--s-6); }

  /* Лид складывается в колонку: текст первым, вклейка после. */
  .news-lead {
    grid-template-columns: 1fr;
    gap: var(--s-5);
    margin-bottom: var(--s-10);
  }

  /* На 360 px датная колонка съедала у текста треть ширины: строка падала до
     ~20 знаков и рвалась на обрывки. Колонка ложится над телом отдельной
     строкой, вклейка держит обе — тексту остаётся читаемая мера. */
  .ledger-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "date thumb"
      "body thumb";
    align-items: start;
    column-gap: var(--s-3);
    row-gap: var(--s-1);
    padding: var(--s-4) var(--s-3);
    margin-inline: calc(var(--s-3) * -1);
  }
  .ledger-row__date {
    grid-area: date;
    flex-direction: row;
    align-items: baseline;
    gap: var(--s-2);
    min-width: 0;
    padding-right: 0;
    border-right: 0;
  }
  .ledger-row__dm { font-size: var(--t--1); }
  .ledger-row__body { grid-area: body; }
  .ledger-row__thumb { grid-area: thumb; width: 88px; }

  /* Журнал правок: без лидера, дата уходит под заголовок. */
  .release-strip { margin-top: var(--s-14); }
  .release-row {
    flex-wrap: wrap;
    gap: var(--s-1) var(--s-3);
    padding: var(--s-3);
    margin-inline: calc(var(--s-3) * -1);
  }
  .release-row__leader { display: none; }
  .release-row__title { flex: 1 1 100%; white-space: normal; order: 1; }
  .release-row__version { order: 0; }
  .release-row__date { order: 0; margin-left: auto; }

  .post-overlay { padding: var(--s-3); }
  .post-overlay__body { padding: 0 var(--s-4) var(--s-6); }
}
