/* ================= ZonumFilm — FULL CSS ================= */

/* ---------- Variables (dark graphite site, lighter gray header) ---------- */
:root{
  /* Base palette */
  --bg:   #1b1f23;   /* page background (graphite) */
  --bg2:  #20262c;   /* cards/panels */
  --bg3:  #262d35;   /* subtle surfaces */
    
  --header-glass-dark: rgba(15,18,24,.86); /* тёмное стекло */
  --header-glass-dark2: rgba(15,18,24,.72);
  --glow: rgba(212,175,55,.28);

  --text:#ececec; --muted:#a9b0bb;
  --acc:#d4af37; --acc2:#b58e22; --danger:#ef4444;

  --border:#2a333d; --chip:#1f262e;

  /* Header */
  --header:#3a3f45;                   /* solid header fallback */
  --header-glass: rgba(58,63,69,.78); /* glass layer */
  --glow: rgba(212,175,55,.28);       /* soft gold line */

  /* Layout */
  --radius:16px; --shadow:0 6px 24px rgba(0,0,0,.35);
  --container:1200px;
  --logo-nudge: 22px;

  /* Carousel */
  --hf-gap: 12px;
}
/* Единый размер для H1, где бы он ни стоял */
:root { --h1-size: clamp(28px, 3vw, 40px); }

h1,
:where(article,section,nav,aside) h1{
  font-size: var(--h1-size);
}

/* ---------- Footer ---------- */
.site-footer{margin-top:0; border-top:1px solid var(--border); background:var(--bg)}
.footer-grid{display:grid; grid-template-columns:1fr auto; gap:20px; padding:28px 0; align-items:center}
.footer-links{display:flex; gap:16px; flex-wrap:wrap}
.footer-copy{grid-column:1/-1; color:var(--muted)}

/* ---------- Utility ---------- */
/* === Bottom rail for header (restore) === */
.site-header{ position:relative; overflow:visible; }

/* базовые псевдо-элементы */
.site-header::before,
.site-header::after{
  content:"";
  position:absolute;
  left:0; right:0;
  pointer-events:none;
  z-index:1;
}

/* тонкая светлая линия над основной */
.site-header::before{
  bottom:2px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);
  opacity:.95;
}

/* основная «золотая» линия */
.site-header::after{
  bottom:0;
  height:2px;
  background:linear-gradient(90deg,
    transparent 0%,
    #f2c252 12%,
    #d4af37 50%,
    #f2c252 88%,
    transparent 100%);
  box-shadow:0 -1px 0 rgba(0,0,0,.35) inset;
}

/* перебиваем старое отключение в v10 */
.site-header.v10::before,
.site-header.v10::after{
  content:"" !important;
  display:block !important;
}

/* если используешь автоскрытие v10 — аккуратно прячем линии вместе с шапкой */
.site-header.v10.v10-hide::before,
.site-header.v10.v10-hide::after{
  opacity:0;
  transition:opacity .2s ease;
}
/*h1 на главной*/
.movies-heading {
  text-align: left;
  margin-bottom: 0.75rem; /* небольшой зазор ~12px */
    margin-top: 0.75rem;
    color:var(--text);
  text-decoration:none;
  transition:color .2s ease;
}

.movies-heading .title {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.2;
  margin: 0;
  color: #fff;
}

@media (min-width: 768px) {
  .movies-heading .title {
    font-size: 1.75rem; /* на больших экранах чуть больше */
  }
}

/* ---------- Cards (inner lists) ---------- */
.cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px,1fr)); gap:16px}
.card.short{
  display:grid; grid-template-columns:120px 1fr; gap:16px;
  background:var(--bg2); border:1px solid var(--border); border-radius:var(--radius);
  padding:14px; box-shadow:var(--shadow)
}
.card .thumb{position:relative; display:block; min-height:170px}
.thumb img,.poster{border-radius:0px}
.thumb-placeholder{display:grid; place-items:center; background:#0d0f14; border:1px dashed var(--border); border-radius:12px; height:100%}
.label.quality{position:absolute; left:8px; bottom:8px; background:var(--chip); padding:4px 8px; border-radius:10px; border:1px solid var(--border); font-size:12px}
.card .meta .title{margin:0 0 6px 0; font-size:18px}
.meta-row{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:8px}
.chip{background:var(--chip); border:1px solid var(--border); padding:4px 8px; border-radius:999px; color:#cbd5e1; font-size:12px}
.excerpt{color:var(--muted); margin:0 0 10px 0}
.actions{display:flex; align-items:center; gap:12px}
.actions .btn{padding:8px 12px; border-radius:12px; background:var(--bg3); border:1px solid var(--border); color:var(--text)}
.actions .btn-primary{background:var(--acc); border-color:transparent}
.counters{display:flex; gap:10px; color:#9aa4b2}

/* ---------- Full story ---------- */
.full .full-head .title{margin:0 0 8px 0; font-size:28px}
.breadcrumbs{color:var(--muted); font-size:14px; margin-bottom:12px; margin-top: 12px;}
.full-top{display:grid; grid-template-columns:240px 1fr; gap:20px}
.poster-wrap{display:grid; gap:10px}
.poster{width:100%; height:auto}
.poster--ph{height:340px; background:#0d0f14; border:1px dashed var(--border); border-radius:12px}
.vote{background:var(--chip); padding:8px; border-radius:12px; border:1px solid var(--border); text-align:center}
.fav{font-size:14px}
.watch .player{background:var(--bg2); border:1px solid var(--border); border-radius:12px; min-height:650px; display:grid; place-items:center; overflow:hidden}
.player-placeholder{color:var(--muted); padding:20px; text-align:center}
.info-panel{margin-top:0px; background:var(--bg2); border:1px solid var(--border); border-radius:12px; align-self: stretch;
  display: flex;           /* чтобы футер был внизу */
  flex-direction: column;}
.info-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px,1fr)); gap:10px; padding:12px;  flex: 1 1 auto; }
.info .k{color:#9aa4b2; font-size:12px}
.info .v{font-weight:600}
.full-body{display:grid; grid-template-columns:1fr 320px; gap:20px; margin-top:20px}
.full-body .content{background:var(--bg2); border:1px solid var(--border); border-radius:12px; padding:16px}
.side .widget{background:var(--bg2); border:1px solid var(--border); border-radius:12px}
.widget-title{padding:12px 14px; border-bottom:1px solid var(--border); font-weight:700}
.widget-body{padding:12px 14px}
.rows{display:grid; gap:6px; margin-bottom:10px}
.share{display:flex; gap:8px; flex-wrap:wrap}

@media (max-width:900px){
  .card.short{grid-template-columns:1fr}
  .full-top{grid-template-columns:1fr}
  .full-body{grid-template-columns:1fr}
}

/* ---------- Home grid tiles (used by tabs_item.tpl) ---------- */
.tab-title{margin:14px 0 8px 0; font-size:18px}
.tabcontent{display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
@media (max-width:1280px){.tabcontent{grid-template-columns:repeat(5,1fr)}}
@media (max-width:980px){ .tabcontent{grid-template-columns:repeat(4,1fr)}}
@media (max-width:720px){ .tabcontent{grid-template-columns:repeat(3,1fr)}}
@media (max-width:480px){ .tabcontent{grid-template-columns:repeat(2,1fr)}}

.tile.t185{
  position:relative; border-radius:16px; border:1px solid var(--border);
  overflow:hidden; background:var(--bg2); box-shadow:var(--shadow);
  aspect-ratio:185/300
}
.tile-link{display:block; width:100%; height:100%}
.tile.t185 img,.tile.t185 .tile-ph{width:100%; height:100%; object-fit:cover; display:block}
.tile.t185 .tile-ph{background:#0d0f14}
.tile-grad{position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.02) 0%,rgba(0,0,0,.35) 60%,rgba(0,0,0,.7) 100%)}
.tile-caption{position:absolute; left:10px; right:10px; bottom:10px; display:flex; flex-direction:column; gap:4px}
.tile-title{color:#fff; font-weight:600; font-size:14px; line-height:1.25; text-shadow:0 1px 2px rgba(0,0,0,.5); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden}
.tile-year{font-size:12px; color:#cbd5e1; opacity:.9}

/* ---------- HERO CAROUSEL (hf-) ---------- */
.hf-carousel{margin:16px 0 12px; position:relative; overflow:visible}
.hf-viewport{overflow:hidden; background:transparent; border:0; box-shadow:none; border-radius:0}
.hf-track{display:flex; transition:transform .45s ease; will-change:transform}
.hf-slide{flex:0 0 100%; padding:var(--hf-gap); box-sizing:border-box}
@media (min-width:520px){ .hf-slide{flex-basis:50%} }
@media (min-width:720px){ .hf-slide{flex-basis:33.3333%} }
@media (min-width:980px){ .hf-slide{flex-basis:25%} }
@media (min-width:1200px){ .hf-slide{flex-basis:20%} }
@media (min-width:1400px){ .hf-slide{flex-basis:16.6667%} }

.hf-imgwrap{
  position:relative; width:100%; aspect-ratio:2/3; overflow:hidden;
  border-radius:14px; background:transparent; border:0
}
.hf-imgwrap img,.hf-ph{width:100%; height:100%; object-fit:cover; display:block}
.hf-overlay{
  position:absolute; inset:0; padding:10px;
  display:flex; flex-direction:column; justify-content:flex-end;
  background:linear-gradient(180deg, rgba(0,0,0,0) 55%, rgba(0,0,0,.45) 100%)
}
.hf-ttl{
  font-weight:900; font-size:15px; line-height:1.25; margin:0 0 8px 0;
  color:rgba(255,255,255,.9); text-shadow:0 2px 8px rgba(0,0,0,.6)
}
.hf-year-badge{
  align-self:flex-start; padding:4px 8px; border-radius:10px;
  background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.12);
  font-size:12px; color:#fff
}

.hf-prev,.hf-next{
  position:absolute; top:50%;
  background:transparent; border:0; padding:0;
  color:rgba(255,255,255,.85); font-size:34px; font-weight:900; line-height:1;
  z-index:2; cursor:pointer; text-shadow:0 2px 8px rgba(0,0,0,.6)
}
.hf-prev{left:0;  transform:translate(-120%,-50%)}
.hf-next{right:0; transform:translate(120%,-50%)}
.hf-prev:hover{color:#fff; transform:translate(-120%,-50%) scale(1.06)}
.hf-next:hover{color:#fff; transform:translate(120%,-50%) scale(1.06)}
@media (max-width:900px){
  .hf-prev{left:8px; transform:translate(0,-50%)}
  .hf-next{right:8px; transform:translate(0,-50%)}
}

/* ---------- Horizontal sections (per H2) ---------- */
.home-sections{display:grid; gap:22px; background:transparent !important;}
.sec{position:relative; background:transparent !important; box-shadow:none !important;}
.sec-head{display:flex; align-items:center; justify-content:space-between; gap:16px}
.sec .tab-title{margin:6px 0 10px 0; font-size:25px}
.sec .tab-title a{
  color:var(--text);
  text-decoration:none;
  transition:color .2s ease;
  position:relative;
}
.sec .tab-title a:hover{ color:#f2c252; }

/* уголок появляется только при ховере */
.sec .tab-title a::after{
  content:"❯";
  display:inline-block;
  margin-left:.5em;
  opacity:0;
  transform:translateX(-5px);
  transition:opacity .2s ease, transform .2s ease, color .2s ease;
  font-size:.9em;
}
.sec .tab-title a:hover::after{
  opacity:1;
  color:#f2c252;
  transform:translateX(0);
  animation:pulsingAngle .9s ease-in-out infinite;
}
@keyframes pulsingAngle{
  0%   { transform:translateX(0) scale(1);    opacity:1; }
  50%  { transform:translateX(4px) scale(1.1); opacity:.9; }
  100% { transform:translateX(0) scale(1);    opacity:1; }
}

/* >>> УБИРАЕМ СЕРЫЙ ФОН ВЕЗДЕ В БЛОКЕ С ПОСТЕРАМИ (с исключением для .okno) <<< */
.sec,
.sec *:not(.okno):not(.okno *){
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}

/* если фон был из псевдо-элементов (градиенты на краях) — сносим */
.sec::before,.sec::after,
.sec-viewport::before,.sec-viewport::after,
.sec-track::before,.sec-track::after{
  content:none !important;
  background:none !important;
  box-shadow:none !important;
}

/* КОНКРЕТНО: вырубаем подложки у карточек */
.sec-track .tile-ph,
.sec-track .tile-grad{
  display:none !important;             /* полностью скрыть слои */
  background:none !important;
  box-shadow:none !important;
  pointer-events:none !important;
  opacity:0 !important;
}

/* На всякий случай: ссылка-обёртка без фона */
.sec-track .tile-link{
  background:transparent !important;
  box-shadow:none !important;
}

/* область карусели — без фона и перекрытий */
.sec-viewport{
  position:relative; overflow:hidden;
  background:transparent !important;
  backdrop-filter:none !important;
}
.sec-track{
  display:grid; grid-auto-flow:column;
  grid-auto-columns: calc((100% - 5*14px)/6);
  gap:14px; padding-bottom:2px; scroll-snap-type:x mandatory;
  background:transparent !important;
}

/* плитки постеров — тоже без фона */
.sec-track .tile{
  background:transparent !important;
  scroll-snap-align:start;
}

/* если серый проступал через gap от родителя — перекрашиваем контейнер секции */
.sec{ background:transparent !important; }

/* ВОЗВРАЩАЕМ ЭФФЕКТ ДЛЯ ПОСТЕРОВ (.okno) */
.okno{
  background: transparent;
  transition: box-shadow 0.2s linear, transform 0.2s linear; /* вместо scale */
}
.okno:hover{
  box-shadow: 0 0 15px #f2c252 !important;
  transform: scale(0.9);
}

/* адаптив */
@media (max-width:1280px){ .sec-track{grid-auto-columns: calc((100% - 4*14px)/5)} }
@media (max-width:980px) { .sec-track{grid-auto-columns: calc((100% - 3*14px)/4)} }
@media (max-width:720px) { .sec-track{grid-auto-columns: calc((100% - 2*14px)/3)} }
@media (max-width:480px) { .sec-track{grid-auto-columns: calc((100% - 1*14px)/2)} }

.sec-arrows{display:flex; gap:10px}
.sec-prev,.sec-next{
  position:relative; width:auto; height:auto; padding:0; border:0; background:transparent !important;
  color:rgba(255,255,255,.85); font-size:30px; font-weight:900; line-height:1;
  cursor:pointer; text-shadow:0 2px 8px rgba(0,0,0,.6)
}
.sec-prev::after,.sec-next::after{content:""; position:absolute; inset:-10px}
.sec-prev:hover,.sec-next:hover{color:#fff; transform:scale(1.06)}
.brand-v3, .brand-v3:hover { text-decoration: none; }
./* убираем фон, но не убиваем hover-тень у .okno */
.okno,
.okno.tile,
.tile,
.tile-link {
  background: transparent !important;
  background-color: transparent !important;
}

/* тень сбрасываем только у "внутренних" контейнеров */
.tile,
.tile-link {
  box-shadow: none !important;
}
/* ---------- Mini Search (рядом с логотипом) ---------- */

/* центр шапки: логотип + поиск в одну строку */
.header-row.v3{ grid-template-columns: 1fr minmax(480px,auto) 1fr; }
.brand-inline{ display:flex; align-items:center; gap:16px; justify-content:center; }

/* компактная строка поиска */
.mini-search{ position:relative; width:260px; z-index:3000; }
@media (max-width:1100px){ .mini-search{ width:220px; } }
@media (max-width:900px){  .mini-search{ display:none; } }

.mini-form{ position:relative; z-index:3001; }
.mini-form input[type="search"]{
  width:100%; height:32px; padding:0 10px; border-radius:0px;
  border:1px solid var(--border); background:var(--bg3); color:var(--text); outline:none;
  font-size:14px;
}
.mini-form input::placeholder{ color:var(--muted); }

/* ВАЖНО: никаких left/top/width — их проставляет DLE JS. */
#searchsuggestions{
  position:absolute;
  display:none;                         /* DLE включает display:block */
  z-index:5000 !important;              /* поверх шапки */
  background:var(--bg2);
  border:1px solid var(--border);
  border-radius:0px;
  box-shadow:0 16px 40px rgba(0,0,0,.45);
  max-height:60vh; overflow:auto; box-sizing:border-box;
}

/* Элементы результата (совместимо с fastsearchresult.tpl) */
#searchsuggestions a.qs-item{ display:flex; gap:10px; align-items:center; padding:10px; text-decoration:none; border-radius:10px; }
#searchsuggestions a.qs-item:hover{ background:var(--bg3); }
#searchsuggestions .qs-pic{ width:40px; height:60px; flex:0 0 40px; border-radius:8px; overflow:hidden; background:#0d0f14; border:1px solid var(--border); }
#searchsuggestions .qs-pic img{ width:100%; height:100%; object-fit:cover; display:block; }
#searchsuggestions .qs-meta{ min-width:0 }
#searchsuggestions .qs-title{ color:#fff; font-weight:800; font-size:14px; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:block; }
#searchsuggestions .qs-sub{ color:#cbd5e1; font-size:12px; display:flex; gap:8px; align-items:center; margin-top:2px; opacity:.9; }

/* Убираем “Расширенный поиск” */
#searchsuggestions a[href*="do=search"],
#searchsuggestions a[href*="/search"],
#searchsuggestions .search_all,
#searchsuggestions a:where(:last-child){ display: none !important; }

/* ===== Категория: сетка плиток ===== */
body.is-cat #dle-content{
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  gap:14px;
}
@media (max-width:1280px){ body.is-cat #dle-content{ grid-template-columns:repeat(5,1fr) } }
@media (max-width:980px) { body.is-cat #dle-content{ grid-template-columns:repeat(4,1fr) } }
@media (max-width:720px) { body.is-cat #dle-content{ grid-template-columns:repeat(3,1fr) } }
@media (max-width:480px) { body.is-cat #dle-content{ grid-template-columns:repeat(2,1fr) } }


/* если пагинация вдруг попала внутрь #dle-content — на всю ширину */
body.is-cat #dle-content .navigation,
body.is-cat #dle-content .pagi{
grid-column:1 / -1;
}
.bottom-nav {clear: both; opacity:0;}

/* Отступы на страницах категорий */
body.is-cat main {
  padding-top: 28px;   /* верхний отступ от шапки */
  padding-bottom: 48px;/* нижний отступ до футера */
}

/* Чуть больше воздуха над/под сеткой карточек (по желанию) */
body.is-cat .cat-grid {
  margin-top: 12px;
  margin-bottom: 24px;
}

/* Адаптив: на очень узких экранах чутка меньше */
@media (max-width: 480px) {
  body.is-cat main { padding-top: 20px; padding-bottom: 36px; }
}
/* 1 SCROLL */
/* ==== ЕДИНЫЙ СКРОЛЛ-КОНТЕЙНЕР ==== */
/* Скролл всегда у html, чтобы не мигало двумя полосами */
html {
  height: 100%;
  overflow-y: scroll;     /* всегда резервируем полосу */
  overflow-x: hidden;
}

/* body не скроллит, а просто растягивается */
body {
  min-height: 100%;
  height: auto !important;
  overflow-y: visible !important;
  overflow-x: hidden;
}

/* На категориях исключаем внутренние вертикальные скроллы */
body.is-cat main,
body.is-cat .container,
body.is-cat .cat-grid,
body.is-cat #dle-content {
  overflow-y: visible !important;
  max-height: none !important;
}

/* Скрытая навигация точно не влияет на высоту и не даёт скролл */
#hidden-nav {
  display: none !important;
  height: 0 !important;
  overflow: hidden !important;
}

/* Мобильное меню: по умолчанию не создаёт полосу скролла */
.mobile-menu.v3 {
  display: none;
  max-height: 0;
  overflow: hidden;
}
.nav-toggle.v3[aria-expanded="true"] + .mobile-menu.v3 {
  display: block;
  max-height: calc(100vh - 64px);
  overflow: auto;
}

/* H1 и панель фильтров */

.cat-head{display:flex; flex-direction:column; gap:14px; margin:10px 0 16px}
.cat-head h1{margin:0; font-size:26px; line-height:1.2; letter-spacing:.2px}

.filters{display:flex; align-items:center; flex-wrap:wrap; gap:12px}

/* обёртка селекта — тоже «пилюля», чтобы визуально совпадало */
.select-wrap{
  position:relative; display:inline-block;
  border-radius:999px;
}
.select-wrap::after{
  content:""; position:absolute; right:14px; top:50%;
  width:8px; height:8px; border-right:2px solid #9aa4b2; border-bottom:2px solid #9aa4b2;
  transform:translateY(-50%) rotate(45deg); pointer-events:none; opacity:.9;
}

/* сам селект — овальный */
.filter-select{
  appearance:none; -webkit-appearance:none; -moz-appearance:none;
  background:var(--bg3); color:#e5eaf1;
  border:1px solid var(--border); border-radius:999px;
  padding:10px 36px 10px 14px; font-weight:700; font-size:14px; line-height:1;
  min-width:150px; outline:none;

  /* чтобы края выглядели ровно на всех платформах */
  background-clip: padding-box;
  overflow: hidden;
}
.filter-select:focus{box-shadow:0 0 0 2px rgba(212,175,55,.2); border-color:var(--acc)}

.filter-reset{
  background:transparent; border:0; color:#cbd5e1; font-weight:700; cursor:pointer;
  padding:8px 10px; border-radius:10px;
}
.filter-reset:hover{color:#fff; background:rgba(255,255,255,.06)}

@media (max-width:720px){
  .filter-select{min-width:130px}
  .cat-head h1{font-size:22px}
}

/* --- Rounded dropdown поверх select --- */
.select-wrap::after{ display:none; }          /* скрываем старую стрелку */

.select-wrap{ position:relative; }            /* якорь */
.filter-select{                                /* прячем нативный select */
  position:absolute; left:-9999px; top:auto; width:1px; height:1px;
  overflow:hidden; opacity:0; pointer-events:none;
}

/* Кнопка-пилюля */
.pill {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--bg3); color:#e5eaf1;
  border:1px solid var(--border);
  border-radius:999px; padding:10px 14px;
  font-weight:700; font-size:14px; line-height:1;
  cursor:pointer; user-select:none;
}
.pill:hover { background:rgba(255,255,255,.06); }
.pill[aria-expanded="true"] { box-shadow:0 0 0 2px rgba(212,175,55,.18); border-color:var(--acc); }
.pill-caret {
  width:8px; height:8px; border-right:2px solid #9aa4b2; border-bottom:2px solid #9aa4b2;
  transform:rotate(45deg);
}

/* Овальное выпадающее меню */
.pill-menu{
  position:absolute; z-index:4000; margin-top:6px;
  min-width:180px; max-height:50vh; overflow:auto;
  background:var(--bg2); border:1px solid var(--border);
  border-radius:16px; box-shadow:0 16px 40px rgba(0,0,0,.45);
  padding:6px; display:none;
}
.select-wrap.open > .pill-menu{ display:block; }

/* Пункты меню — тоже «пилюли» */
.pill-item{
  padding:8px 12px; border-radius:999px;
  color:#e5eaf1; cursor:pointer; white-space:nowrap;
}
.pill-item:hover { background:rgba(255,255,255,.06); }
.pill-item.is-selected { background:rgba(212,175,55,.14); border:1px solid rgba(212,175,55,.25); }

/* ===== Header v6: glass + neon rail + focus search ===== */
/* ===== Header v10: центр-лого, меню по бокам, поиск под логотипом (refined) ===== */
/* ===== Header v10: центр-лого, меню по бокам, поиск под логотипом (auto-hide) ===== */
:root{
  --v10-bg1: rgba(20,24,28,.88);
  --v10-bg2: rgba(20,24,28,.74);
  --v10-logo-ufo:  #e9eef7;
  --v10-logo-film: #f2c252;
  --v10-border:    #2a333d;

  /* Настройки симметрии/кнопок */
  --v10-center-gap: 28px;   /* зазор между логотипом и меню слева/справа */
  --v10-item-gap:   14px;   /* расстояние между кнопками в группах */
  --v10-btn-min:   120px;   /* минимальная ширина кнопки меню (одинаковая) */
}

/* фиксированная шапка без нижней полосы/тени */
.site-header.v10{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1500;
  overflow: visible;
  background: linear-gradient(180deg, var(--v10-bg1), var(--v10-bg2));
  backdrop-filter: blur(10px) saturate(130%);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  border: 0 !important;
  box-shadow: none !important;
  transform: translateY(0);                 /* для анимации скрытия */
  transition: transform .25s ease;
}
.site-header.v10::after{ content:none !important; height:0 !important; display:none !important; }

/* тело под фиксированную шапку (высоту ставит JS) */
body{ padding-top: var(--v10-h, 80px); transition: padding-top .2s ease; }

/* когда шапка скрыта — убираем отступ, чтобы контент «поднялся» */

.site-header.v10.v10-hide{ transform: translateY(-100%); }

.hbar-v10{
  display:grid;
  grid-template-columns: 1fr auto 1fr; /* слева меню — центр логотип — справа меню */
  align-items:center;
  column-gap: var(--v10-center-gap);
  padding: 14px 0 10px;
  position:relative;
}

/* Центровой стек: логотип + поиск под ним */
.brand-stack{
  display:grid; justify-items:center; align-items:center; gap:8px;
}

/* ЛОГО: два цвета + мягкое свечение, без подчёркиваний */
.brand-v10{
  text-decoration:none !important;
  display:inline-flex; gap:10px; align-items:baseline;
  font-family:'Russo One','Manrope',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  line-height:1;
}
.brand-v10 .ufo, .brand-v10 .film{
  font-size: clamp(26px, 2.8vw, 34px);
  font-weight: 900; letter-spacing:.8px;
}
.brand-v10 .ufo{
  color: var(--v10-logo-ufo);
  text-shadow: 0 1px 0 rgba(0,0,0,.35), 0 0 6px rgba(230,240,255,.28), 0 0 14px rgba(230,240,255,.18);
}
.brand-v10 .film{
  color: var(--v10-logo-film);
  text-shadow: 0 1px 0 rgba(0,0,0,.35), 0 0 6px rgba(242,194,82,.38), 0 0 14px rgba(242,194,82,.22);
}

/* Меню: по бокам от лого, крупное и симметричное */
.nav-v10{ display:flex; gap: var(--v10-item-gap); align-items:center; }
.nav-v10.left  { justify-self:end;   justify-content:flex-end; }
.nav-v10.right { justify-self:start; justify-content:flex-start; }

/* Кнопки меню: одинаковая ширина, без свечения; «пузырёк» только на hover/active */
.nav-v10 a{
  display:flex; align-items:center; justify-content:center;
  min-width: var(--v10-btn-min);
  padding: 10px 10px;
  border-radius: 12px;
  font-family:'Russo One','Manrope',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-size:18px; font-weight:900; letter-spacing:.5px;
  color:#e8edf5; text-decoration:none;
  background: transparent;
  text-shadow:none;
  transition: transform .12s ease, background .15s ease, box-shadow .15s ease, color .12s ease;
}
.nav-v10 a:hover{
  background: rgba(255,255,255,.05);
  box-shadow:
    inset 0 -2px 6px rgba(0,0,0,.28),
    inset 0  1px 0 rgba(255,255,255,.04);
  transform: translateY(1px);
  color:#fff;
}
.nav-v10 a:active{
  background: rgba(255,255,255,.04);
  box-shadow:
    inset 0 -3px 8px rgba(0,0,0,.35),
    inset 0  1px 0 rgba(255,255,255,.04);
  transform: translateY(2px);
  opacity:.98;
}

/* Поиск под логотипом (центр) — рабочий fastsearch */
.mini-search.v10{ position:relative; width: 340px; }
@media (max-width:1200px){ .mini-search.v10{ width:300px; } }
@media (max-width:1000px){ .mini-search.v10{ width:260px; } }
.mini-search.v10 .mini-form input[type="search"]{
  width:100%; height:36px; padding:0 10px; border-radius:0px;
  border:1px solid var(--v10-border); background:var(--bg3); color:var(--text);
  outline:none; font-size:14px; text-align:center;
}
.mini-search.v10 .mini-form input::placeholder{ color:#a9b0bb; }
/* Выпадающие подсказки */
.mini-search.v10 #searchsuggestions{
  position:absolute; left:0; right:0; margin-top:6px; z-index:5000 !important;
  background:var(--bg2); border:1px solid var(--v10-border); border-radius:10px;
  box-shadow:0 16px 40px rgba(0,0,0,.45); max-height:60vh; overflow:auto; display:none;
}
.mini-search.v10 #searchsuggestions[style*="display: block"]{ display:block !important; }

/* Бургер (покажем на мобиле) */
.nav-toggle.v10{
  display:none; position:absolute; right:16px; top:12px;
  width:40px; height:36px; border:0; background:transparent; cursor:pointer;
}
.nav-toggle.v10 .bar{ position:absolute; left:8px; right:8px; height:2px; background:#fff; border-radius:2px; transition:.25s; }
.nav-toggle.v10 .bar:nth-child(1){ top:11px } .nav-toggle.v10 .bar:nth-child(2){ top:17px } .nav-toggle.v10 .bar:nth-child(3){ top:23px }
.nav-toggle.v10[aria-expanded="true"] .bar:nth-child(1){ transform:translateY(6px) rotate(45deg) }
.nav-toggle.v10[aria-expanded="true"] .bar:nth-child(2){ opacity:0 }
.nav-toggle.v10[aria-expanded="true"] .bar:nth-child(3){ transform:translateY(-6px) rotate(-45deg) }

/* Мобильное меню */
.mobile-menu.v10{
  display:none; position:absolute; left:16px; right:16px; top:100%;
  background:rgba(15,18,24,.98); border:1px solid var(--v10-border);
  border-radius:14px; padding:12px; box-shadow:0 12px 30px rgba(0,0,0,.45);
}
.mobile-menu.v10 a{ display:block; padding:10px 12px; border-radius:10px; color:#e8edf5; text-decoration:none; font-weight:700; }
.mobile-menu.v10 a + a{ margin-top:6px }
.mobile-menu.v10.open{ display:block }

/* Адаптив: на узких — только центр-логотип + поиск + бургер */
@media (max-width: 1100px){
  .nav-v10.left, .nav-v10.right{ display:none }
  .nav-toggle.v10{ display:inline-flex; align-items:center; justify-content:center }
  .hbar-v10{ grid-template-columns: 1fr auto 1fr; }
}
/* адаптивные ширины кнопок, чтобы не ломалось */
@media (max-width:1280px){ .nav-v10 a{ min-width:110px } }
@media (max-width:1120px){ .nav-v10 a{ min-width:100px } }
@media (max-width: 560px){ .mini-search.v10{ width: 200px; } }

/* v10: меню — тише по цвету и тоньше по начертанию */
.nav-v10 a{
  /* вместо «Russo One» берём более лёгкий Manrope */
  font-family: 'Manrope', system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 600;            /* было 900 */
  letter-spacing: .3px;        /* было .5px */
  color: #cbd5e1;              /* мягче, не так ярко */
  opacity: .92;
}

/* ховер: чуть менее заметный «пузырёк» и без лишней яркости */
.nav-v10 a:hover{
  background: rgba(255,255,255,.04);   /* было .05 */
  box-shadow:
    inset 0 -1px 4px rgba(0,0,0,.24),  /* было сильнее */
    inset 0  1px 0 rgba(255,255,255,.04);
  color:#ffffff;
}

/* active: тоже мягче */
.nav-v10 a:active{
  background: rgba(255,255,255,.03);
  box-shadow:
    inset 0 -2px 5px rgba(0,0,0,.30),
    inset 0  1px 0 rgba(255,255,255,.04);
  transform: translateY(2px);
  opacity:.96;
}

/* Это у нас РЕЙТИНГ */
/* Fullstory: футер панели с лайком/дизлайком */
/* Fullstory: футер панели с лайком/дизлайком */
.info-foot{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-top:1px solid var(--border);
}

.rate--thumbs{ display:flex; align-items:center; gap:12px; }
.rate--thumbs .rate-btn{
  display:inline-grid; place-items:center;
  width:36px; height:36px;
  border-radius:10px;
  background: var(--bg3);
  border:0px solid var(--border);
  text-decoration:none;
  font-size:18px; line-height:1;
  cursor:pointer;
}
.rate--thumbs a.rate-btn:hover,
.rate--thumbs .rate-btn:hover{ background:rgba(255,255,255,.06); }

.rate--thumbs .rate-counts{
  display:flex; align-items:baseline; gap:6px; color:#9aa4b2; font-weight:600;
}
.rate--thumbs .likes{ color:var(--acc); }
.rate--thumbs .dislikes{ color:var(--danger); }
.rate--thumbs .sep{ opacity:.6; }

/* Конец рейтинга ////////////// */

/* ДОПКА плеер на всю ширину + постер внизу*/
/* Постер адаптивно занимает свою колонку */
.poster-wrap .poster{ width: 100%; height: auto; display: block; }

/* Футер рейтинга (если не добавляли ранее) */
.info-foot{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-top:1px solid var(--border);
}
.rate--thumbs{ display:flex; align-items:center; gap:12px; }
.rate--thumbs .rate-btn{
  display:inline-grid; place-items:center;
  width:36px; height:36px;
  border-radius:10px;
  background:var(--bg3);
  border:0px solid var(--border);
  text-decoration:none;
  font-size:18px; line-height:1;
  cursor:pointer;
}
.rate--thumbs a.rate-btn:hover,
.rate--thumbs .rate-btn:hover{ background:rgba(255,255,255,.06); }
.rate--thumbs .rate-counts{
  display:flex; align-items:baseline; gap:6px; font-weight:600;
}
.rate--thumbs .likes{ color:var(--acc); }
.rate--thumbs .dislikes{ color:var(--danger); }
.rate--thumbs .sep{ opacity:.6; }

/* Адаптив: на мобилках складываем в одну колонку */
@media (max-width: 900px){
  .info-foot{ justify-content: flex-start; }
}

/* Плеер в .full-top — на всю ширину (обе колонки) */
.full-top > .watch { grid-column: 1 / -1; }

/* Если ещё не добавляли — лёгкая полоса с лайками */
.info-foot{
  display:flex; justify-content:flex-end; align-items:center;
  gap:12px; padding:10px 12px; border-top:1px solid var(--border);
}
.rate--thumbs{ display:flex; align-items:center; gap:12px; }
.rate--thumbs .rate-btn{
  display:inline-grid; place-items:center; width:36px; height:36px;
  border-radius:10px; background:var(--bg3); border:0px solid var(--border);
  text-decoration:none; font-size:18px; line-height:1; cursor:pointer;
}
.rate--thumbs a.rate-btn:hover, .rate--thumbs .rate-btn:hover{ background:rgba(255,255,255,.06); }
.rate--thumbs .rate-counts{ display:flex; align-items:baseline; gap:6px; font-weight:600; }
.rate--thumbs .likes{ color:var(--acc); } .rate--thumbs .dislikes{ color:var(--danger); }
.rate--thumbs .sep{ opacity:.6; }

/* КОНЕЦ ДОПКА плеер на всю ширину + постер внизу*/
/*АДАПТАЦИЯ ПОСТЕРА ПОД МОБИЛУ      */
/* === Mobile: постер не на всю ширину, аккуратный размер === */
@media (max-width: 900px){
  /* одна колонка под плеером */
  .full-top{ grid-template-columns: 1fr; }

  /* не растягиваем постер во всю ширину экрана */
  .poster-wrap{ justify-self: center; }
  .poster{
    width: clamp(160px, 60vw, 320px); /* ограничили ширину */
    max-height: 70vh;                  /* и высоту — чтобы не был «во весь экран» */
    height: auto;
    display: block;
  }

  /* инфо-панель вплотную к постеру */
  .info-panel{ margin-top: 12px; }
}

/* плеер остаётся на всю ширину сверху (на всякий случай, если ещё не добавляли) */

/* КОНЕЦ АДАПТАЦИИ ПОД МОБИЛУ */

/* Отступ перед футером без рывков скролла */
/* === Mobile fix: постер без vh-скачков + одна колонка === */
@media (max-width: 900px){
  .full-top{ grid-template-columns: 1fr; }

  .poster-wrap{ justify-self: center; }
  .poster{
    width: clamp(160px, 60vw, 320px);
    height: auto;
    /* вместо 70vh: используем устойчивую высоту экрана + жёсткий потолок */
    max-height: min(70svh, 480px);
    display: block;
  }

  .info-panel{ margin-top: 12px; } /* чтобы панель не липла к постеру */
}

.full-top > .watch{ grid-column: 1 / -1; }
.full-top { min-height: 0; }
.full-top > * { min-height: 0; }
article.full::after{
  content: "";
  display: block;
  height: 48px;   /* десктопный зазор */
}

@media (max-width: 900px){
  article.full::after{ height: 28px; } /* мобильный зазор */
}
/* Конец Отступ между fullstory и футером сайта */

/*  Кнопки плеера */
.tabbar{ display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.tab-btn{
  padding:10px 14px; border-radius:10px;
  border:1px solid var(--border); background:var(--bg3);
  cursor:pointer; font-weight:600;
}
.tab-btn.is-active{ background:var(--bg2); }
.tab-panel[hidden]{ display:none !important; }

/* Рамка/пропорции для iframe */
.video-box{
  position:relative; aspect-ratio:16/9; background:#000;
  border-radius:12px; overflow:hidden;
}
.video-box iframe{
  position:absolute; inset:0; width:100%; height:100%;
  display:block;
}

/* Плеер — на всю ширину верхнего ряда */
.full-top > .watch{ grid-column: 1 / -1; }

/* Mobile: одна колонка под плеером; умеренный размер постера */
@media (max-width: 900px){
  .full-top{ grid-template-columns: 1fr; }
  .poster-wrap{ justify-self:center; }
  .poster{ width:clamp(160px,60vw,320px); height:auto; display:block; }
  .info-panel{ margin-top:12px; }
}
.tab-btn, .tab-btn.is-active{ color:#fff !important; }
.tab-btn.is-active{
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--acc) 35%, transparent),
      0 0 10px 1px color-mix(in srgb, var(--acc) 18%, transparent) !important;}
/* Mobile: одна колонка под плеером; умеренный размер постера */
@media (max-width: 900px){
  .full-top{ grid-template-columns: 1fr; }
  .poster-wrap{ justify-self:center; }
  .poster{ width:clamp(160px,60vw,320px); height:auto; display:block; }
  .info-panel{ margin-top:12px; }
}
/*  Коонец Кнопки плеера */
/* ===== FULLSTORY: базовые переменные ===== */
.full {
  --gap: 24px;
  --poster-w-min: 260px;
  --poster-w-max: 340px;
}

/* ===== Шапка полного материала ===== */
.full .full-top { display: block; }
.full .watch { margin-bottom: var(--gap); }
/* скрывать неактивные панели плеера */
.full .tab-panel[hidden] { display: none !important; }

/* ===== Ряд: постер слева, инфо справа ===== */
.full .top-row{
  display: flex !important;
  align-items: flex-start !important;   /* верхнее выравнивание */
  gap: var(--gap) !important;
}

/* ===== Левый столбец (постер) ===== */
/* поддерживаем и новую .poster-block, и старую .poster-wrap — работают одинаково */
.full .poster-block,
.full .poster-wrap{
  width: clamp(var(--poster-w-min), 28vw, var(--poster-w-max)) !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  align-self: flex-start !important;
}

/* картинка постера */
.full .poster,
.full .poster-block img,
.full .poster-wrap img.poster{
  display: block !important;
  width: 100% !important;
  height: auto !important;
  border-radius: 12px;
  margin: 0 !important;
}

/* ===== Плашка рейтинга ПОД постером (НЕ absolute) ===== */
/* поддерживаем и .poster-bar (новая), и .poster-meta (старая) */
.full .poster-bar,
.full .poster-meta{
  position: static !important;             /* обычный поток — всегда под постером */
  margin-top: 10px !important;
  width: 100% !important;
  box-sizing: border-box !important;

  background: #3b3b3b !important;          /* плотная тёмная */
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important;
  padding: 10px 14px !important;
  color: #fff !important;

  /* сброс наследованных абсолютов из старых стилей */
  left: auto !important; right: auto !important; top: auto !important; bottom: auto !important;
  transform: none !important; height: auto !important; z-index: auto !important;
}

/* внутренний ряд рейтингов */
.full .rating-row{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 0 !important;
  width: 100%;
}
.full .rating-row > .rg-item{
  flex: 1 1 0 !important;                 /* равные доли ширины */
  min-width: 0;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 6px !important;
  white-space: nowrap !important;
  font-weight: 700;
}
.full .rating-row .rg-val{ font-weight: 700; }

/* ===== Правый столбец (растянутый блок) ===== */
.full .info-panel{
  flex: 1 1 0 !important;                 /* занимает всё оставшееся */
  align-self: flex-start !important;
  margin: 0 !important;
}

/* сетка доп полей */
.full .info-grid{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px 24px;
}
@media (max-width: 1200px){
  .full .info-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .full .info-grid{ grid-template-columns: 1fr; }
}
.full .info .k{ opacity: .7; font-size: 14px; margin-bottom: 4px; }
.full .info .v{ font-weight: 600; }

/* лайки/дизлайки под полями */
.full .info-foot{ margin-top: 14px; }

/* заголовок "Описание" */
.full .content-title{ margin: 16px 0 12px; }

/* блок похожих материалов */
.full .related{ margin-top: 24px; }

/* ===== Страховки от «паразитных» отступов/псевдоэлементов ===== */
.full .top-row > *{ margin-top: 0 !important; }
.full .poster-block::before,
.full .poster-block::after,
.full .poster-wrap::before,
.full .poster-wrap::after{ content: none !important; }

/* ===== Адаптив ===== */
@media (max-width: 900px){
  .full .top-row{ flex-direction: column; }
  .full .poster-block,
  .full .poster-wrap{
    width: 100% !important;
    max-width: 360px;
    margin: 0 auto !important;
  }
  .full .info-panel{ width: 100%; }
}
/* Постер ~30% меньше (только десктоп) */
@media (min-width: 901px){
  .full{
    /* было 260/340 — уменьшаем до ~182/238 */
    --poster-w-min: 182px;
    --poster-w-max: 238px;
  }
  .full .poster-block,
  .full .poster-wrap{
    /* было 28vw — уменьшаем до 19.6vw (= 28 * 0.7) */
    width: clamp(var(--poster-w-min), 19.6vw, var(--poster-w-max)) !important;
  }
}
/* Отступ слева для "Описание" и всего текста ниже внутри правого блока */
.full .info-panel { --desc-pad-left: 16px; } /* подкорректируй 12–20 при желании */

.full .info-panel .content-title{
  margin: 16px 0 12px !important;
  padding-left: var(--desc-pad-left) !important;
}

/* весь контент описания после h2 с одинаковым левым отступом */
.full .info-panel .content-title ~ *{
  padding-left: var(--desc-pad-left) !important;
  box-sizing: border-box;
}

/* чтобы списки не выглядели «двойным» отступом */
.full .info-panel .content-title ~ ul,
.full .info-panel .content-title ~ ol{
  margin-left: 0 !important;
}

/* чуть компактнее на мобилках */
@media (max-width: 900px){
  .full .info-panel { --desc-pad-left: 12px; }
}

/*FIX PLASHKA*/

/* === Рейтинг: оверлей на нижнем крае постера (десктоп) === */
@media (min-width: 901px){
  .full .poster-block,
  .full .poster-wrap{
    position: relative !important;
    overflow: hidden !important;     /* повторяем скругления */
    border-radius: 12px;             /* чтобы бар совпадал по углам */
  }

  /* обоим классам плашки — одинаковое поведение */
  .full .poster-bar,
  .full .poster-meta{
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;

    /* вид плашки */
    background: #3b3b3b !important;  /* плотная тёмная */
    border-top: 1px solid rgba(255,255,255,.12) !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-radius: 0 !important;

    min-height: 46px;
    padding: 8px 12px !important;

    display: flex !important;
    align-items: center !important;
    z-index: 2;
  }

  /* равные интервалы и без налезаний */
  .full .rating-row{
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
  }
  .full .rating-row .rg-item{
    flex: 1 1 0 !important;
    min-width: 0;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    font-weight: 700;
    color: #fff;
  }
}

/* === Мобилка: как было — плашка под постером, не перекрывает === */
@media (max-width: 900px){
  .full .poster-bar,
  .full .poster-meta{
    position: static !important;
    margin-top: 10px !important;
    width: 100% !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
  }
}
/* MINI-FIX: плашка = продолжение постера, без наложения (desktop) */
@media (min-width: 901px){
  /* постер и бар — один «бутерброд»: картинка сверху, бар снизу */
  .full .poster-block,
  .full .poster-wrap{
    position: relative !important;
    overflow: visible !important;                  /* ничего не обрезаем */
  }

  /* у картинки только верхние скругления */
  .full .poster{
    border-radius: 12px 12px 0 0 !important;
    display: block !important;
  }

  /* сама плашка — СТАТИЧНО под картинкой (не absolute) */
  .full .poster-bar,
  .full .poster-meta{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    margin-top: 0 !important;                      /* без зазора у шва */

    background: #3b3b3b !important;
    /* нижние скругления, чтобы вместе с постером выглядело как единая карточка */
    border-radius: 0 0 12px 12px !important;

    /* тонкая разделительная линия по шву — можно убрать, если не нужна */
    border-top: 1px solid rgba(255,255,255,.12) !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;

    padding: 10px 14px !important;
    z-index: 1 !important;
  }

  /* равномерные интервалы внутри плашки */
  .full .rating-row{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
  }
  .full .rating-row .rg-item{
    flex: 1 1 0 !important;
    min-width: 0;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    font-weight: 700;
    color: #fff;
  }
}

/* на мобиле оставляем как было — бар под постером отдельным блоком */
@media (max-width: 900px){
  .full .poster-bar,
  .full .poster-meta{
    position: static !important;
    margin-top: 10px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    border-radius: 10px !important;
    padding: 10px 14px !important;
  }
}
/* ===== ЛАЙК/ДИЗ ПОД ПОСТЕРОМ ===== */
.full .poster-thumbs{
  margin-top: 10px;
  background: #0b0d12;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 10px;
  padding: 10px 12px;
}

/* Внутри – одна линия с ровными интервалами */
.full .poster-thumbs .rate--thumbs{
  display: grid;
  grid-template-columns: 1fr auto 1fr;  /* 👍  |  счётчики  |  👎 */
  align-items: center;
  gap: 8px;
}

/* Кнопки-иконки по краям, кликабельная площадь побольше */
.full .poster-thumbs .rate-btn{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 6px 10px;
  border-radius: 8px;
  cursor: pointer;
  user-select: none;
}
.full .poster-thumbs .rate-up{ justify-self: start; }
.full .poster-thumbs .rate-down{ justify-self: end; }

/* Счётчики по центру */
.full .poster-thumbs .rate-counts{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
}
.full .poster-thumbs .rate-counts .sep{ opacity: .4; }

/* Небольшая «подсветка» при наведении (необязательно) */
.full .poster-thumbs .rate-btn:hover{
  background: rgba(255,255,255,.06);
}

/* Мобилка: чуть компактнее */
@media (max-width: 480px){
  .full .poster-thumbs{ padding: 8px 10px; }
  .full .poster-thumbs .rate-btn{ padding: 6px 8px; }
}

/* === FIX: лайк/диз — без фона, идеально ровно и симметрично === */
.full .poster-thumbs .rate--thumbs{
  display: grid !important;
  grid-template-columns: 1fr auto 1fr !important; /* 👍 | counts | 👎 */
  align-items: center !important;
  justify-items: center !important;               /* всё по центру своих колонок */
  gap: 0 !important;
}

/* сами кнопки — без фона/рамок/тени, одинаковая «площадка» */
.full .poster-thumbs .rate-btn{
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;

  width: 40px;              /* одинаковая ширина зоны клика */
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  font-size: 20px;          /* одинаковый размер символов */
  cursor: pointer;
}

/* не тянем кнопки к краям — строго центр в своих колонках */
.full .poster-thumbs .rate-up,
.full .poster-thumbs .rate-down{
  justify-self: center !important;
}

/* центрируем счётчики */
.full .poster-thumbs .rate-counts{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0;
  text-align: center;
}

/* убираем любые прошлые подсветки при наведении */
.full .poster-thumbs .rate-btn:hover{
  background: none !important;
}

/*Ровность у Описания и доп полейй*/
/* Единый левый край внутри правого блока */
.full .info-panel { --edge-left: 16px; } /* подгони 12–20px по вкусу */

/* 1) Доп-поля (info-grid) — такой же отступ слева */
.full .info-panel .info-grid{
  padding-left: var(--edge-left) !important;
  box-sizing: border-box;
}

/* 2) Заголовок "Описание" и весь контент ниже — тот же отступ */
.full .info-panel .content-title{
  padding-left: var(--edge-left) !important;
  margin-left: 0 !important;
}
.full .info-panel .content-title ~ *{
  padding-left: var(--edge-left) !important;
  box-sizing: border-box;
}

/* 3) Чтобы списки не давали «двойной» отступ внутри описания */
.full .info-panel .content-title ~ ul,
.full .info-panel .content-title ~ ol{
  margin-left: 0 !important;
  padding-left: 1.2em; /* стандартная выемка маркеров внутри общего поля */
}

/* 4) Чуть почистим «паразитные» отступы у первых элементов описания */
.full .info-panel .content-title + p:first-of-type{ margin-top: 0; }

/* (опц.) Если у .info-panel есть свой внутренний padding-left, уравниваем: */
.full .info-panel{ padding-left: 0 !important; }

/*Темная оболочка на описание*/
/* Тёмная карточка вокруг постера и правого блока */
.full .full-card{
  background: #0b0d12;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 8px;
  padding: 18px;
  margin-top: 16px;
}

/* внутри неё оставляем текущую раскладку */
.full .full-card .top-row{
  display: flex;
  align-items: flex-start;
  gap: 24px;
}

/* чтобы не было «карточка в карточке» у правого блока */
.full .full-card .info-panel{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}
/*Конец Темная оболочка на описание*/
/*FOOTER*/
/* ===== футер ===== */
.site-footer{
  margin-top: 28px;
  background: #0b0d12;
  border-top: 1px solid rgba(255,255,255,.08);
  color: #cfd6df;
  font-size: 14px;
}
.site-footer__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 16px;
}
.site-footer__left{ display:flex; align-items:center; gap:12px; }
.site-footer__logo{ text-decoration:none; line-height:1; }

/* уменьшаем бренд из шапки */
.site-footer .brand-v10{ font-size: 22px; }

.site-footer__copy{ opacity:.9; }

.site-footer__right{ display:flex; align-items:center; gap:8px; white-space:nowrap; }
.site-footer__mail{ color:#fff; font-weight:600; text-decoration:none; }
.site-footer__mail:hover{ text-decoration:underline; }

@media (max-width: 680px){
  .site-footer__inner{ flex-direction:column; align-items:flex-start; gap:10px; }
  .site-footer .brand-v10{ font-size: 20px; }
}

/* Текстовый бренд в футере — меньше, без фонов */
.site-footer .brand-v10.brand--sm{
  font-size: 22px;            /* размер поменьше, чем в шапке */
  line-height: 1;
  text-decoration: none;
  background: none !important;
}
.site-footer .brand-v10.brand--sm .ufo,
.site-footer .brand-v10.brand--sm .film{
  display: inline-block;
}

/* если где-то остались старые стили .logo с картинкой — отключаем их */
.site-footer .logo,
.site-footer__logo{
  background: none !important;
  background-image: none !important;
}

/* адаптив: ещё чуть компактнее на узких экранах */
@media (max-width: 680px){
  .site-footer .brand-v10.brand--sm{ font-size: 20px; }
}

/*КОНЕЦ FOOTER*/
.full .poster-thumbs{ border: 0 !important; }
.full .poster-bar{ border: 0 !important; }

/* Бейдж предупреждения возраста */
.full .info .age-warn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px;
  border-radius: 8px;
  font-weight: 700;
  line-height: 1;
  color: #ff6b6b;                             /* красный текст */
  background: rgba(220, 38, 38, .12);         /* лёгкая красная подложка */
  border: 1px solid rgba(220, 38, 38, .45);   /* тонкая рамка */
}
.full .info .age-warn::before{
                               /* иконка предупреждения */
  font-size: 14px;
  line-height: 1;
}
/* Год под H1: на 20% меньше и полусерый */
/* Год под H1: на 20% меньше и полусерый */
.full .h1-year{
  display: block;
  margin-top: -20px;
  font-size: 1.4em;                 /* 20% меньше H1 */
  line-height: 1.1;
  color: rgba(255,255,255,.6);      /* полусерый (для тёмной темы) */
  font-weight: 600;                  /* можно убрать, если не нужно */
}

/* Мобилка: уменьшаем постер и подрезаем внутренние отступы */
@media (max-width: 680px){
  /* сам постер: уже и по центру */
  .full .poster-block{
    width: 100% !important;
    max-width: 280px;         /* подгони 260–300 по вкусу */
    margin: 0 auto 12px !important;
  }
  .full .poster{ border-radius: 10px 10px 0 0; }

  /* плашка рейтинга под постером — компактнее */
  .full .poster-bar{
    padding: 8px 10px !important;
    min-height: 40px;
  }
  .full .rating-row .rg-item .rg-val{ font-size: 13px; }

  /* блок лайк/диз — тоже компактнее */
  .full .poster-thumbs{
    padding: 8px 10px;
  }
  .full .poster-thumbs .rate-btn{
    width: 36px; height: 32px; font-size: 18px;
  }
}

/* Очень узкие экраны — ещё чуть меньше */
@media (max-width: 420px){
  .full .poster-block{ max-width: 240px; }
  .full .rating-row .rg-item .rg-val{ font-size: 12px; }
}
/* Конец Мобилка: уменьшаем постер и подрезаем внутренние отступы */
.pill-caret{
  transition: transform .2s ease;           /* плавная анимация */
  transform: rotate(45deg);                  /* закрытое состояние */
}
.select-wrap.open .pill-caret{
  transform: rotate(-135deg);                /* открытое состояние (перевёрнута) */
}

/* Единый размер для H1 внутри article/section/nav/aside — чтобы не было предупреждения PSI */
:root { --h1-size: clamp(28px, 3vw, 40px); }

h1,
article h1,
section h1,
nav h1,
aside h1{
  font-size: var(--h1-size);
}

/* Пилюли-фильтры: красивый серый скролл только у меню */
.pill-menu{
  /* для Firefox */
  scrollbar-width: thin;
  scrollbar-color: rgba(169,176,187,.55) var(--bg3); /* thumb / track */
}

/* для WebKit (Chrome/Edge/Safari) */
.pill-menu::-webkit-scrollbar{
  width: 10px;
}
.pill-menu::-webkit-scrollbar-track{
  background: var(--bg3);
  border-radius: 10px;
}
.pill-menu::-webkit-scrollbar-thumb{
  background: rgba(169,176,187,.55);   /* var(--muted) с прозрачностью */
  border-radius: 10px;
  border: 2px solid var(--bg3);        /* визуальный «зазор» внутри трека */
}
.pill-menu::-webkit-scrollbar-thumb:hover{
  background: rgba(169,176,187,.75);
}

/* === Mobile: ≤767.98px — убираем стрелки, 2 постера и без видимых скроллбаров === */
@media (max-width: 767.98px){
  /* Спрятать все варианты стрелок */
  .hf-prev, .hf-next,
  .sec .sec-prev, .sec .sec-next,
  .swiper-button-prev, .swiper-button-next {
    display: none !important;
  }

  /* HERO (блок #hf): 2 карточки во вьюпорте */
  #hf .hf-track {
    display: flex;             /* на мобиле переводим трек в flex */
    gap: 12px;                 /* интервал между карточками */
  }
  #hf .hf-track > * {
    flex: 0 0 calc((100% - 12px) / 2) !important; /* ровно 2 карточки */
    max-width: none;
  }
  /* свайп для HERO по-прежнему не включаем — как у тебя и было
     (если включишь overflow-x: auto, скроллбар всё равно будет скрыт правилами ниже) */

  /* Секции .sec: 2 карточки и свайп вместо стрелок */
  .sec .sec-viewport {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;      /* Firefox — скрыть полосу */
    -ms-overflow-style: none;   /* IE/старый Edge — скрыть полосу */
  }
  .sec .sec-viewport::-webkit-scrollbar { /* Chrome/Safari — скрыть полосу */
    display: none;
    width: 0;
    height: 0;
    background: transparent;
  }

  .sec .sec-track {
    display: flex;
    gap: 12px;
  }
  .sec .sec-track > * {
    flex: 0 0 calc((100% - 12px) / 2) !important; /* ровно 2 карточки */
    max-width: none;
  }
}