/* ============================================================
   Верх страницы — полоса прямого эфира и шапка в одну строку, общий для
   главной и всех внутренних страниц.
   Разметку печатает soyuzny_top() (inc/top.php), файл грузится на
   всех страницах поверх style.css. Скоуп — класс h17top на <body>: он
   стоит везде и нужен ради веса селекторов — правила перебивают общие
   правила шапки из style.css.

   Порядок: цвета схем → полоса эфира → второй вариант полосы → шапка →
   брейкпоинты верха → соцсети в полосе → что поменялось на
   страницах основного сайта.
   ============================================================ */

/* ─────────── 0. Цвета схем верха ─────────── */

/* Цвета верха, которые различаются по схемам, — токены, зарегистрированные
   как <color>: так они едут вместе со всей страницей при смене схемы (блок
   «ПЛАВНОЕ ПЕРЕКЛЮЧЕНИЕ ЦВЕТОВЫХ СХЕМ» в style.css). До 11.09.2026 фон
   полосы, фон шапки и цвет её ссылок задавались правилами на
   html[data-theme=…] — такое правило включается мгновенно: полоса и шапка
   щёлкали в новую схему, пока тело страницы ещё перетекало 420 мс.

   Токены живут на <body> (класс h17top есть на всех страницах), и переход
   для них объявлен там же: список переходов на <html> общий, в style.css, и
   переписывать его целиком ради своих токенов значило бы держать две копии.
   Правило перехода на body сильнее общего `html.theme-anim *` (тот оставляет
   потомкам только box-shadow), поэтому !important и в нём. Значения —
   литералами: токен схемы не должен ссылаться на другой токен схемы. */
@property --h17-strip{syntax:"<color>";inherits:true;initial-value:#07202F}
@property --h17-bg{syntax:"<color>";inherits:true;initial-value:#08253C}
@property --h17-rule{syntax:"<color>";inherits:true;initial-value:rgba(255,255,255,.24)}
@property --h17-pop-line{syntax:"<color>";inherits:true;initial-value:rgba(255,255,255,.12)}
@property --h17-pop-shd{syntax:"<color>";inherits:true;initial-value:rgba(0,0,0,.45)}
@property --h17-link{syntax:"<color>";inherits:true;initial-value:#fff}
.h17top{
	--h17-strip:#07202F;
	--h17-bg:#08253C;
	--h17-rule:rgba(255,255,255,.24);
	--h17-pop-line:rgba(255,255,255,.12);
	--h17-pop-shd:rgba(0,0,0,.45);
	--h17-link:#fff;
}
html[data-theme="light"] .h17top{
	--h17-strip:#0A263D;
	--h17-bg:#E4EAF2;
	--h17-rule:rgba(91,110,128,.45);
	--h17-pop-line:rgba(91,110,128,.22);
	--h17-pop-shd:rgba(10,38,61,.16);
	--h17-link:#0077FF;
}
html.theme-anim body.h17top{
	transition-property:box-shadow,--h17-strip,--h17-bg,--h17-rule,--h17-pop-line,--h17-pop-shd,--h17-link!important;
}
/* Переключатель схем в полосе живёт своей анимацией, как и общий
   (исключения в style.css): при смене схемы он переворачивается. Поворот на
   180° в тёмной схеме ставит общее правило `html[data-theme="dark"] .tvb-sw`
   из style.css; здесь — его переход с прежними длительностью и кривой, а
   дорожка и подписи вдобавок перетекают по цвету вместе со страницей.

   Флажок внутри по left не ездит: с 15.09.2026 left у него в обеих схемах
   один (раздел 1), к «Тёмному» его приносит поворот дорожки. Перехода по
   left ему не давать — сдвиг складывался бы с поворотом, и вместо полукруга
   флажок топтался бы на месте. Вечером 11.09.2026 здесь стоял переход по
   left вместо поворота — переключатель перестал переворачиваться. */
html.theme-anim .h17top .h17-theme .tvb-sw{transition-property:transform,background-color!important;transition-duration:.38s,var(--theme-anim)!important;transition-timing-function:cubic-bezier(.16,.85,.24,1),linear!important}
html.theme-anim .h17top .h17-theme .tvb-seg{transition-property:color!important;transition-duration:var(--theme-anim)!important;transition-timing-function:linear!important}
/* То же при смене схемы через View Transitions (класс theme-vt, основной
   путь с 15.09.2026, пункт 5 блока плавного переключения в style.css):
   флажок идёт живым слоем поверх растворения, поэтому переворачивается и
   перетекает фоном сам, а флажок внутри встаёт на место сразу — его
   переходы, как и у всей страницы, погашены. Подписям своего перехода не
   нужно: они в снимке и растворяются вместе со страницей. */
html.theme-vt .h17top .h17-theme .tvb-sw{transition:transform .38s cubic-bezier(.16,.85,.24,1),background-color var(--theme-anim) linear!important}

/* ─────────── 1. Полоса прямого эфира ─────────── */

.h17top .h17-live{width:100%;background:var(--h17-strip);border-bottom:1px solid rgba(255,255,255,.09)}

/* Полоса — один ряд зон слева направо: кадр эфира | «Сейчас в эфире» |
   программа | анонсы подкастов | переключатель схем. Кадр, «сейчас в эфире»,
   программа и переключатель стоят по своей ширине, анонсы забирают весь
   остаток и делят его поровну — пустого хвоста перед переключателем нет.

   Когда места мало, зоны сжимаются в заданном порядке: сначала программа
   (2 → 1 → 0 пунктов; текущая передача в «Сейчас в эфире» остаётся), затем
   у переключателя уходят подписи «Светлый/Тёмный», затем анонсы (3 → 2 → 1
   → 0). Порядок считает скрипт сразу после полосы (inc/top.php) по
   реальной ширине текста, а не брейкпоинты: названия передач и подкастов
   меняются каждый день. Правило одно — заголовки всегда видны целиком, без
   многоточий; им отдана вся высота полосы (высота кадра эфира), и если
   заголовок в неё не укладывается, срабатывает следующий шаг.

   Зазор между зонами один (--l17-gap), волосяная черта — ровно посередине.
   Исключение — кадр и «Сейчас в эфире» во втором варианте: это один блок,
   без черты и теснее (--l17-join, раздел 1а). Flex, а не grid: скрытая зона просто выпадает из ряда, и лишних зазоров от
   пустых колонок не остаётся.

   Поля полосы — те же, что у шапки (.h16-row в style.css): кадр начинается на
   вертикали логотипа, переключатель кончается на вертикали лупы. */
.h17top .h17-live-in{
	--l17-frame:220px;
	--l17-gap:clamp(28px,2.3vw,44px);
	display:flex;align-items:center;gap:var(--l17-gap);
	width:100%;
	padding:10px var(--gut);
}
@media(min-width:1180px){
	.h17top .h17-live-in{padding-left:clamp(20px,1.6vw,32px);padding-right:clamp(20px,1.6vw,32px)}
}
/* Волосяные разделители ровно посередине зазоров между зонами. */
.h17top .h17-live-in>*+*{position:relative}
.h17top .h17-live-in>*+*::before{
	content:"";position:absolute;left:calc(var(--l17-gap) / -2);top:50%;transform:translateY(-50%);
	width:1px;height:64px;background:rgba(255,255,255,.13);
}
/* Что скрипт убрал: программу и анонсы целиком, лишние карточки анонсов по
   одной. Атрибут hidden слабее собственного display — скрытие явное. */
.h17top .h17-live-in[data-pods="0"] .h17-pod,
.h17top .h17-pod-a[hidden]{display:none}

/* Кадр эфира: 16:9, живой поток, кликом открывает панель эфира.

   Внутри стоит общий плеер сайта (.tv-strip-play из soyuzny_header_live) —
   он же держит <video>, кнопки паузы, звука и полного экрана; здесь ему
   задаются только габариты кадра. Пока поток не пошёл, видна заставка, а с
   первым кадром её гасит общее правило .tv-strip-play:not(.is-paused) img. */
.h17top .h17-frame{
	position:relative;display:block;flex:0 0 auto;width:var(--l17-frame);aspect-ratio:16/9;
	padding:0;border:none;overflow:hidden;background:#000;line-height:0;
}
/* Габариты задаются кадру так же, как в левой колонке основного сайта
   (.tv-vrail .tv-strip-play): рамка остаётся в потоке и держит пропорцию
   сама — сюда же встают <video> и заставка по правилам общей темы. */
.h17top .h17-frame .tv-strip-play{
	position:relative;width:100%;height:auto;aspect-ratio:16/9;
	margin:0;flex:0 0 auto;border-radius:0;
}
.h17top .h17-prog{position:absolute;left:0;right:0;bottom:0;z-index:3;height:2px;background:rgba(255,255,255,.22);pointer-events:none}
.h17top .h17-prog i{display:block;height:100%;background:var(--blue);transition:width .6s linear}
@keyframes lppulse{0%,100%{opacity:1}50%{opacity:.25}}

/* «Сейчас в эфире». Ширина — по заголовку, но не шире 190px: длинное название
   переносится на две-три строки, а не растягивает зону. После переноса
   скрипт полосы поджимает блок по самой длинной строке (hugNow в
   inc/top.php): иначе коробка стояла во всю меру, и черта за блоком
   отходила от текста на 50–60px вместо половины зазора. */
.h17top .h17-now{
	display:flex;flex:0 0 auto;flex-direction:column;justify-content:center;gap:6px;min-width:0;max-width:190px;
	padding:0;border:none;background:transparent;text-align:left;cursor:pointer;
}
.h17top .h17-now-lbl{
	display:flex;align-items:center;gap:6px;white-space:nowrap;
	font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.52);
}
.h17top .h17-now-lbl::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--red);animation:lppulse 1.6s ease-in-out infinite}
.h17top .h17-now-t{font-size:16px;line-height:1.3;font-weight:700;color:#fff;text-wrap:pretty}
.h17top .h17-now-time{font-size:11.5px;font-weight:600;color:rgba(255,255,255,.58);font-variant-numeric:tabular-nums}

/* Анонсы подкастов — главный блок полосы: забирают всю свободную ширину и
   делят её поровну между карточками (flex:1 1 0, без потолка), поэтому между
   последней карточкой и переключателем не остаётся пустого поля.

   Карточка лежит горизонтально: кадр слева, заголовок справа — целиком, без
   обрезки строк; ему отдана вся высота полосы. Если заголовок в неё уже не
   укладывается, скрипт полосы убирает одну карточку. Обложки подкастов
   квадратные — в кадре 16:9 они кроются по центру (object-fit).

   Справа от перенесённого заголовка остаётся поле — строки короче меры.
   У последней карточки оно вставало перед чертой переключателя, и та
   отходила от текста вдвое дальше, чем от переключателя. Поэтому после
   раскладки скрипт полосы (hugPods в inc/top.php) поджимает заголовки
   по самой длинной строке и отдаёт освободившееся место обложкам; если
   обложки упёрлись в потолок, остаток делится поровну по краям зоны. */
/* Подпись — от верха обложки, а не по её центру (02.10.2026): по центру
   короткие и длинные заголовки стояли на разной высоте. Карточки ряда —
   одной высоты (stretch), обложка прижата к верху карточки. */
.h17top .h17-pod{display:flex;flex:1 1 0;align-items:stretch;gap:18px;min-width:0}
.h17top .h17-pod-a{
	display:flex;align-items:stretch;gap:12px;flex:1 1 0;min-width:0;
	text-decoration:none;
}
/* Кадр — доля карточки с полом и потолком: на узкой карточке снимок не
   мельчает до пятна, на широкой не перевешивает текст. Потолок — не больше
   0,78 кадра эфира: обложка анонса не крупнее самого эфира. На 900px кадр
   эфира 150px, а обложка доходила до 170px — была выше него и раздвигала
   полосу на 12px. */
.h17top .h17-pod-th{
	position:relative;display:block;width:44%;min-width:96px;max-width:min(170px,calc(var(--l17-frame) * .78));flex:0 0 auto;align-self:flex-start;
	aspect-ratio:16/9;overflow:hidden;background:rgba(255,255,255,.06);line-height:0;
}
.h17top .h17-pod-th img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
/* Наведение (02.10.2026): снимок чуть крупнее, заголовок подчёркнут —
   вместо прежней полупрозрачности всей карточки. Рамка в 1px по краю
   кадра — тёмная обложка не сливается с полосой. */
.h17top .h17-pod-a:hover .h17-pod-th img{transform:scale(1.06)}
.h17top .h17-pod-th::after{
	content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
	box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);
}
@media (prefers-reduced-motion:reduce){
	.h17top .h17-pod-th img{transition:none}
	.h17top .h17-pod-a:hover .h17-pod-th img{transform:none}
}
/* Знак воспроизведения — по нему ряд читается как анонсы подкастов, а не как
   ещё одна лента новостей; кликов он не перехватывает. С 02.10.2026 знак и
   длительность на обложке — общие с карточками полос «Медиа» на главной:
   правила в style.css (v19.37), своих здесь нет. */
.h17top .h17-pod-t{
	display:flex;flex-direction:column;min-width:0;font-size:13.5px;line-height:1.32;font-weight:600;color:rgba(255,255,255,.86);
	transition:color .2s;text-wrap:pretty;
}
.h17top .h17-pod-a:hover .h17-pod-t{color:#fff}
.h17top .h17-pod-h{
	display:block;
	text-decoration-line:underline;text-decoration-thickness:1px;text-underline-offset:3px;
	text-decoration-color:transparent;transition:text-decoration-color .2s;
}
.h17top .h17-pod-a:hover .h17-pod-h{text-decoration-color:rgba(255,255,255,.45)}
/* Рубрика «Медиа» над заголовком (02.10.2026) — как подпись «Сейчас в
   эфире», только голубая. Разрядка .06em, а не .12em: «История с Романом
   Гальпериным» так встаёт в одну строку при колонке 240px (239px против
   258). На 1920 колонка ~180px — длинная рубрика переносится на две строки,
   и скрипт полосы, чтобы удержать три анонса, снимает подписи у
   переключателя схем. */
.h17top .h17-pod-rub{
	display:block;margin-bottom:6px;
	font-size:11px;line-height:1.25;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
	color:#7CC0FF;text-wrap:balance;
}

/* Правый край — переключатель схем. margin-left:auto держит его у правой
   кромки и тогда, когда анонсов в ряду не осталось. */
.h17top .h17-live-end{display:flex;flex:0 0 auto;margin-left:auto}

/* Переключатель схем — общий компонент темы (.tvb-sw + .tvb-seg), но в
   полосе он прямоугольный, без скруглений, и подписи стоят по сторонам.
   Когда места мало, скрипт полосы снимает подписи (is-theme-compact) —
   остаётся один флажок. */
.h17top .h17-theme{display:flex;align-items:center;gap:10px}
.h17top .h17-live-in.is-theme-compact .h17-theme{gap:0}
.h17top .h17-live-in.is-theme-compact .h17-theme .tvb-seg{display:none}
.h17top .h17-theme .tvb-seg{
	padding:0;border:none;background:transparent;cursor:pointer;
	font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
	color:rgba(255,255,255,.42);transition:color .2s;white-space:nowrap;
}
html[data-theme="light"] .h17top .h17-theme .tvb-seg[data-set-theme="light"],
html[data-theme="dark"] .h17top .h17-theme .tvb-seg[data-set-theme="dark"]{color:#fff}
.h17top .h17-theme .tvb-sw{
	position:relative;width:40px;height:20px;flex:0 0 auto;padding:0;border:none;border-radius:0;
	background:rgba(255,255,255,.2);cursor:pointer;transition:background .25s;
}
html[data-theme="dark"] .h17top .h17-theme .tvb-sw{background:var(--blue)}
/* Флажок стоит у левого края дорожки в обеих схемах: в тёмной дорожку
   переворачивает на 180° общее правило из style.css, и флажок приходит к
   подписи «Тёмный». До 15.09.2026 в тёмной схеме ему ставился ещё и
   left у правого края — вместе с поворотом это возвращало его налево, к
   «Светлому», и в покое переключатель в обеих схемах выглядел одинаково. */
.h17top .h17-theme .tvb-sw i{
	position:absolute;top:3px;left:3px;width:14px;height:14px;border:none;border-radius:0;
	background:#fff;transform:none;
}

/* ─────────── 1а. Полоса эфира — второй вариант (основной с 11.09.2026) ───────────

   Класс h17-v2 на .h17-live стоит в inc/top.php всегда. Правила
   раздела 1 — общая основа, эти — поверх. Скоуп у них сильнее
   брейкпоинтов, поэтому меньшие экраны — отдельными правилами с тем же
   скоупом в конце файла («Полоса эфира на меньших экранах»).

   Высота 140px (--l17-h; 28.09.2026 было 160, до 11.09 — 180): кадр эфира
   во всю высоту за вычетом полей по 10px и нижней черты — 119px, в 16:9 это
   212px шириной. Ленты
   программы нет: в «Сейчас в эфире» текущая передача и её время. Анонсы
   подкастов идут сразу за этим блоком и прижаты влево (скрипт полосы их не
   центрирует); свободное место остаётся перед переключателем схем.

   Высота, поля, ширина кадра и просвет кадр — «Сейчас в эфире» заданы на
   <body class="h17top">, а не на самой полосе (01.10.2026): по ним же
   строится строка шапки — логотип по центру кадра, меню от вертикали
   «Сейчас в эфире» (раздел 7). Ступени по ширине — в конце файла. */
.h17top{
	--l17-h:140px;
	--l17-pad:10px;
	--l17-join:16px;
	--l17-frame-w:calc((var(--l17-h) - 1px - 2 * var(--l17-pad)) * 16 / 9);
}
.h17top .h17-v2 .h17-live-in{
	--l17-frame:var(--l17-frame-w);
	--l17-gap:clamp(36px,2.4vw,52px);
	padding-top:var(--l17-pad);padding-bottom:var(--l17-pad);
}
.h17top .h17-v2 .h17-live-in>*+*::before{height:88px}
.h17top .h17-v2 .h17-prog{height:3px}

/* Кадр эфира и «Сейчас в эфире» — один блок (11.09.2026): черты между ними
   нет, и текст стоит к кадру теснее, чем зоны полосы друг к другу, — на
   --l17-join, как заголовок анонса к своей обложке (16px), а не на
   --l17-gap. Зазор ряда общий, поэтому разница снимается отрицательным
   полем. Скрипт полосы меряет раскладку как есть: освободившееся место
   достаётся анонсам. Черта остаётся одна — между этим блоком и анонсами. */
.h17top .h17-v2 .h17-frame+.h17-now{margin-left:calc(var(--l17-join) - var(--l17-gap))}
.h17top .h17-v2 .h17-frame+.h17-now::before{content:none}

/* «Сейчас в эфире»: подпись и название открывают панель эфира (как прежде
   вся карточка), под ними время. Ширину по тексту ставит hugNow. */
.h17top .h17-v2 .h17-now{gap:12px;max-width:240px;cursor:auto}
.h17top .h17-now-main{
	display:flex;flex-direction:column;gap:8px;padding:0;border:none;background:transparent;
	font:inherit;color:inherit;text-align:left;cursor:pointer;
}
/* Название — 16px: 24px читалось слишком крупно рядом с кадром, 18px —
   тоже (11.09.2026). */
.h17top .h17-v2 .h17-now-lbl{gap:7px;font-size:11px}
.h17top .h17-v2 .h17-now-lbl::before{width:6px;height:6px}
.h17top .h17-v2 .h17-now-t{font-size:16px;line-height:1.25}
.h17top .h17-now-row{display:flex;align-items:center;gap:14px}
.h17top .h17-v2 .h17-now-time{font-size:13px}
/* Анонсы — три в ряд: обложка от 140px и не больше 0,9 кадра эфира (191px,
   107px в высоту) — эфир остаётся главным в полосе; заголовок 14px (15px
   читалось крупно, 11.09.2026). Сколько встаёт, решает скрипт полосы
   (MIN_CARD 290px). */
.h17top .h17-v2 .h17-pod{gap:28px}
.h17top .h17-v2 .h17-pod-a{gap:16px}
.h17top .h17-v2 .h17-pod-th{width:48%;min-width:140px;max-width:calc(var(--l17-frame) * .9)}
/* Подпись не шире 240px (~32 знака, 02.10.2026): на больших экранах
   заголовок расползался до 350px в две строки. Что заголовок не взял,
   скрипт полосы отдаёт обложкам до их потолка, остальное — поровну в
   промежутки (spreadPods). На 1920 подпись ~180px — предел не работает. */
.h17top .h17-v2 .h17-pod-t{font-size:14px;line-height:1.36;max-width:240px}

/* Переключатель схем — тоже крупнее; подписи 11px (было 12 — уменьшены
   вместе с заголовками полосы, 11.09.2026). */
.h17top .h17-v2 .h17-theme{gap:12px}
.h17top .h17-v2 .h17-theme .tvb-seg{font-size:11px}
.h17top .h17-v2 .h17-theme .tvb-sw{width:48px;height:24px}
.h17top .h17-v2 .h17-theme .tvb-sw i{top:4px;left:4px;width:16px;height:16px}

/* ─────────── 2. Шапка ─────────── */

/* Шапка не липкая — уезжает вверх вместе со страницей; когда она уходит
   за верх окна, её сменяет всплывающая шапка (.live-banner, style.css).

   Подложка темнее общей (--strip-bg — в светлой схеме белая). Под тёмной
   полосой эфира белая шапка сливалась с телом страницы, и меню на ней теряло
   опору. Тона свои, не из палитры: в светлой нужен шаг между белым телом и
   фоном страницы, в тёмной — между полосой эфира сверху и телом снизу, и ни
   одна переменная палитры в эти зазоры не попадает. Заданы они токенами
   верха (--h17-bg и соседи, раздел 0), а не правилами на html[data-theme=…]:
   такое правило включается мгновенно, и шапка щёлкала бы в новую схему, пока
   остальная страница плавно перетекает. Тем же тоном (--h17-bg) залит список
   «⋯» — он читается как продолжение шапки.

   z-index 202, как у общей .hdr в style.css: список «⋯» свисает из шапки
   на страницу — на «Главное» (подпись главного фото стоит в документе позже
   с z-index 1), и на ленту новостей справа (z-index 140). Оверлеи меню, эфира и
   поиска (255–500) выше. */
.h17top .hdr.h17{position:relative;top:auto;z-index:202;width:100%;background:var(--h17-bg)}

/* Всплывающая шапка — тем же тоном, что основная (28.09.2026, «фон у
   выпадающей шапки такой же, как у этой»). До этого её подложка была
   --strip-bg из style.css: в светлой схеме белая, в тёмной #0d2e47 —
   на шаг светлее основной. Черта снизу остаётся из style.css. */
.h17top .live-banner::before{background:var(--h17-bg)}

/* Шапка — одна строка на любой ширине: логотип у левой кромки, меню, у правой
   кромки лупа. Второго ряда больше нет: что не помещается, уходит в список
   «⋯» (разметка и скрипт — в inc/top.php). Соцсетей в строке нет — место
   отдано рубрикам; соцсети стоят в полосе эфира под переключателем схем
   (раздел 5).

   Все просветы строки — от одного шага --h17-step: между пунктами меню — шаг,
   вокруг волосяных черт — по шагу с каждой стороны, от логотипа до меню и от
   меню до лупы — два шага (column-gap сетки). Шаг растёт с экраном, но не
   дальше 22px: шире ряд рассыпается на отдельные слова.

   Высота постоянная, 74px, как на основном сайте. Поля строки — те же, что у
   полосы эфира (.h16-row в style.css): логотип начинается на вертикали кадра
   эфира, лупа кончается на вертикали переключателя схем. */
.h17top .h17-onerow{--h17-step:clamp(16px,1.1vw,22px)}
.h17top .h17-onerow .h16-row{
	grid-template-columns:auto minmax(0,1fr) auto;
	gap:0 calc(var(--h17-step) * 2);
	height:74px;padding-top:0;padding-bottom:0;
}
.h17top .h17-onerow .h16-logo{justify-self:start}
/* Правая группа — всегда в третьей колонке. Ниже 480px ряда меню нет, и
   сама по себе группа вставала во вторую, тянущуюся колонку: за ней
   оставался зазор колонок перед пустой третьей, и бургер не доходил до
   правого поля на 16px — не стоял на вертикали края полосы эфира.
   Зазор лупа — бургер 26px на всех ширинах (02.10.2026, «сделай отступ
   немного больше»): был шаг строки, 16–22px, — с бургером на десктопе пара
   смотрелась слипшейся. 26px — тот же, что был на телефоне. */
.h17top .h17-onerow .h16-right{grid-column:3;justify-self:end;gap:26px;margin:0}
/* Оптический сдвиг иконок из style.css рассчитан на бургер у левой кромки и
   лупу у правой; здесь у правого края стоят обе кнопки, и сдвиг только
   растащил бы их по-разному. */
.h17top .h17-onerow .h16-right>.ibtn svg{transform:none}
.h17top .h17-onerow .h16-logo .logo svg{height:30px}
/* Лупе в общей теме задан отрицательный левый отступ — им она подтягивалась к
   краю рядом с соцсетями основной шапки. Здесь он съедал бы зазор до меню. */
.h17top .h17-onerow .h16-right .hdr-search-btn{margin-left:0}
/* Иконки лупы и бургера приведены к одной ширине — в общей теме бургер шире
   лупы на четыре пикселя, и в паре у кромки это было заметно. */
.h17top .h17-onerow .hdr-search-btn svg{width:17px;height:17px}
.h17top .h17-onerow .hdr-burger svg{width:18px;height:14px}
/* Кнопки идут без собственных полей: у общей .ibtn квадрат 32px вокруг
   рисунка, и зазоры строки отсчитывались бы от рамки, а не от рисунка — от
   меню до лупы и от лупы до бургера выходило бы больше, чем задано.
   Теперь границей элемента служит сам рисунок, и шаг ряда виден как есть.
   Область нажатия при этом не сжимается: её держит невидимая рамка
   псевдоэлемента, на раскладку он не влияет. */
.h17top .h17-onerow .h16-right>.ibtn{
	position:relative;width:auto;height:auto;min-width:0;min-height:0;padding:0;
}
.h17top .h17-onerow .h16-right>.ibtn::after{content:"";position:absolute;inset:-8px}
/* Бургеру в общей теме заданы ширина, сдвиг и position:static по id
   (#menuOpenBtn — там он стоит у левой кромки и подтягивается влево), а id
   сильнее любого класса. Здесь кнопка живёт у правой кромки в ряду с лупой,
   поэтому значения снимаются: иначе она занимала бы 32px вместо своих 18 и
   уезжала влево, а её невидимая рамка нажатия (::after) отсчитывалась бы не
   от кнопки, а от всей шапки — растягивалась на её ширину, перехватывала
   клики по логотипу и лупе и выпирала за край экрана. */
.h17top .h17-onerow .h16-right>#menuOpenBtn{position:relative;width:auto;left:auto}

/* Меню — один ряд из трёх групп: НОВОСТИ/МЕДИА, за волосяной чертой проектные
   разделы, за второй чертой рубрики новостей. Выключка по левому краю, общий
   шаг; распределение по всей ширине давало слишком большие просветы, поэтому
   остаток места уходит в просвет перед лупой.

   Кегли постоянные: НОВОСТИ/МЕДИА — 15px, остальное — 12px. Прежде они
   плавали вместе с экраном (10.4–19px), чтобы ряд влезал в строку; теперь
   лишнее уходит в «⋯», и кегль держится одним на всех ширинах.

   Ряд растянут на всю высоту строки (align-self:stretch): высота у него
   постоянная, и появление кнопки «⋯» её не трогает. overflow:hidden —
   страховка на случай, если скрипт не отработал: ряд обрезается по своей
   ячейке и не наезжает на лупу. Пункты не сжимаются (flex:none), поэтому
   непоместившийся пункт уходит целиком, а не мнётся. */
.h17top .h17-nav{
	display:flex;align-items:center;align-self:stretch;gap:var(--h17-step);
	min-width:0;overflow:hidden;
}
.h17top .h17-nav>*{flex:none}
/* hidden слабее собственного display пунктов — скрытие задано явно. */
.h17top .h17-nav [hidden]{display:none}
.h17top .h17-nav-a{
	display:block;padding:6px 0;white-space:nowrap;text-decoration:none;text-transform:uppercase;
	font-weight:var(--w-semibold);transition:color .2s,opacity .2s;
}
/* Проектные разделы — тем же цветом, что НОВОСТИ и МЕДИА: они продолжают ту
   же навигацию, а не открывают ряд рубрик. Цвет — --h17-link: в тёмной
   схеме белый, в светлой синий. Отклик этих пунктов — прозрачность, серых
   рубрик — синий цвет. */
.h17top .h17-nav-big{font-size:15px;letter-spacing:.07em;color:var(--h17-link)}
.h17top .h17-nav-lead,
.h17top .h17-nav-cat{font-size:12px;letter-spacing:.04em}
.h17top .h17-nav-lead{color:var(--h17-link)}
.h17top .h17-nav-cat{color:var(--txt2)}
.h17top .h17-nav-big:hover,
.h17top .h17-nav-lead:hover{opacity:.72}
.h17top .h17-nav-cat:hover{color:var(--blue)}
/* Обводку фокуса срезал бы overflow ряда — вместо неё подчёркивание. */
.h17top .h17-nav-a:focus-visible{outline:none;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.h17top .h17-nav-sep{width:1px;height:16px;background:var(--h17-rule)}

/* Кнопка «⋯» — за последним видимым пунктом. Рамка шире рисунка (под палец и
   кружок подсветки), и её левое поле прибавлялось бы к шагу ряда; кнопка
   сдвинута на это поле, поэтому точки стоят ровно через шаг от пункта. */
.h17top .h17-more{
	display:grid;place-items:center;width:30px;height:30px;margin-left:-6px;padding:0;
	border:0;border-radius:50%;background:transparent;color:var(--txt2);cursor:pointer;
	transition:color .2s,background .2s;
}
.h17top .h17-more svg{width:18px;height:4px}
.h17top .h17-more:hover,
.h17top .h17-more[aria-expanded="true"]{color:var(--blue)}
.h17top .h17-more[aria-expanded="true"]{background:rgba(0,119,255,.1)}
.h17top .h17-more:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}

/* Список скрытых пунктов свисает из шапки под кнопкой «⋯»; левый край текста
   встаёт на вертикаль точек (left считает скрипт). Порядок тот же, что в
   ряду; проектные разделы отбиты от рубрик чертой и того же цвета, что в
   ряду (--h17-link). */
.h17top .h17-more-panel{
	position:absolute;top:100%;left:0;z-index:2;min-width:230px;padding:10px 0;
	background:var(--h17-bg);border:1px solid var(--h17-pop-line);box-shadow:0 18px 40px var(--h17-pop-shd);
}
.h17top .h17-more-panel[hidden]{display:none}
.h17top .h17-more-a{
	display:block;padding:9px 24px;white-space:nowrap;text-decoration:none;text-transform:uppercase;
	font-size:12px;font-weight:var(--w-semibold);letter-spacing:.04em;color:var(--txt2);
	transition:color .2s,background .2s;
}
.h17top .h17-more-lead{color:var(--h17-link)}
.h17top .h17-more-a:hover,
.h17top .h17-more-a:focus-visible{color:var(--blue);background:rgba(0,119,255,.08);outline:none}
.h17top .h17-more-sep{display:block;height:1px;margin:8px 24px;background:var(--h17-pop-line)}

/* ─────────── 4. Брейкпоинты верха ─────────── */

/* Бургер — на всех ширинах, справа от лупы, в самом углу строки (с
   02.10.2026: «добавь бургер по умолчанию справа от лупы на всех
   разрешениях»). До этого на десктопе его не было: меню повторяло строку
   шапки, а скрытые пункты открывала «⋯» — она в строке и остаётся. Место
   под бургер скрипт подгонки меню учитывает сам: он меряет ряд по его
   правому краю, и что не помещается, уходит в «⋯». Лупа теперь кончается не
   на вертикали переключателя схем, а за шаг до бургера. */
/* До 900px — мобильная ширина (планшет вертикально и телефон): все разделы,
   вместе с соцсетями, — в меню бургера. В строке остаются
   только НОВОСТИ и МЕДИА: проектные разделы, рубрики и «⋯» убираются — «⋯»
   рядом с бургером был бы вторым меню. Скрипт подгонки при этом ничего не
   прячет: убранные пункты не имеют ширины, и ряд не переполняется.
   Строка ниже и логотип мельче, как на основном сайте. Области нажатия лупы и
   бургера — около 44px (рамка псевдоэлемента), и зазор между кнопками 26px
   (общий, выше) их как раз разводит. */
@media(max-width:900px){
	.h17top .h17-onerow .h16-row{height:62px}
	.h17top .h17-nav [data-fold],
	.h17top .h17-nav-sep,
	.h17top .h17-more,
	.h17top .h17-more-panel{display:none}
	.h17top .h17-onerow .h16-logo .logo svg{height:26px}
	.h17top .h17-onerow .h16-right>.ibtn::after{inset:-13px}
}
/* До 480px ряда меню нет вовсе: НОВОСТЯМ и МЕДИА (163px) нужно от 467px окна
   вместе с логотипом, лупой, бургером и зазорами, на телефоне (375–430) между
   логотипом и лупой свободно 100–150px. Зазор колонок — 16px, как у полей. */
@media(max-width:479px){
	.h17top .h17-onerow .h16-row{column-gap:16px}
	.h17top .h17-nav{display:none}
}
/* Кадр эфира ниже 1500px — 200px: на ноутбуке 220px отнимали у анонсов место
   под целую строку заголовка. Остальное сжатие полосы — за её скриптом. */
@media(max-width:1500px){
	.h17top .h17-live-in{--l17-frame:200px}
}
/* Мобильная ширина: кадр меньше, зазоры уже, переключатель схем уходит из
   полосы в бургер-меню (с 02.10.2026 бургер в шапке на всех ширинах). */
@media(max-width:900px){
	.h17top .h17-live-in{--l17-frame:150px;--l17-gap:20px;padding-top:12px;padding-bottom:12px}
	.h17top .h17-live-end{display:none}
}
/* Переключатель схем в бургер-меню с 19.09.2026 — в шапке панели, перед
   лупой (style.css, v19.25); прежнее правило для него под крупными
   разделами снято. */
@media(max-width:640px){
	/* На телефоне в полосе остаются кадр и «Сейчас в эфире» — анонсам места
	   нет, скрипт полосы снимает их сам. Кадр сжимается, волосяные
	   разделители снимаются — при зазоре 14px они только сорят. */
	.h17top .h17-live-in{--l17-frame:118px;--l17-gap:14px}
	.h17top .h17-live-in>*+*::before{display:none}
	.h17top .h17-now-t{font-size:13px}
	.h17top .h17-now-time{font-size:10.5px}
}

/* Полоса эфира на меньших экранах (вариант h17-v2). Лестница та же, что у
   прежней полосы — кадр 220 → 150 → 118px, — но высота задаётся одной
   --l17-h, а кадр считается из неё: 140px (кадр 212) → до 1500px 126px
   (187) → до 900px 110px (151) → до 640px 92px (119). До 28.09.2026
   верхние две ступени были 160 и 144: полосу сняли на 20px, ступень до
   1500px сжата в той же пропорции (0,9), иначе на ноутбуке полоса
   выходила бы выше, чем на большом экране. Сколько анонсов
   встаёт и остаются ли подписи у переключателя, решает скрипт полосы; до
   900px переключатель уходит в бургер-меню (правило выше). Скоуп .h17-v2 —
   иначе раздел 1а перебивал бы эти правила.

   Подписи полосы (LIVE, «Сейчас в эфире», время) — 11px на всех ширинах: мельче на главной ничего нет
   (лестница кеглей — блок v19.6 в style.css, 11.09.2026). До этого на
   телефоне они падали до 9px. */
@media(max-width:1500px){
	.h17top{--l17-h:126px}
	.h17top .h17-v2 .h17-live-in>*+*::before{height:76px}
	.h17top .h17-v2 .h17-now-t{font-size:15px}
	.h17top .h17-v2 .h17-pod-t{font-size:13.5px}
}
@media(max-width:900px){
	.h17top{--l17-h:110px;--l17-pad:12px;--l17-join:12px}
	.h17top .h17-v2 .h17-live-in{--l17-gap:20px}
	.h17top .h17-v2 .h17-live-in>*+*::before{height:64px}
	.h17top .h17-v2 .h17-now{gap:10px}
	.h17top .h17-v2 .h17-now-t{font-size:14px}
	.h17top .h17-v2 .h17-now-time{font-size:12px}
}
/* На телефоне в полосе кадр и «Сейчас в эфире». */
@media(max-width:640px){
	.h17top{--l17-h:92px}
	.h17top .h17-v2 .h17-live-in{--l17-gap:14px;position:relative}
	.h17top .h17-v2 .h17-now{gap:6px;position:static}
	.h17top .h17-v2 .h17-now-main{gap:4px}
	.h17top .h17-v2 .h17-now-lbl{gap:5px;font-size:11px}
	.h17top .h17-v2 .h17-now-lbl::before{width:5px;height:5px}
	.h17top .h17-v2 .h17-now-t{font-size:13px}
	.h17top .h17-v2 .h17-now-time{font-size:11px}
	.h17top .h17-v2 .h17-now-row{gap:10px}
}

/* ─────────── 5. Соцсети в полосе эфира ─────────── */

/* Соцсети — в правой зоне полосы, под переключателем схем (с 11.09.2026).
   В строке шапки им места нет: там оно отдано рубрикам, и ряд значков
   отправил бы в «⋯» ещё три рубрики на 1920 и все — на 1440. В правой зоне
   полосы место есть: переключатель с подписями сам занимает 201px в ширину
   и 24px из 160 в высоту, и ряд встаёт под него, не раздвигая зону.

   Значки — те же, что стояли в полосе до 10.09.2026 (по просьбе
   пользователя: «в прошлом варианте иконки выглядели аккуратнее»):
   светлый кружок 19px (с 16.10.2026 — 18px, см. ниже), знак вырезан
   цветом полосы (--h17-strip — в тёмной схеме полоса темнее, и вырез
   идёт вслед за ней), при наведении значок
   чуть приподнимается. Восемь значков вместе с «Яндекс Музыкой»:
   8 × 19 + 7 × 7 = 201px. Переключатель с подписями 11px уже — 190px, и
   его левый край стоял на 11px правее ряда значков. С 15.09.2026 ряд
   переключателя тянется на ширину зоны, подписи встают по её краям, а
   флажок — посередине между ними (зазоры ~17px вместо 12).

   С 16.10.2026 значков девять (добавился VIDEOBEL). При 19px и шаге 7px
   ряд вырос бы до 227px и забрал бы у анонсов 25px, поэтому кружок стал
   18px, шаг — 5px: 9 × 18 + 8 × 5 = 202px, зона прежней ширины.

   Когда скрипт полосы подписи снимает (is-theme-compact), зона сужается до
   флажка, и ряд переносится на два: 5 + 4, 110px. Одним рядом он в этой
   ширине отнимал бы место у анонсов. До 900px правой зоны нет вовсе
   (правило в разделе 4): соцсети там — в подвале бургер-меню. */
.h17top .h17-live-end{flex-direction:column;align-items:flex-end;justify-content:center;gap:16px}
.h17top .h17-live-in:not(.is-theme-compact) .h17-live-end .h17-theme{align-self:stretch;justify-content:space-between}
.h17top .h17-soc{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:5px;max-width:203px}
.h17top .h17-live-in.is-theme-compact .h17-soc{max-width:111px}
.h17top .h17-soc .soc-a{
	--soc:#98A6B3;
	--soc-disc:#98A6B3;
	--soc-ink:var(--h17-strip);
	--soc-plate:currentColor;
	display:grid;place-items:center;
	width:18px;height:18px;border:0;border-radius:50%;background:none;
	color:var(--soc);
	transition:opacity .2s,transform .2s;
}
.h17top .h17-soc .soc-a svg{width:100%;height:100%}
/* У «Яндекс Музыки» диск рисуется отдельной переменной, а искра берёт
   currentColor — ей нужен цвет полосы, иначе знак сливается с плашкой. */
.h17top .h17-soc .soc-yandex-music{color:var(--h17-strip)}
.h17top .h17-soc .soc-a:hover{opacity:.82;transform:translateY(-1px)}
.h17top .h17-soc .soc-a:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ─────────── 6. Страницы основного сайта ─────────── */

/* Полоса прогресса чтения статьи, липкий ряд «Поделиться» и отступ, с
   которым секции главной встают под якорь, считаются от высоты всплывающей
   шапки (--sticky-h, style.css). С 11 по 18.09.2026, пока шапки не было, их
   здесь переставляли на кромку окна; с её возвращением правила сняты. */

/* Левая колонка программы на главной /redesign/ (.tv-vrail) — без кадра
   эфира: он в полосе над шапкой.

   Ниже 1180px колонка ложилась строкой «кадр + текущая передача» между
   шапкой и контентом. Без кадра она повторяла бы полосу прямо над собой,
   поэтому на узких экранах колонки нет. */
@media(max-width:1179px){
	.h17top .tv-vrail{display:none}
}

/* ─────────── 7. Поля строки шапки — поля полосы эфира ─────────── */

/* 28.09.2026 строка стояла в рамке колонок («сделай шапку в рамках правой и
   левой колонки…»): логотип по левому краю «Главного», лупа по правому краю
   ленты «Новости». В рамку (1255px на 1920) строка целиком не помещалась —
   за синими разделами оставались «Союзное государство» и «⋯».

   30.09.2026 после макетов (две строки, логотип по центру — отвергнуты;
   выбрано «выровняй всё по левому краю: слева направо логотип, потом
   рубрики, лупа привязана к правому краю») поля строки снова те же, что у
   полосы эфира (.h16-row в style.css, раздел 3): концы скобки логотипа — на
   вертикали кадра эфира, лупа кончается на вертикали переключателя схем.
   Просвет логотип — меню и меню — лупа — два шага (раздел 3). На 1920
   помещается вся строка; уже — лишнее уходит в «⋯» (1440: Экономика,
   Происшествия, В мире; 1180: все рубрики новостей).

   Шапка на всех страницах одна и та же, от сетки страницы не зависит.

   01.10.2026 строка сведена с полосой эфира над ней («лого посередине
   плеера — рубрики начинаются от линии с названием текущей программы
   эфира»). Первая колонка сетки — ширина кадра эфира (--l17-frame-w, раздел
   1а), логотип стоит по её центру; меню отступает от неё на тот же просвет,
   что «Сейчас в эфире» от кадра (--l17-join), и НОВОСТИ начинаются на
   вертикали названия передачи. Поля строки и полосы равны на любой ширине,
   а ширину кадра и просвет обе берут из одних переменных — сведение держится
   на всех ступенях полосы. Прежний сдвиг логотипа на 4,5px (концы скобки на
   краю кадра) снят: по центру скобки симметричны.

   Колонки идут без зазора сетки (он был бы и между логотипом и меню):
   просвет меню — лупа, прежние два шага, задан полем правой группы.

   До 640px не сводим: кадр там 119px, а логотип 148px — он вылез бы за кадр
   в поле окна. Там прежняя раскладка — логотип у левой кромки. */
@media(min-width:1180px){
	.h17top .h17-onerow .h16-row{padding-left:clamp(20px,1.6vw,32px);padding-right:clamp(20px,1.6vw,32px)}
}
@media(min-width:641px){
	.h17top .h17-onerow .h16-row{grid-template-columns:var(--l17-frame-w) minmax(0,1fr) auto;column-gap:0}
	.h17top .h17-onerow .h16-logo{justify-self:center}
	/* Ширина логотипа — по рисунку, а не атрибут width="170": до 900px он
	   26px высотой и 148px шириной, и коробка 170px шире кадра (151px). */
	.h17top .h17-onerow .h16-logo .logo svg{width:auto}
	.h17top .h17-onerow .h17-nav{margin-left:var(--l17-join)}
	.h17top .h17-onerow .h16-right{margin-left:calc(var(--h17-step) * 2)}
}