/* ========================================================================
   ИЗОЛИРОВАННЫЙ UI-KIT "МОИХ СПИСКОВ" (Без вреда для сайта)
   ======================================================================== */
/* Общие переменные для всего UI-кита */
.kp-ui-scope {
  --surface: #14161b;
  --surface-2: #1a1d23;
  --border: #22252b;
  --text: #ffffff;
  --muted: #8a8f98;
  --accent: #d92323;
  --radius: 12px;
  --radius-sm: 8px;
}

/* 
  Дальше пусть идет весь твой остальной код из файла, 
  который ты скинул: Компонент 1 и Компонент 2.
  Убедись, что Компонент 2 (начиная с .kp-lk__top и .kp-filters) там есть.
*/
/* Локальная палитра — действует СТРОГО внутри наших кнопок и баннеров */
.kp-controls, .kp-guest {
  --kp-surface: #14161b;
  --kp-surface-2: #1a1d23;
  --kp-border: #22252b;
  --kp-text: #ffffff;
  --kp-muted: #8a8f98;
  --kp-accent: #d92323;
  --kp-radius-sm: 8px;
  --kp-radius: 12px;
  --kp-shadow: 0 10px 30px rgba(0,0,0,.45);
}

/* ====== КОМПОНЕНТ №1: Панель кнопок ====== */
.kp-controls { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:20px; }
.kp-controls .kp-btn {
  display:inline-flex; align-items:center; gap:8px;
  height:44px; padding:0 18px; margin:0;
  background:var(--kp-surface-2); color:var(--kp-text);
  border:1px solid var(--kp-border); border-radius:var(--kp-radius-sm);
  font:600 14px/1 inherit; cursor:pointer; user-select:none;
  transition:all .15s ease;
}
.kp-controls .kp-btn:hover { background:#1f2229; border-color:#2c3038; }
.kp-controls .kp-btn:active { transform:translateY(1px); }
.kp-controls .kp-btn svg { width:18px; height:18px; flex:0 0 18px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* Кнопка "В избранное" */
.kp-controls .kp-fav .kp-fav__icon-fill { display:none; }
.kp-controls .kp-fav.is-active { border-color:var(--kp-accent); color:#fff; }
.kp-controls .kp-fav.is-active .kp-fav__icon { display:none; }
.kp-controls .kp-fav.is-active .kp-fav__icon-fill { display:block; fill:var(--kp-accent); stroke:var(--kp-accent); }

/* Выпадающий дропдаун */
.kp-controls .kp-dd { position:relative; }
.kp-controls .kp-dd__toggle .kp-dd__chev { transition:transform .2s; }
    .kp-controls .kp-dd.is-open .kp-dd__chev { transform:rotate(180deg); }
.kp-controls .kp-dd.has-value .kp-dd__toggle { border-color:var(--kp-accent); color:#fff; }
.kp-controls .kp-dd__menu {
  position:absolute; top:calc(100% + 8px); left:0; min-width:240px;
  background:#15181e; border:1px solid var(--kp-border); border-radius:var(--kp-radius-sm);
  padding:6px; box-shadow:var(--kp-shadow);
  opacity:0; visibility:hidden; transform:translateY(-4px);
  transition:all .15s; z-index:999;
}
.kp-controls .kp-dd.is-open .kp-dd__menu { opacity:1; visibility:visible; transform:translateY(0); }
.kp-controls .kp-dd__item {
  display:flex; align-items:center; gap:10px; width:100%;
  padding:10px 12px; background:transparent; border:0; border-radius:6px;
  color:var(--kp-text); font:500 14px/1.2 inherit; text-align:left; cursor:pointer;
}
.kp-controls .kp-dd__item:hover { background:#1f2229; }
.kp-controls .kp-dd__item.is-selected { color:var(--kp-accent); }
.kp-controls .kp-dd__item svg { width:16px; height:16px; color:var(--kp-muted); }
.kp-controls .kp-dd__item.is-selected svg { color:var(--kp-accent); }

/* Гостевой баннер */
.kp-guest {
  background:linear-gradient(180deg,#15181e,#111418);
  border:1px solid var(--kp-border); border-radius:var(--kp-radius);
  padding:18px 20px; max-width:640px; margin-top:20px;
}
.kp-guest__row { display:flex; gap:14px; align-items:flex-start; }
.kp-guest__lock {
  flex:0 0 38px; width:38px; height:38px; display:grid; place-items:center;
  background:#1c1f25; border:1px solid var(--kp-border); border-radius:10px; color:var(--kp-accent);
}
.kp-guest__lock svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.kp-guest__text { color:var(--kp-muted); font-size:14px; line-height:1.55; }
.kp-guest__text b { color:var(--kp-text); font-weight:600; }
.kp-guest .kp-link { color:var(--kp-accent); text-decoration:none; font-weight:600; border-bottom:1px dashed transparent; }
.kp-guest .kp-link:hover { border-bottom-color:var(--kp-accent); }
.kp-guest__more { display:inline-block; margin-top:10px; color:var(--kp-muted); font-size:13px; text-decoration:none; transition:color .15s; }
.kp-guest__more:hover { color:var(--kp-accent); }

/* ====== КОМПОНЕНТ №2: ЛИЧНЫЙ КАБИНЕТ (/MY-LISTS/) ====== */
.kp-lk-wrapper {
  --kp-bg: #0f1115;
  --kp-surface: #14161b;
  --kp-surface-2: #1a1d23;
  --kp-border: #22252b;
  --kp-text: #ffffff;
  --kp-muted: #8a8f98;
  --kp-accent: #d92323;
  --kp-accent-hover: #ef2f2f;
  --kp-radius: 12px;
  --kp-radius-sm: 8px;
  --kp-shadow: 0 10px 30px rgba(0,0,0,.45);
  
  background: var(--kp-bg);
  border: 1px solid var(--kp-border);
  border-radius: 16px;
  padding: 30px;
  font-family: inherit;
  color: var(--kp-text);
}
.kp-lk-wrapper * { box-sizing: border-box; }

.kp-lk__top { display:flex; flex-wrap:wrap; gap:12px; align-items:center; justify-content:space-between; margin-bottom:20px; }
.kp-lk__top h1 { font-size:26px; font-weight:700; margin:0 0 8px; color:var(--kp-text); }
.kp-lk__top p { color:var(--kp-muted); margin:0; font-size:14px; }

.kp-filters { display:flex; flex-wrap:wrap; gap:8px; margin-top: 16px; }
.kp-filters--genres { margin-top: 10px; }
.kp-chip {
  display:inline-flex; align-items:center; gap:8px;
  height:36px; padding:0 14px; border-radius:999px;
  background:var(--kp-surface-2); border:1px solid var(--kp-border); color:var(--kp-text);
  font:500 13px/1 inherit; cursor:pointer; transition:all .15s;
}
.kp-chip:hover { border-color:#2c3038; background:#1f2229; }
.kp-chip.is-active { background:var(--kp-accent); border-color:var(--kp-accent); color:#fff; }
.kp-chip__count {
  font-size:11px; font-weight:700; padding:2px 7px; border-radius:999px;
  background:rgba(255,255,255,.08); color:var(--kp-muted);
}
.kp-chip.is-active .kp-chip__count { background:rgba(0,0,0,.25); color:#fff; }

.kp-lk-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:16px; margin-top:30px; }
.kp-card {
  background:var(--kp-surface); border:1px solid var(--kp-border); border-radius:var(--kp-radius);
  overflow:hidden; display:flex; flex-direction:column; transition:transform .2s, border-color .2s;
}
.kp-card:hover { transform:translateY(-3px); border-color:#2c3038; }
.kp-card__poster { position:relative; aspect-ratio:2/3; background:#1a1d23 center/cover no-repeat; display:block; }
.kp-card__status {
  position:absolute; left:8px; top:8px; padding:5px 10px; border-radius:999px;
  background:rgba(15,17,21,.78); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.08);
  color:#fff; font-size:11px; font-weight:600; letter-spacing:.02em;
  display:inline-flex; align-items:center; gap:6px;
}
.kp-card__status::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--kp-accent); }
.kp-card__body { padding:12px 14px 14px; }
.kp-card__title { font-size:14px; font-weight:600; margin:0 0 4px; color:#fff; line-height:1.3; }
.kp-card__title a { color:#fff; text-decoration:none; }
.kp-card__title a:hover { color:var(--kp-accent); }
.kp-card__meta { font-size:12px; color:var(--kp-muted); padding-bottom: 5px; }

/* КРАСИВАЯ ЗАГЛУШКА ДЛЯ ГОСТЯ */
.kp-empty {
  min-height:400px; display:grid; place-items:center; text-align:center;
  background:radial-gradient(ellipse at center, #181b21, var(--kp-bg) 70%);
  border:1px solid var(--kp-border); border-radius:var(--kp-radius); padding:40px 20px;
  grid-column: 1 / -1; width: 100%;
}
.kp-empty__inner { max-width:460px; margin: 0 auto; }
.kp-empty__icon {
  width:96px; height:96px; margin:0 auto 24px; border-radius:24px;
  background:linear-gradient(135deg, #1a1d23, #101216);
  border:1px solid var(--kp-border); display:grid; place-items:center; color:var(--kp-accent);
  box-shadow:0 20px 40px -20px rgba(217,35,35,.35);
}
.kp-empty__icon svg { width:48px; height:48px; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.kp-empty__title { font-size:26px; font-weight:700; margin:0 0 10px; color:#fff; letter-spacing:-.01em; }
.kp-empty__sub { color:var(--kp-muted); font-size:15px; line-height:1.55; margin:0 0 24px; }
.kp-btn-primary {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:48px; padding:0 26px; border-radius:10px;
  background:var(--kp-accent); border:0; color:#fff; cursor:pointer;
  font:600 15px/1 inherit; text-decoration:none; transition:background .15s, transform .05s;
  box-shadow:0 10px 24px -10px rgba(217,35,35,.6);
}
.kp-btn-primary:hover { background:var(--kp-accent-hover); color:#fff; }
.kp-btn-primary:active { transform:translateY(1px); }

.kp-remove-btn {
    position: absolute;
    right: 8px;
    top: 8px;
    background: rgba(0,0,0,0.5);
    border: none;
    color: #fff;
    height: 24px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    cursor: pointer;
    transition: background 0.2s;
}
.kp-remove-btn:hover { background: #d92323; }
.kp-remove-btn svg { stroke: currentColor; stroke-width: 2; }

/* --- БЕЗОПАСНЫЙ ВОЗВРАТ КРАСНОГО ЦВЕТА ПРЕМЬЕРЕ НЕДЕЛИ --- */
span.kp-chip.kp-chip--accent {
    background: #e50914 !important; /* Фирменный красный цвет кинопортала */
    color: #ffffff !important;
    border-color: #e50914 !important;
}
/* =========================================================
   News v2 — стили для shortstory.tpl и fullstory.tpl (DLE 20)
   Палитра: bg #0f1115, surface #14161b, border #22252b,
            text #fff / muted #8a8f98, accent #d92323
   Добавь содержимое этого файла в свой main.css темы.
   ========================================================= */
/* ---------- Список новостей: сетка ---------- */
.kp-news-grid{
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
}
@media (max-width: 900px){ .kp-news-grid{ grid-template-columns: 1fr; } }
/* ---------- Карточка новости (shortstory) ---------- */
.kp-news-card{
	display: grid;
	grid-template-columns: 280px 1fr;
	gap: 18px;
	background: #14161b;
	border: 1px solid #22252b;
	border-radius: 14px;
	overflow: hidden;
	transition: border-color .2s ease, transform .2s ease;
}
.kp-news-card:hover{ border-color: #d92323; }
@media (max-width: 640px){
	.kp-news-card{ grid-template-columns: 1fr; }
}
.kp-news-card__thumb{
	position: relative;
	display: block;
	aspect-ratio: 16/10;
	background: #0f1115;
	overflow: hidden;
}
.kp-news-card__thumb img{
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform .4s ease;
}
.kp-news-card:hover .kp-news-card__thumb img{ transform: scale(1.04); }
.kp-news-card__noimg{
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	color: #3a3f47;
}
.kp-news-card__cat{
	position: absolute;
	top: 10px; left: 10px;
	background: #d92323;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	padding: 4px 10px;
	border-radius: 6px;
}
.kp-news-card__body{
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px 18px 16px 0;
}
@media (max-width: 640px){
	.kp-news-card__body{ padding: 0 16px 16px; }
}
.kp-news-card__meta{
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	font-size: 12px;
	color: #8a8f98;
}
.kp-news-card__meta time,
.kp-news-card__meta .kp-news-card__views,
.kp-news-card__meta .kp-news-card__comm{
	display: inline-flex; align-items: center; gap: 5px;
}
.kp-news-card__dot{ opacity: .5; }
.kp-news-card__title{
	margin: 0;
	font-size: 18px;
	line-height: 1.3;
	font-weight: 600;
}
.kp-news-card__title a{
	color: #fff;
	text-decoration: none;
	transition: color .15s ease;
}
.kp-news-card__title a:hover{ color: #d92323; }
.kp-news-card__text{
	color: #8a8f98;
	font-size: 14px;
	line-height: 1.55;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.kp-news-card__foot{
	display: flex; align-items: center; justify-content: space-between;
	margin-top: auto;
	padding-top: 6px;
}
.kp-news-card__more{
	display: inline-flex; align-items: center; gap: 6px;
	color: #d92323;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}
.kp-news-card__more:hover{ color: #ef2f2f; }
.kp-news-card__more svg{ transition: transform .2s ease; }
.kp-news-card__more:hover svg{ transform: translateX(3px); }
.kp-news-card__edit i{
	font-style: normal;
	color: #8a8f98;
	font-size: 12px;
	cursor: pointer;
}
.kp-news-card__edit i:hover{ color: #d92323; }
/* ---------- Полная новость (fullstory) ---------- */
.kp-news-full{
	background: #14161b;
	border: 1px solid #22252b;
	border-radius: 16px;
	padding: 32px;
	color: #fff;
}
@media (max-width: 640px){ .kp-news-full{ padding: 20px; border-radius: 12px; } }
.kp-news-full__head{ margin-bottom: 22px; }
.kp-news-full__cat{
	display: inline-block;
	background: #d92323;
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	padding: 5px 12px;
	border-radius: 6px;
	text-decoration: none;
	margin-bottom: 14px;
}
.kp-news-full__cat:hover{ background: #ef2f2f; }
.kp-news-full__title{
	margin: 0 0 16px;
	font-size: 32px;
	line-height: 1.2;
	font-weight: 700;
	letter-spacing: -.01em;
}
@media (max-width: 640px){ .kp-news-full__title{ font-size: 24px; } }
.kp-news-full__meta{
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
	font-size: 13px;
	color: #8a8f98;
	padding-bottom: 18px;
	border-bottom: 1px solid #22252b;
}
.kp-news-full__meta > span,
.kp-news-full__meta > a,
.kp-news-full__meta > time{
	display: inline-flex; align-items: center; gap: 6px;
}
.kp-news-full__meta a{ color: #8a8f98; text-decoration: none; }
.kp-news-full__meta a:hover{ color: #d92323; }
.kp-news-full__sep{ opacity: .5; }
.kp-news-full__cover{
	margin: 22px 0 26px;
	border-radius: 12px;
	overflow: hidden;
	background: #0f1115;
}
.kp-news-full__cover img{ width: 100%; height: auto; display: block; }
.kp-news-full__content{
	font-size: 16px;
	line-height: 1.7;
	color: #e7e8ea;
}
.kp-news-full__content p{ margin: 0 0 1em; }
.kp-news-full__content h2,
.kp-news-full__content h3,
.kp-news-full__content h4{
	color: #fff;
	margin: 1.5em 0 .6em;
	line-height: 1.3;
}
.kp-news-full__content h2{ font-size: 22px; }
.kp-news-full__content h3{ font-size: 19px; }
.kp-news-full__content a{ color: #d92323; text-decoration: none; border-bottom: 1px solid rgba(217,35,35,.4); }
.kp-news-full__content a:hover{ border-bottom-color: #d92323; }
.kp-news-full__content img{ max-width: 100%; height: auto; border-radius: 10px; }
.kp-news-full__content blockquote{
	margin: 1.2em 0;
	padding: 14px 18px;
	background: #0f1115;
	border-left: 3px solid #d92323;
	border-radius: 8px;
	color: #cfd1d5;
}
.kp-news-full__content ul,
.kp-news-full__content ol{ padding-left: 1.4em; margin: 0 0 1em; }
.kp-news-full__content li{ margin-bottom: .4em; }
.kp-news-full__tags{
	display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid #22252b;
	font-size: 13px;
	color: #8a8f98;
}
.kp-news-full__tags a{
	display: inline-block;
	background: #0f1115;
	border: 1px solid #22252b;
	padding: 4px 10px;
	border-radius: 6px;
	color: #cfd1d5;
	text-decoration: none;
	transition: all .15s ease;
}
.kp-news-full__tags a:hover{
	border-color: #d92323;
	color: #d92323;
}
.kp-news-full__foot{
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
	gap: 14px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid #22252b;
}
.kp-news-full__share{
	display: flex; align-items: center; gap: 10px;
	color: #8a8f98;
	font-size: 13px;
}
.kp-news-full__actions{ display: flex; flex-wrap: wrap; gap: 8px; }
.kp-news-full__btn{
	display: inline-flex; align-items: center; gap: 6px;
	background: #0f1115;
	border: 1px solid #22252b;
	color: #cfd1d5;
	padding: 8px 14px;
	border-radius: 8px;
	font-size: 13px;
	text-decoration: none;
	cursor: pointer;
	transition: all .15s ease;
}
.kp-news-full__btn:hover{ border-color: #d92323; color: #fff; }
.kp-news-full__btn--accent{
	background: #d92323;
	border-color: #d92323;
	color: #fff;
}
.kp-news-full__btn--accent:hover{ background: #ef2f2f; border-color: #ef2f2f; }
.kp-news-full__rating{
	display: flex; align-items: center; gap: 10px;
	margin-top: 18px;
	padding: 14px 16px;
	background: #0f1115;
	border: 1px solid #22252b;
	border-radius: 10px;
	font-size: 13px;
	color: #8a8f98;
}
/* ---------- Похожие материалы ---------- */
.kp-news-related{
	margin-top: 28px;
	padding-top: 22px;
	border-top: 1px solid #22252b;
}
.kp-news-related__title{
	margin: 0 0 14px;
	font-size: 18px;
	font-weight: 600;
	color: #fff;
}
.kp-news-related__list{
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
}
@media (max-width: 800px){ .kp-news-related__list{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px){ .kp-news-related__list{ grid-template-columns: 1fr; } }
.kp-news-related__list a{
	color: #cfd1d5;
	text-decoration: none;
	font-size: 14px;
	line-height: 1.4;
	display: block;
	padding: 12px 14px;
	background: #0f1115;
	border: 1px solid #22252b;
	border-radius: 10px;
	transition: all .15s ease;
}
.kp-news-related__list a:hover{ border-color: #d92323; color: #fff; }

/* Принудительно задаем темный фон всем таблицам внутри контента */
.kp-news-full-content table, 
.kp-news-full-content table tr, 
.kp-news-full-content table td {
    background: #1c1c1c !important; /* Темный фон */
    color: #e0e0e0 !important;      /* Светлый текст */
    border: 1px solid #333 !important;
}
.kp-news-card__thumb {
    flex-shrink: 0;
}
/* Специально для новостей — меняем пропорции */
.kp-card__poster--news {
    aspect-ratio: 16 / 9; /* Горизонтальный, как на скрипте 15 */
    /* Или если хочешь вертикальный: aspect-ratio: 2 / 3; */
}
/* 1. Делаем обертку относительной, чтобы меню не улетало со своего места */
.kp-podborki-dropdown {
    position: relative;
    display: inline-block;
    margin-left: 10px; /* Отступ от соседней кнопки */
}

/* 2. Механика выпадающего меню (скрыто по умолчанию) */
.kp-podborki-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 8px;
    background: #181824; /* Темный фон меню */
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 12px;
    padding: 12px;
    min-width: 200px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
    z-index: 100;
}

/* 3. Показываем меню при наведении на блок */
.kp-podborki-dropdown:hover .kp-podborki-menu {
    display: block;
}

/* 4. Принудительно выстраиваем подборки в столбик ТОЛЬКО внутри этого меню */
.kp-podborki-menu .podborki-list {
    display: flex !important;
    flex-direction: column !important; /* Перебиваем глобальный flex-row или wrap */
    gap: 8px !important;
    margin: 0 !important;
}

/* 5. Растягиваем теги на ширину меню */
.kp-podborki-menu .podborka-tag {
    display: block !important;
    text-align: center !important;
    /* Цвета и фоны автоматически подтянутся из твоих глобальных стилей! */
}
/* Умная адаптация плеера для всех устройств */
.kp-player-frame {
    width: 100% !important;
    max-width: 1230px; /* Твоя максимальная ширина на ПК */
    aspect-ratio: 16 / 9; /* Автоматически держит правильные пропорции экрана */
    height: auto !important; /* Отменяет фиксированную высоту */
    border-radius: var(--radius, 14px); /* Добавляет скругления как у всего сайта */
    background: #000;
    display: block;
}
/* Точечно обращаемся только к div с классом podborki-list внутри kp-listing__body */
div.kp-listing__body > div.podborki-list {
    display: grid !important;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; 
    gap: 20px !important;
    width: 100% !important;
}

div.podborki-list > div.podborka-card {
    width: 100% !important;
    max-width: none !important;
}
/* =========================================================
   Series v2 — График выхода серий (schedule.tpl)
   Палитра: bg #0f1115, surface #14161b, border #22252b,
            text #fff / muted #8a8f98, accent #d92323
   ========================================================= */

.kp-schedule{
	color: #fff;
	background: #14161b;
	border: 1px solid #22252b;
	border-radius: 14px;
	padding: 18px;
}

/* ---------- Шапка ---------- */
.kp-schedule__header{ margin-bottom: 14px; }
.kp-schedule__title{
	margin: 0 0 12px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.2;
	color: #fff;
}

/* CTA-кнопка */
.kp-schedule__cta{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	min-height: 46px;
	padding: 10px 16px;
	background: #d92323;
	border: 1px solid #d92323;
	border-radius: 10px;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease, transform .15s ease;
}
.kp-schedule__cta:hover{
	background: #b51c1c;
	border-color: #b51c1c;
	transform: translateY(-1px);
}
.kp-schedule__cta svg{ flex-shrink: 0; }

/* ---------- Список серий ---------- */
.kp-schedule__list{
	background: #0f1115;
	border: 1px solid #22252b;
	border-radius: 10px;
	overflow: hidden;
}

.kp-schedule__item.is-hidden{ display: none; }

.kp-schedule__item{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 11px 14px;
	border-bottom: 1px solid #22252b;
	transition: background .15s ease;
}
.kp-schedule__item:last-child{ border-bottom: 0; }
.kp-schedule__item:hover{ background: #181a20; }

/* Ближайшая невышедшая серия */
.kp-schedule__item.is-upcoming{
	position: relative;
	background: rgba(217,35,35,.06);
	border-left: 3px solid #d92323;
	padding-left: 11px;
}
.kp-schedule__item.is-upcoming::before{
	content: 'Скоро';
	position: absolute;
	left: 14px;
	top: -8px;
	padding: 2px 7px;
	background: #d92323;
	border-radius: 4px;
	color: #fff;
	font-size: 9px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .05em;
}

.kp-schedule__left{
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.kp-schedule__num{
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
}
.kp-schedule__name{
	color: #8a8f98;
	font-size: 12px;
	line-height: 1.25;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.kp-schedule__date{
	flex-shrink: 0;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: #8a8f98;
	font-size: 12.5px;
	font-weight: 500;
	white-space: nowrap;
}
.kp-schedule__date svg{ flex-shrink: 0; color: #8a8f98; }

/* ---------- Кнопка развернуть/свернуть ---------- */
.kp-schedule__toggler{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	width: 100%;
	margin-top: 12px;
	padding: 10px;
	background: transparent;
	border: 1px solid #22252b;
	border-radius: 10px;
	color: #8a8f98;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.kp-schedule__toggler:hover{
	color: #fff;
	border-color: #d92323;
	background: rgba(217,35,35,.08);
}
.kp-schedule__toggler-icon{
	transition: transform .2s ease;
}
.kp-schedule__list.is-collapsed + .kp-schedule__toggler .kp-schedule__toggler-icon{
	transform: rotate(180deg);
}

/* ---------- Адаптивность ---------- */
@media (max-width: 640px){
	.kp-schedule{ padding: 14px; border-radius: 12px; }
	.kp-schedule__title{ font-size: 16px; }
	.kp-schedule__cta{ font-size: 13px; min-height: 44px; }

	.kp-schedule__item{
		align-items: flex-start;
		gap: 10px;
		padding: 14px;
	}
	.kp-schedule__left{ gap: 3px; }
	.kp-schedule__num{ font-size: 13px; }
	.kp-schedule__name{ font-size: 11.5px; white-space: normal; }
	.kp-schedule__date{
		font-size: 12px;
		align-items: flex-start;
		flex-direction: column;
		gap: 4px;
	}
}

@media (max-width: 420px){
	.kp-schedule__item{
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}
	.kp-schedule__date{
		flex-direction: row;
		align-items: center;
	}
}
  /* ============================================
     КОМПОНЕНТ №5 — СЪЁМОЧНАЯ ГРУППА (Актёры/Режиссёры)
     ============================================ */
  .uk-cast {
    position: relative; color: var(--text);
    background: var(--surface);
    border: 1px solid var(--border);
    border-radius: 12px;
    padding: 16px;
  }
  .uk-cast__head {
    display: flex; align-items: center; gap: 10px; margin-bottom: 16px;
    border-bottom: 1px solid var(--border); padding-bottom: 12px;
  }
  .uk-cast__title { margin: 0; font-size: 20px; font-weight: 700; color: var(--text); }
  .uk-cast__count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 26px; height: 20px; padding: 0 7px;
    background: var(--surface); border: 1px solid var(--border);
    border-radius: 999px; color: var(--muted); font-size: 12px; font-weight: 600;
  }
  .uk-cast__grid {
    display: grid; grid-template-columns: repeat(8, 1fr); gap: 12px;
  }
  .uk-cast__card {
    display: block; text-decoration: none; color: inherit;
    transition: transform .18s ease;
    outline: none;
  }
  .uk-cast__card:hover { transform: translateY(-4px) scale(1.02); }
  .uk-cast__card:focus-visible .uk-cast__photo {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(217,35,35,.35);
  }
  .uk-cast__photo {
    position: relative; width: 100%; aspect-ratio: 2/3;
    border-radius: 10px; overflow: hidden;
    background: var(--surface); border: 1px solid var(--border);
    margin-bottom: 10px;
    transition: border-color .18s ease, box-shadow .18s ease;
  }
  .uk-cast__card:hover .uk-cast__photo {
    border-color: var(--accent);
  }
  .uk-cast__photo img {
    width: 100%; height: 100%; display: block;
    transition: transform .2s ease;
  }
  .uk-cast__card:hover .uk-cast__photo img { transform: scale(1.05); }
  .uk-cast__placeholder {
    display: grid; place-items: center; width: 100%; height: 100%;
    background: var(--surface); color: var(--muted);
    font-size: 32px; font-weight: 700; text-transform: uppercase;
  }
  .uk-cast__name {
    margin: 0 0 3px; font-size: 13.5px; font-weight: 700;
    color: var(--text); line-height: 1.25;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .uk-cast__role { font-size: 12px; color: var(--muted); line-height: 1.2; }
  .uk-cast__role--director { color: var(--accent); }
  .uk-cast__nav { display: none; }

  @media (max-width: 1200px) { .uk-cast__grid { grid-template-columns: repeat(6, 1fr); } }
  @media (max-width: 900px)  { .uk-cast__grid { grid-template-columns: repeat(5, 1fr); } }
  @media (max-width: 720px)  { .uk-cast__grid { grid-template-columns: repeat(4, 1fr); gap: 10px; } }
  @media (max-width: 560px) {
    .uk-cast__grid {
      display: flex; flex-wrap: nowrap; gap: 12px;
      overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none; -ms-overflow-style: none;
      padding: 4px 0 12px;
    }
    .uk-cast__grid::-webkit-scrollbar { display: none; }
    .uk-cast__card { flex: 0 0 auto; width: 120px; scroll-snap-align: start; }
    .uk-cast__title { font-size: 18px; }
    .uk-cast__nav {
      position: absolute; top: 50%; transform: translateY(-50%);
      z-index: 2; display: flex; align-items: center; justify-content: center;
      width: 34px; height: 34px; border: 0; border-radius: 50%;
      background: var(--surface); color: var(--text);
      box-shadow: 0 4px 12px rgba(0,0,0,.35);
      cursor: pointer; transition: .18s ease; padding: 0;
    }
    .uk-cast__nav:hover { background: var(--accent); color: #fff; }
    .uk-cast__nav svg { width: 18px; height: 18px; }
    .uk-cast__nav--prev { left: -6px; }
    .uk-cast__nav--next { right: -6px; }
  }
    .uk-wrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px 80px;
  }

  .uk-section {
    margin-bottom: 48px;
  }

  .uk-section__title {
    font-size: 13px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--muted);
    margin: 0 0 16px;
    font-weight: 600;
  }
  /* ============================================
     КОМПОНЕНТ №4 — КНОПКИ ПОДПИСКИ
     ============================================ */
  .uk-subs {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
  }

  .uk-sub-btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 20px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
    font-family: inherit;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
    outline: none;
  }

  .uk-sub-btn svg {
    flex-shrink: 0;
  }

  /* Состояние А — Не подписан */
  .uk-sub-btn--idle {
    background: var(--surface);
    color: var(--text);
    border: 1px solid var(--border);
  }

  .uk-sub-btn--idle:hover {
    border-color: var(--accent);
    color: var(--accent);
  }

  /* Состояние Б — Подписан */
  .uk-sub-btn--active {
    background: var(--accent);
    color: #ffffff;
    border: 1px solid var(--accent);
  }

  .uk-sub-btn--active:hover {
    background: #b91d1d;
    border-color: #b91d1d;
  }

  .uk-caption {
    color: var(--muted);
    font-size: 12px;
    margin-top: 8px;
    display: block;
  }
  /* =========================================================
   Series v2 — Гид по сериям (episodes.tpl)
   Палитра: bg #0f1115, surface #14161b, border #22252b,
            text #fff / muted #8a8f98, accent #d92323
   ========================================================= */

.kp-episodes{ color: #fff; }

/* ---------- Шапка ---------- */
.kp-episodes__head{
	display: flex; align-items: center; justify-content: space-between;
	gap: 16px;
	background: #14161b;
	border: 1px solid #22252b;
	border-radius: 14px;
	padding: 16px;
	margin-bottom: 18px;
}
.kp-episodes__head-left{
	display: flex; align-items: center; gap: 14px;
	min-width: 0;
}
.kp-episodes__poster{
	display: block;
	flex-shrink: 0;
	width: 60px; height: 90px;
	border-radius: 8px;
	overflow: hidden;
	background: #0f1115;
	border: 1px solid #22252b;
}
.kp-episodes__poster img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.kp-episodes__head-info{ min-width: 0; }
.kp-episodes__series{
	color: #8a8f98;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: .06em;
	margin-bottom: 4px;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kp-episodes__season{
	margin: 0;
	font-size: 26px;
	font-weight: 700;
	letter-spacing: -.01em;
	line-height: 1.1;
	color: #fff;
}

.kp-episodes__head-right{ flex-shrink: 0; }
.kp-episodes__select{
	position: relative;
	display: block;
	min-width: 200px;
}
.kp-episodes__select > span{
	position: absolute; left: 12px; top: 6px;
	font-size: 10px;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: #8a8f98;
	pointer-events: none;
}
.kp-episodes__select select{
	width: 100%;
	height: 46px;
	padding: 16px 34px 4px 12px;
	background: #0f1115;
	border: 1px solid #22252b;
	border-radius: 10px;
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	outline: none;
	transition: border-color .15s ease;
}
.kp-episodes__select select:focus,
.kp-episodes__select select:hover{ border-color: #d92323; }
.kp-episodes__select > svg{
	position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
	color: #8a8f98;
	pointer-events: none;
}

@media (max-width: 640px){
	.kp-episodes__head{ flex-direction: column; align-items: stretch; }
	.kp-episodes__head-right{ width: 100%; }
	.kp-episodes__select{ min-width: 0; }
	.kp-episodes__season{ font-size: 22px; }
}

/* ---------- Список эпизодов ---------- */
.kp-episodes__list{
	background: #14161b;
	border: 1px solid #22252b;
	border-radius: 14px;
	overflow: hidden;
}

.kp-ep{
	display: grid;
	grid-template-columns: 40px 160px 1fr auto;
	align-items: center;
	gap: 14px;
	padding: 12px 16px;
	border-bottom: 1px solid #22252b;
	transition: background .15s ease;
}
.kp-ep:last-child{ border-bottom: 0; }
.kp-ep:hover{ background: #191c22; }

/* Кнопка "Глаз" */
.kp-ep__eye{
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent;
	border: 1px solid #22252b;
	border-radius: 8px;
	color: #8a8f98;
	cursor: pointer;
	padding: 0;
	transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.kp-ep__eye:hover{ color: #fff; border-color: #3a3f47; }
.kp-ep__eye.is-watched{
	color: #d92323;
	border-color: #d92323;
	background: rgba(217,35,35,.08);
}

/* Номер */
.kp-ep__num{
	color: #8a8f98;
	font-size: 13px;
	font-weight: 500;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Название */
.kp-ep__title{ min-width: 0; }
.kp-ep__title-ru{
	color: #fff;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kp-ep__title-en{
	color: #8a8f98;
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.3;
	margin-top: 2px;
	overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}

/* Кнопка "Смотреть" */
.kp-ep__watch{
	display: inline-flex; align-items: center; gap: 6px;
	height: 36px;
	padding: 0 16px;
	background: transparent;
	border: 1px solid #22252b;
	border-radius: 8px;
	color: #cfd1d5;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	transition: all .15s ease;
	white-space: nowrap;
}
.kp-ep__watch:hover{
	background: #d92323;
	border-color: #d92323;
	color: #fff;
}
.kp-ep__watch svg{ flex-shrink: 0; }

/* ---------- Мобильная адаптация ---------- */
@media (max-width: 720px){
	.kp-ep{
		grid-template-columns: 44px 1fr auto;
		grid-template-areas:
			"eye title watch"
			"eye num   watch";
		gap: 4px 12px;
		padding: 12px 14px;
	}
	.kp-ep__eye{
		grid-area: eye;
		align-self: center;
		width: 44px; height: 44px;
	}
	.kp-ep__title{
		grid-area: title;
		order: 1;
	}
	.kp-ep__num{
		grid-area: num;
		order: 2;
		font-size: 11.5px;
		text-transform: uppercase;
		letter-spacing: .04em;
	}
	.kp-ep__watch{
		grid-area: watch;
		align-self: center;
		height: 44px;
		padding: 0 14px;
	}
	.kp-ep__title-ru{ font-size: 14px; white-space: normal; }
	.kp-ep__title-en{ display: none; }
}

@media (max-width: 400px){
	.kp-ep__watch span{ display: none; }
	.kp-ep__watch{ width: 44px; padding: 0; justify-content: center; }
}
/* ============================================
   БЕЙДЖИ РЕЛИЗА (4K, Реклама, ЛГБТ)
   ============================================ */
.kp-release-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 15px 0; /* Отступы сверху и снизу, отрегулируй по вкусу */
}

.kp-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 1px solid transparent;
    cursor: default;
}

.kp-badge svg {
    width: 14px;
    height: 14px;
}

/* 4K - Золотой/Желтый акцент */
.kp-badge--4k {
    color: #f5c518;
    background: rgba(245, 197, 24, 0.1);
    border-color: rgba(245, 197, 24, 0.3);
}

/* Реклама - Оранжевый/Предупреждающий акцент */
.kp-badge--adv {
    color: #f97316;
    background: rgba(249, 115, 22, 0.1);
    border-color: rgba(249, 115, 22, 0.3);
}

/* ЛГБТ/18+ - Фиолетовый акцент */
.kp-badge--lgbt {
    color: #d946ef;
    background: rgba(217, 70, 239, 0.1);
    border-color: rgba(217, 70, 239, 0.3);
}
.kp-poster-wrapper { position: relative; }
.kp-poster-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: rgba(245, 197, 24, 0.9);
    color: #000;
    padding: 3px 8px;
    border-radius: 4px;
    font-weight: 800;
    font-size: 10px;
    text-transform: uppercase;
}
.kp-specs {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 2 колонки, чтобы занять всё место */
    gap: 15px;
    margin-top: 20px;
    padding: 15px;
    background: rgba(255,255,255,0.03);
    border-radius: 12px;
}
.kp-specs__label { color: #888; font-size: 12px; display: block; }
.kp-voiceovers-block {
    display: flex;
    align-items: center;
    background: rgba(255,255,255,0.03); /* Тот же фон, что у блока выше */
    padding: 15px;
    border-radius: 12px;
    margin-top: 15px;
}

.kp-voice-title {
    color: #888;
    margin-right: 15px;
    font-size: 14px;
}

.kp-voice-links {
    font-size: 0; /* Магия: прячем запятые от DLE */
}

.kp-voice-links a {
    font-size: 11px; /* Возвращаем размер текста кнопкам */
    display: inline-block;
    background: #1a1a1a;
    border: 1px solid rgba(255,255,255,0.1);
    color: #ccc;
    padding: 5px 10px;
    border-radius: 6px;
    margin: 3px;
    text-decoration: none;
    text-transform: uppercase;
    transition: 0.2s;
}

.kp-voice-links a:hover {
    background: #e50914; /* Красный акцент при наведении */
    color: #fff;
    border-color: #e50914;
}
.kp-poster-container {
    position: relative; /* Обязательно, чтобы бейдж не улетел за пределы картинки */
    overflow: hidden;
    border-radius: 12px;
}

.kp-badge-on-poster {
    position: relative;
    background: #f5c518; /* Золотой цвет */
    color: #000;
    font-weight: 900;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.5);
}
.kp-genres-block {
    background: rgba(255,255,255,0.03);
    padding: 12px 15px;
    border-radius: 12px;
    margin-top: 15px;
    text-align: center; /* Центрируем текст */
    font-size: 14px;
}

.kp-genres-block a {
    color: #fff;
    text-decoration: none;
    margin: 0 5px;
}

.kp-genres-block a:hover {
    color: #e50914;
}
/* Делаем так, чтобы на экранах меньше 768px колонки выстраивались друг под другом */
@media (max-width: 768px) {
    .kp-full__top {
        flex-direction: column !important;
        align-items: center;
    }
    
    .kp-full__poster {
        width: 100%;
        max-width: 320px; /* Ограничиваем ширину постера, чтобы он не был гигантским */
        margin: 0 auto;
    }
    
    .kp-full__info {
        width: 100%;
    }
    
    /* Скрываем хвосты у плашек на мобильном, если они всё же вылезают */
    .kp-meta-row {
        width: 100%;
    }
}
/* РОДИТЕЛЬ: запрещаем тянуться на 100% ширины, убиваем длинные хвосты */
.kp-meta-list {
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* Блоки обжимают контент по ширине */
    gap: 8px;
    margin-top: 20px;
}

/* СТРОКА ТЕМНОГО ФОНА */
.kp-meta-row {
    display: inline-flex;
    align-items: center;
    background: rgba(255,255,255,0.03);
    padding: 6px 12px;
    border-radius: 12px;
    flex-wrap: wrap; /* Спасает мобильную верстку */
}

/* НАЗВАНИЕ ПОЛЯ */
.kp-meta-label {
    color: #888;
    font-size: 13px;
    margin-right: 15px;
}

/* ПРЯЧЕМ ЗАПЯТЫЕ ОТ DLE */
.kp-meta-values {
    font-size: 0; 
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* СТИЛЬ ПИЛЮЛЬ (Жанры, Год, Озвучка) */
.kp-meta-values a, 
.kp-meta-values span {
    font-size: 11px;
    display: inline-block;
    background: #1a1a1a;
    border: 1px solid rgba(255,255,255,0.1);
    color: #ccc;
    padding: 5px 12px;
    border-radius: 6px;
    text-decoration: none;
    text-transform: uppercase;
    transition: 0.2s;
}

/* ХОВЕР ДЛЯ КЛИКАБЕЛЬНЫХ ССЫЛОК */
.kp-meta-values a:hover {
    background: #e50914;
    color: #fff;
    border-color: #e50914;
}

/* СПЕЦ-СТИЛЬ ДЛЯ ВОЗРАСТА (без ховера, цветной акцент) */
.kp-meta-values span.kp-age-limit {
    border-color: rgba(217, 70, 239, 0.3);
    color: #d946ef;
}
/* Контейнер на постере */
.kp-mini-ratings {
    position: absolute;
    top: 10px;
    right: 10px;
    display: flex;
    flex-direction: column; /* Выстраивает плашки друг под другом */
    gap: 6px;
    z-index: 10;
}

/* Общая форма плашки (темный фон + рамка) */
.kp-mini-rating {
    display: inline-flex;
    align-items: center;
    background: rgba(20, 20, 20, 0.85); /* Темный фон */
    border: 1px solid rgba(255, 255, 255, 0.15); /* Тонкая светлая рамка */
    border-radius: 8px; /* Скругление внешнего блока */
    padding: 3px 10px 3px 3px; /* Внутренние отступы (слева меньше из-за цветного квадрата) */
    backdrop-filter: blur(4px);
}

/* Цветной квадратик (КП / IMDB) */
.kp-mini-badge {
    font-size: 11px;
    font-weight: 800;
    border-radius: 6px; /* Скругление внутреннего квадрата */
    padding: 4px 6px;
    margin-right: 8px; /* Отступ от цифры */
    line-height: 1;
}

.kp-mini-badge--kp {
    background: #ff6600;
    color: #fff;
}

.kp-mini-badge--imdb {
    background: #f5c518;
    color: #000;
}

/* Сама цифра рейтинга */
.kp-mini-val {
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    line-height: 1;
}
/* ==========================================
   МОБИЛЬНОЕ ВЫЕЗЖАЮЩЕЕ МЕНЮ
   ========================================== */

/* Кнопка 3 полоски (скрыта на ПК, видна на мобилках) */
.kp-mobile-menu-btn {
    display: none;
    flex-direction: column;
    justify-content: space-between;
    width: 26px;
    height: 18px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    margin-right: 15px;
}

.kp-mobile-menu-btn span {
    width: 100%;
    height: 2px;
    background-color: #fff;
    border-radius: 2px;
    transition: 0.3s;
}

/* Выезжающая панель */
.kp-mobile-drawer {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 9999;
    visibility: hidden;
    opacity: 0;
    transition: 0.3s ease;
}

.kp-mobile-drawer.active {
    visibility: visible;
    opacity: 1;
}

.kp-mobile-drawer__overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0, 0, 0, 0.7);
    backdrop-filter: blur(4px);
}

.kp-mobile-drawer__content {
    position: absolute;
    top: 0; left: 0;
    width: 280px;
    background: #14161b;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    padding: 25px 20px;
    box-sizing: border-box;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}

.kp-mobile-drawer.active .kp-mobile-drawer__content {
    transform: translateX(0);
}

.kp-mobile-drawer__head {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.kp-mobile-drawer__title {
    color: #fff;
    font-weight: 700;
    font-size: 18px;
}

.kp-mobile-drawer__close {
    background: none;
    border: none;
    color: #8a8f98;
    font-size: 28px;
    cursor: pointer;
}

.kp-mobile-nav {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.kp-mobile-nav a {
    color: #d0d4dc;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    transition: 0.2s;
}

.kp-mobile-nav a:hover {
    color: #e50914;
}

/* Показываем кнопку только на экранах < 992px */
@media (max-width: 992px) {
    .kp-mobile-menu-btn {
        display: flex !important;
    }
}
/* Подсветка логотипа при наведении */
.kp-header .kp-logo { /* Замени .logo на реальный класс твоего логотипа, если он другой */
    transition: opacity 0.3s ease, filter 0.3s ease;
}

.kp-header .kp-logo:hover {
    opacity: 0.8;
    filter: drop-shadow(0 0 8px rgba(229, 9, 20, 0.5)); /* Легкое красное свечение в цвет кнопок */
}