/* ============================================================================
   Лента раздела — фаза 2 TASK-005.
   Перенос принятого образца-страницы-ленты-2026-08-13 на разметку блоков ядра
   (Query Loop). Числа — только через var() из tokens.css.

   ОТЛИЧИЕ ОТ ОБРАЗЦА — не в виде, а в носителе: там карточки набраны руками,
   здесь их рисует ядро (post-template → li.wp-block-post), поэтому селекторы
   карточки цепляются за классы, которые шаблон вешает на блоки поста
   (card__thumb/title/deck/meta), а сама карточка — это `.feed > li`.
   Безкадровая строка возникает сама: у поста нет миниатюры — колонка кадра
   остаётся пустым полем (в образце это `.card--textonly`, здесь — просто
   отсутствие featured-image; вид тот же, «пустое поле слева читается как тишина»).

   НЕ ЗДЕСЬ: рекламное место (фаза 5, живьё, OPEN-052) и фильтр по разделу
   (переезд, OPEN-040/041) — их в этом инкременте нет.
   ============================================================================ */

/* Полоса содержания уже обвязки и прижата влево (решение владельца 20.08.2026):
   логотип и первый блок содержания стоят на одной левой границе. */
.lane{ max-width:var(--feed-width); }
/* Архивы автора и поиска выровнены влево по оболочке, как обычные архивы и
   статья: логотип, крошки и контент на одной левой границе (решения владельца
   20.08.2026 и 14.09.2026). */

/* --- ШАПКА ЛЕНТЫ ------------------------------------------------------------ */
.feed__head{
  display:flex; flex-wrap:wrap; align-items:baseline;
  gap:var(--space-3) var(--space-4);
  padding-block-end:var(--space-4); margin-block-end:0;
  border-block-end:1px solid var(--rule-strong);
}
.feed__title{
  font-size:var(--step-5); font-weight:var(--wght-head2);
  font-variation-settings:"opsz" var(--opsz-head2);
  line-height:var(--lh-head2); letter-spacing:-.015em; margin:0;
}
.feed__count{ font-family:var(--font-apparatus); font-size:var(--step-1); color:var(--ink-mute); margin:0; }

/* --- ЛЕНТА — СПИСОК СТРОК, А НЕ СЕТКА КАРТОЧЕК ------------------------------
   Список строк оставляет заголовку полную длину и не требует резать его до
   двух строк ради ровной сетки; у 28 % материалов кадра нет вовсе, и в списке
   строка без кадра просто отдаёт текст правее пустого поля. */
.feed{ display:flex; flex-direction:column; list-style:none; margin:0; padding:0; }

/* Карточка — строка ленты, её рисует ядро (li.wp-block-post). */
.feed > li{
  display:grid; grid-template-columns:var(--feed-thumb) 1fr; gap:0 var(--feed-gap);
  padding-block:var(--space-5); border-block-end:1px solid var(--rule);
  position:relative; margin:0;
}
/* Раскладка строки задана ЯВНО (грабля образца 02.08: неявная расстановка в
   двухколоночной строке с растянутым на ряды кадром непредсказуема). Контекст
   обёрнут в :where(), чтобы тип `li` не поднимал специфичность выше именованных
   правил карточки (иначе кадр уезжал бы в колонку 2). */
:where(.feed > li) > *{ grid-column:2; margin:0; }
.card__thumb{ grid-column:1; grid-row:1 / span 3; align-self:start; margin:0; }
.card__title{ grid-row:1; }
.card__deck{ grid-row:2; }
.card__meta{ grid-row:3; }

/* Поиск и профиль автора возвращают тематический кикер над заголовком. */
.card__theme{
  grid-row:1; font-family:var(--font-apparatus); font-size:var(--step-1);
  font-weight:var(--wght-meta); line-height:var(--lh-meta); letter-spacing:.06em;
  text-transform:uppercase; color:var(--ink-mute); margin:0; position:relative; z-index:1;
}
.card__theme a{ color:inherit; text-decoration:none; }
.card__theme a:hover{ text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:.18em; }
.feed--themes .card__thumb{ grid-row:1 / span 4; }
.feed--themes .card__title{ grid-row:2; margin-block-start:var(--space-2); }
.feed--themes .card__deck{ grid-row:3; }
.feed--themes .card__meta{ grid-row:4; }
.feed--themes > li:not(:has(.card__theme)) .card__title{ grid-row:1; margin-block-start:0; }
.feed--themes > li:not(:has(.card__theme)) .card__deck{ grid-row:2; }
.feed--themes > li:not(:has(.card__theme)) .card__meta{ grid-row:3; }

/* Страница метки (OPEN-095): кикер «Раздел · Тема» и строка меток материала
   пятым рядом. Ссылки кикера и меток подняты над растянутой ссылкой заголовка. */
.card__sep{ color:var(--rule-strong); }
.card__tags{
  font-family:var(--font-apparatus); font-size:var(--step-1); line-height:var(--lh-meta);
  color:var(--ink-mute); margin-block-start:var(--space-2); position:relative; z-index:1;
}
.card__tags a{ color:inherit; text-decoration:underline; text-decoration-color:var(--rule); text-underline-offset:.2em; }
.card__tags a:hover{ color:var(--ink); text-decoration-color:var(--accent); }
.card__tags a:focus-visible, .card__theme a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.feed--tags .card__thumb{ grid-row:1 / span 5; }
.feed--tags .card__tags{ grid-row:5; }
.feed--tags > li:not(:has(.card__theme)) .card__tags{ grid-row:4; }

/* Место под кадр резервируется соотношением сторон (критерий 3, CLS без
   скачков). 3:2 — наименее навязчивое из общих; вертикальный кадр кадрируется
   по центру. Рамка волосяной линейкой, подложек в системе нет. */
.card__thumb img{
  display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover;
  box-shadow:0 0 0 1px var(--rule-strong);
}
/* `height:auto` обязателен: у сырой миниатюры (get_the_post_thumbnail в реке
   группы) есть атрибут height=NNN — без сброса он перебивает aspect-ratio, и
   кадр вытягивается в натуральную (портретную) высоту. В архивной ленте это
   гасит глобальный стиль блока featured-image; в своей реке — вот это правило. */

.card__title{
  font-size:var(--step-4); font-weight:var(--wght-head3);
  font-variation-settings:"opsz" var(--opsz-head3); line-height:var(--lh-tight);
  margin-block-start:0; text-wrap:balance;
}
/* Ссылка растянута на всю строку: нажимаемая область — вся карточка, но в
   дереве доступности остаётся одна ссылка с текстом заголовка. */
.card__title a{ color:inherit; text-decoration:none; }
.card__title a::after{ content:""; position:absolute; inset:0; }
.feed > li:hover .card__title a{
  text-decoration:underline; text-decoration-color:var(--accent);
  text-decoration-thickness:.06em; text-underline-offset:.14em;
}
.feed > li:focus-within{ outline:2px solid var(--accent); outline-offset:4px; border-radius:2px; }
.card__title a:focus-visible{ outline:none; }
.feed > li:active{ background:var(--accent-wash); }
/* Посещённое — тоном чернил, а не цветом (политика цвета запрещает акцент в тексте). */
.card__title a:visited{ color:var(--ink-soft); }

/* Анонс. Обрезка тремя строками — мера показа; в ленту приходит короткий
   excerpt, длину режет ядро. Текст лежит в post-excerpt__excerpt. */
.card__deck{ margin-block-start:var(--space-3); max-width:var(--measure-deck-feed); }
.card__deck p,
.card__deck .wp-block-post-excerpt__excerpt{
  margin:0; font-size:var(--step-2); line-height:var(--lh-deck); color:var(--ink-soft);
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

/* Строка меты: дата и автор; у афиши и конкурсов вместо даты — срок события, у афиши
   ещё площадка и город (фильтр render_block_core/post-date, OPEN-092).
   Разделитель — средняя точка между элементами. */
.card__meta{
  display:flex; flex-wrap:wrap; gap:0 .1em;
  margin-block-start:var(--space-3);
  font-family:var(--font-apparatus); font-size:var(--step-1); line-height:var(--lh-meta); color:var(--ink-mute);
}
.card__meta > * + *::before{ content:"\00B7"; color:var(--rule-strong); margin-inline:.55em; }
.card__meta a{ color:inherit; text-decoration:none; }
.card__meta a:hover{ text-decoration:underline; text-underline-offset:.2em; }
.card__meta time{ white-space:nowrap; }

/* --- КОЛУМНИСТЫ: карточка с кикером-автором ---------------------------------
   Раздел «Колумнисты» — колонки РАЗНЫХ авторов, поэтому имя автора вынесено в
   кикер над заголовком (в обычной ленте кикер снят, договорённость 02.09.2026),
   а в мете остаётся только дата. Кадр растягивается на четыре ряда. Правила
   scoped `.feed--columns` — общей ленты не касаются. */
.card__kicker{
  font-family:var(--font-apparatus); font-size:var(--step-1); font-weight:var(--wght-meta);
  line-height:var(--lh-meta); color:var(--ink-mute); margin:0; text-wrap:pretty;
  /* Название колонки — фраза (не короткая метка), поэтому без caps/трекинга. */
  /* Ссылка колонки поднята над растянутой ссылкой заголовка (::after) — кликается
     сама и ведёт на страницу колонки, остальная карточка ведёт в материал. */
  position:relative; z-index:1;
}
.card__kicker a{ color:inherit; text-decoration:none; }
.card__kicker a:hover{ text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:.18em; }
.card__kicker a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.feed--columns .card__thumb{ grid-row:1 / span 4; }
.feed--columns .card__kicker{ grid-row:1; }
.feed--columns .card__title{ grid-row:2; margin-block-start:var(--space-2); }
.feed--columns .card__deck{ grid-row:3; }
.feed--columns .card__meta{ grid-row:4; }

/* --- КОЛУМНИСТЫ: указатель колонок (шорткод ph_column_nav, 03.10.2026) ------
   Раскрывающийся указатель под шапкой ленты: строка-переключатель «Колонки ·
   <выбрано>», под ней список колонок по свежести с числом статей и годом
   последней. На узком свёрнут (27 строк отодвинули бы ленту), на широком nav.js
   раскрывает его сразу, список — в две колонки газетного указателя (названия
   колонок длинные, третья колонка в ленте 65rem рвала бы их на три строки). Цвета нет:
   текущая — чернилами и весом, как в .secnav. */
.colnav{ border-block-end:1px solid var(--rule); }
.colnav__sum{
  display:flex; align-items:center; gap:var(--space-3);
  min-block-size:44px; padding-block:var(--space-2);
  font-family:var(--font-apparatus); font-size:var(--step-2); line-height:var(--lh-meta);
  color:var(--ink); cursor:pointer; list-style:none;
}
.colnav__sum::-webkit-details-marker{ display:none; }
.colnav__sum::marker{ content:""; }
.colnav__label{ font-weight:var(--wght-strong); }
.colnav__state{
  min-inline-size:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  color:var(--ink-mute);
}
.colnav__sum::after{
  content:""; inline-size:0; block-size:0; flex:0 0 auto; margin-inline-start:auto;
  border-inline:.3125rem solid transparent;
  border-block-start:.375rem solid var(--ink-mute);
  transition:transform .12s ease-out;
}
.colnav__sum:hover::after{ border-block-start-color:var(--ink); }
.colnav__box[open] > .colnav__sum::after{ transform:rotate(180deg); border-block-start-color:var(--ink); }
.colnav__sum:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.colnav__list{
  list-style:none; margin:0; padding:0 0 var(--space-4);
  columns:1; column-gap:var(--space-6);
}
.colnav__list > li{ break-inside:avoid; margin:0; }
.colnav__item{
  display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3);
  min-block-size:44px; align-content:center; flex-wrap:nowrap;
  padding-block:var(--space-2); border-block-end:1px solid var(--rule-soft);
  font-family:var(--font-apparatus); font-size:var(--step-1); line-height:var(--lh-meta);
  color:var(--ink-soft); text-decoration:none;
}
.colnav__name{ text-wrap:pretty; }
.colnav__n{ flex:0 0 auto; color:var(--ink-mute); font-variant-numeric:tabular-nums; white-space:nowrap; }
.colnav__item:hover .colnav__name{ color:var(--ink); text-decoration:underline; text-underline-offset:.2em; }
.colnav__item.is-current{ color:var(--ink); font-weight:var(--wght-meta); }
.colnav__item.is-current .colnav__name{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.22em; }
.colnav__item:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.colnav__item--all{ color:var(--ink); }
.colnav__now{
  margin:var(--space-4) 0 0; font-family:var(--font-apparatus); font-size:var(--step-1);
  line-height:var(--lh-meta); color:var(--ink-mute);
}
.colnav__now a{ color:var(--ink); text-underline-offset:.2em; }
@media (min-width: 48rem){
  .colnav__list{ columns:2; }
  .colnav__item{ min-block-size:0; padding-block:var(--space-1); }
}
@media (prefers-reduced-motion: reduce){
  .colnav__sum::after{ transition:none; }
}

/* --- АФИША ПО ДАТАМ: указатель дат и архив по месяцам (TASK-010, 04.10.2026) ----
   Над лентой «Афиши», «Новостей», «Конкурсов»: пилюли «Сегодня · месяц · архив» — те же
   .secnav__item, что у переключателя разделов; поле даты — линией, как поле подписки;
   кнопка — рамкой, как пилюля (заливка чернилами — только у главного действия формы
   подписки). Города — раскрывающийся .colnav, как «Колонки». Архив — газетный указатель:
   год заголовком, месяцы строками с числом, как указатель имён. Цвета нет. */
.evnav{
  display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
  gap:var(--space-3) var(--space-5);
  padding-block:var(--space-3) var(--space-4); border-block-end:1px solid var(--rule);
}
.evnav__quick{ display:flex; flex-wrap:wrap; gap:var(--space-2); list-style:none; margin:0; padding:0; }
.evnav__quick a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.evnav__day{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:var(--space-2) var(--space-3); margin:0; }
.evnav__label{
  font-family:var(--font-apparatus); font-size:var(--step-1); line-height:var(--lh-meta); color:var(--ink-mute);
  align-self:center;
}
.evnav__input{
  min-block-size:2.5rem; min-inline-size:0;
  font-family:var(--font-apparatus); font-size:var(--step-1); font-variant-numeric:tabular-nums;
  color:var(--ink); background:var(--bg);
  border:0; border-block-end:1px solid var(--rule-strong); border-radius:0; padding:var(--space-1) 0;
}
.evnav__input:hover{ border-block-end-color:var(--ink-mute); }
.evnav__input:focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-block-end-color:var(--ink); }
.evnav__button{
  min-block-size:2.5rem; padding:var(--space-1) var(--space-4);
  font-family:var(--font-apparatus); font-size:var(--step-1); font-weight:var(--wght-meta); line-height:var(--lh-meta);
  color:var(--ink); background:var(--bg); border:1px solid var(--ink); border-radius:2px; cursor:pointer;
}
.evnav__button:hover{ background:var(--bg-sunk); }
.evnav__button:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.evnav__cities .colnav__list{ padding-block-end:var(--space-3); }

.evarc{ margin-block-start:var(--space-5); columns:1; column-gap:var(--space-6); }
.evarc__year{ margin:0 0 var(--space-6); break-inside:avoid-column; }
.evarc__y{
  margin:0 0 var(--space-2); padding-block-end:var(--space-2); border-block-end:1px solid var(--rule-strong);
  font-family:var(--font-apparatus); font-size:var(--step-3); font-weight:var(--wght-strong);
  font-variant-numeric:tabular-nums;
}
.evarc__months{ list-style:none; margin:0; padding:0; }
.evarc__month{
  display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3);
  min-block-size:44px; align-content:center; padding-block:var(--space-2);
  border-block-end:1px solid var(--rule-soft);
  font-family:var(--font-apparatus); font-size:var(--step-1); line-height:var(--lh-meta);
  color:var(--ink); text-decoration:none;
}
.evarc__n{ color:var(--ink-mute); font-variant-numeric:tabular-nums; }
.evarc__month:hover .evarc__name{ text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:.16em; }
.evarc__month:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
@media (min-width: 48rem){
  .evarc{ columns:3; }
  .evarc__month{ min-block-size:0; padding-block:var(--space-1); }
}
@media (min-width: 64rem){
  .evarc{ columns:4; }
}

/* --- ПАГИНАЦИЯ ---------------------------------------------------------------
   Простая, без «умной» середины: у ленты раздела страниц немного, а
   бесконечная прокрутка ломает возврат из статьи и адресуемость страницы.
   Ядро рисует ссылки классом .page-numbers. */
.pager{
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3);
  margin-block-start:var(--space-6);
  font-family:var(--font-apparatus); font-size:var(--step-2);
}
.pager .page-numbers,
.pager .wp-block-query-pagination-previous,
.pager .wp-block-query-pagination-next{
  min-width:2.6em; padding:.45em .6em; text-align:center;
  border:1px solid var(--rule); border-radius:2px; color:var(--ink); text-decoration:none;
}
.pager a.page-numbers:hover,
.pager a.wp-block-query-pagination-previous:hover,
.pager a.wp-block-query-pagination-next:hover{ border-color:var(--ink-mute); }
.pager a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.pager .page-numbers.current{ border-color:var(--ink); font-weight:var(--wght-meta); }
.pager .page-numbers.dots{ border:0; color:var(--ink-mute); min-width:auto; padding-inline:0; }

/* --- ПУСТОТА (критерий 9) ---------------------------------------------------
   На подложке --bg-sunk, с одним действием, без картинок и без извинений. */
.note{
  background:var(--bg-sunk); padding:var(--space-6) var(--space-5); margin-block-start:var(--space-6);
  font-family:var(--font-apparatus); font-size:var(--step-2); line-height:var(--lh-meta);
  max-width:calc(var(--step-2) * 40);
}
.note h2, .note h3{
  font-size:var(--step-3); font-family:var(--font-text); font-weight:var(--wght-head3);
  line-height:var(--lh-tight); margin-block-end:var(--space-2);
}
.note p{ color:var(--ink-soft); margin:0; }
.note a{ color:inherit; text-decoration:underline; text-decoration-color:var(--accent); text-decoration-thickness:.06em; text-underline-offset:.16em; }

/* --- АДАПТИВНОСТЬ. Одна контрольная точка, выведенная из содержимого: ниже
   640 px строка с кадром 240 px оставляет тексту меньше 20 знаков. --------- */
@media (max-width:40rem){  /* --bp-узкий */
  /* Без промежутка сетки: ряды разводят отступы самих элементов (8/14/14/8, как на
     широком), иначе 14 px сетки ложились поверх них и удваивали ритм карточки
     (замечание владельца 04.10.2026, TASK-009). От текста отделён только кадр. */
  .feed > li{ grid-template-columns:1fr; gap:0; }
  .feed > li > *{ grid-column:1; }
  .card__thumb{ grid-column:1; grid-row:1; margin-block-end:var(--space-3); }
  .card__title{ grid-row:2; }
  .card__deck{ grid-row:3; }
  .card__meta{ grid-row:4; }
  .card__thumb img{ aspect-ratio:16 / 9; }
  /* Колумнисты: кадр / кикер-автор / заголовок / анонс / мета. */
  .feed--columns .card__thumb{ grid-row:1; }
  .feed--columns .card__kicker{ grid-row:2; }
  .feed--columns .card__title{ grid-row:3; }
  .feed--columns .card__deck{ grid-row:4; }
  .feed--columns .card__meta{ grid-row:5; }
  .feed--themes .card__thumb{ grid-row:1; }
  .feed--themes .card__theme{ grid-row:2; }
  .feed--themes .card__title{ grid-row:3; }
  .feed--themes .card__deck{ grid-row:4; }
  .feed--themes .card__meta{ grid-row:5; }
  .feed--themes > li:not(:has(.card__theme)) .card__title{ grid-row:2; }
  .feed--themes > li:not(:has(.card__theme)) .card__deck{ grid-row:3; }
  .feed--themes > li:not(:has(.card__theme)) .card__meta{ grid-row:4; }
  .feed--tags .card__thumb{ grid-row:1; }
  .feed--tags .card__tags{ grid-row:6; }
  .feed--tags > li:not(:has(.card__theme)) .card__tags{ grid-row:5; }
}

/* --- ЦЕЛЬ НАЖАТИЯ ПОД ГРУБЫМ УКАЗАТЕЛЕМ (OPEN-065) — пагинация 44×44 ------- */
@media (pointer: coarse){
  .pager .page-numbers,
  .pager .wp-block-query-pagination-previous,
  .pager .wp-block-query-pagination-next{
    min-height:var(--tap-min); min-width:var(--tap-min);
    display:inline-flex; align-items:center; justify-content:center;
  }
}