/*
 * COMMENT: sat.css — стили сателлитов (сеть sat1)
 * Отдаётся как /_s/sat.css?v={version} (immutable); sat-go вычисляет версию по CSS и JS.
 * Подключается неблокирующе (media=print → all). Блок crit:start … crit:end — критический CSS (≤ 8 КБ):
 * sat-go вырезает его по маркерам и вставляет в <head> без комментариев и пустых строк. Внутри — только
 * первый экран и подвал, который на коротких страницах прижат к низу окна. Блок critv:start … critv:end —
 * добавка страницы видео (≤ 3 КБ): мета под заголовком и раскладка оверлея следующего ролика.
 * Блок crita:start … crita:end резервирует места под рекламу в полном CSS; шаблоны sat-go его не встраивают.
 * Остальное (анимация отсчёта, пагинация, фокус) — ниже маркеров.
 * Контракт разметки — шаблоны etc/sat/go/internal/site/tpl/.
 *
 * Темы: :root[data-theme=light|dark|purple] — переменные --bg --surface --s2 --text --text-2 --border --accent
 * --on (текст на акценте); палитры cfg.palette: html[data-p="0..7"] — акцент, радиус --radius и плотность --gap
 * (тема purple всегда держит свой акцент #9b5cff: её селектор специфичнее палитры).
 * Кадрирование: cfg.style (SatBuild) задаёт :root{--ar;--pt} и .d{idx}{--dw;--dh;--dx;--dy}; здесь — только их
 * применение (aspect-ratio с запасом padding-top через @supports not), обфускации .o0–.o3, .um, .fr и
 * .ff (запасной источник картинки, ставит SatApp.cards.fallback: обычный кадр по cover).
 *
 * Каркас страницы sat-go:
 *   header.hd.hd-full > .w.hd-w > a.hd-l + form.hd-s (поиск) + button.hd-mb (меню) + nav.hd-n (ссылки, тема);
 *   .hd-full включает мобильное меню; без этой метки навигация остаётся видимой;
 *   nav.chips[.top] — лента ниш (.top — верхняя, липкая под шапкой на всех страницах и во всю ширину окна);
 *   main.w.m — содержимое;
 *   .ph > h1 (+ p) — заголовок страницы ниши/категорий; .vi > h1 + .vi-m — заголовок и мета видео;
 *   .sat-ov > p.sat-ov-m (span[data-r=geo|timeout|err|end] — тексты причин, видна только текущая)
 *            + a.sat-ov-n (img + span.sat-ov-t + span.sat-ov-c — счётчик) + button.sat-ov-x;
 *   .lg — юридический текст; .nf — сообщение 404/410; footer.ft > .w (nav ссылок + p).
 */
/*crit:start*/
/* темы: тёмная по умолчанию, светлая, фиолетовая */
:root{--bg:#0e0f12;--surface:#17191e;--s2:#22252c;--text:#eef0f3;--text-2:#9ba2ae;--border:#272b33;--accent:#e11d5c;--on:#fff;--radius:10px;--gap:10px;--gut:10px;--hd:48px;--font:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans Devanagari",sans-serif;color-scheme:dark}
:root[data-theme=light]{--bg:#f6f7f9;--surface:#fff;--s2:#e9ebef;--text:#111;--text-2:#5b626e;--border:#dfe2e8;color-scheme:light}
:root[data-theme=purple]{--bg:#0e0f12;--surface:#17191e;--s2:#231e30;--text:#eef0f3;--text-2:#a69fb8;--border:#2c2639;--accent:#9b5cff;--on:#fff}
/* палитры cfg.palette: акцент, радиус, плотность */
html[data-p="1"]{--accent:#ff9f0a;--on:#141007;--radius:6px;--gap:8px}
html[data-p="2"]{--accent:#1f6fe5;--radius:12px;--gap:12px}
html[data-p="3"]{--accent:#7c4dff;--radius:14px;--gap:12px}
html[data-p="4"]{--accent:#12b886;--on:#03140e;--radius:8px}
html[data-p="5"]{--accent:#d9411e;--radius:4px;--gap:6px}
html[data-p="6"]{--accent:#f5b700;--on:#1a1300}
html[data-p="7"]{--accent:#c026d3;--radius:16px;--gap:14px}
/* база */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--text);font:14px/1.45 var(--font);-webkit-tap-highlight-color:transparent}
a{color:inherit;text-decoration:none}
img{display:block;border:0}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
.w{max-width:1440px;margin:0 auto;padding:0 var(--gut)}
/* шапка 48 px, липкая */
.hd{position:sticky;top:0;z-index:20;height:var(--hd);background:var(--bg);border-bottom:1px solid var(--border)}
.hd-w{display:flex;align-items:center;height:100%}
.hd-l{display:flex;align-items:center;min-width:0;font-size:18px;font-weight:800;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hd-l img{flex:none;width:26px;height:26px;margin-right:8px;border-radius:7px}
.hd-s{position:relative;display:flex;flex:1;min-width:0;max-width:380px;height:34px;margin:0 10px 0 auto}
.hd-q{width:100%;min-width:0;padding:6px 35px 6px 10px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;font-size:16px}
.hd-sb,.hd-mb{display:flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;padding:0;border:0;background:none;cursor:pointer}
.hd-sb{position:absolute;right:0;top:0}
.hd-sb::before{content:"";width:12px;height:12px;margin:-3px 3px 0 0;border:2px solid currentColor;border-radius:50%}
.hd-sb::after{content:"";position:absolute;right:8px;bottom:8px;width:7px;height:2px;background:currentColor;transform:rotate(45deg)}
.hd-mb{display:none}
.hd-mb::before{content:"☰";font-size:23px}
.hd-n{display:flex;align-items:center;flex:none;margin-left:auto}
.hd-n a{padding:7px 10px;border-radius:999px;color:var(--text-2);font-size:13px;font-weight:650}
.hd-n a[aria-current]{color:var(--text)}
.hd-t{display:flex;align-items:center;justify-content:center;width:40px;height:40px;margin-left:2px;padding:0;border:0;border-radius:50%;background:none;cursor:pointer}
.hd-t::before{content:"";width:18px;height:18px;border:2px solid currentColor;border-radius:50%;background:linear-gradient(90deg,currentColor 50%,transparent 0)}
@media(max-width:1023px){.hd-full .hd-l{max-width:30%;font-size:15px;margin-right:8px}.hd-full .hd-l img{width:22px;height:22px;margin-right:5px}.hd-s{max-width:none;margin-left:0}.hd-mb{display:flex}.hd-full .hd-n{display:none;position:absolute;top:var(--hd);right:var(--gut);flex-wrap:wrap;max-width:calc(100% - 2*var(--gut));padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:0 6px 20px #0004}.hd-full .hd-n.open{display:flex}}
/* лента ниш со scroll-snap; верхняя — липкая под шапкой (не уезжает под неё), фон и линия во всю ширину окна */
.chips{display:flex;max-width:1440px;margin:0 auto;padding:8px var(--gut);overflow-x:auto;scroll-snap-type:x proximity;scroll-padding:0 var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chips::-webkit-scrollbar{display:none}
.w .chips{margin:0 calc(-1*var(--gut))}
.chip{flex:none;margin-right:6px;padding:7px 13px;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-size:13px;font-weight:650;line-height:1.2;white-space:nowrap;scroll-snap-align:start}
.chip.on{background:var(--accent);border-color:var(--accent);color:var(--on)}
.chips.top{position:sticky;top:var(--hd);z-index:15;max-width:none;padding-left:max(var(--gut),calc(50% - 720px + var(--gut)));padding-right:max(var(--gut),calc(50% - 720px + var(--gut)));background:var(--bg);border-bottom:1px solid var(--border)}
.hd:has(+.chips.top){border-bottom-color:transparent}
/* секции, заголовки страниц */
.s{margin:14px 0 26px}
.s-h{margin:0 0 10px;font-size:17px;font-weight:750;line-height:1.25;letter-spacing:-.01em}
.s~.s~.s{content-visibility:auto;contain-intrinsic-size:auto 900px}
.ph{padding:14px 0 2px}
.ph h1,.vi h1{margin:0;font-size:21px;font-weight:800;line-height:1.2;letter-spacing:-.015em}
.ph p{margin:4px 0 0;color:var(--text-2);font-size:13px}
.bc{padding-top:12px;color:var(--text-2);font-size:12px;overflow-wrap:anywhere}
/* сетка 2/3/4/5/6 колонок */
.g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px var(--gap)}
@media(min-width:640px){:root{--gut:16px}.g{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:1024px){:root{--gut:24px}.g{grid-template-columns:repeat(4,minmax(0,1fr))}.c-n{font-size:14px}}
@media(min-width:1400px){.g{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(min-width:1600px){.g{grid-template-columns:repeat(6,minmax(0,1fr))}}
/* карточка: кадр донора по cover из .d{idx}, длительность, заголовок в 2 строки */
.c{display:block;min-width:0}
.c-i{position:relative;display:block}
.c-b{position:relative;display:block;overflow:hidden;aspect-ratio:var(--ar,16/9);border-radius:var(--radius);background:var(--s2)}
@supports not (aspect-ratio:1/1){.c-b{height:0;padding-top:var(--pt,56.25%)}}
.c-b img{position:absolute;left:var(--dx,0);top:var(--dy,0);width:var(--dw,100%);height:var(--dh,100%);max-width:none}
.o1 img{transform:rotate(180deg)}
.o2 img{width:calc(var(--dw,100%)*2)}
.o3 img{height:calc(var(--dh,100%)*2)}
.um{transform:scaleX(-1)}
.fr{background:var(--surface)}
.fr img,.ff img{left:0;top:0;width:100%;height:100%;object-fit:contain;transform:none}
.ff img{object-fit:cover}
.c-t{position:absolute;right:6px;bottom:6px;padding:2px 5px;border-radius:5px;background:rgba(0,0,0,.74);color:#fff;font-size:11px;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums;pointer-events:none}
.c-n{display:-webkit-box;height:2.7em;margin-top:6px;overflow:hidden;font-size:13px;line-height:1.35;word-break:break-word;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* При явном классе ng внешние карточки скрыты; обычный каркас sat-go этот класс не ставит. */
html.ng .c[data-x=e]{display:none}
/* плеер: место под 16:9 до загрузки (без сдвига); до 768 px во всю ширину экрана, шире — не выше 70vh (заголовок над сгибом) */
.sat-pl{position:relative;margin:0 calc(-1*var(--gut));overflow:hidden;aspect-ratio:16/9;background:#000}
@supports not (aspect-ratio:1/1){.sat-pl{height:0;padding-top:56.25%}}
.sat-pl video,.sat-pl iframe,.sat-po{position:absolute;left:0;top:0;width:100%;height:100%;border:0;background:#000;object-fit:contain}
.vi{padding:12px 0 2px}
.vi h1{font-size:18px;font-weight:750;line-height:1.3}
@media(min-width:768px){.sat-pl{margin:14px auto 0;border-radius:var(--radius)}.sat-pl,.vi{max-width:calc(70vh*16/9)}.vi{margin:0 auto}.vi h1{font-size:21px}}
/* все категории: имя ниши в одну строку, плашка — «{n} videos» (пустая скрыта) */
.s[data-blk=cat] .c-n{height:auto;font-size:14px;font-weight:700;-webkit-line-clamp:1}
.c-t:empty{display:none}
/* подвал: sticky top:100vh — на короткой странице у низа окна (предел — body min-height:100vh), на длинной в потоке */
.ft{position:sticky;top:100vh;margin-top:36px;padding:20px 0 28px;padding-bottom:calc(28px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--border);color:var(--text-2);font-size:12.5px;line-height:1.5}
.ft nav a{display:inline-block;margin:0 18px 6px 0;color:var(--text);font-weight:650}
.ft p{max-width:80ch;margin:8px 0 0}
/*crit:end*/
/*critv:start*/
/* страница видео: мета под заголовком (длительность, ниши, каналы) */
.vi-d{margin:8px 0;color:var(--text-2);line-height:1.55;overflow-wrap:anywhere}
.vi-m{display:flex;flex-wrap:wrap;align-items:center;margin-top:8px;color:var(--text-2);font-size:13px;font-variant-numeric:tabular-nums}
.vi-m>*{margin:0 10px 6px 0}
.vi-m .chip{margin:0 6px 6px 0;padding:5px 11px;color:var(--text)}
/* оверлей «следующее»: geo / timeout / err / end; текст причины — span[data-r] текущей причины, счётчик — при run */
.sat-ov{position:absolute;left:0;top:0;right:0;bottom:0;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:10px 14px;background:rgba(9,10,13,.9);color:#fff;text-align:center}
.sat-ov-m{max-width:40ch;margin:0 0 8px;font-size:14px;font-weight:700;line-height:1.35}
.sat-ov-m>[data-r]{display:none}
.sat-ov[data-r=geo] .sat-ov-m>[data-r=geo],.sat-ov[data-r=timeout] .sat-ov-m>[data-r=timeout],.sat-ov[data-r=err] .sat-ov-m>[data-r=err],.sat-ov[data-r=end] .sat-ov-m>[data-r=end]{display:inline}
.sat-ov-n{position:relative;display:flex;align-items:center;width:100%;max-width:440px;padding:6px;overflow:hidden;border-radius:calc(var(--radius) + 2px);background:rgba(255,255,255,.1);text-align:left}
.sat-ov-n img{flex:none;width:120px;height:68px;margin-right:10px;border-radius:var(--radius);background:#222;object-fit:cover}
.sat-ov-t{display:-webkit-box;flex:1;min-width:0;overflow:hidden;font-size:13px;font-weight:650;line-height:1.35;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.sat-ov-c{position:absolute;left:12px;top:12px;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background:var(--accent);color:var(--on);font-size:12px;font-weight:800;line-height:24px;text-align:center;font-variant-numeric:tabular-nums}
.sat-ov:not(.run) .sat-ov-c{display:none}
.sat-ov-x{margin-top:8px;padding:6px 16px;border:1px solid rgba(255,255,255,.32);border-radius:999px;background:none;color:#fff;font-size:13px;font-weight:650;cursor:pointer}
@media(min-width:640px){.sat-ov-m{margin-bottom:14px;font-size:16px}.sat-ov-n{padding:8px}.sat-ov-n img{width:168px;height:94px;margin-right:12px}.sat-ov-t{font-size:15px}.sat-ov-x{margin-top:14px}}
/*critv:end*/

/*crita:start*/
/* места под рекламу: высота резервируется только при html.ads-on (cfg.ads.enabled); слоты сетки (grid-8, grid-20,
   rel-6) — во всю строку, а dense добирает карточками следующих строк ячейки перед слотом, если номер слота не кратен
   числу колонок (2–6): слот встаёт на ближайшую границу строки, дыр в сетке нет */
html.ads-on .sat-ad[hidden]{display:block!important}
html.ads-on .sat-ad{max-width:728px;min-height:100px;margin:12px auto}
html.ads-on .g{grid-auto-flow:row dense}
html.ads-on .sat-ad[data-slot=grid-8],html.ads-on .sat-ad[data-slot=grid-20],html.ads-on .sat-ad[data-slot=rel-6]{grid-column:1/-1;width:100%;min-height:250px;margin:0 auto}
html.ads-on .sat-ad[data-slot=footer]{min-height:250px}
html.ads-on .sat-ad[data-slot=sticky-bottom]{position:fixed;left:0;right:0;bottom:0;z-index:30;max-width:none;min-height:50px;margin:0;background:var(--surface)}
html.ads-on .ft{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
/*crita:end*/

/*
 * Некритическая часть: состояния ссылок и фокус, анимация отсчёта оверлея, догрузка лент, пагинация,
 * юридические страницы и 404, уменьшенное движение.
 */

/* наведение (только устройства с курсором) и видимый фокус клавиатуры (у карточки — внутрь: content-visibility режет края) */
@media(hover:hover){
	.hd-n a:hover,.chip:hover{color:var(--text)}
	.chip.on:hover{color:var(--on)}
	.c:hover .c-n{color:var(--accent)}
	.c:hover .c-b img{filter:brightness(1.06)}
	.hd-t:hover{background:var(--s2)}
}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.c:focus-visible{outline-width:3px;outline-offset:-3px;border-radius:var(--radius)}
.hd-l:focus-visible{border-radius:6px}
:root[data-theme=purple] .hd-t{color:var(--accent)}

/* поиск, буквенный указатель и связи: не меняют геометрию первого экрана до взаимодействия */
.hd-ac{position:absolute;left:0;right:0;top:calc(100% + 5px);z-index:25;max-height:60vh;overflow-y:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:0 6px 20px #0004}
.hd-ac a{display:block;padding:9px 12px;overflow-wrap:anywhere}
.hd-ac a:hover,.hd-ac a[aria-selected=true]{background:var(--s2);color:var(--accent)}
.az-i{display:flex;flex-wrap:wrap;gap:5px;margin:16px 0}
.az-i a{min-width:32px;padding:5px 8px;border:1px solid var(--border);border-radius:5px;background:var(--surface);text-align:center;font-weight:700}
.az{scroll-margin-top:calc(var(--hd) + 12px)}
.az .chips,.rl .chips{flex-wrap:wrap;gap:6px;overflow:visible}
.az .chip,.rl .chip{margin:0;white-space:normal;overflow-wrap:anywhere}
.chip b{margin-left:4px;color:var(--text-2);font-size:11px;font-variant-numeric:tabular-nums}
.ct{border-style:dashed}
.cm{border-color:var(--accent)}

/* оверлей «следующее»: полоса отсчёта 5 с (раскладка оверлея — в блоке critv) */
.sat-ov-n::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:0 50%}
.sat-ov.run .sat-ov-n::after{animation:sat-cd 5s linear forwards}
.sat-ov.run.pz .sat-ov-n::after{animation-play-state:paused}
@keyframes sat-cd{to{transform:scaleX(1)}}

/* готовые и догружаемые ленты: метка для IntersectionObserver, загрузка, кнопка «Ещё» */
.sat-more{height:1px}
.sat-feed.ld .sat-more{height:56px;background:radial-gradient(circle at 50% 50%,var(--accent) 0 4px,transparent 5px) 50% 50%/24px 24px no-repeat;opacity:.7;animation:sat-pulse 1s ease-in-out infinite alternate}
@keyframes sat-pulse{from{opacity:.25}to{opacity:.85}}
.sat-more-b{display:block;min-width:220px;height:44px;margin:18px auto 0;padding:0 26px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);font-size:14px;font-weight:700;cursor:pointer}

/* пагинация ниши */
.pg{display:flex;flex-wrap:wrap;justify-content:center;margin:6px 0 22px}
.pg a{display:inline-flex;align-items:center;justify-content:center;min-width:42px;height:42px;margin:3px;padding:0 12px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);font-weight:700;font-variant-numeric:tabular-nums}
.pg a.on,.pg a[aria-current]{background:var(--accent);border-color:var(--accent);color:var(--on)}

/* юридические страницы, 404/410 */
.lg{max-width:72ch;padding:14px 0 28px;font-size:15px;line-height:1.65}
.lg h1{margin:0 0 12px;font-size:24px;line-height:1.25}
.lg h2{margin:24px 0 8px;font-size:17px}
.lg a{color:var(--accent);text-decoration:underline}
.nf{padding:28px 0 6px}
.nf h1{margin:0;font-size:24px;font-weight:800;line-height:1.25}
.nf p{margin:8px 0 0;max-width:60ch;color:var(--text-2)}

/* уменьшенное движение: без анимаций и плавных переходов */
@media(prefers-reduced-motion:reduce){
	*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
	.sat-ov.run .sat-ov-n::after{transform:scaleX(1)}
}
