:root {
  --bg: #06060A;
  --bg-2: #090A10;
  --section: #10111A;
  --section-2: #141722;
  --card: #171927;
  --card-2: #1f2333;
  --border: rgba(255,255,255,.10);
  --border-strong: rgba(255,255,255,.18);
  --text: #F4F4F8;
  --muted: #A7AEC0;
  --faint: rgba(167,174,192,.62);
  --primary: #7C5CFF;
  --secondary: #A855F7;
  --accent: #22D3EE;
  --danger: #EF4444;
  --ok: #22C55E;
  --shadow: 0 24px 80px rgba(0,0,0,.42);
  --radius: 24px;
}
* { box-sizing: border-box; outline: none; -webkit-tap-highlight-color: transparent; }
html { font-size: 16px; }
body {
  margin: 0;
  min-height: 100vh;
  overflow: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 72% -8%, rgba(124,92,255,.22), transparent 34rem),
    radial-gradient(circle at 18% 14%, rgba(34,211,238,.12), transparent 30rem),
    linear-gradient(180deg, #0b0c12 0%, #06060A 34rem, #030306 100%);
  font-family: Inter, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  user-select: none;
}
button, input, select, textarea { font: inherit; }
button { border: 0; background: transparent; color: inherit; cursor: pointer; }
a { color: inherit; text-decoration: none; }
.svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 280px minmax(0, 1fr); }
.sidebar {
  height: 100vh;
  padding: 22px 16px;
  display: flex;
  flex-direction: column;
  gap: 28px;
  background: linear-gradient(180deg, rgba(10,12,18,.96), rgba(5,6,10,.94));
  border-right: 1px solid var(--border);
  box-shadow: 18px 0 70px rgba(0,0,0,.28);
  z-index: 20;
}
.brand { display: flex; align-items: center; gap: 14px; padding: 0 6px; }
.brand__logo, .profile-pill__dot, .device-overlay__logo {
  width: 52px; height: 52px; border-radius: 18px; display: grid; place-items: center;
  background: linear-gradient(135deg, #7C5CFF, #22D3EE);
  font-weight: 900; letter-spacing: -.03em; box-shadow: 0 18px 45px rgba(124,92,255,.32);
}
.brand strong { display:block; font-size: 21px; line-height: 1; }
.brand span { display:block; margin-top: 6px; color: var(--muted); font-size: 14px; }
.nav { display: grid; gap: 6px; }
.nav__item {
  min-height: 48px;
  display: flex; align-items: center; gap: 12px;
  padding: 0 16px;
  border-radius: 16px;
  color: var(--muted);
  font-weight: 700;
  text-align: left;
  transition: .18s ease;
}
.nav__item svg, .nav__item i { width: 19px; height: 19px; opacity: .86; }
.nav__item:hover, .nav__item:focus-visible, .nav__item.is-active,
.bottom-nav__item.is-active {
  background: linear-gradient(135deg, rgba(124,92,255,.92), rgba(168,85,247,.86));
  color: #fff;
  box-shadow: 0 16px 42px rgba(124,92,255,.24);
  transform: translateY(-1px);
}
.sidebar__bottom { margin-top: auto; display: grid; gap: 12px; }
.control-current, .profile-pill {
  min-height: 54px;
  padding: 0 14px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.055);
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  color: var(--muted);
}
.profile-pill { justify-content: flex-start; }
.profile-pill__dot { width: 30px; height: 30px; border-radius: 10px; font-size: 12px; box-shadow: none; }
.control-current b, .profile-pill b { color: var(--text); }
.content {
  position: relative;
  min-width: 0;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 96px 34px 64px;
  scroll-behavior: smooth;
}
.content::-webkit-scrollbar { width: 10px; }
.content::-webkit-scrollbar-track { background: rgba(255,255,255,.03); }
.content::-webkit-scrollbar-thumb { background: rgba(255,255,255,.20); border-radius: 999px; border: 3px solid transparent; background-clip: content-box; }
.topbar {
  position: fixed; left: 280px; right: 0; top: 0; z-index: 18;
  min-height: 82px;
  display: flex; align-items: center; justify-content: space-between; gap: 22px;
  padding: 16px 34px;
  background: linear-gradient(180deg, rgba(8,9,14,.92), rgba(8,9,14,.64));
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(22px);
}
.mobile-menu { display: none; }
.topbar__title { min-width: 0; }
.eyebrow { margin: 0 0 6px; color: var(--muted); letter-spacing: .28em; text-transform: uppercase; font-size: 12px; font-weight: 800; }
h1 { margin: 0; font-size: 28px; line-height: 1.05; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.topbar__actions { display: flex; align-items: center; gap: 12px; min-width: min(560px, 48vw); }
.search-box {
  flex: 1;
  height: 48px;
  display: flex; align-items: center; gap: 10px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.065);
}
.search-box i, .search-box svg { color: var(--muted); width: 18px; }
.input {
  width: 100%; min-height: 46px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: rgba(255,255,255,.065);
  color: var(--text);
  padding: 0 15px;
}
.input--search { min-height: 0; border: 0; background: transparent; padding: 0; }
.input::placeholder { color: rgba(167,174,192,.58); }
.input:focus { border-color: rgba(124,92,255,.8); box-shadow: 0 0 0 4px rgba(124,92,255,.16); }
.input--select { width: auto; min-width: 170px; color-scheme: dark; }
.btn {
  min-height: 46px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 0 18px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.075);
  color: var(--text);
  font-weight: 800;
  white-space: nowrap;
  transition: .18s ease;
}
.btn:hover, .btn:focus-visible, .focus-ring { transform: translateY(-1px); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.12); }
.btn--primary { border-color: transparent; background: linear-gradient(135deg, var(--primary), var(--secondary)); color: #fff; box-shadow: 0 18px 44px rgba(124,92,255,.25); }
.btn--primary:hover, .btn--primary:focus-visible { box-shadow: 0 22px 60px rgba(124,92,255,.32); }
.btn--danger { background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.30); color: #fff; }
.btn--icon { width: 48px; padding: 0; border-radius: 50%; }
.page { display: none; }
.page.is-active { display: block; animation: pageIn .22s ease both; }
@keyframes pageIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.notice {
  margin-bottom: 18px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.07);
  color: var(--muted);
  line-height: 1.45;
}
.notice.is-hidden { display:none; }
.notice--danger { background: rgba(239,68,68,.14); border-color: rgba(239,68,68,.28); color: #fecaca; }
.notice--success { background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.28); color: #bbf7d0; }
.notice--clean { margin: 0; }
.hero {
  position: relative;
  min-height: clamp(360px, 43vh, 560px);
  border-radius: 32px;
  overflow: hidden;
  border: 1px solid var(--border);
  background: linear-gradient(135deg, rgba(124,92,255,.18), rgba(34,211,238,.06)), var(--section);
  box-shadow: var(--shadow);
  isolation: isolate;
  margin-bottom: 30px;
}
.hero::before { content:""; position:absolute; inset:0; background: var(--hero-bg, none) center/cover no-repeat; opacity:.72; z-index:-2; }
.hero::after { content:""; position:absolute; inset:0; background: linear-gradient(90deg, rgba(6,6,10,.98) 0%, rgba(6,6,10,.76) 42%, rgba(6,6,10,.20) 100%), linear-gradient(0deg, rgba(6,6,10,.95), transparent 48%); z-index:-1; }
.hero__info { width: min(760px, 72%); padding: clamp(28px, 5vw, 64px); }
.hero h2 { margin: 12px 0 12px; font-size: clamp(42px, 6vw, 84px); line-height: .92; letter-spacing: -.06em; font-weight: 900; }
.hero p { margin: 0; max-width: 720px; color: rgba(244,244,248,.78); font-size: 17px; line-height: 1.55; }
.hero__meta, .details-actions, .form-actions, .toolbar, .chip-list, .translation-row, .season-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.hero__actions { display:flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.badge, .media-card__meta span, .details-chip, .translation-chip, .episode-meta span {
  display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px;
  border: 1px solid rgba(255,255,255,.12); border-radius: 999px;
  background: rgba(0,0,0,.38); color: rgba(244,244,248,.88);
  font-size: 12px; font-weight: 800;
}
.badge::before { content:""; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-right: 7px; box-shadow: 0 0 18px var(--accent); }
.sections { display: grid; gap: 30px; }
.section { min-width: 0; }
.section__head { display:flex; align-items:flex-end; justify-content:space-between; gap: 18px; margin-bottom: 14px; }
.section__head h2 { margin:0; font-size: clamp(24px, 2vw, 34px); letter-spacing: -.035em; }
.section__head p { margin: 6px 0 0; color: var(--muted); font-size: 14px; }
.section__more {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: rgba(255,255,255,.065);
  color: var(--text);
  font-weight: 800;
}
.section__more:hover { background: #fff; color: #111; }
.row-scroll { display: flex; gap: 16px; overflow-x: auto; overflow-y: hidden; padding: 4px 4px 18px; scroll-snap-type: x proximity; }
.row-scroll::-webkit-scrollbar { height: 9px; }
.row-scroll::-webkit-scrollbar-track { background: rgba(255,255,255,.04); border-radius: 999px; }
.row-scroll::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius: 999px; }
.media-card { position: relative; width: 174px; flex: 0 0 174px; scroll-snap-align: start; }
.media-card__poster {
  position: relative; display:block; width:100%; padding-bottom: 150%;
  border-radius: 22px; overflow: hidden;
  background: #202433 center/cover no-repeat;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 18px 45px rgba(0,0,0,.28);
  transition: .18s ease;
}
.media-card__poster::before { content:""; position:absolute; inset:0; background: linear-gradient(180deg, transparent 44%, rgba(0,0,0,.86)); z-index:1; }
.media-card__poster::after { content:"Смотреть"; position:absolute; left:10px; bottom:10px; z-index:3; padding: 7px 10px; border-radius:999px; background:#fff; color:#111; font-size:12px; font-weight:900; opacity:0; transform: translateY(6px); transition:.18s ease; }
.poster-play { position:absolute; inset:0; z-index:2; display:grid; place-items:center; opacity:0; transition:.18s ease; }
.poster-play i, .poster-play svg { width: 46px; height:46px; padding: 13px; border-radius:50%; background:rgba(255,255,255,.92); color:#111; }
.media-card:hover .media-card__poster, .media-card__poster:focus-visible { transform: translateY(-4px) scale(1.025); border-color: rgba(255,255,255,.32); box-shadow: 0 24px 60px rgba(0,0,0,.42), 0 0 0 4px rgba(124,92,255,.22); }
.media-card:hover .media-card__poster::after, .media-card__poster:focus-visible::after, .media-card:hover .poster-play { opacity:1; transform:none; }
.media-card__body { padding-top: 11px; }
.media-card h3 { margin:0; font-size: 16px; line-height:1.22; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.media-card p { margin:6px 0 0; color: var(--muted); font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.media-card__meta { position:absolute; z-index:4; top:10px; left:10px; right:10px; display:flex; flex-wrap:wrap; gap:5px; }
.media-card__meta span { min-height:24px; padding:0 8px; font-size:11px; background: rgba(0,0,0,.58); backdrop-filter: blur(10px); }
.skeleton-card { pointer-events:none; }
.skeleton-poster, .skeleton-line { border-radius: 20px; background: linear-gradient(90deg, rgba(255,255,255,.055), rgba(255,255,255,.12), rgba(255,255,255,.055)); background-size: 240% 100%; animation: shimmer 1.15s infinite linear; }
.skeleton-poster { width:100%; padding-bottom:150%; }
.skeleton-line { height: 14px; margin-top: 12px; }
.skeleton-line--short { width: 64%; }
@keyframes shimmer { to { background-position: -240% 0; } }
.toolbar { position: sticky; top: 82px; z-index: 8; padding: 12px 0 18px; margin-bottom: 10px; background: linear-gradient(180deg, rgba(6,6,10,.98), rgba(6,6,10,.84), transparent); backdrop-filter: blur(16px); }
.segmented { display:inline-flex; gap:5px; padding:5px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.055); }
.segmented__item { min-height:38px; padding:0 14px; border-radius:999px; color:var(--muted); font-weight:800; }
.segmented__item.is-active { background:#fff; color:#111; }
.catalog-meta, .muted { color: var(--muted); line-height: 1.45; }
.grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 22px 16px; }
.grid .media-card { width:auto; flex-basis:auto; }
.load-more { display:flex; justify-content:center; padding: 32px 0; }
.media-content { display:grid; gap:18px; }
.page-loader { min-height: 420px; display:grid; place-items:center; gap:14px; color:var(--muted); }
.page-loader span { width:44px; height:44px; border-radius:50%; border:3px solid rgba(255,255,255,.12); border-top-color: var(--accent); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.details-hero {
  min-height: clamp(420px, 58vh, 680px);
  display:grid; grid-template-columns: minmax(190px, 260px) minmax(0, 1fr); gap: 34px; align-items:end;
  padding: clamp(24px, 4vw, 54px);
  border-radius: 34px;
  border:1px solid var(--border);
  background: linear-gradient(135deg, rgba(23,25,39,.9), rgba(10,12,18,.96));
  background-size:cover; background-position:center;
  box-shadow: var(--shadow);
  overflow:hidden;
}
.media-page-hero { margin-bottom: 4px; }
.details-poster { width:100%; aspect-ratio:2/3; border-radius: 24px; background: #222636 center/cover no-repeat; border: 1px solid rgba(255,255,255,.12); box-shadow: 0 24px 80px rgba(0,0,0,.48); }
.details-main { min-width:0; }
.media-back { margin-bottom: 20px; min-height: 38px; }
.media-page-meta { position: static; margin-bottom: 14px; }
.details-title { margin: 0 0 16px; font-size: clamp(42px, 6vw, 86px); line-height:.92; letter-spacing:-.065em; font-weight:900; max-width: 1000px; }
.details-overview { margin:0; max-width: 850px; color: rgba(244,244,248,.78); font-size: 17px; line-height:1.62; }
.media-genres { margin-top: 18px; }
.details-actions { margin-top: 24px; }
.details-section { padding: 22px; border-radius: 26px; border:1px solid var(--border); background: rgba(16,17,26,.78); box-shadow: 0 16px 50px rgba(0,0,0,.22); }
.details-section h3 { margin: 0 0 16px; font-size: 24px; letter-spacing:-.02em; }
.chip-button, .person-chip { min-height: 42px; display:inline-flex; align-items:center; gap:10px; padding: 0 14px; border-radius:999px; border:1px solid var(--border); background:rgba(255,255,255,.065); color: var(--text); font-weight:800; }
.chip-button:hover, .person-chip:hover { background:#fff; color:#111; }
.person-chip__photo { width:32px; height:32px; border-radius:50%; background:#222636 center/cover no-repeat; }
.series-tree { display:grid; grid-template-columns: minmax(180px, 260px) minmax(0, 1fr); gap:18px; }
.section-title-row { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.section-title-row h3 { margin:0; }
.season-tabs { display:grid; gap:8px; align-self:start; position: sticky; top: 114px; }
.season-tab { min-height:54px; padding:0 16px; border-radius:18px; border:1px solid var(--border); background:rgba(255,255,255,.055); color:var(--muted); font-weight:900; text-align:left; }
.season-tab.is-active { background: linear-gradient(135deg, rgba(124,92,255,.95), rgba(168,85,247,.78)); color:#fff; border-color:transparent; }
.season-pane { display:none; }
.season-pane.is-active { display:block; }
.episode-list { display:grid; gap:12px; }
.episode-row { display:grid; grid-template-columns: 170px minmax(0, 1fr); gap:14px; padding:12px; border-radius:20px; border:1px solid var(--border); background:rgba(255,255,255,.045); }
.episode-row:hover { background:rgba(255,255,255,.075); border-color:rgba(255,255,255,.18); }
.episode-preview { aspect-ratio:16/9; border-radius:16px; background:#222636 center/cover no-repeat; display:grid; place-items:center; font-size:28px; font-weight:900; overflow:hidden; }
.episode-preview::after { content:"▶"; width:42px; height:42px; display:grid; place-items:center; border-radius:50%; background:rgba(0,0,0,.58); color:#fff; font-size:16px; }
.episode-info { min-width:0; align-self:center; }
.episode-title { font-size:18px; font-weight:800; line-height:1.25; }
.episode-meta { display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.episode-air { margin-top:8px; color:var(--muted); line-height:1.45; font-size:14px; }
.translation-row { margin-top:10px; }
.translation-chip { border-radius:999px; min-height:34px; cursor:pointer; }
.empty-state { color:var(--muted); padding:14px; }
.drawer { position:fixed; inset:0; z-index:40; background:rgba(0,0,0,.72); backdrop-filter:blur(20px); opacity:0; pointer-events:none; transition:.18s ease; overflow-y:auto; }
.drawer.is-open { opacity:1; pointer-events:auto; }
.drawer__close { position:fixed; right:22px; top:22px; width:48px; height:48px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--border); background:rgba(255,255,255,.10); z-index:3; }
.drawer__close:hover { background:#fff; color:#111; }
#drawerContent { width:min(1100px, calc(100vw - 48px)); margin: 92px auto 48px; }
.persons-grid { display:grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap:16px; }
.person-card { min-height:250px; padding:10px; display:grid; grid-template-rows:1fr auto auto; gap:10px; text-align:left; border-radius:24px; border:1px solid var(--border); background:rgba(255,255,255,.055); }
.person-card:hover { background:#fff; color:#111; transform:translateY(-2px); }
.person-card__photo { border-radius:18px; background:#222636 center/cover no-repeat; min-height:190px; }
.person-card small { color: inherit; opacity:.65; }
.person-head { display:grid; grid-template-columns: 260px minmax(0,1fr); gap:24px; align-items:end; padding:26px; border-radius:30px; border:1px solid var(--border); background:linear-gradient(135deg, rgba(124,92,255,.16), rgba(34,211,238,.06)), var(--section); }
.person-head__photo { width:100%; aspect-ratio:2/3; border-radius:24px; background:#222636 center/cover no-repeat; }
.collections-grid, .account-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap:18px; }
.panel, .collection-card { padding:22px; border-radius:26px; border:1px solid var(--border); background:rgba(16,17,26,.78); box-shadow: 0 18px 56px rgba(0,0,0,.20); }
.panel--wide { grid-column:1/-1; }
.panel__title { margin-bottom:14px; font-size:22px; font-weight:900; }
.form-card label { display:grid; gap:8px; color:var(--muted); margin-top:12px; font-weight:800; }
.auth-card .muted { margin: 0 0 12px; }
.auth-actions { margin-top:16px; }
.profile-card-mini { display:grid; gap:6px; color:var(--muted); }
.profile-card-mini b { color: var(--text); }
.mini-list { display:grid; gap:10px; color:var(--muted); }
.mini-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px; border-radius:18px; border:1px solid var(--border); background:rgba(255,255,255,.05); }
.collection-card h3 { margin:0 0 8px; }
.collection-card p { margin:0 0 16px; color:var(--muted); line-height:1.5; }
.json-box, pre { padding:14px; border-radius:18px; border:1px solid var(--border); background:rgba(0,0,0,.25); color:var(--muted); white-space:pre-wrap; overflow:auto; }
.cinema-player { position:fixed; inset:0; z-index:60; background:#000; }
.player-stage { position:absolute; inset:0; background:#000; }
.player-frame { position:absolute; inset:0; width:100%; height:100%; border:0; }
.player-frame.is-hidden, .is-hidden { display:none!important; }
.player-empty { display:none; }
.player-topline { position:absolute; top:0; left:0; right:0; z-index:3; display:flex; align-items:center; gap:14px; padding:18px 22px; background:linear-gradient(180deg, rgba(0,0,0,.82), transparent); }
.round-btn { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.18); }
.player-titlebox { display:grid; gap:4px; padding:10px 14px; border-radius:18px; background:rgba(0,0,0,.45); }
.player-titlebox span { color:var(--muted); font-size:13px; }
.btn--player-next { margin-left:auto; }
.player-bottom-dock { position:absolute; left:0; right:0; bottom:0; z-index:3; padding: 20px 24px 24px; background:linear-gradient(0deg, #000 0%, rgba(0,0,0,.82) 64%, transparent); }
.player-selectors { display:flex; flex-wrap:wrap; gap:12px; margin-bottom:14px; }
.player-chip-group { display:flex; align-items:center; gap:10px; padding:10px 12px; border-radius:18px; background:rgba(255,255,255,.08); }
.player-chip-group > span { color:var(--muted); font-weight:800; }
.player-chip-row, .player-season-tabs, .player-episode-strip { display:flex; gap:8px; overflow-x:auto; }
.player-chip, .player-season-tab { min-height:34px; padding:0 12px; border-radius:999px; background:rgba(255,255,255,.12); font-weight:800; }
.player-chip.is-active, .player-season-tab.is-active, .player-episode-card.is-active { background:#fff; color:#111; }
.player-series-block { display:grid; gap:10px; }
.player-episode-card { flex:0 0 260px; display:grid; grid-template-columns:84px 1fr; gap:10px; text-align:left; padding:8px; border-radius:18px; background:rgba(255,255,255,.10); }
.player-episode-thumb { border-radius:12px; background:#222 center/cover no-repeat; aspect-ratio:16/9; display:grid; place-items:center; }
.player-episode-text { display:grid; align-content:center; gap:4px; min-width:0; }
.player-episode-text small { color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.device-overlay { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:24px; background:rgba(6,6,10,.96); backdrop-filter:blur(24px); }
.device-overlay.is-hidden { display:none; }
.device-overlay__body { width:min(760px,100%); padding:28px; border-radius:32px; border:1px solid var(--border); background:linear-gradient(135deg, rgba(124,92,255,.16), rgba(34,211,238,.06)), var(--section); box-shadow:var(--shadow); }
.device-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:20px; }
.device-tile { min-height:170px; display:grid; gap:8px; align-content:center; padding:18px; border-radius:24px; border:1px solid var(--border); background:rgba(255,255,255,.055); text-align:left; }
.device-tile:hover { background:#fff; color:#111; }
.device-tile__icon { width:46px; height:46px; display:grid; place-items:center; border-radius:16px; background:rgba(124,92,255,.20); font-weight:900; }
.device-tile small { color:var(--muted); line-height:1.4; }
.bottom-nav, .mode-fab { display:none; }
@media (min-width: 1500px) { .media-card { width: 188px; flex-basis: 188px; } .grid { grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); } }
@media (max-width: 1100px) {
  .app-shell { grid-template-columns: 230px minmax(0,1fr); }
  .topbar { left:230px; }
  .sidebar { padding:18px 12px; }
  .content { padding-left:24px; padding-right:24px; }
  .media-card { width:150px; flex-basis:150px; }
  .details-hero { grid-template-columns: 200px 1fr; }
  .series-tree { grid-template-columns:1fr; }
  .season-tabs { position:relative; top:auto; display:flex; overflow-x:auto; }
  .season-tab { min-width:130px; }
}
@media (max-width: 820px) {
  body { overflow:auto; }
  .app-shell { display:block; min-height:100vh; }
  .sidebar { display:none; }
  .topbar { left:0; min-height:72px; padding:12px 14px; }
  .topbar__title { display:none; }
  .topbar__actions { min-width:0; flex:1; gap:8px; }
  .search-box { min-width:0; }
  .btn--icon { display:none; }
  .content { height:auto; min-height:100vh; overflow:visible; padding:86px 14px 92px; }
  .hero { min-height:340px; border-radius:24px; }
  .hero__info { width:100%; padding:26px; }
  .hero h2 { font-size:44px; }
  .section__head { align-items:flex-start; }
  .section__head h2 { font-size:24px; }
  .media-card { width:132px; flex-basis:132px; }
  .grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap:18px 12px; }
  .toolbar { top:72px; }
  .input--select { width:100%; }
  .details-hero { grid-template-columns:1fr; min-height:auto; padding:22px; border-radius:26px; }
  .details-poster { width:160px; }
  .details-title { font-size:42px; }
  .episode-row { grid-template-columns: 112px 1fr; }
  .episode-title { font-size:16px; }
  .person-head { grid-template-columns:1fr; }
  .person-head__photo { width:160px; }
  .device-grid { grid-template-columns:1fr; }
  .bottom-nav { position:fixed; left:10px; right:10px; bottom:10px; z-index:30; display:grid; grid-template-columns:repeat(5,1fr); gap:4px; padding:6px; border-radius:22px; border:1px solid var(--border); background:rgba(10,12,18,.88); backdrop-filter: blur(20px); }
  .bottom-nav__item { min-height:54px; display:grid; place-items:center; gap:2px; border-radius:16px; color:var(--muted); font-size:12px; font-weight:800; }
  .bottom-nav__item svg, .bottom-nav__item i { width:18px; height:18px; }
  .mode-fab { position:fixed; right:14px; bottom:82px; z-index:34; display:flex; align-items:center; gap:8px; min-height:42px; padding:0 12px; border-radius:999px; background:#fff; color:#111; font-weight:900; box-shadow:0 18px 50px rgba(0,0,0,.35); }
  .player-bottom-dock { max-height:48vh; overflow:auto; }
  .player-selectors { display:grid; }
}
@media (max-width: 520px) {
  .hero h2, .details-title { font-size:34px; }
  .media-card { width:118px; flex-basis:118px; }
  .details-poster { width:132px; }
  .episode-row { grid-template-columns:1fr; }
  .topbar__actions .btn--primary { padding:0 13px; }
}

/* v6 graphite cinema polish */
:root {
  --bg: #090A0D;
  --bg-2: #0D0F14;
  --section: #11141A;
  --section-2: #151923;
  --card: #171B23;
  --card-2: #1E232D;
  --border: rgba(229,231,235,.10);
  --border-strong: rgba(229,231,235,.18);
  --text: #F4F4F5;
  --muted: #A7AEBA;
  --faint: rgba(167,174,186,.62);
  --primary: #F4F4F5;
  --secondary: #C7CCD6;
  --accent: #818898;
  --danger: #EF4444;
  --ok: #22C55E;
  --shadow: 0 28px 90px rgba(0,0,0,.48);
}
body {
  background:
    radial-gradient(circle at 78% -12%, rgba(255,255,255,.075), transparent 32rem),
    radial-gradient(circle at 12% 8%, rgba(129,136,152,.09), transparent 28rem),
    linear-gradient(180deg, #0B0C10 0%, #08090C 42rem, #050609 100%);
}
.sidebar {
  background: linear-gradient(180deg, rgba(13,15,20,.98), rgba(6,7,10,.96));
}
.brand__logo, .profile-pill__dot, .device-overlay__logo {
  background: linear-gradient(135deg, #2A2F3A, #D7DAE0);
  color: #090A0D;
  box-shadow: 0 18px 45px rgba(0,0,0,.38);
}
.nav__item:hover, .nav__item:focus-visible, .nav__item.is-active,
.bottom-nav__item.is-active {
  background: linear-gradient(135deg, rgba(244,244,245,.96), rgba(183,188,198,.92));
  color: #08090C;
  box-shadow: 0 16px 44px rgba(0,0,0,.30);
}
.topbar {
  background: linear-gradient(180deg, rgba(11,12,16,.94), rgba(11,12,16,.70));
}
.search-box, .input, .control-current, .profile-pill {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.105);
}
.input:focus {
  border-color: rgba(244,244,245,.55);
  box-shadow: 0 0 0 4px rgba(244,244,245,.08);
}
.btn--primary {
  background: linear-gradient(135deg, #F4F4F5, #B8BEC9);
  color: #090A0D;
  box-shadow: 0 18px 48px rgba(0,0,0,.32);
}
.btn--primary:hover, .btn--primary:focus-visible { box-shadow: 0 22px 62px rgba(0,0,0,.42); }
.hero {
  background: linear-gradient(135deg, rgba(255,255,255,.08), rgba(129,136,152,.05)), var(--section);
}
.hero::after {
  background:
    linear-gradient(90deg, rgba(7,8,11,.98) 0%, rgba(7,8,11,.82) 45%, rgba(7,8,11,.25) 100%),
    linear-gradient(0deg, rgba(7,8,11,.96), transparent 50%);
}
.badge, .media-card__meta span, .details-chip, .translation-chip, .episode-meta span {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.12);
}
.media-card, .panel, .collection-card, .person-card {
  background: linear-gradient(180deg, rgba(23,27,35,.86), rgba(13,15,20,.84));
  border-color: rgba(255,255,255,.10);
}
.media-card:hover, .person-card:hover, .device-tile:hover {
  background: linear-gradient(180deg, rgba(34,39,50,.94), rgba(18,21,28,.94));
  color: var(--text);
}
.poster-play { background: rgba(244,244,245,.92); color:#08090c; }
.section__more:hover { background:#F4F4F5; color:#090A0D; }
.player-chip.is-active, .player-season-tab.is-active, .player-episode-card.is-active {
  background:#F4F4F5;
  color:#090A0D;
}
.auth-shell {
  display: grid;
  grid-template-columns: minmax(280px, .85fr) minmax(320px, .9fr);
  gap: 20px;
  align-items: start;
}
.auth-hero-card, .auth-panel {
  border: 1px solid var(--border);
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(23,27,35,.90), rgba(11,13,18,.92));
  box-shadow: var(--shadow);
  padding: clamp(22px, 3vw, 32px);
  overflow: hidden;
  position: relative;
}
.auth-hero-card::after {
  content:"";
  position:absolute;
  right:-90px;
  top:-90px;
  width:240px;
  height:240px;
  border-radius:50%;
  background: radial-gradient(circle, rgba(244,244,245,.13), transparent 64%);
}
.auth-kicker {
  display:inline-flex;
  min-height:28px;
  align-items:center;
  padding:0 10px;
  border:1px solid var(--border);
  border-radius:999px;
  color:var(--muted);
  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.auth-hero-card h2 {
  margin: 18px 0 12px;
  font-size: clamp(34px, 5vw, 62px);
  line-height: .92;
  letter-spacing: -.06em;
}
.auth-hero-card p { margin:0; color:var(--muted); line-height:1.55; max-width:620px; }
.auth-benefits { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.auth-benefits span {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:38px;
  padding:0 12px;
  border:1px solid var(--border);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  font-weight:800;
}
.auth-benefits svg { width:18px; height:18px; color:var(--muted); }
.auth-tabs {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  padding:6px;
  border:1px solid var(--border);
  border-radius:20px;
  background:rgba(255,255,255,.045);
  margin-bottom:18px;
}
.auth-tab {
  min-height:44px;
  border-radius:15px;
  color:var(--muted);
  font-weight:900;
}
.auth-tab.is-active {
  background:#F4F4F5;
  color:#090A0D;
}
.auth-form { display:none; }
.auth-form.is-active { display:grid; animation: pageIn .18s ease both; }
.auth-form label { display:grid; gap:8px; color:var(--muted); margin-top:13px; font-weight:800; }
.account-panels {
  grid-column: 1 / -1;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:18px;
}
.profile-panel { position: relative; }
.profile-logout { margin-top:16px; }
@media (max-width: 980px) {
  .auth-shell { grid-template-columns: 1fr; }
  .account-panels { grid-template-columns: 1fr; }
}


/* v7 Kinolot graphite UI / layout fixes */
:root {
  --bg:#090A0D; --bg-2:#0D0F14; --section:#11141A; --section-2:#151923;
  --card:#171B23; --card-2:#1E232D; --border:rgba(229,231,235,.11);
  --border-strong:rgba(229,231,235,.20); --text:#F4F4F5; --muted:#A7AEBA;
  --primary:#F4F4F5; --secondary:#C7CCD6; --accent:#818898;
}
body {
  background:
    radial-gradient(circle at 80% -12%, rgba(255,255,255,.07), transparent 31rem),
    radial-gradient(circle at 8% 6%, rgba(120,125,138,.10), transparent 30rem),
    linear-gradient(180deg,#0B0C10 0%,#08090C 44rem,#050609 100%);
}
.app-shell { grid-template-columns: 252px minmax(0,1fr); }
.sidebar { padding: 20px 14px; gap: 22px; background: linear-gradient(180deg, rgba(15,17,22,.98), rgba(7,8,11,.98)); border-right: 1px solid rgba(255,255,255,.08); }
.brand { padding: 2px 8px 16px; border-bottom: 1px solid rgba(255,255,255,.08); }
.brand__logo, .profile-pill__dot, .device-overlay__logo { background: linear-gradient(135deg,#242933,#DADDE3); color:#08090C; box-shadow:0 18px 50px rgba(0,0,0,.40); }
.brand strong { font-size:22px; letter-spacing:-.04em; }
.nav { gap: 4px; }
.nav__item { min-height: 46px; padding: 0 14px; border-radius: 15px; color: #AEB4C0; background: transparent; border: 1px solid transparent; font-size: 15px; }
.nav__item i, .nav__item svg { display:none; }
.nav__item::before { width: 28px; height: 28px; display:grid; place-items:center; border-radius:10px; background: rgba(255,255,255,.055); color:#D6DAE1; font-size:13px; font-weight:900; }
.nav__item[data-page="home"]::before { content:"⌂"; }
.nav__item[data-type="MOVIE"]::before { content:"M"; }
.nav__item[data-type="SERIAL"]::before { content:"TV"; }
.nav__item[data-page="collections"]::before { content:"#"; }
.nav__item[data-page="persons"]::before { content:"P"; }
.nav__item[data-page="account"]::before { content:"U"; }
.nav__item:hover, .nav__item:focus-visible { background: rgba(255,255,255,.065); color:#F4F4F5; border-color: rgba(255,255,255,.10); box-shadow:none; transform:none; }
.nav__item.is-active, .bottom-nav__item.is-active { background: linear-gradient(135deg,#F4F4F5,#B8BEC8); color:#08090C; border-color: transparent; box-shadow:0 14px 38px rgba(0,0,0,.32); transform:none; }
.nav__item.is-active::before { background: rgba(8,9,12,.12); color:#08090C; }
.sidebar__bottom { gap: 10px; }
.control-current, .profile-pill { border-radius: 18px; background: linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035)); }
.content { height:100vh; overflow-y:auto; padding: 0 34px 64px; }
.topbar { position: sticky; left:auto; right:auto; top:0; z-index: 34; margin: 0 -34px 24px; min-height: 86px; padding: 15px 34px; background: linear-gradient(180deg,rgba(10,11,15,.96),rgba(10,11,15,.82)); border-bottom:1px solid rgba(255,255,255,.08); box-shadow: 0 18px 60px rgba(0,0,0,.22); }
.topbar__actions { min-width: min(640px, 50vw); }
.search-box { height:50px; background: rgba(255,255,255,.07); border-color:rgba(255,255,255,.13); }
.search-box:focus-within { border-color:rgba(244,244,245,.48); box-shadow:0 0 0 4px rgba(244,244,245,.07); }
.input, .input--select { background: rgba(255,255,255,.07); border-color:rgba(255,255,255,.12); }
.toolbar { position: sticky; top: 86px; z-index: 21; padding: 14px; margin: 0 0 22px; border: 1px solid rgba(255,255,255,.09); border-radius: 24px; background: linear-gradient(180deg, rgba(15,17,22,.94), rgba(10,11,15,.88)); backdrop-filter: blur(20px); box-shadow: 0 18px 60px rgba(0,0,0,.24); }
.segmented { padding:5px; border:1px solid rgba(255,255,255,.10); border-radius:999px; background:rgba(255,255,255,.045); }
.segmented__item { min-height:38px; padding:0 16px; border-radius:999px; color:#AEB4C0; font-weight:900; }
.segmented__item.is-active { background:#F4F4F5; color:#08090C; }
.grid { align-items:start; }
.catalog-error { grid-column:1 / -1; }
.hero { border-radius: 30px; min-height: clamp(330px, 42vh, 530px); }
.hero h2 { letter-spacing:-.07em; }
.btn--primary { background:linear-gradient(135deg,#F4F4F5,#B8BEC8); color:#08090C; }
.section__head h2 { letter-spacing:-.045em; }
.media-card__poster { background-color:#1D222B; }
.media-card__body h3 { line-height:1.18; }
.auth-shell { min-height: calc(100vh - 132px); display:grid; grid-template-columns: minmax(360px,1.12fr) minmax(360px,.88fr); gap:0; border:1px solid rgba(255,255,255,.10); border-radius:34px; overflow:hidden; background:#050609; box-shadow: var(--shadow); }
.auth-hero-card, .auth-panel { border:0; box-shadow:none; border-radius:0; }
.auth-hero-card { min-height: 590px; display:flex; flex-direction:column; justify-content:flex-end; padding: clamp(30px,5vw,72px); background: linear-gradient(90deg,rgba(5,6,9,.22),rgba(5,6,9,.78)), radial-gradient(circle at 30% 18%,rgba(244,244,245,.18),transparent 22rem), radial-gradient(circle at 64% 38%,rgba(129,136,152,.16),transparent 18rem), linear-gradient(135deg,#3B414D 0%,#171B23 42%,#08090C 100%); }
.auth-hero-card::before { content:"KINOLOT"; position:absolute; left:7%; top:8%; font-size: clamp(42px,7vw,110px); font-weight:1000; letter-spacing:-.08em; color:rgba(255,255,255,.07); pointer-events:none; }
.auth-hero-card h2 { max-width:680px; font-size: clamp(40px,6vw,78px); }
.auth-panel { display:grid; align-content:center; padding: clamp(26px,4vw,56px); background:#050609; border-left: 1px solid rgba(255,255,255,.08); }
.auth-tabs { background:rgba(255,255,255,.055); border-radius:22px; }
.telegram-auth-btn { width:100%; min-height:52px; display:flex; align-items:center; justify-content:center; gap:12px; border-radius:17px; border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.075); color:#F4F4F5; font-weight:900; margin: 0 0 14px; }
.telegram-auth-btn:hover { background:#F4F4F5; color:#08090C; }
.telegram-auth-btn__icon { width:30px; height:30px; display:grid; place-items:center; border-radius:10px; background:#2AABEE; color:white; font-size:12px; }
.auth-divider { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:12px; font-weight:900; text-transform:uppercase; letter-spacing:.12em; margin: 6px 0 12px; }
.auth-divider::before, .auth-divider::after { content:""; flex:1; height:1px; background:rgba(255,255,255,.09); }
.auth-form .panel__title { font-size:28px; margin-bottom:10px; }
.auth-form label { font-size:14px; }
.auth-form .input { min-height:54px; border-radius:14px; background: #1A1C22; }
.auth-actions .btn { min-height:50px; }
.account-panels { grid-column:1 / -1; padding:20px; background:linear-gradient(180deg,rgba(15,17,22,.98),rgba(7,8,11,.98)); }
@media (max-width: 1100px) { .app-shell { grid-template-columns: 230px minmax(0,1fr); } .topbar { left:auto; } .auth-shell { grid-template-columns:1fr; } .auth-hero-card { min-height:380px; } .auth-panel { border-left:0; border-top:1px solid rgba(255,255,255,.08); } }
@media (max-width: 820px) { .content { height:auto; min-height:100vh; overflow:visible; padding:0 14px 92px; } .topbar { margin:0 -14px 18px; top:0; } .toolbar { top:72px; } .auth-shell { min-height:auto; border-radius:26px; } .auth-hero-card { min-height:300px; padding:26px; } .auth-panel { padding:22px; } }

/* v9 Apple TV inspired redesign */
:root {
  --bg: #000000;
  --bg-2: #050507;
  --section: #0B0C10;
  --section-2: #111219;
  --card: #17181F;
  --card-2: #20222B;
  --border: rgba(255,255,255,.105);
  --border-strong: rgba(255,255,255,.24);
  --text: #F5F5F7;
  --muted: #A1A1AA;
  --faint: rgba(161,161,170,.62);
  --primary: #F5F5F7;
  --secondary: #D7D8DE;
  --accent: #B9C0CA;
  --danger: #FF453A;
  --ok: #30D158;
  --shadow: 0 36px 120px rgba(0,0,0,.62);
  --tv-focus: 0 0 0 4px rgba(255,255,255,.92), 0 28px 80px rgba(0,0,0,.72), 0 0 80px rgba(255,255,255,.12);
  --glass: rgba(24,25,31,.58);
  --glass-strong: rgba(32,34,42,.76);
}
html { background: #000; }
body {
  color: var(--text);
  background:
    radial-gradient(circle at 54% -18%, rgba(255,255,255,.105), transparent 34rem),
    radial-gradient(circle at 90% 18%, rgba(120,126,140,.10), transparent 28rem),
    radial-gradient(circle at 6% 6%, rgba(255,255,255,.06), transparent 24rem),
    linear-gradient(180deg, #050507 0%, #000 42rem, #000 100%);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", Inter, "Segoe UI", system-ui, sans-serif;
  letter-spacing: -.01em;
}
.app-shell { grid-template-columns: 236px minmax(0, 1fr); }
.sidebar {
  padding: 18px 14px;
  gap: 24px;
  background: linear-gradient(180deg, rgba(10,11,15,.82), rgba(0,0,0,.76));
  border-right: 1px solid rgba(255,255,255,.075);
  box-shadow: 24px 0 90px rgba(0,0,0,.34);
  backdrop-filter: blur(34px) saturate(130%);
}
.brand { padding: 0 6px 18px; border-bottom: 1px solid rgba(255,255,255,.075); }
.brand__logo, .profile-pill__dot, .device-overlay__logo {
  width: 46px; height: 46px; border-radius: 15px;
  background: radial-gradient(circle at 24% 18%, rgba(255,255,255,.95), rgba(255,255,255,.56) 34%, rgba(112,118,130,.88) 100%);
  color: #08090C;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 18px 42px rgba(0,0,0,.45);
}
.brand strong { font-size: 18px; letter-spacing: -.035em; text-transform: uppercase; }
.brand span { margin-top: 5px; font-size: 12px; color: rgba(245,245,247,.58); }
.nav { gap: 8px; }
.nav__item {
  min-height: 44px;
  padding: 0 12px;
  border-radius: 14px;
  color: rgba(245,245,247,.62);
  font-size: 14px;
  font-weight: 760;
  border: 1px solid transparent;
  background: transparent;
}
.nav__item::before {
  width: 28px; height: 28px; border-radius: 10px;
  background: rgba(255,255,255,.055);
  color: rgba(245,245,247,.82);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.nav__item:hover, .nav__item:focus-visible, .nav__item.is-active, .bottom-nav__item.is-active {
  background: rgba(255,255,255,.105);
  color: #fff;
  border-color: rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 26px rgba(0,0,0,.26);
  transform: none;
}
.nav__item.is-active::before { background: rgba(255,255,255,.14); color: #fff; }
.sidebar__bottom { gap: 10px; }
.control-current, .profile-pill {
  min-height: 50px;
  border-radius: 16px;
  border-color: rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  color: rgba(245,245,247,.62);
  backdrop-filter: blur(20px);
}
.control-current b, .profile-pill b { color: #fff; }
.content { padding: 0 clamp(28px, 3vw, 56px) 84px; background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 18rem); }
.topbar {
  min-height: 86px;
  margin: 0 calc(clamp(28px, 3vw, 56px) * -1) 30px;
  padding: 16px clamp(28px, 3vw, 56px);
  background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,.48));
  border-bottom: 1px solid rgba(255,255,255,.075);
  box-shadow: none;
  backdrop-filter: blur(36px) saturate(140%);
}
.eyebrow { color: rgba(245,245,247,.48); letter-spacing: .34em; font-size: 11px; }
h1 { font-size: clamp(26px, 2.6vw, 38px); font-weight: 820; letter-spacing: -.045em; }
.topbar__actions { min-width: min(620px, 50vw); gap: 10px; }
.search-box {
  height: 50px; border-radius: 999px;
  background: rgba(255,255,255,.085);
  border-color: rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.search-box:focus-within { background: rgba(255,255,255,.13); border-color: rgba(255,255,255,.28); box-shadow: 0 0 0 4px rgba(255,255,255,.08), inset 0 1px 0 rgba(255,255,255,.09); }
.input, .input--select { min-height: 48px; border-radius: 16px; background: rgba(255,255,255,.085); border-color: rgba(255,255,255,.12); color: #fff; }
.input:focus { border-color: rgba(255,255,255,.34); box-shadow: 0 0 0 4px rgba(255,255,255,.08); }
.btn {
  min-height: 46px; padding: 0 18px; border-radius: 999px;
  border-color: rgba(255,255,255,.13);
  background: rgba(255,255,255,.085);
  color: #fff; font-weight: 820;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.065);
}
.btn:hover, .btn:focus-visible, .focus-ring { background: rgba(255,255,255,.15); border-color: rgba(255,255,255,.26); transform: translateY(-1px) scale(1.015); }
.btn--primary { background: #F5F5F7; color: #050507; border-color: transparent; box-shadow: 0 16px 42px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.55); }
.btn--primary:hover, .btn--primary:focus-visible { background: #fff; box-shadow: var(--tv-focus); }
.btn--icon { background: rgba(255,255,255,.075); }
.notice { border-radius: 22px; background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.12); }
.hero {
  min-height: clamp(520px, 64vh, 760px);
  border-radius: clamp(30px, 3.2vw, 48px);
  border: 1px solid rgba(255,255,255,.10);
  background: #0A0B0F;
  box-shadow: 0 42px 140px rgba(0,0,0,.62);
  margin-bottom: 46px;
}
.hero::before { opacity: .92; transform: scale(1.01); filter: saturate(1.06) contrast(1.02); }
.hero::after {
  background:
    linear-gradient(90deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.76) 38%, rgba(0,0,0,.22) 72%, rgba(0,0,0,.34) 100%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.70) 15%, rgba(0,0,0,.02) 55%);
}
.hero__info { width: min(820px, 74%); padding: clamp(36px, 6vw, 86px); display:flex; flex-direction:column; justify-content:flex-end; min-height:inherit; }
.badge { align-self:flex-start; min-height:30px; padding:0 12px; background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.16); backdrop-filter:blur(18px); }
.badge::before { background:#fff; box-shadow:0 0 18px rgba(255,255,255,.75); }
.hero h2 { max-width:860px; margin:14px 0 16px; font-size:clamp(48px,7.2vw,112px); line-height:.88; letter-spacing:-.085em; font-weight:920; text-shadow:0 18px 54px rgba(0,0,0,.72); }
.hero p { max-width:700px; color:rgba(245,245,247,.78); font-size:clamp(16px,1.2vw,20px); line-height:1.56; text-shadow:0 8px 30px rgba(0,0,0,.75); }
.hero__meta { margin-bottom:14px; }
.hero__actions { margin-top:28px; }
.sections { gap:46px; }
.section__head { align-items:center; margin-bottom:18px; }
.section__head h2 { font-size:clamp(23px,2vw,32px); font-weight:820; letter-spacing:-.045em; }
.section__head p { color:rgba(245,245,247,.48); }
.section__more { min-height:36px; padding:0 14px; background:rgba(255,255,255,.075); border-color:rgba(255,255,255,.12); color:rgba(245,245,247,.84); }
.section__more:hover, .section__more:focus-visible { background:rgba(255,255,255,.16); color:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.14); }
.row-scroll { gap:18px; padding:8px 6px 26px; scroll-padding-left:6px; }
.row-scroll::-webkit-scrollbar { height:0; }
.media-card { width:188px; flex-basis:188px; border-radius:22px; transition:transform .22s cubic-bezier(.2,.8,.2,1), filter .22s ease; }
.media-card__poster { border-radius:20px; border-color:rgba(255,255,255,.10); box-shadow:0 20px 54px rgba(0,0,0,.42); background-color:#15171D; transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s ease, border-color .22s ease, filter .22s ease; }
.media-card__poster::before { background:linear-gradient(180deg, rgba(0,0,0,0) 50%, rgba(0,0,0,.78) 100%); }
.media-card__poster::after { display:none; }
.poster-play i, .poster-play svg { width:58px; height:58px; padding:17px; background:rgba(245,245,247,.96); color:#000; box-shadow:0 16px 48px rgba(0,0,0,.40); }
.media-card:hover, .media-card:focus-within { z-index:6; }
.media-card:hover .media-card__poster, .media-card__poster:focus-visible, .control-tv .media-card__poster.focus-ring { transform:translateY(-8px) scale(1.075); border-color:rgba(255,255,255,.82); box-shadow:var(--tv-focus); filter:saturate(1.08) contrast(1.04); }
.media-card:hover .poster-play, .media-card__poster:focus-visible .poster-play { opacity:1; }
.media-card__body { padding-top:14px; }
.media-card h3 { font-size:15px; font-weight:760; line-height:1.24; }
.media-card p { color:rgba(245,245,247,.52); font-size:12px; }
.media-card__meta { top:9px; left:9px; right:9px; }
.media-card__meta span, .details-chip, .translation-chip, .episode-meta span { background:rgba(0,0,0,.42); border-color:rgba(255,255,255,.14); color:rgba(245,245,247,.86); backdrop-filter:blur(18px); }
.skeleton-poster, .skeleton-line { background:linear-gradient(100deg, rgba(255,255,255,.04), rgba(255,255,255,.105), rgba(255,255,255,.04)); background-size:260% 100%; }
.toolbar { top:86px; padding:12px; margin-bottom:24px; border-radius:26px; border-color:rgba(255,255,255,.10); background:rgba(12,13,17,.62); box-shadow:0 22px 76px rgba(0,0,0,.32); backdrop-filter:blur(34px) saturate(140%); }
.segmented { background:rgba(255,255,255,.065); border-color:rgba(255,255,255,.10); }
.segmented__item { min-height:40px; padding:0 18px; color:rgba(245,245,247,.62); font-weight:820; }
.segmented__item.is-active { background:#F5F5F7; color:#050507; }
.catalog-meta { margin:0 0 8px; color:rgba(245,245,247,.58); }
.grid { grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:30px 20px; }
.grid .media-card { width:auto; }
.details-hero { min-height:clamp(560px,70vh,820px); grid-template-columns:minmax(190px,290px) minmax(0,1fr); gap:clamp(24px,4vw,54px); align-items:end; padding:clamp(28px,5vw,76px); border-radius:clamp(30px,3vw,48px); border-color:rgba(255,255,255,.10); box-shadow:0 44px 150px rgba(0,0,0,.66); position:relative; isolation:isolate; overflow:hidden; }
.details-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, rgba(0,0,0,.84) 0%, rgba(0,0,0,.56) 44%, rgba(0,0,0,.20) 100%), linear-gradient(0deg, #000 0%, rgba(0,0,0,.54) 24%, transparent 60%); pointer-events:none; }
.details-poster { border-radius:24px; border-color:rgba(255,255,255,.18); box-shadow:0 30px 90px rgba(0,0,0,.68), 0 0 0 1px rgba(255,255,255,.06); }
.media-back { margin-bottom:22px; background:rgba(255,255,255,.10); }
.details-title { max-width:980px; font-size:clamp(48px,7.2vw,112px); line-height:.88; letter-spacing:-.085em; text-shadow:0 18px 54px rgba(0,0,0,.78); }
.details-overview { max-width:850px; color:rgba(245,245,247,.78); font-size:clamp(16px,1.15vw,20px); }
.details-actions { gap:12px; }
.details-section { border-radius:28px; border-color:rgba(255,255,255,.10); background:rgba(18,19,25,.66); box-shadow:0 26px 90px rgba(0,0,0,.34); backdrop-filter:blur(24px) saturate(130%); }
.details-section h3 { font-size:25px; font-weight:820; }
.chip-button, .person-chip, .translation-chip { border-color:rgba(255,255,255,.12); background:rgba(255,255,255,.075); }
.chip-button:hover, .person-chip:hover, .translation-chip:hover, .chip-button:focus-visible, .person-chip:focus-visible, .translation-chip:focus-visible { background:#F5F5F7; color:#050507; box-shadow:0 0 0 4px rgba(255,255,255,.10); }
.season-tabs { top:118px; gap:10px; }
.season-tab { min-height:56px; border-radius:16px; background:rgba(255,255,255,.075); border-color:rgba(255,255,255,.10); }
.season-tab.is-active { background:#F5F5F7; color:#050507; }
.episode-list { gap:14px; }
.episode-row { grid-template-columns:188px minmax(0,1fr); border-radius:22px; background:rgba(255,255,255,.062); border-color:rgba(255,255,255,.10); transition:.18s ease; }
.episode-row:hover { transform:translateY(-2px); background:rgba(255,255,255,.095); border-color:rgba(255,255,255,.18); }
.episode-preview { border-radius:18px; }
.episode-title { font-weight:820; }
.auth-shell { min-height:calc(100vh - 150px); border-radius:42px; border-color:rgba(255,255,255,.11); background:#000; box-shadow:0 42px 150px rgba(0,0,0,.70); }
.auth-hero-card { background:linear-gradient(90deg, rgba(0,0,0,.12), rgba(0,0,0,.86)), radial-gradient(circle at 28% 28%, rgba(255,255,255,.20), transparent 17rem), radial-gradient(circle at 70% 48%, rgba(96,105,122,.20), transparent 20rem), linear-gradient(135deg, #3A3E47 0%, #12141A 48%, #000 100%); }
.auth-hero-card::before { color:rgba(255,255,255,.055); }
.auth-hero-card h2 { font-weight:920; letter-spacing:-.08em; }
.auth-panel { background:#000; }
.auth-tabs, .telegram-auth-btn, .auth-form .input { background:rgba(255,255,255,.085); border-color:rgba(255,255,255,.12); }
.auth-tab.is-active { background:#F5F5F7; color:#050507; }
.telegram-auth-btn:hover { background:#F5F5F7; color:#050507; }
.person-card, .panel, .collection-card { border-color:rgba(255,255,255,.10); background:rgba(18,19,25,.66); backdrop-filter:blur(24px); }
.person-card:hover { background:rgba(255,255,255,.12); color:#fff; box-shadow:var(--tv-focus); }
.drawer { background:rgba(0,0,0,.76); backdrop-filter:blur(30px); }
.drawer__close:hover { background:#F5F5F7; color:#050507; }
.control-tv .media-card { width:218px; flex-basis:218px; }
.control-tv .row-scroll { gap:26px; }
.control-tv .nav__item, .control-tv .btn, .control-tv .segmented__item, .control-tv .season-tab { min-height:56px; }
.control-tv .media-card h3 { font-size:17px; }
@media (min-width: 1680px) { .media-card { width:204px; flex-basis:204px; } .grid { grid-template-columns:repeat(auto-fill,minmax(188px,1fr)); } }
@media (max-width: 1100px) { .app-shell { grid-template-columns:220px minmax(0,1fr); } .topbar { left:auto; } .media-card { width:162px; flex-basis:162px; } .details-hero { grid-template-columns:210px 1fr; } }
@media (max-width: 820px) { .topbar { margin:0 -14px 18px; padding:12px 14px; } .content { padding:0 14px 92px; } .hero { min-height:430px; border-radius:28px; } .hero__info { width:100%; padding:28px; } .hero h2 { font-size:44px; } .media-card { width:136px; flex-basis:136px; } .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 13px; } .details-hero { grid-template-columns:1fr; min-height:auto; padding:24px; } .details-poster { width:168px; } .details-title { font-size:42px; } .episode-row { grid-template-columns:1fr; } .auth-shell { border-radius:30px; } }

/* v10 Apple TV composition/layout pass */
@media (min-width: 821px) {
  body {
    overflow: hidden;
    background:
      radial-gradient(circle at 70% -10%, rgba(255,255,255,.08), transparent 34rem),
      radial-gradient(circle at 8% 20%, rgba(124,92,255,.10), transparent 32rem),
      linear-gradient(180deg, #050507 0%, #020203 100%);
  }
  .app-shell {
    display: block;
    min-height: 100vh;
  }
  .sidebar {
    position: fixed;
    left: clamp(18px, 2vw, 34px);
    right: clamp(18px, 2vw, 34px);
    top: 16px;
    height: 74px;
    width: auto;
    z-index: 40;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 10px 12px;
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 28px;
    background: linear-gradient(180deg, rgba(20,21,28,.70), rgba(5,6,9,.54));
    box-shadow: 0 24px 84px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.08);
    backdrop-filter: blur(30px) saturate(145%);
  }
  .brand {
    min-width: 210px;
    padding: 0 14px 0 0;
    border: 0;
    border-right: 1px solid rgba(255,255,255,.08);
  }
  .brand__logo {
    width: 46px;
    height: 46px;
    border-radius: 16px;
  }
  .brand strong {
    font-size: 19px;
  }
  .brand span {
    display: none;
  }
  .nav {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
  }
  .nav__item {
    min-height: 48px;
    padding: 0 15px;
    border-radius: 18px;
    white-space: nowrap;
    font-size: 14px;
  }
  .nav__item svg, .nav__item i {
    display: none;
  }
  .nav__item::before {
    display: none;
  }
  .nav__item.is-active {
    background: rgba(255,255,255,.16);
    color: #fff;
    border-color: rgba(255,255,255,.18);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 16px 44px rgba(0,0,0,.30);
  }
  .sidebar__bottom {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
  }
  .control-current {
    min-height: 46px;
    padding: 0 14px;
    min-width: 122px;
    border-radius: 18px;
  }
  .profile-pill {
    min-height: 46px;
    min-width: 150px;
    max-width: 220px;
    border-radius: 18px;
    overflow: hidden;
  }
  .profile-pill__dot {
    width: 30px;
    height: 30px;
    border-radius: 11px;
    flex: 0 0 auto;
  }
  .profile-pill b {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .content {
    height: 100vh;
    overflow-y: auto;
    padding: 108px clamp(24px, 4vw, 76px) 90px;
    background: none;
  }
  .topbar {
    position: sticky;
    top: 0;
    z-index: 30;
    min-height: 72px;
    margin: 0 0 22px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
  .topbar::before {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 126px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.22), transparent);
    z-index: -1;
  }
  .topbar__title {
    max-width: min(48vw, 680px);
  }
  .topbar__actions {
    min-width: min(520px, 42vw);
  }
  .search-box {
    height: 46px;
    background: rgba(255,255,255,.07);
  }
  body[data-page="home"] .topbar__title {
    opacity: 0;
    pointer-events: none;
  }
  body[data-page="home"] .topbar {
    margin-bottom: -50px;
  }
  body[data-page="home"] #notice:not(.is-hidden) {
    margin-top: 58px;
  }
  body[data-page="home"] .hero {
    margin-top: 0;
  }
  .hero {
    min-height: min(76vh, 820px);
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(220px, 330px);
    align-items: end;
    gap: clamp(24px, 4vw, 60px);
    padding: clamp(34px, 5vw, 82px);
    border-radius: 44px;
    margin-bottom: 54px;
  }
  .hero::after {
    background:
      radial-gradient(circle at 78% 50%, rgba(255,255,255,.12), transparent 18rem),
      linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.66) 44%, rgba(0,0,0,.22) 100%),
      linear-gradient(0deg, #000 0%, rgba(0,0,0,.52) 24%, transparent 64%);
  }
  .hero__info {
    width: 100%;
    min-height: 0;
    padding: 0;
    justify-content: end;
  }
  .hero h2 {
    max-width: 960px;
    font-size: clamp(56px, 7.8vw, 126px);
  }
  .hero p {
    max-width: 760px;
  }
  .hero__poster-card {
    display: block;
    width: min(100%, 320px);
    aspect-ratio: 2 / 3;
    justify-self: end;
    align-self: end;
    border-radius: 30px;
    background: #15171d center/cover no-repeat;
    border: 1px solid rgba(255,255,255,.16);
    box-shadow: 0 34px 110px rgba(0,0,0,.65), 0 0 0 1px rgba(255,255,255,.06);
    position: relative;
    overflow: hidden;
    transition: .22s cubic-bezier(.2,.8,.2,1);
  }
  .hero__poster-card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.64));
  }
  .hero__poster-card span {
    position: absolute;
    inset: auto 18px 18px auto;
    z-index: 2;
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: #f5f5f7;
    color: #000;
    box-shadow: 0 18px 50px rgba(0,0,0,.48);
  }
  .hero__poster-card:hover, .hero__poster-card:focus-visible {
    transform: translateY(-10px) scale(1.04);
    border-color: rgba(255,255,255,.84);
    box-shadow: var(--tv-focus);
  }
  .sections {
    gap: 56px;
  }
  .section {
    position: relative;
  }
  .section__head {
    padding: 0 2px;
    margin-bottom: 16px;
  }
  .section__head h2 {
    font-size: clamp(22px, 1.9vw, 34px);
  }
  .section__head p {
    display: none;
  }
  .section--featured {
    padding: 24px;
    margin: 0 -24px;
    border-radius: 36px;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018));
    border: 1px solid rgba(255,255,255,.07);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.055);
  }
  .section--featured .row-scroll {
    gap: 24px;
    padding-bottom: 12px;
  }
  .section--featured .media-card {
    width: clamp(210px, 15.5vw, 278px);
    flex-basis: clamp(210px, 15.5vw, 278px);
  }
  .section--featured .media-card h3 {
    font-size: 17px;
  }
  .section--genre .media-card {
    width: clamp(156px, 11.4vw, 206px);
    flex-basis: clamp(156px, 11.4vw, 206px);
  }
  .row-scroll {
    margin-left: -6px;
    margin-right: -6px;
    padding-left: 6px;
    padding-right: 6px;
  }
  .catalog-meta {
    margin: 0 0 18px;
  }
  .toolbar {
    top: 0;
    margin: 0 0 24px;
    padding: 14px;
    border-radius: 28px;
    justify-content: flex-start;
    width: fit-content;
    max-width: 100%;
  }
  .grid {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    gap: 34px 22px;
  }
  body[data-page="catalog"] .content {
    padding-left: clamp(30px, 6vw, 104px);
    padding-right: clamp(30px, 6vw, 104px);
  }
  body[data-page="media"] .topbar {
    margin-bottom: 10px;
  }
  body[data-page="media"] .content {
    padding-left: clamp(24px, 4vw, 76px);
    padding-right: clamp(24px, 4vw, 76px);
  }
  .details-hero {
    min-height: min(76vh, 820px);
    border-radius: 44px;
  }
  .auth-shell {
    grid-template-columns: minmax(0, 1.05fr) minmax(380px, .75fr);
    min-height: min(76vh, 780px);
  }
}

@media (min-width: 1500px) {
  .section--genre .media-card { width: 218px; flex-basis: 218px; }
  .section--featured .media-card { width: 292px; flex-basis: 292px; }
  .grid { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); }
}

@media (min-width: 821px) and (max-width: 1240px) {
  .sidebar {
    grid-template-columns: auto minmax(0, 1fr);
    height: auto;
    align-items: start;
  }
  .nav {
    justify-content: flex-end;
    flex-wrap: wrap;
  }
  .sidebar__bottom {
    grid-column: 1 / -1;
    justify-content: flex-end;
  }
  .content {
    padding-top: 154px;
  }
  .hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .hero__poster-card {
    display: none;
  }
  .topbar__actions {
    min-width: min(430px, 44vw);
  }
}

@media (max-width: 820px) {
  .hero__poster-card { display: none; }
  .section--featured {
    padding: 0;
    border: 0;
    background: transparent;
  }
  .section--featured .media-card { width: 150px; flex-basis: 150px; }
}

/* v11: ajax search + icon-pack polish */
.search-shell { position: relative; flex: 1; min-width: 280px; }
.search-shell .search-box { width: 100%; }
.search-clear { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 999px; color: var(--muted); background: rgba(255,255,255,.06); }
.search-clear:hover { color: var(--text); background: rgba(255,255,255,.14); }
.search-clear svg { width: 16px; height: 16px; }
.search-suggest {
  position: absolute; left: 0; right: 0; top: calc(100% + 10px); z-index: 60;
  padding: 12px; border: 1px solid rgba(255,255,255,.14); border-radius: 24px;
  background: linear-gradient(180deg, rgba(28,30,38,.96), rgba(9,10,14,.96));
  box-shadow: 0 34px 100px rgba(0,0,0,.55); backdrop-filter: blur(28px);
  max-height: min(70vh, 620px); overflow: auto;
}
.search-suggest::-webkit-scrollbar { width: 8px; }
.search-suggest::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 999px; }
.suggest-group + .suggest-group { margin-top: 12px; }
.suggest-group__title { padding: 4px 8px 8px; color: var(--muted); font-size: 12px; font-weight: 900; letter-spacing: .16em; text-transform: uppercase; }
.suggest-item, .suggest-all {
  width: 100%; min-height: 72px; display: grid; grid-template-columns: 46px minmax(0,1fr) 22px; align-items: center; gap: 12px;
  padding: 8px; border-radius: 18px; text-align: left; color: var(--text); transition: .16s ease;
}
.suggest-item:hover, .suggest-item:focus-visible, .suggest-all:hover { background: rgba(255,255,255,.10); transform: translateY(-1px); }
.suggest-item--compact { min-height: 58px; grid-template-columns: 38px minmax(0,1fr) 22px; }
.suggest-poster, .suggest-avatar { width: 46px; height: 58px; border-radius: 11px; background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.04)); background-size: cover; background-position: center; border: 1px solid rgba(255,255,255,.10); }
.suggest-avatar { width: 38px; height: 38px; border-radius: 50%; display:grid; place-items:center; }
.suggest-avatar svg { width: 18px; height: 18px; color: var(--muted); }
.suggest-main { min-width: 0; display: grid; gap: 5px; }
.suggest-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.suggest-main small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); font-size: 12px; }
.suggest-item > svg { color: var(--muted); width: 18px; }
.suggest-empty { padding: 18px; color: var(--muted); }
.suggest-all { margin-top: 8px; min-height: 48px; display: flex; justify-content: center; font-weight: 900; background: rgba(255,255,255,.08); }
.suggest-all svg { width: 17px; height: 17px; }
.search-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin: 8px 0 24px; }
.search-page-head h2 { margin:0; font-size: clamp(32px, 4vw, 56px); letter-spacing:-.045em; }
@media (max-width: 900px) {
  .search-shell { min-width: 0; }
  .search-suggest { position: fixed; left: 12px; right: 12px; top: 78px; }
  .search-page-head { display:grid; }
}

/* v12: Apple TV search composition */
.search-composer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025));
  box-shadow: inset 0 1px rgba(255,255,255,.06), 0 30px 90px rgba(0,0,0,.28);
  margin-bottom: 14px;
}
.search-composer__field {
  min-height: 56px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 0 18px;
  border-radius: 20px;
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.10);
}
.search-composer__field svg { width: 20px; height: 20px; color: var(--muted); }
.search-composer__field .input { padding: 0; border: 0; background: transparent; min-height: 54px; font-size: 18px; }
.search-scopes {
  display: flex;
  align-items: center;
  gap: 10px;
  overflow-x: auto;
  padding: 4px 2px 22px;
  scrollbar-width: none;
}
.search-scopes::-webkit-scrollbar { display: none; }
.search-scope {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
  padding: 0 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
  color: var(--muted);
  font-weight: 900;
  transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease;
}
.search-scope svg { width: 17px; height: 17px; }
.search-scope small { min-width: 0; color: inherit; opacity: .62; font-size: 11px; }
.search-scope:hover, .search-scope:focus-visible { transform: translateY(-1px); color: var(--text); background: rgba(255,255,255,.12); }
.search-scope.is-active {
  color: #0A0A0D;
  background: linear-gradient(180deg, #fff, #D9DEE7);
  box-shadow: 0 12px 34px rgba(255,255,255,.12);
}
.search-lobby {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.search-lobby__panel {
  min-height: 180px;
  padding: 22px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.10);
  background: radial-gradient(circle at 15% 0%, rgba(255,255,255,.10), transparent 36%), rgba(255,255,255,.045);
}
.search-lobby__title {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
  color: var(--text);
  font-weight: 950;
  letter-spacing: -.02em;
}
.search-lobby__title svg { width: 19px; height: 19px; color: var(--muted); }
.chip-cloud { display: flex; flex-wrap: wrap; gap: 10px; }
.quick-search, .quick-genre {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 13px;
  border-radius: 999px;
  color: var(--text);
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.09);
  font-weight: 850;
}
.quick-search:hover, .quick-genre:hover { background: rgba(255,255,255,.14); }
.quick-search svg, .quick-genre svg { width: 15px; height: 15px; color: var(--muted); }
.entity-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 18px;
}
.entity-card {
  min-height: 190px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 9px;
  padding: 22px;
  border-radius: 28px;
  color: var(--text);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035));
  border: 1px solid rgba(255,255,255,.10);
  text-align: center;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.entity-card:hover, .entity-card:focus-visible { transform: translateY(-4px) scale(1.015); border-color: rgba(255,255,255,.26); background: rgba(255,255,255,.10); }
.entity-card__avatar {
  width: 82px;
  height: 82px;
  display: grid;
  place-items: center;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.20), rgba(255,255,255,.05));
  background-size: cover;
  background-position: center;
  border: 1px solid rgba(255,255,255,.12);
}
.entity-card--person .entity-card__avatar { border-radius: 50%; }
.entity-card__avatar svg { width: 30px; height: 30px; color: var(--muted); }
.entity-card b { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; }
.entity-card small { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--muted); }
@media (max-width: 900px) {
  .search-composer { grid-template-columns: 1fr; }
  .search-lobby { grid-template-columns: 1fr; }
  .entity-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* v13: Apple TV mockup implementation — full-screen hero, pill nav, fullscreen blurred search */
@media (min-width: 821px) {
  :root {
    --apple-bg: #000000;
    --apple-glass: rgba(32, 20, 15, .52);
    --apple-glass-strong: rgba(18, 18, 22, .72);
    --apple-white: #F5F5F7;
    --apple-muted: rgba(245,245,247,.66);
    --apple-border: rgba(255,255,255,.14);
    --apple-shadow: 0 24px 90px rgba(0,0,0,.48);
  }

  body {
    background: #000;
    color: var(--apple-white);
  }

  body::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    z-index: -3;
    background:
      radial-gradient(circle at 72% 8%, rgba(255,132,42,.22), transparent 28rem),
      radial-gradient(circle at 20% 0%, rgba(255,255,255,.07), transparent 20rem),
      #000;
  }

  .app-shell {
    display: block;
    min-height: 100vh;
    background: #000;
  }

  .sidebar {
    position: fixed;
    inset: 24px auto auto 50%;
    transform: translateX(-50%);
    z-index: 120;
    width: auto;
    height: 58px;
    min-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: 999px;
    background:
      linear-gradient(180deg, rgba(68,36,22,.56), rgba(28,14,10,.54)),
      rgba(0,0,0,.34);
    box-shadow: 0 24px 70px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.16);
    backdrop-filter: blur(34px) saturate(160%);
    -webkit-backdrop-filter: blur(34px) saturate(160%);
  }

  .brand {
    position: fixed;
    left: max(36px, 3vw);
    top: 26px;
    z-index: 121;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .brand__logo {
    width: 44px;
    height: 44px;
    border-radius: 15px;
    background: linear-gradient(180deg, #fff, #A9ADB7);
    color: #050507;
    font-size: 13px;
    box-shadow: 0 18px 50px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.8);
  }

  .brand strong {
    text-transform: uppercase;
    letter-spacing: -.035em;
    font-size: 22px;
    color: #fff;
    text-shadow: 0 12px 34px rgba(0,0,0,.72);
  }

  .brand span {
    display: none;
  }

  .nav {
    height: 58px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-width: 0;
    padding: 5px;
  }

  .nav__item {
    height: 48px;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    white-space: nowrap;
    padding: 0 24px;
    border: 0;
    border-radius: 999px;
    background: transparent;
    color: rgba(245,245,247,.74);
    font-size: 16px;
    font-weight: 830;
    letter-spacing: -.018em;
    box-shadow: none;
    transition: transform .22s cubic-bezier(.2,.8,.2,1), background .22s ease, color .22s ease, box-shadow .22s ease;
  }

  .nav__item svg, .nav__item i, .nav__item::before {
    display: none !important;
  }

  .nav__item:hover,
  .nav__item:focus-visible {
    color: #fff;
    transform: translateY(-1px);
    background: rgba(255,255,255,.09);
  }

  .nav__item.is-active {
    color: #030303;
    background: linear-gradient(180deg, #fff, #D8DCE5);
    border-color: transparent;
    box-shadow: 0 18px 48px rgba(255,255,255,.18), inset 0 1px 0 rgba(255,255,255,.85);
  }

  .sidebar__bottom {
    position: fixed;
    right: max(32px, 3vw);
    top: 26px;
    z-index: 121;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .control-current {
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 50%;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    backdrop-filter: blur(22px);
  }

  .control-current span { display: none; }
  .control-current b { font-size: 0; }
  .control-current b::before { content: "⚙"; font-size: 19px; color: #fff; }

  .profile-pill {
    min-width: 44px;
    width: 44px;
    height: 44px;
    min-height: 44px;
    padding: 0;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.16);
    backdrop-filter: blur(22px);
    overflow: hidden;
  }

  .profile-pill__dot {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: linear-gradient(180deg, #fff, #A9ADB7);
    color: #060609;
  }

  .profile-pill b { display: none; }

  .content {
    height: auto;
    min-height: 100vh;
    overflow: visible;
    padding: 118px clamp(40px, 5vw, 86px) 90px;
    background: transparent;
  }

  body[data-page="home"] .content {
    padding: 0 0 96px;
  }

  .topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    min-height: 80px;
    margin: -8px 0 22px;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }

  .topbar::before {
    content: "";
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    height: 132px;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(0,0,0,.74), rgba(0,0,0,.20), transparent);
    z-index: -1;
  }

  body[data-page="home"] .topbar {
    display: none;
  }

  .topbar__actions {
    min-width: min(520px, 42vw);
  }

  .search-box {
    height: 48px;
    border-radius: 999px;
    background: rgba(255,255,255,.10);
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 18px 44px rgba(0,0,0,.25);
    backdrop-filter: blur(22px);
  }

  .search-box:focus-within {
    border-color: rgba(255,255,255,.32);
    background: rgba(255,255,255,.16);
  }

  .hero {
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: clamp(120px, 14vh, 172px) clamp(50px, 5.4vw, 96px) clamp(160px, 24vh, 260px);
    border-radius: 0;
    border: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(240px, 360px);
    align-items: center;
    gap: clamp(26px, 5vw, 76px);
    overflow: hidden;
    box-shadow: inset 0 -150px 120px rgba(0,0,0,.98);
    background: #000;
  }

  .hero::before {
    opacity: .98;
    filter: saturate(1.12) contrast(1.04) brightness(.86);
    transform: scale(1.02);
  }

  .hero::after {
    background:
      radial-gradient(circle at 68% 38%, rgba(255,135,31,.16), transparent 34rem),
      linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.72) 28%, rgba(0,0,0,.18) 62%, rgba(0,0,0,.04) 100%),
      linear-gradient(0deg, #000 0%, rgba(0,0,0,.82) 16%, rgba(0,0,0,.28) 46%, rgba(0,0,0,.20) 100%);
  }

  .hero__info {
    width: min(650px, 52vw);
    padding: 0;
    min-height: 0;
    justify-content: center;
    align-self: center;
  }

  .hero .badge {
    height: auto;
    padding: 0;
    border: 0;
    background: transparent;
    color: rgba(255,255,255,.88);
    font-size: 18px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: -.02em;
    box-shadow: none;
  }

  .hero h2 {
    max-width: 700px;
    margin: 14px 0 18px;
    font-size: clamp(54px, 7vw, 122px);
    line-height: .82;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-weight: 920;
    text-shadow: 0 22px 80px rgba(0,0,0,.80);
  }

  .hero__meta {
    order: -1;
    margin: 0 0 10px;
    gap: 8px;
  }

  .hero__meta .details-chip {
    min-height: 28px;
    border-radius: 7px;
    padding: 0 8px;
    background: rgba(0,0,0,.20);
    border-color: rgba(255,255,255,.34);
    color: rgba(255,255,255,.88);
    font-size: 13px;
  }

  .hero p {
    max-width: 520px;
    color: rgba(255,255,255,.88);
    font-size: clamp(16px, 1.28vw, 21px);
    line-height: 1.46;
    text-shadow: 0 12px 40px rgba(0,0,0,.76);
  }

  .hero__actions {
    margin-top: 28px;
    gap: 14px;
  }

  .hero__actions .btn {
    min-height: 56px;
    border-radius: 14px;
    padding: 0 34px;
    font-size: 18px;
    font-weight: 900;
  }

  .hero__actions .btn--primary {
    background: rgba(255,255,255,.78);
    color: #17110E;
    border-color: rgba(255,255,255,.66);
    box-shadow: 0 18px 50px rgba(0,0,0,.32);
  }

  .hero__actions .btn--primary:hover,
  .hero__actions .btn--primary:focus-visible {
    background: #fff;
    color: #000;
  }

  .hero__poster-card {
    display: none;
  }

  #homeSections {
    position: relative;
    z-index: 4;
    margin-top: clamp(-190px, -16vh, -110px);
    padding: 0 clamp(50px, 5.4vw, 96px);
  }

  .sections {
    gap: 34px;
  }

  .section {
    position: relative;
  }

  .section + .section {
    margin-top: 18px;
  }

  .section__head {
    margin: 0 0 12px;
    padding: 0;
  }

  .section__head h2 {
    color: #fff;
    font-size: clamp(24px, 1.7vw, 34px);
    font-weight: 880;
    letter-spacing: -.035em;
    text-shadow: 0 12px 36px rgba(0,0,0,.75);
  }

  .section__more {
    min-height: 32px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(255,255,255,.12);
    border-color: rgba(255,255,255,.12);
    color: rgba(255,255,255,.86);
    backdrop-filter: blur(14px);
  }

  .section__more span { display: none; }
  .section__more::after { content: "›"; margin-left: 7px; font-size: 20px; line-height: 0; }

  .section--featured {
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body[data-page="home"] .row-scroll {
    gap: 22px;
    margin: 0 -8px;
    padding: 6px 8px 24px;
    scrollbar-width: none;
  }

  body[data-page="home"] .row-scroll::-webkit-scrollbar { display: none; }

  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card {
    width: clamp(230px, 17.4vw, 340px);
    flex: 0 0 clamp(230px, 17.4vw, 340px);
    border-radius: 14px;
  }

  body[data-page="home"] .media-card__poster {
    aspect-ratio: 16 / 9;
    border-radius: 13px;
    box-shadow: 0 18px 52px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.10);
  }

  body[data-page="home"] .media-card__poster::after {
    background: linear-gradient(180deg, rgba(0,0,0,.0) 24%, rgba(0,0,0,.72) 100%);
  }

  body[data-page="home"] .media-card h3 {
    margin-top: 10px;
    font-size: 16px;
    font-weight: 760;
    letter-spacing: -.025em;
  }

  body[data-page="home"] .media-card p {
    color: rgba(245,245,247,.58);
    font-size: 14px;
  }

  body[data-page="home"] .media-card__meta {
    display: none;
  }

  body[data-page="home"] .media-card:hover,
  body[data-page="home"] .media-card:focus-within {
    transform: translateY(-7px) scale(1.045);
    z-index: 8;
  }

  body[data-page="home"] .media-card:hover .media-card__poster,
  body[data-page="home"] .media-card:focus-within .media-card__poster {
    border-color: rgba(255,255,255,.82);
    box-shadow: 0 0 0 4px rgba(255,255,255,.82), 0 24px 74px rgba(0,0,0,.62);
  }

  body:not([data-page="home"]) .grid {
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  }
}

.search-modal-open .app-shell,
.search-modal-open .bottom-nav,
.search-modal-open .mode-fab,
.search-modal-open .drawer {
  filter: blur(18px) brightness(.32) saturate(.8);
  transform: scale(1.012);
  transition: filter .22s ease, transform .22s ease;
}

.search-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: grid;
  place-items: start center;
  padding: clamp(70px, 9vh, 118px) 24px 60px;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(42px) brightness(.45) saturate(120%);
  -webkit-backdrop-filter: blur(42px) brightness(.45) saturate(120%);
  overflow: auto;
}

.search-overlay.is-hidden {
  display: none;
}

.search-overlay__close {
  position: fixed;
  right: clamp(24px, 3vw, 44px);
  top: clamp(22px, 3vw, 42px);
  z-index: 4;
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: rgba(255,255,255,.62);
  background: transparent;
  transition: .18s ease;
}

.search-overlay__close svg { width: 34px; height: 34px; stroke-width: 2.4; }
.search-overlay__close:hover,
.search-overlay__close:focus-visible { color: #fff; background: rgba(255,255,255,.10); }

.search-overlay__stage {
  width: min(1080px, 100%);
  display: grid;
  justify-items: center;
  gap: 28px;
  padding-top: 0;
}

.search-overlay__stage h2 {
  margin: 0 0 8px;
  width: min(780px, 100%);
  text-align: left;
  font-size: clamp(42px, 5vw, 68px);
  line-height: .95;
  font-weight: 880;
  letter-spacing: -.055em;
  color: #fff;
  text-shadow: 0 18px 50px rgba(0,0,0,.78);
}

.search-overlay__field {
  width: min(980px, 100%);
  min-height: 78px;
  display: grid;
  grid-template-columns: 34px minmax(0,1fr) 46px;
  align-items: center;
  gap: 18px;
  padding: 0 18px 0 22px;
  border-radius: 14px;
  background: rgba(255,255,255,.98);
  color: #111;
  box-shadow: 0 28px 90px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.86);
}

.search-overlay__field > svg,
.search-overlay__field > i { color: #B9BBC4; width: 32px; height: 32px; }

.search-overlay__field input {
  width: 100%;
  height: 78px;
  border: 0;
  outline: 0;
  background: transparent;
  color: #16171B;
  font-size: clamp(22px, 2vw, 30px);
  font-weight: 520;
  letter-spacing: -.025em;
}

.search-overlay__field input::placeholder {
  color: #B8BAC2;
}

.search-overlay__field button {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #111;
  background: rgba(0,0,0,.06);
}

.search-overlay__field button:hover { background: rgba(0,0,0,.12); }

.search-overlay__quick-actions {
  display: flex;
  justify-content: center;
  gap: 22px;
  margin-top: 18px;
}

.search-overlay__quick-actions button {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: rgba(38,39,46,.86);
  border: 1px solid rgba(255,255,255,.09);
  box-shadow: 0 18px 52px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.10);
  backdrop-filter: blur(20px);
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease;
}

.search-overlay__quick-actions button svg { width: 30px; height: 30px; }
.search-overlay__quick-actions button:hover,
.search-overlay__quick-actions button:focus-visible {
  transform: translateY(-3px) scale(1.05);
  background: rgba(255,255,255,.18);
  box-shadow: 0 0 0 4px rgba(255,255,255,.16), 0 24px 70px rgba(0,0,0,.52);
}

.search-overlay__popular {
  margin-top: clamp(44px, 8vh, 100px);
  display: grid;
  justify-items: center;
  gap: 18px;
  color: #fff;
}

.search-overlay__popular strong {
  font-size: 21px;
  font-weight: 860;
  letter-spacing: -.025em;
}

.search-overlay__popular div,
.search-overlay__chips {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  max-width: 760px;
}

.search-overlay__popular button,
.search-overlay__chips button {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  border-radius: 999px;
  color: #fff;
  background: rgba(42,43,50,.86);
  border: 1px solid rgba(255,255,255,.08);
  font-size: 16px;
  font-weight: 740;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.search-overlay__popular button:hover,
.search-overlay__chips button:hover {
  background: rgba(255,255,255,.18);
}

.search-overlay__results {
  width: min(1180px, 100%);
  display: grid;
  gap: 26px;
  margin-top: 18px;
}

.search-overlay__results section h3 {
  margin: 0 0 14px;
  text-align: center;
  color: #fff;
  font-size: 22px;
}

.search-overlay__media-row {
  display: flex;
  gap: 18px;
  overflow-x: auto;
  padding: 6px 4px 22px;
  scrollbar-width: none;
}
.search-overlay__media-row::-webkit-scrollbar { display: none; }

.search-overlay-card {
  width: 230px;
  flex: 0 0 230px;
  display: grid;
  gap: 8px;
  text-align: left;
  color: #fff;
  transition: transform .18s ease;
}

.search-overlay-card:hover,
.search-overlay-card:focus-visible { transform: translateY(-6px) scale(1.035); }
.search-overlay-card__image {
  aspect-ratio: 16 / 9;
  border-radius: 13px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.08) center/cover no-repeat;
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 52px rgba(0,0,0,.38);
}
.search-overlay-card__image svg { opacity: 0; transition: .18s ease; }
.search-overlay-card:hover .search-overlay-card__image svg { opacity: 1; }
.search-overlay-card b { font-size: 16px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.search-overlay-card small { color: rgba(255,255,255,.58); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }

.search-overlay__all {
  justify-self: center;
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 0 18px;
  border-radius: 999px;
  color: #111;
  background: #fff;
  font-weight: 850;
}

@media (max-width: 820px) {
  .search-overlay { padding: 70px 16px 40px; }
  .search-overlay__stage h2 { width: 100%; font-size: 42px; }
  .search-overlay__field { min-height: 62px; grid-template-columns: 24px minmax(0,1fr); border-radius: 14px; }
  .search-overlay__field input { height: 62px; font-size: 19px; }
  .search-overlay__field button { display: none; }
  .search-overlay__quick-actions button { width: 58px; height: 58px; }
  .search-overlay__popular { margin-top: 44px; }
}

/* v14: Apple TV menu/search repair — logo inside menu, modal search only, automatic responsive mode */
.device-overlay,
.mode-fab,
.mode-fab.is-hidden,
.control-current,
#changeControlModeBtn {
  display: none !important;
}
.search-shell--hidden,
#searchBtn {
  display: none !important;
}

.topbar-search-btn {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 18px;
  border-radius: 999px;
  color: rgba(255,255,255,.88);
  border: 1px solid rgba(255,255,255,.13);
  background: rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 44px rgba(0,0,0,.24);
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  font-weight: 850;
}
.topbar-search-btn:hover,
.topbar-search-btn:focus-visible {
  color: #050506;
  background: #fff;
  transform: translateY(-1px);
}
.topbar-search-btn svg { width: 18px; height: 18px; }

@media (min-width: 821px) {
  body {
    background: #000 !important;
    overflow-x: hidden;
  }

  .app-shell {
    display: block !important;
    background: #000 !important;
  }

  .sidebar {
    position: fixed !important;
    top: 22px !important;
    left: 50% !important;
    right: auto !important;
    bottom: auto !important;
    transform: translateX(-50%) !important;
    width: min(1180px, calc(100vw - 64px)) !important;
    height: 62px !important;
    min-height: 0 !important;
    z-index: 220 !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 18px !important;
    padding: 6px 8px 6px 12px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    background:
      linear-gradient(180deg, rgba(86,48,28,.58), rgba(27,14,10,.54)),
      rgba(0,0,0,.30) !important;
    box-shadow: 0 24px 90px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.18) !important;
    backdrop-filter: blur(46px) saturate(170%) !important;
    -webkit-backdrop-filter: blur(46px) saturate(170%) !important;
  }

  .brand {
    position: static !important;
    inset: auto !important;
    transform: none !important;
    min-width: 0 !important;
    height: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 0 16px 0 6px !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.12) !important;
    background: transparent !important;
  }

  .brand__logo {
    width: 38px !important;
    height: 38px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(184,188,198,.98)) !important;
    color: #050506 !important;
    box-shadow: 0 14px 38px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.82) !important;
  }

  .brand strong {
    display: block !important;
    color: #fff !important;
    font-size: 18px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
    letter-spacing: -.035em !important;
    text-shadow: 0 12px 32px rgba(0,0,0,.72) !important;
  }

  .brand span { display: none !important; }

  .nav {
    height: 50px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    padding: 0 !important;
    min-width: 0 !important;
    overflow: hidden !important;
  }

  .nav__item {
    height: 50px !important;
    min-height: 50px !important;
    flex: 0 1 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 clamp(10px, 1.25vw, 24px) !important;
    border-radius: 999px !important;
    border: 0 !important;
    background: transparent !important;
    color: rgba(245,245,247,.76) !important;
    font-size: clamp(13px, .96vw, 16px) !important;
    font-weight: 760 !important;
    letter-spacing: -.02em !important;
    white-space: nowrap !important;
    box-shadow: none !important;
  }

  .nav__item:hover,
  .nav__item:focus-visible {
    color: #fff !important;
    background: rgba(255,255,255,.10) !important;
    transform: translateY(-1px) !important;
  }

  .nav__item.is-active {
    color: #050506 !important;
    background: linear-gradient(180deg, #fff, #DDE2EA) !important;
    box-shadow: 0 18px 54px rgba(255,255,255,.18), inset 0 1px 0 rgba(255,255,255,.9) !important;
  }

  .nav__item svg,
  .nav__item i,
  .nav__item::before { display: none !important; }

  .nav__item--search {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    padding: 0 !important;
    margin-left: 2px !important;
    color: rgba(245,245,247,.86) !important;
  }

  .nav__item--search span { display: none !important; }
  .nav__item--search svg,
  .nav__item--search i {
    display: block !important;
    width: 21px !important;
    height: 21px !important;
  }

  .sidebar__bottom {
    display: none !important;
  }

  .content {
    width: 100% !important;
    min-height: 100vh !important;
    padding: 112px clamp(34px, 5vw, 92px) 90px !important;
    background: #000 !important;
  }

  body[data-page="home"] .content {
    padding: 0 0 96px !important;
  }

  .topbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 80 !important;
    min-height: 76px !important;
    margin: 0 0 22px !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
  }

  body[data-page="home"] .topbar {
    display: none !important;
  }

  .topbar__actions {
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  .topbar-search-btn {
    display: none !important;
  }

  #refreshBtn {
    background: rgba(255,255,255,.09) !important;
    border-color: rgba(255,255,255,.13) !important;
    backdrop-filter: blur(18px) !important;
  }

  .hero {
    min-height: 100vh !important;
    padding: clamp(126px, 16vh, 188px) clamp(50px, 6vw, 104px) clamp(172px, 26vh, 270px) !important;
    border-radius: 0 !important;
    border: 0 !important;
    box-shadow: inset 0 -170px 130px rgba(0,0,0,1) !important;
  }

  .hero::before {
    opacity: .98 !important;
    filter: saturate(1.12) contrast(1.04) brightness(.78) !important;
    transform: scale(1.03) !important;
  }

  .hero::after {
    background:
      radial-gradient(circle at 70% 38%, rgba(255,139,40,.22), transparent 31rem),
      linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.68) 31%, rgba(0,0,0,.20) 62%, rgba(0,0,0,.05) 100%),
      linear-gradient(0deg, #000 0%, rgba(0,0,0,.86) 14%, rgba(0,0,0,.28) 48%, rgba(0,0,0,.10) 100%) !important;
  }

  .hero h2 {
    font-size: clamp(58px, 7.2vw, 120px) !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
  }

  #homeSections {
    margin-top: clamp(-205px, -17vh, -118px) !important;
    padding: 0 clamp(50px, 6vw, 104px) !important;
  }

  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card {
    width: clamp(245px, 18vw, 348px) !important;
    flex-basis: clamp(245px, 18vw, 348px) !important;
  }

  body[data-page="home"] .media-card__poster {
    padding-bottom: 56.25% !important;
    aspect-ratio: 16 / 9 !important;
  }

  .toolbar {
    border-radius: 26px !important;
    background: rgba(255,255,255,.045) !important;
    border: 1px solid rgba(255,255,255,.09) !important;
    backdrop-filter: blur(24px) !important;
  }
}

@media (min-width: 821px) and (max-width: 1180px) {
  .sidebar {
    width: min(1040px, calc(100vw - 34px)) !important;
    gap: 10px !important;
  }
  .brand strong { font-size: 16px !important; }
  .brand { padding-right: 10px !important; }
  .nav__item { padding: 0 10px !important; font-size: 13px !important; }
  .nav__item--search { width: 46px !important; min-width: 46px !important; max-width: 46px !important; }
}

@media (max-width: 820px) {
  .device-overlay,
  .mode-fab,
  .control-current { display: none !important; }
  .topbar-search-btn { display: inline-flex !important; }
  .topbar__actions { min-width: 0 !important; }
  .bottom-nav__item[data-search-open] { display: inline-flex; }
}

.search-modal-open .app-shell,
.search-modal-open .bottom-nav,
.search-modal-open .drawer {
  filter: blur(24px) brightness(.25) saturate(.72) !important;
  transform: scale(1.018) !important;
}

.search-overlay {
  background: rgba(0,0,0,.64) !important;
  backdrop-filter: blur(62px) brightness(.38) saturate(125%) !important;
  -webkit-backdrop-filter: blur(62px) brightness(.38) saturate(125%) !important;
}

.search-overlay::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 72% 24%, rgba(255,255,255,.08), transparent 20rem),
    radial-gradient(circle at 28% 52%, rgba(255,123,32,.10), transparent 24rem),
    linear-gradient(180deg, rgba(0,0,0,.16), rgba(0,0,0,.82));
}

.search-overlay__stage {
  gap: 30px !important;
}

.search-overlay__stage h2 {
  width: min(980px, 100%) !important;
  font-size: clamp(52px, 5.4vw, 78px) !important;
  font-weight: 820 !important;
}

.search-overlay__field {
  width: min(1040px, 100%) !important;
  min-height: 82px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.98) !important;
}

.search-overlay__field input {
  height: 82px !important;
}

.search-overlay__quick-actions button {
  background: rgba(31,32,38,.82) !important;
  backdrop-filter: blur(26px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(140%) !important;
}

/* v15: fixed Apple TV composition, stable fullscreen search, login/register modal */
:root {
  --kinolot-yellow: #FFD21A;
  --kinolot-yellow-2: #FFB800;
  --tv-bg: #000;
  --tv-panel: rgba(28,29,35,.82);
  --tv-panel-strong: rgba(34,35,42,.94);
  --tv-border: rgba(255,255,255,.13);
}

html, body { width: 100%; max-width: 100%; }
body { background: #000 !important; overflow: hidden !important; }
button, input, select, textarea { font-family: Inter, "SF Pro Display", "Segoe UI", system-ui, -apple-system, sans-serif !important; }
.device-overlay, .mode-fab, #changeControlModeBtn, .control-current, .search-shell { display: none !important; }

@media (min-width: 821px) {
  .app-shell { display: block !important; min-height: 100vh !important; background: #000 !important; }
  .sidebar {
    position: fixed !important;
    top: 24px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    z-index: 120 !important;
    width: min(1280px, calc(100vw - 72px)) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 18px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0,1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(72,45,32,.72), rgba(35,24,21,.62)) !important;
    box-shadow: 0 24px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14) !important;
    backdrop-filter: blur(42px) saturate(155%) !important;
    -webkit-backdrop-filter: blur(42px) saturate(155%) !important;
  }
  .brand {
    height: 54px !important;
    min-width: 184px !important;
    padding: 0 18px 0 5px !important;
    border-right: 1px solid rgba(255,255,255,.14) !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    background: transparent !important;
  }
  .brand__logo {
    width: 46px !important;
    height: 46px !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, #fff, #bcc1cb) !important;
    color: #070708 !important;
    box-shadow: 0 14px 38px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.8) !important;
  }
  .brand strong { color: #fff !important; font-size: 20px !important; font-weight: 900 !important; letter-spacing: -.04em !important; text-transform: uppercase !important; }
  .brand span { display: none !important; }
  .nav { height: 58px !important; min-width: 0 !important; display: flex !important; justify-content: center !important; align-items: center !important; gap: 8px !important; padding: 0 !important; overflow: hidden !important; }
  .nav__item {
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 clamp(14px,1.45vw,28px) !important;
    border-radius: 999px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    color: rgba(255,255,255,.74) !important;
    font-weight: 820 !important;
    font-size: clamp(14px,1vw,17px) !important;
    white-space: nowrap !important;
    text-align: center !important;
  }
  .nav__item svg, .nav__item i { display: none !important; }
  .nav__item:hover, .nav__item:focus-visible { background: rgba(255,255,255,.11) !important; color: #fff !important; transform: translateY(-1px) !important; }
  .nav__item.is-active { background: linear-gradient(180deg, #fff, #E0E4EA) !important; color: #070708 !important; box-shadow: 0 18px 55px rgba(255,255,255,.16), inset 0 1px 0 rgba(255,255,255,.88) !important; }
  .nav__item--search { width: 58px !important; min-width: 58px !important; max-width: 58px !important; padding: 0 !important; }
  .nav__item--search span { display: none !important; }
  .nav__item--search svg, .nav__item--search i { display: block !important; width: 25px !important; height: 25px !important; color: rgba(255,255,255,.82) !important; }
  .nav__item--search.is-active { background: rgba(255,255,255,.14) !important; color: #fff !important; }
  .sidebar__bottom { display: none !important; }
  .content { width: 100% !important; height: 100vh !important; overflow-y: auto !important; overflow-x: hidden !important; padding: 122px clamp(38px,5vw,96px) 90px !important; background: #000 !important; scroll-behavior: smooth !important; }
  body[data-page="home"] .content { padding: 0 0 96px !important; }
  .topbar { position: sticky !important; top: 0 !important; z-index: 50 !important; min-height: 78px !important; margin: 0 0 18px !important; padding: 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; }
  body[data-page="home"] .topbar { display: none !important; }
  .topbar__actions { min-width: 0 !important; }
  .topbar-search-btn { display: none !important; }
}

body[data-page="home"] .hero.home-showcase {
  position: relative !important;
  min-height: 100svh !important;
  height: auto !important;
  display: grid !important;
  align-content: end !important;
  gap: clamp(24px,4vh,52px) !important;
  padding: clamp(132px,17vh,205px) clamp(26px,6vw,110px) clamp(46px,7vh,86px) !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  isolation: isolate !important;
  box-shadow: inset 0 -190px 160px #000 !important;
}
body[data-page="home"] .hero.home-showcase::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -3 !important;
  background: var(--hero-bg, none) center/cover no-repeat !important;
  opacity: .52 !important;
  filter: blur(2px) saturate(1.05) contrast(1.03) brightness(.72) !important;
  transform: scale(1.04) !important;
}
body[data-page="home"] .hero.home-showcase::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background:
    radial-gradient(circle at 62% 38%, rgba(255,203,16,.16), transparent 27rem),
    linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.64) 42%, rgba(0,0,0,.32) 100%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.88) 22%, rgba(0,0,0,.24) 70%, rgba(0,0,0,.38) 100%) !important;
}
.showcase-copy { position: relative !important; z-index: 3 !important; width: min(720px, 92vw) !important; text-shadow: 0 16px 48px rgba(0,0,0,.9) !important; }
.showcase-meta { display: flex !important; flex-wrap: wrap !important; gap: 10px !important; margin-bottom: 16px !important; }
.showcase-meta span, .showcase-card__badges b { min-height: 32px !important; display: inline-flex !important; align-items: center !important; padding: 0 12px !important; border-radius: 10px !important; border: 1px solid rgba(255,255,255,.30) !important; background: rgba(255,255,255,.10) !important; color: #fff !important; font-size: 15px !important; font-weight: 850 !important; backdrop-filter: blur(16px) !important; }
.showcase-card__badges .is-quality { background: var(--kinolot-yellow) !important; color: #111 !important; border-color: transparent !important; }
.showcase-copy h2 { margin: 0 !important; max-width: 920px !important; font-size: clamp(58px,8vw,126px) !important; line-height: .88 !important; letter-spacing: .14em !important; text-transform: uppercase !important; font-weight: 950 !important; color: #fff !important; }
.showcase-copy p { max-width: 660px !important; margin: 22px 0 0 !important; color: rgba(255,255,255,.86) !important; font-size: clamp(18px,1.6vw,26px) !important; line-height: 1.42 !important; display: -webkit-box !important; -webkit-line-clamp: 5 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
.showcase-actions { display: flex !important; gap: 14px !important; margin-top: 30px !important; }
.showcase-btn { min-height: 58px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 11px !important; padding: 0 28px !important; border-radius: 17px !important; font-size: 18px !important; font-weight: 900 !important; background: rgba(255,255,255,.16) !important; color: #fff !important; border: 1px solid rgba(255,255,255,.18) !important; box-shadow: 0 18px 52px rgba(0,0,0,.44) !important; backdrop-filter: blur(20px) !important; }
.showcase-btn--primary { background: #fff !important; color: #080808 !important; border-color: transparent !important; }
.showcase-btn:hover, .showcase-btn:focus-visible { transform: translateY(-2px) scale(1.03) !important; box-shadow: 0 0 0 4px rgba(255,255,255,.20), 0 24px 72px rgba(0,0,0,.55) !important; }
.showcase-rail { position: relative !important; z-index: 4 !important; display: flex !important; gap: clamp(18px,2vw,34px) !important; overflow-x: auto !important; overflow-y: visible !important; padding: 16px 8px 42px !important; margin: 0 calc(clamp(26px,6vw,110px) * -1) !important; padding-left: clamp(26px,6vw,110px) !important; padding-right: clamp(26px,6vw,110px) !important; scroll-snap-type: x proximity !important; scrollbar-width: none !important; -webkit-overflow-scrolling: touch !important; }
.showcase-rail::-webkit-scrollbar { display: none !important; }
.showcase-card { position: relative !important; flex: 0 0 clamp(250px, 25vw, 430px) !important; aspect-ratio: 3 / 4 !important; min-height: 360px !important; max-height: 620px !important; border-radius: clamp(22px,2.2vw,38px) !important; overflow: hidden !important; border: 1px solid rgba(255,255,255,.10) !important; background: rgba(255,255,255,.08) center/cover no-repeat !important; box-shadow: 0 30px 90px rgba(0,0,0,.52) !important; scroll-snap-align: center !important; transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease, opacity .22s ease !important; transform-origin: center bottom !important; }
.showcase-card::after { content: "" !important; position: absolute !important; inset: 0 !important; background: linear-gradient(180deg, rgba(0,0,0,.04) 20%, rgba(0,0,0,.72) 100%) !important; }
.showcase-card:hover, .showcase-card:focus-visible, .showcase-card.is-active { transform: translateY(-14px) scale(1.045) !important; border-color: rgba(255,255,255,.84) !important; box-shadow: 0 0 0 5px rgba(255,255,255,.82), 0 38px 120px rgba(0,0,0,.75) !important; z-index: 6 !important; }
.showcase-card__badges { position: absolute !important; z-index: 3 !important; top: 18px !important; left: 18px !important; display: flex !important; gap: 8px !important; }
.showcase-card__content { position: absolute !important; z-index: 3 !important; left: 22px !important; right: 22px !important; bottom: 24px !important; display: grid !important; gap: 7px !important; text-align: left !important; }
.showcase-card__content strong { color: #fff !important; font-size: clamp(28px,2.4vw,46px) !important; line-height: .98 !important; letter-spacing: -.05em !important; font-weight: 950 !important; text-shadow: 0 12px 36px rgba(0,0,0,.88) !important; }
.showcase-card__content small { color: rgba(255,255,255,.78) !important; font-size: 15px !important; }
.showcase-dots { position: relative !important; z-index: 5 !important; justify-self: center !important; display: flex !important; gap: 8px !important; margin-top: -22px !important; }
.showcase-dots button { width: 9px !important; height: 9px !important; border-radius: 99px !important; background: rgba(255,255,255,.72) !important; opacity: .75 !important; }
.showcase-dots button.is-active { width: 32px !important; background: var(--kinolot-yellow) !important; opacity: 1 !important; }

body[data-page="home"] #homeSections { position: relative !important; z-index: 8 !important; margin-top: 0 !important; padding: 0 clamp(26px,6vw,110px) !important; display: grid !important; gap: 42px !important; }
body[data-page="home"] .section__head h2 { font-size: clamp(26px,2.3vw,42px) !important; letter-spacing: -.045em !important; }
body[data-page="home"] .row-scroll { gap: 18px !important; overflow-x: auto !important; overflow-y: visible !important; padding: 10px 6px 26px !important; scrollbar-width: thin !important; scroll-snap-type: x proximity !important; }
body[data-page="home"] .media-card { width: clamp(150px, 12vw, 230px) !important; flex: 0 0 clamp(150px, 12vw, 230px) !important; }
body[data-page="home"] .section--featured .media-card { width: clamp(180px, 14vw, 270px) !important; flex-basis: clamp(180px, 14vw, 270px) !important; }
body[data-page="home"] .media-card__poster { padding-bottom: 150% !important; aspect-ratio: auto !important; border-radius: 17px !important; }
body[data-page="home"] .media-card:hover .media-card__poster, body[data-page="home"] .media-card:focus-within .media-card__poster { box-shadow: 0 0 0 3px #fff, 0 28px 80px rgba(0,0,0,.72) !important; }

body.search-modal-open { overflow: hidden !important; }
body.search-modal-open .content { overflow: hidden !important; }
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100dvh !important;
  z-index: 1000 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  padding: clamp(78px,9vh,122px) 24px 56px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: rgba(0,0,0,.66) !important;
  backdrop-filter: blur(72px) brightness(.32) saturate(125%) !important;
  -webkit-backdrop-filter: blur(72px) brightness(.32) saturate(125%) !important;
  overscroll-behavior: contain !important;
  box-sizing: border-box !important;
}
#searchOverlay.search-overlay.is-hidden { display: none !important; }
#searchOverlay .search-overlay__stage { position: relative !important; left: auto !important; right: auto !important; transform: none !important; width: min(1040px, calc(100vw - 48px)) !important; max-width: calc(100vw - 48px) !important; margin: 0 auto !important; display: grid !important; justify-items: center !important; gap: 30px !important; padding: 0 !important; }
#searchOverlay .search-overlay__stage h2 { width: min(980px, 100%) !important; margin: 0 0 6px !important; text-align: left !important; justify-self: center !important; font-size: clamp(50px,5.5vw,82px) !important; line-height: 1 !important; letter-spacing: -.055em !important; }
#searchOverlay .search-overlay__field { width: min(980px, 100%) !important; max-width: 100% !important; min-height: 82px !important; grid-template-columns: 34px minmax(0,1fr) 46px !important; border-radius: 16px !important; padding: 0 18px 0 22px !important; background: #fff !important; color: #111 !important; overflow: hidden !important; }
#searchOverlay .search-overlay__field input { width: 100% !important; min-width: 0 !important; height: 82px !important; color: #111 !important; font-size: clamp(24px,2vw,30px) !important; }
#searchOverlay .search-overlay__quick-actions { margin-top: 20px !important; }
#searchOverlay .search-overlay__popular { margin-top: clamp(44px,7vh,86px) !important; }
#searchOverlay .search-overlay__results { width: min(1180px, 100%) !important; max-width: 100% !important; overflow: visible !important; }
#searchOverlay .search-overlay__media-row { max-width: 100% !important; overflow-x: auto !important; overflow-y: visible !important; }
#searchOverlay .search-overlay-card { width: 240px !important; flex: 0 0 240px !important; }
#searchOverlay .search-overlay__close { position: fixed !important; top: 28px !important; right: 30px !important; z-index: 1002 !important; }

.auth-modal-page { min-height: calc(100vh - 150px) !important; display: grid !important; align-items: center !important; padding: clamp(16px,3vw,54px) 0 !important; }
.auth-close { position: fixed !important; top: 32px !important; right: 34px !important; z-index: 4 !important; width: 42px !important; height: 42px !important; display: grid !important; place-items: center !important; color: #fff !important; opacity: .8 !important; }
.auth-close svg { width: 28px !important; height: 28px !important; }
.auth-modal-card { width: min(1500px, 100%) !important; min-height: min(760px, calc(100vh - 180px)) !important; margin: 0 auto !important; display: grid !important; grid-template-columns: minmax(420px, .95fr) minmax(430px, 1.05fr) !important; border-radius: 28px !important; overflow: hidden !important; background: #0B0B0D !important; border: 1px solid rgba(255,255,255,.08) !important; box-shadow: 0 44px 160px rgba(0,0,0,.72) !important; }
.auth-form-side { background: #151519 !important; display: flex !important; align-items: center !important; justify-content: center !important; padding: clamp(34px,5vw,76px) !important; }
.auth-form { display: none !important; width: min(560px, 100%) !important; gap: 16px !important; }
.auth-form.is-active { display: grid !important; }
.auth-form h2 { margin: 0 0 22px !important; color: #fff !important; font-size: clamp(32px,3vw,52px) !important; line-height: 1.15 !important; font-weight: 760 !important; letter-spacing: -.045em !important; }
.auth-field { display: grid !important; gap: 8px !important; color: rgba(255,255,255,.6) !important; font-size: 13px !important; }
.auth-field span { display: none !important; }
.auth-field .input, .auth-form .input { height: 64px !important; min-height: 64px !important; border: 0 !important; border-radius: 14px !important; background: #1F1F25 !important; color: #fff !important; padding: 0 22px !important; font-size: 17px !important; box-shadow: none !important; }
.auth-field .input:focus, .auth-form .input:focus { box-shadow: 0 0 0 3px rgba(255,210,26,.26) !important; background: #25252C !important; }
.auth-submit { height: 66px !important; border-radius: 15px !important; background: var(--kinolot-yellow) !important; color: #070707 !important; font-size: 18px !important; font-weight: 900 !important; margin-top: 10px !important; }
.auth-submit:hover, .auth-submit:focus-visible { transform: translateY(-1px) !important; box-shadow: 0 18px 58px rgba(255,210,26,.22) !important; }
.auth-social { height: 58px !important; border-radius: 14px !important; background: #1F1F25 !important; color: #fff !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 10px !important; font-weight: 850 !important; }
.auth-help-row { display: flex !important; justify-content: center !important; align-items: center !important; gap: 6px !important; margin-top: 16px !important; color: rgba(255,255,255,.86) !important; }
.auth-help-row button, .auth-support, .auth-agree b { color: var(--kinolot-yellow) !important; font-weight: 850 !important; }
.auth-support { justify-self: center !important; display: inline-flex !important; align-items: center !important; gap: 8px !important; margin-top: 12px !important; }
.auth-agree { display: flex !important; align-items: center !important; gap: 12px !important; color: #fff !important; line-height: 1.35 !important; }
.auth-agree input { width: 22px !important; height: 22px !important; accent-color: var(--kinolot-yellow) !important; }
.auth-visual-side { position: relative !important; background: #000 !important; display: grid !important; place-items: center !important; overflow: hidden !important; border-left: 1px solid rgba(255,255,255,.05) !important; }
.auth-logo-mark { position: absolute !important; top: 22% !important; left: 50% !important; transform: translateX(-50%) !important; display: flex !important; align-items: center !important; gap: 18px !important; color: #fff !important; }
.auth-logo-mark span { width: 76px !important; height: 76px !important; display: grid !important; place-items: center !important; border-radius: 24px !important; background: linear-gradient(135deg, var(--kinolot-yellow), var(--kinolot-yellow-2)) !important; color: #111 !important; font-weight: 950 !important; font-size: 24px !important; }
.auth-logo-mark b { font-size: clamp(50px,5vw,82px) !important; letter-spacing: -.055em !important; }
.auth-cinema-illustration { position: absolute !important; bottom: 10% !important; left: 50% !important; width: min(560px, 76%) !important; height: 320px !important; transform: translateX(-50%) !important; }
.auth-cinema-illustration .sofa { position: absolute !important; left: 16% !important; bottom: 34px !important; width: 58% !important; height: 90px !important; border-radius: 28px 28px 18px 18px !important; background: #303038 !important; box-shadow: inset 0 16px 0 rgba(255,255,255,.04) !important; }
.auth-cinema-illustration .lamp { position: absolute !important; left: 16% !important; bottom: 130px !important; width: 54px !important; height: 130px !important; border-radius: 8px !important; background: linear-gradient(180deg, var(--kinolot-yellow) 0 34%, #2D2D34 34% 100%) !important; clip-path: polygon(20% 0, 80% 0, 100% 34%, 63% 34%, 63% 100%, 47% 100%, 47% 34%, 0 34%) !important; }
.auth-cinema-illustration .person { position: absolute !important; bottom: 96px !important; width: 58px !important; height: 92px !important; border-radius: 50px 50px 16px 16px !important; background: #fff !important; }
.auth-cinema-illustration .person::before { content: "" !important; position: absolute !important; top: -28px !important; left: 12px !important; width: 36px !important; height: 36px !important; border-radius: 50% !important; background: #FFB184 !important; }
.auth-cinema-illustration .person-a { left: 32% !important; background: #fff !important; }
.auth-cinema-illustration .person-b { left: 45% !important; background: var(--kinolot-yellow) !important; transform: scale(.9) !important; }
.auth-cinema-illustration .tvbox { position: absolute !important; right: 2% !important; bottom: 28px !important; width: 126px !important; height: 92px !important; background: #34343B !important; border-radius: 10px !important; box-shadow: 0 52px 0 -28px #B6B7BD !important; }
.account-panels--compact { display: grid !important; grid-template-columns: repeat(4, minmax(0,1fr)) !important; gap: 14px !important; width: min(1500px,100%) !important; margin: 18px auto 0 !important; }

@media (max-width: 820px) {
  body { overflow: auto !important; }
  .sidebar { display: none !important; }
  .content { height: auto !important; min-height: 100vh !important; overflow: visible !important; padding: 78px 14px 96px !important; }
  body[data-page="home"] .content { padding: 0 0 96px !important; }
  body[data-page="home"] .hero.home-showcase { padding: 92px 16px 38px !important; min-height: 86svh !important; }
  .showcase-copy h2 { font-size: clamp(42px,14vw,70px) !important; }
  .showcase-copy p { font-size: 16px !important; -webkit-line-clamp: 4 !important; }
  .showcase-rail { margin: 0 -16px !important; padding-left: 16px !important; padding-right: 16px !important; }
  .showcase-card { flex-basis: min(76vw, 310px) !important; min-height: 330px !important; }
  #searchOverlay.search-overlay { padding: 76px 16px 42px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; }
  #searchOverlay .search-overlay__stage h2 { font-size: 44px !important; }
  #searchOverlay .search-overlay__field { min-height: 64px !important; grid-template-columns: 24px minmax(0,1fr) !important; border-radius: 14px !important; }
  #searchOverlay .search-overlay__field input { height: 64px !important; font-size: 18px !important; }
  #searchOverlay .search-overlay__field button { display: none !important; }
  .auth-modal-card { grid-template-columns: 1fr !important; min-height: auto !important; border-radius: 22px !important; }
  .auth-form-side { padding: 28px 18px !important; }
  .auth-visual-side { min-height: 260px !important; }
  .auth-logo-mark { top: 28px !important; }
  .auth-logo-mark span { width: 50px !important; height: 50px !important; border-radius: 16px !important; }
  .auth-logo-mark b { font-size: 34px !important; }
  .auth-cinema-illustration { transform: translateX(-50%) scale(.65) !important; transform-origin: center bottom !important; }
  .account-panels--compact { grid-template-columns: 1fr !important; }
}

/* v16: clean Apple TV palette, stable deck layout, fixed search overlay */
:root {
  --apple-bg: #000000;
  --apple-surface: rgba(28, 29, 34, .66);
  --apple-surface-strong: rgba(32, 33, 38, .92);
  --apple-border: rgba(255,255,255,.14);
  --apple-text: #F5F5F7;
  --apple-muted: rgba(245,245,247,.62);
  --apple-focus: 0 0 0 4px rgba(255,255,255,.80), 0 30px 90px rgba(0,0,0,.68);
  --kinolot-yellow: #FFD21A;
}
html, body { background:#000 !important; max-width:100% !important; overflow-x:hidden !important; }
body { color:var(--apple-text) !important; }
body::before {
  content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.055), transparent 38rem), #000;
}

@media (min-width: 821px) {
  .app-shell { display:block !important; background:#000 !important; min-height:100vh !important; }
  .content { width:100% !important; height:100vh !important; overflow-y:auto !important; overflow-x:hidden !important; padding:122px clamp(38px,5vw,96px) 90px !important; background:#000 !important; }
  body[data-page="home"] .content { padding:0 0 96px !important; }
  .content::-webkit-scrollbar { width:8px !important; }
  .content::-webkit-scrollbar-track { background:#000 !important; }
  .content::-webkit-scrollbar-thumb { background:rgba(255,255,255,.24) !important; border-radius:999px !important; border:2px solid #000 !important; }

  .sidebar {
    position:fixed !important; top:24px !important; left:50% !important; transform:translateX(-50%) !important;
    z-index:220 !important; width:min(1240px, calc(100vw - 72px)) !important; height:72px !important; min-height:72px !important;
    display:grid !important; grid-template-columns:auto minmax(0,1fr) !important; align-items:center !important; gap:18px !important;
    padding:0 18px !important; border-radius:999px !important; border:1px solid var(--apple-border) !important;
    background:linear-gradient(180deg, rgba(45,46,52,.70), rgba(18,19,23,.58)) !important;
    box-shadow:0 24px 86px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.16) !important;
    backdrop-filter:blur(44px) saturate(145%) !important; -webkit-backdrop-filter:blur(44px) saturate(145%) !important;
  }
  .brand { height:54px !important; min-width:188px !important; padding:0 18px 0 4px !important; border-right:1px solid rgba(255,255,255,.13) !important; display:flex !important; align-items:center !important; gap:12px !important; background:transparent !important; }
  .brand__logo { width:46px !important; height:46px !important; border-radius:16px !important; background:linear-gradient(180deg,#fff,#C8CDD6) !important; color:#050506 !important; box-shadow:0 14px 38px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.88) !important; }
  .brand strong { color:#fff !important; font-size:20px !important; font-weight:900 !important; letter-spacing:-.04em !important; text-transform:uppercase !important; }
  .brand span { display:none !important; }
  .nav { height:58px !important; display:flex !important; justify-content:center !important; align-items:center !important; gap:8px !important; overflow:hidden !important; }
  .nav__item { height:54px !important; min-height:54px !important; padding:0 clamp(14px,1.35vw,28px) !important; border:0 !important; border-radius:999px !important; background:transparent !important; box-shadow:none !important; color:rgba(245,245,247,.74) !important; font-size:clamp(14px,1vw,17px) !important; font-weight:820 !important; white-space:nowrap !important; }
  .nav__item svg, .nav__item i { display:none !important; }
  .nav__item:hover, .nav__item:focus-visible { background:rgba(255,255,255,.10) !important; color:#fff !important; transform:none !important; }
  .nav__item.is-active { background:linear-gradient(180deg,#fff,#E1E4EA) !important; color:#070708 !important; box-shadow:0 16px 48px rgba(255,255,255,.14), inset 0 1px 0 rgba(255,255,255,.88) !important; }
  .nav__item--search { width:58px !important; min-width:58px !important; max-width:58px !important; padding:0 !important; }
  .nav__item--search span { display:none !important; }
  .nav__item--search svg, .nav__item--search i { display:block !important; width:25px !important; height:25px !important; color:rgba(245,245,247,.85) !important; }
  .nav__item--search.is-active { background:rgba(255,255,255,.12) !important; color:#fff !important; }
  .sidebar__bottom, .control-current, #changeControlModeBtn, .mode-fab, .device-overlay, .search-shell, .topbar-search-btn { display:none !important; }
  body[data-page="home"] .topbar { display:none !important; }
  .topbar { background:transparent !important; border:0 !important; box-shadow:none !important; backdrop-filter:none !important; }
}

body[data-page="home"] #homePage { display:block !important; }
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  position:relative !important; height:100svh !important; min-height:760px !important; width:100% !important;
  display:flex !important; flex-direction:column !important; justify-content:flex-end !important; gap:22px !important;
  padding:126px 0 76px !important; margin:0 !important; border:0 !important; border-radius:0 !important; overflow:hidden !important;
  background:#000 !important; box-shadow:inset 0 -180px 150px #000 !important; isolation:isolate !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before {
  content:"" !important; position:absolute !important; inset:-32px !important; z-index:-3 !important;
  background:var(--hero-bg, none) center/cover no-repeat !important; opacity:.42 !important;
  filter:blur(22px) saturate(1.08) brightness(.62) !important; transform:scale(1.10) !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  content:"" !important; position:absolute !important; inset:0 !important; z-index:-2 !important;
  background:radial-gradient(circle at 50% 34%, rgba(255,255,255,.11), transparent 32rem), linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.62) 54%, #000 100%) !important;
}
.showcase-blur-layer { position:absolute !important; inset:0 !important; z-index:-1 !important; pointer-events:none !important; background:linear-gradient(90deg, rgba(0,0,0,.76), transparent 22%, transparent 78%, rgba(0,0,0,.78)) !important; }
.showcase-copy, body[data-page="home"] .showcase-copy { display:none !important; }
body[data-page="home"] .showcase-deck {
  position:relative !important; z-index:5 !important; width:100% !important; max-width:100vw !important;
  display:flex !important; align-items:center !important; gap:clamp(24px,3.2vw,54px) !important;
  overflow-x:auto !important; overflow-y:visible !important; scroll-snap-type:x mandatory !important; scrollbar-width:none !important;
  padding:40px max(28px, calc((100vw - 1320px)/2)) 48px !important; -webkit-overflow-scrolling:touch !important;
}
body[data-page="home"] .showcase-deck::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .showcase-card {
  position:relative !important; flex:0 0 clamp(280px, 24vw, 430px) !important; aspect-ratio:3/4 !important; min-height:420px !important;
  border-radius:clamp(24px,2.2vw,40px) !important; overflow:hidden !important; scroll-snap-align:center !important;
  border:1px solid rgba(255,255,255,.10) !important; background:rgba(255,255,255,.07) center/cover no-repeat !important;
  box-shadow:0 30px 95px rgba(0,0,0,.58) !important; opacity:.82 !important;
  transform:scale(.94) !important; transition:transform .24s cubic-bezier(.2,.8,.2,1), opacity .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
body[data-page="home"] .showcase-card::after { content:"" !important; position:absolute !important; inset:0 !important; z-index:1 !important; background:linear-gradient(180deg, rgba(0,0,0,0) 34%, rgba(0,0,0,.84) 100%) !important; }
body[data-page="home"] .showcase-card.is-active { flex-basis:clamp(340px, 30vw, 520px) !important; transform:scale(1) !important; opacity:1 !important; border-color:rgba(255,255,255,.72) !important; box-shadow:var(--apple-focus) !important; }
body[data-page="home"] .showcase-card:hover, body[data-page="home"] .showcase-card:focus-visible { transform:scale(1.025) !important; opacity:1 !important; border-color:rgba(255,255,255,.86) !important; box-shadow:var(--apple-focus) !important; }
body[data-page="home"] .showcase-card__badges { position:absolute !important; top:22px !important; left:22px !important; z-index:3 !important; display:flex !important; gap:8px !important; }
body[data-page="home"] .showcase-card__badges b { min-height:34px !important; padding:0 12px !important; border-radius:12px !important; background:rgba(80,84,92,.70) !important; color:#fff !important; border:1px solid rgba(255,255,255,.22) !important; backdrop-filter:blur(16px) !important; font-size:16px !important; font-weight:850 !important; }
body[data-page="home"] .showcase-card__badges .is-quality { background:var(--kinolot-yellow) !important; color:#111 !important; border-color:transparent !important; }
body[data-page="home"] .showcase-card__content { position:absolute !important; left:28px !important; right:28px !important; bottom:28px !important; z-index:3 !important; display:grid !important; gap:10px !important; color:#fff !important; text-align:left !important; }
body[data-page="home"] .showcase-card__content strong { font-size:clamp(28px,2.8vw,50px) !important; line-height:1.02 !important; letter-spacing:-.055em !important; font-weight:900 !important; text-shadow:0 18px 50px rgba(0,0,0,.82) !important; }
body[data-page="home"] .showcase-card__content small { color:rgba(255,255,255,.70) !important; font-size:15px !important; font-weight:750 !important; }
body[data-page="home"] .showcase-card__content em { display:none !important; max-width:92% !important; color:rgba(255,255,255,.86) !important; font-style:normal !important; font-size:clamp(16px,1.1vw,20px) !important; line-height:1.35 !important; -webkit-line-clamp:3 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; }
body[data-page="home"] .showcase-card.is-active .showcase-card__content em { display:-webkit-box !important; }
.showcase-card__actions { display:none !important; gap:10px !important; margin-top:10px !important; }
body[data-page="home"] .showcase-card.is-active .showcase-card__actions { display:flex !important; }
.showcase-card__actions span { min-height:48px !important; min-width:48px !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; gap:8px !important; padding:0 15px !important; border-radius:14px !important; background:rgba(255,255,255,.12) !important; border:1px solid rgba(255,255,255,.12) !important; backdrop-filter:blur(18px) !important; color:#fff !important; font-weight:850 !important; }
.showcase-card__actions span:first-child { background:var(--kinolot-yellow) !important; color:#111 !important; border-color:transparent !important; padding:0 24px !important; }
body[data-page="home"] .showcase-dots { position:relative !important; z-index:6 !important; display:flex !important; justify-content:center !important; gap:8px !important; margin:0 auto !important; padding:0 20px !important; max-width:80vw !important; }
body[data-page="home"] .showcase-dots button { width:8px !important; height:8px !important; border-radius:999px !important; background:rgba(255,255,255,.62) !important; opacity:.9 !important; padding:0 !important; }
body[data-page="home"] .showcase-dots button.is-active { width:34px !important; background:var(--kinolot-yellow) !important; }
body[data-page="home"] #homeSections { position:relative !important; z-index:8 !important; margin-top:0 !important; padding:34px clamp(22px,5vw,92px) 0 !important; background:#000 !important; }
body[data-page="home"] .section__head h2 { font-size:clamp(22px,1.65vw,30px) !important; font-weight:820 !important; }
body[data-page="home"] .row-scroll { gap:18px !important; overflow-x:auto !important; overflow-y:visible !important; padding:8px 4px 26px !important; scrollbar-width:none !important; }
body[data-page="home"] .row-scroll::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .media-card, body[data-page="home"] .section--featured .media-card, body[data-page="home"] .section--genre .media-card { width:clamp(220px,16vw,310px) !important; flex-basis:clamp(220px,16vw,310px) !important; }
body[data-page="home"] .media-card__poster { padding-bottom:56.25% !important; aspect-ratio:16/9 !important; border-radius:16px !important; }

/* Search overlay must never shift outside viewport */
#searchOverlay.search-overlay {
  position:fixed !important; inset:0 !important; width:100vw !important; height:100dvh !important; max-width:100vw !important;
  z-index:1000 !important; display:flex !important; align-items:flex-start !important; justify-content:center !important;
  padding:clamp(72px,9vh,118px) 24px 52px !important; overflow-y:auto !important; overflow-x:hidden !important;
  background:rgba(0,0,0,.72) !important; backdrop-filter:blur(64px) brightness(.40) saturate(120%) !important; -webkit-backdrop-filter:blur(64px) brightness(.40) saturate(120%) !important;
  transform:none !important; box-sizing:border-box !important;
}
#searchOverlay.search-overlay.is-hidden { display:none !important; }
#searchOverlay .search-overlay__stage { width:min(980px, calc(100vw - 48px)) !important; max-width:calc(100vw - 48px) !important; min-width:0 !important; margin:0 auto !important; display:flex !important; flex-direction:column !important; align-items:center !important; gap:28px !important; transform:none !important; box-sizing:border-box !important; }
#searchOverlay .search-overlay__stage h2 { width:100% !important; margin:0 !important; text-align:left !important; font-size:clamp(48px,5vw,72px) !important; line-height:1 !important; }
#searchOverlay .search-overlay__field { width:100% !important; max-width:100% !important; min-width:0 !important; min-height:78px !important; display:grid !important; grid-template-columns:34px minmax(0,1fr) 46px !important; align-items:center !important; gap:16px !important; padding:0 18px 0 22px !important; border-radius:16px !important; background:#fff !important; color:#111 !important; overflow:hidden !important; box-sizing:border-box !important; }
#searchOverlay .search-overlay__field input { min-width:0 !important; width:100% !important; height:78px !important; border:0 !important; background:transparent !important; color:#111 !important; font-size:clamp(22px,2vw,30px) !important; }
#searchOverlay .search-overlay__results { width:min(1180px, calc(100vw - 48px)) !important; max-width:calc(100vw - 48px) !important; min-width:0 !important; overflow:visible !important; }
#searchOverlay .search-overlay__media-row { width:100% !important; max-width:100% !important; overflow-x:auto !important; overflow-y:visible !important; }
#searchOverlay .search-overlay__close { position:fixed !important; top:24px !important; right:28px !important; z-index:1002 !important; }
.search-modal-open .app-shell, .search-modal-open .bottom-nav, .search-modal-open .drawer { filter:blur(24px) brightness(.25) saturate(.70) !important; transform:none !important; }

/* Auth page, MovieLab-like but Kinolot/Apple palette */
.is-guest .account-panels--compact { display:none !important; }
.auth-modal-page { min-height:calc(100vh - 160px) !important; display:grid !important; align-items:center !important; padding:24px 0 44px !important; }
.auth-modal-card { width:min(1480px, 100%) !important; margin:0 auto !important; min-height:min(760px, calc(100vh - 190px)) !important; display:grid !important; grid-template-columns:minmax(440px,.92fr) minmax(440px,1.08fr) !important; overflow:hidden !important; border-radius:30px !important; background:#0A0A0B !important; border:1px solid rgba(255,255,255,.09) !important; box-shadow:0 40px 150px rgba(0,0,0,.72) !important; }
.auth-form-side { background:#17171B !important; padding:clamp(34px,5vw,82px) !important; display:flex !important; align-items:center !important; justify-content:center !important; }
.auth-form h2 { font-size:clamp(34px,3vw,52px) !important; line-height:1.14 !important; color:#fff !important; font-weight:760 !important; letter-spacing:-.045em !important; }
.auth-field .input, .auth-form .input { background:#222228 !important; color:#fff !important; border:1px solid transparent !important; height:64px !important; border-radius:14px !important; }
.auth-field .input:focus, .auth-form .input:focus { border-color:rgba(255,210,26,.36) !important; box-shadow:0 0 0 4px rgba(255,210,26,.15) !important; background:#28282F !important; }
.auth-submit { background:linear-gradient(180deg,#FFD83A,#F5C400) !important; color:#070707 !important; height:66px !important; border-radius:15px !important; }
.auth-social { background:#222228 !important; color:#fff !important; border:1px solid rgba(255,255,255,.05) !important; }
.auth-visual-side { background:#000 !important; }
.auth-logo-mark span { background:linear-gradient(180deg,#FFD83A,#F5C400) !important; color:#111 !important; }
.auth-help-row button, .auth-support, .auth-agree b { color:#FFD21A !important; }

@media (max-width: 1180px) and (min-width: 821px) {
  .sidebar { width:min(1040px, calc(100vw - 34px)) !important; padding:0 12px !important; gap:10px !important; }
  .brand { min-width:158px !important; padding-right:10px !important; }
  .brand strong { font-size:16px !important; }
  .nav__item { padding:0 10px !important; font-size:13px !important; }
  .nav__item--search { width:50px !important; min-width:50px !important; max-width:50px !important; }
  .auth-modal-card { grid-template-columns:1fr !important; }
  .auth-visual-side { min-height:320px !important; }
}
@media (max-width: 820px) {
  body { overflow-y:auto !important; }
  body[data-page="home"] .hero.home-showcase.home-showcase--deck { min-height:86svh !important; height:auto !important; padding:94px 0 42px !important; }
  body[data-page="home"] .showcase-deck { padding:26px 16px 34px !important; gap:18px !important; }
  body[data-page="home"] .showcase-card { flex-basis:min(78vw,330px) !important; min-height:360px !important; }
  body[data-page="home"] .showcase-card.is-active { flex-basis:min(82vw,350px) !important; }
  #searchOverlay.search-overlay { padding:76px 16px 42px !important; }
  #searchOverlay .search-overlay__stage, #searchOverlay .search-overlay__results { width:calc(100vw - 32px) !important; max-width:calc(100vw - 32px) !important; }
  #searchOverlay .search-overlay__field { min-height:64px !important; grid-template-columns:24px minmax(0,1fr) !important; }
  #searchOverlay .search-overlay__field input { height:64px !important; font-size:18px !important; }
  #searchOverlay .search-overlay__field button { display:none !important; }
  .auth-modal-card { grid-template-columns:1fr !important; border-radius:22px !important; min-height:auto !important; }
  .auth-form-side { padding:28px 18px !important; }
  .auth-visual-side { min-height:260px !important; }
}

/* v17: Apple TV stability pass — no broken placeholder, stable search, smoother rails, skeletons */
:root {
  --apple-black: #000;
  --apple-elevated: rgba(18, 19, 23, .76);
  --apple-elevated-2: rgba(29, 30, 36, .72);
  --apple-line: rgba(255,255,255,.12);
  --apple-text: #F5F5F7;
  --apple-muted: rgba(245,245,247,.62);
  --apple-yellow: #FFD21A;
}
html { width:100%; max-width:100%; background:#000 !important; overflow:hidden !important; }
body { width:100%; max-width:100%; background:#000 !important; color:var(--apple-text) !important; overflow:hidden !important; }
.app-shell { background:#000 !important; }
.content { scrollbar-gutter: stable; }
.content, .row-scroll, .showcase-deck, .search-overlay__media-row { overscroll-behavior: contain; }
.row-scroll, .showcase-deck, .search-overlay__media-row { cursor: grab; }
.row-scroll.is-dragging, .showcase-deck.is-dragging, .search-overlay__media-row.is-dragging { cursor: grabbing; scroll-snap-type: none !important; user-select:none; }

@media (min-width: 821px) {
  .sidebar {
    background: linear-gradient(180deg, rgba(30,31,36,.78), rgba(13,14,17,.66)) !important;
    border-color: rgba(255,255,255,.14) !important;
    box-shadow: 0 28px 110px rgba(0,0,0,.64), inset 0 1px 0 rgba(255,255,255,.12) !important;
  }
  .nav__item.is-active { background: linear-gradient(180deg,#fff,#DDE1E8) !important; color:#050507 !important; }
  .nav__item--search.is-active { background: transparent !important; color:#fff !important; }
  .content { height:100vh !important; overflow-y:auto !important; overflow-x:hidden !important; scroll-behavior:smooth !important; }
  .content::-webkit-scrollbar { width:10px; }
  .content::-webkit-scrollbar-track { background: #000; }
  .content::-webkit-scrollbar-thumb { background: rgba(255,255,255,.22); border-radius:999px; border:3px solid #000; }
}

/* Home skeleton, shown before API data arrives */
body[data-page="home"] .hero.home-showcase--skeleton {
  min-height: 100svh !important;
  height: auto !important;
  padding: clamp(126px, 16vh, 190px) 0 60px !important;
  display: grid !important;
  align-content: center !important;
  background:
    radial-gradient(circle at 72% 28%, rgba(255,255,255,.07), transparent 25rem),
    radial-gradient(circle at 28% 62%, rgba(255,210,26,.07), transparent 28rem),
    #000 !important;
  box-shadow: inset 0 -160px 140px #000 !important;
}
body[data-page="home"] .hero.home-showcase--skeleton::before,
body[data-page="home"] .hero.home-showcase--skeleton::after { display:none !important; }
.showcase-deck--skeleton { justify-content:center !important; overflow:hidden !important; pointer-events:none !important; }
.skeleton-showcase-card {
  background: linear-gradient(100deg, rgba(255,255,255,.055), rgba(255,255,255,.13), rgba(255,255,255,.055)) !important;
  background-size: 240% 100% !important;
  animation: shimmer 1.18s linear infinite !important;
  opacity:.72 !important;
}
.skeleton-showcase-card.is-center { opacity:.95 !important; }

/* Deck carousel: stable Apple TV cards, no huge scaling/white frame */
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  position: relative !important;
  min-height: min(820px, 100svh) !important;
  height: auto !important;
  display: grid !important;
  align-content: center !important;
  padding: clamp(124px, 15vh, 178px) 0 clamp(46px, 8vh, 86px) !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background: #000 !important;
  box-shadow: inset 0 -155px 120px #000 !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-3 !important;
  background: var(--hero-bg, none) center/cover no-repeat !important;
  opacity:.28 !important;
  filter: blur(18px) saturate(1.1) brightness(.58) !important;
  transform: scale(1.14) !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-2 !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.055), transparent 31rem),
    linear-gradient(90deg, rgba(0,0,0,.94), rgba(0,0,0,.54) 50%, rgba(0,0,0,.94)),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.86) 18%, rgba(0,0,0,.25) 100%) !important;
}
body[data-page="home"] .showcase-blur-layer { display:none !important; }
body[data-page="home"] .showcase-deck {
  position: relative !important;
  z-index: 3 !important;
  display: flex !important;
  align-items: center !important;
  gap: clamp(22px, 3vw, 44px) !important;
  width: 100% !important;
  max-width: 100vw !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-inline: 50vw !important;
  padding: 28px max(40px, calc((100vw - 1280px)/2 + 40px)) 44px !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}
body[data-page="home"] .showcase-deck::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .showcase-card {
  flex: 0 0 clamp(280px, 25vw, 430px) !important;
  width: clamp(280px, 25vw, 430px) !important;
  aspect-ratio: 3 / 4 !important;
  min-height: 0 !important;
  max-height: none !important;
  display: block !important;
  border-radius: clamp(20px, 2vw, 32px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  background: rgba(255,255,255,.07) center/cover no-repeat !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.08) !important;
  opacity: .80 !important;
  transform: none !important;
  scroll-snap-align: center !important;
  transition: opacity .22s ease, transform .22s ease, box-shadow .22s ease, border-color .22s ease !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible,
body[data-page="home"] .showcase-card.is-active {
  flex-basis: clamp(280px, 25vw, 430px) !important;
  opacity: 1 !important;
  transform: translateY(-6px) !important;
  border-color: rgba(255,255,255,.22) !important;
  box-shadow: 0 34px 100px rgba(0,0,0,.68), inset 0 1px 0 rgba(255,255,255,.12) !important;
  outline: none !important;
}
body[data-page="home"] .showcase-card::after { background: linear-gradient(180deg, rgba(0,0,0,.04) 28%, rgba(0,0,0,.84) 100%) !important; }
body[data-page="home"] .showcase-card__content strong { font-size: clamp(26px, 2.25vw, 42px) !important; line-height: 1.02 !important; }
body[data-page="home"] .showcase-card__content em { display: none !important; }
body[data-page="home"] .showcase-card__actions { display:none !important; }
body[data-page="home"] .showcase-dots { margin-top: -16px !important; padding-bottom: 8px !important; }

/* Home rows: no aggressive hover, no white outline, smooth wheel/drag scrolling */
body[data-page="home"] #homeSections {
  margin-top: 0 !important;
  padding: 34px clamp(26px, 5vw, 92px) 90px !important;
  display: grid !important;
  gap: 48px !important;
  background: #000 !important;
}
body[data-page="home"] .section { overflow: visible !important; }
body[data-page="home"] .section__head { margin-bottom: 14px !important; }
body[data-page="home"] .section__head h2 { font-size: clamp(26px, 2vw, 38px) !important; }
body[data-page="home"] .row-scroll {
  display:flex !important;
  gap: 18px !important;
  overflow-x:auto !important;
  overflow-y:visible !important;
  padding: 8px 4px 28px !important;
  scroll-snap-type: x proximity !important;
  scroll-padding-left: 4px !important;
  scrollbar-width:none !important;
  -webkit-overflow-scrolling: touch !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 44px), transparent 100%) !important;
}
body[data-page="home"] .row-scroll::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  width: clamp(230px, 16vw, 320px) !important;
  flex: 0 0 clamp(230px, 16vw, 320px) !important;
  transform: none !important;
  scroll-snap-align: start !important;
}
body[data-page="home"] .media-card__poster {
  aspect-ratio: 16/9 !important;
  padding-bottom: 0 !important;
  border-radius: 16px !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.08) !important;
  transform: none !important;
}
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within { transform: translateY(-3px) !important; }
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster {
  transform: none !important;
  border-color: rgba(255,255,255,.20) !important;
  box-shadow: 0 24px 68px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.media-card__poster::after { content:"" !important; }
.poster-play, .media-card__poster .poster-play { opacity:0 !important; }
.media-card:hover .poster-play { opacity:.0 !important; }
.media-card__poster[style=""], .showcase-card[style=""] { background-image: linear-gradient(100deg, rgba(255,255,255,.06), rgba(255,255,255,.13), rgba(255,255,255,.06)) !important; background-size: 220% 100% !important; animation: shimmer 1.2s linear infinite !important; }

/* Stable fullscreen search. Results become a centered grid, so typing cannot push layout to the right. */
body.search-modal-open { overflow:hidden !important; }
body.search-modal-open .content { overflow:hidden !important; }
.search-modal-open .app-shell,
.search-modal-open .bottom-nav,
.search-modal-open .drawer {
  filter: blur(24px) brightness(.28) saturate(.78) !important;
  transform: none !important;
}
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100dvh !important;
  z-index: 1000 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(74px, 9vh, 116px) 24px 56px !important;
  margin: 0 !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
  background: rgba(0,0,0,.76) !important;
  backdrop-filter: blur(72px) brightness(.36) saturate(118%) !important;
  -webkit-backdrop-filter: blur(72px) brightness(.36) saturate(118%) !important;
  overscroll-behavior: contain !important;
}
#searchOverlay.search-overlay.is-hidden { display:none !important; }
#searchOverlay .search-overlay__close { position: fixed !important; top: 26px !important; right: 30px !important; z-index: 1003 !important; }
#searchOverlay .search-overlay__stage {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  width: min(980px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 26px !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__stage h2 { width:100% !important; margin:0 !important; text-align:left !important; font-size:clamp(48px,5vw,76px) !important; line-height:1 !important; }
#searchOverlay .search-overlay__field {
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  min-height:78px !important;
  display:grid !important;
  grid-template-columns:34px minmax(0,1fr) 46px !important;
  align-items:center !important;
  gap:16px !important;
  padding:0 18px 0 22px !important;
  border-radius:16px !important;
  background:#fff !important;
  color:#111 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}
#searchOverlay .search-overlay__field input { min-width:0 !important; width:100% !important; height:78px !important; border:0 !important; outline:0 !important; background:transparent !important; color:#111 !important; font-size:clamp(22px,2vw,30px) !important; }
#searchOverlay .search-overlay__quick-actions { margin-top: 6px !important; }
#searchOverlay .search-overlay__popular { margin-top: clamp(34px, 6vh, 70px) !important; }
#searchOverlay .search-overlay__results {
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin-top: 8px !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__results section { width:100% !important; }
#searchOverlay .search-overlay__media-row {
  width:100% !important;
  max-width:100% !important;
  display:grid !important;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
  gap:18px !important;
  overflow: visible !important;
  padding:0 !important;
}
#searchOverlay .search-overlay-card { width:100% !important; min-width:0 !important; flex: none !important; transform:none !important; }
#searchOverlay .search-overlay-card:hover,
#searchOverlay .search-overlay-card:focus-visible { transform: translateY(-3px) !important; }
#searchOverlay .search-overlay-card__image { width:100% !important; }
#searchOverlay .search-overlay__empty,
#searchOverlay .page-loader { width:100% !important; text-align:center !important; }

@media (max-width: 820px) {
  html, body { overflow:auto !important; }
  body[data-page="home"] .hero.home-showcase.home-showcase--deck,
  body[data-page="home"] .hero.home-showcase--skeleton { min-height: 78svh !important; padding-top: 92px !important; }
  body[data-page="home"] .showcase-deck { padding: 22px 18px 34px !important; gap:18px !important; }
  body[data-page="home"] .showcase-card { flex-basis: min(72vw, 310px) !important; width:min(72vw,310px) !important; }
  body[data-page="home"] #homeSections { padding: 20px 16px 86px !important; }
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card { width: min(72vw, 290px) !important; flex-basis: min(72vw,290px) !important; }
  #searchOverlay.search-overlay { padding: 74px 16px 40px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; }
  #searchOverlay .search-overlay__field { min-height:64px !important; grid-template-columns:24px minmax(0,1fr) !important; }
  #searchOverlay .search-overlay__field input { height:64px !important; font-size:18px !important; }
  #searchOverlay .search-overlay__field button { display:none !important; }
  #searchOverlay .search-overlay__media-row { grid-template-columns: 1fr !important; }
}

/* v18: Apple TV clean pass — real posters, no yellow theme, no dots, working actions, centered search */
:root {
  --kinolot-yellow: #F5F5F7 !important;
  --kinolot-yellow-2: #DDE1EA !important;
  --apple-yellow: #F5F5F7 !important;
  --apple-accent: #F5F5F7 !important;
  --apple-pill: rgba(245,245,247,.92);
  --apple-pill-text: #070708;
}

html, body {
  overflow-x: hidden !important;
  background: #000 !important;
}

@media (min-width: 821px) {
  .sidebar {
    background: linear-gradient(180deg, rgba(35,36,42,.82), rgba(12,13,16,.72)) !important;
    border-color: rgba(255,255,255,.15) !important;
    box-shadow: 0 28px 110px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.13) !important;
  }

  .nav__item.is-active,
  .topbar-search-btn:hover,
  .topbar-search-btn:focus-visible {
    background: linear-gradient(180deg, #FFFFFF, #DCE1EA) !important;
    color: #050506 !important;
  }

  .content {
    background: #000 !important;
  }
}

/* Main showcase should be a calm tvOS rail, not a huge scaled card */
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: min(780px, 94svh) !important;
  padding: clamp(126px, 15vh, 176px) 0 clamp(44px, 7vh, 76px) !important;
  background: #000 !important;
  box-shadow: inset 0 -150px 120px #000 !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before {
  opacity: .38 !important;
  filter: blur(18px) saturate(1.06) brightness(.62) !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  background:
    radial-gradient(circle at 50% 36%, rgba(255,255,255,.075), transparent 32rem),
    linear-gradient(90deg, rgba(0,0,0,.94), rgba(0,0,0,.50) 50%, rgba(0,0,0,.94)),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.86) 18%, rgba(0,0,0,.28) 100%) !important;
}
body[data-page="home"] .showcase-deck {
  gap: clamp(22px, 2.7vw, 42px) !important;
  padding: 26px max(44px, calc((100vw - 1320px)/2 + 44px)) 46px !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
}
body[data-page="home"] .showcase-card {
  flex: 0 0 clamp(300px, 25vw, 420px) !important;
  width: clamp(300px, 25vw, 420px) !important;
  aspect-ratio: 3/4 !important;
  opacity: .88 !important;
  transform: none !important;
  border-color: rgba(255,255,255,.10) !important;
  background-color: #111318 !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible,
body[data-page="home"] .showcase-card.is-active {
  transform: translateY(-4px) !important;
  opacity: 1 !important;
  border-color: rgba(255,255,255,.20) !important;
  box-shadow: 0 36px 105px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.13) !important;
  outline: none !important;
}
body[data-page="home"] .showcase-card::after {
  background: linear-gradient(180deg, rgba(0,0,0,.02) 26%, rgba(0,0,0,.88) 100%) !important;
}
body[data-page="home"] .showcase-dots {
  display: none !important;
}
body[data-page="home"] .showcase-card__badges b,
body[data-page="home"] .media-card__meta span {
  min-height: 30px !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  background: rgba(58, 60, 68, .72) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #F5F5F7 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11) !important;
  backdrop-filter: blur(16px) saturate(140%) !important;
}
body[data-page="home"] .showcase-card__badges .is-quality,
body[data-page="home"] .media-card__meta span:last-child {
  background: rgba(245,245,247,.90) !important;
  color: #050506 !important;
  border-color: transparent !important;
}
body[data-page="home"] .showcase-card__badges .is-rating {
  gap: 5px !important;
}
body[data-page="home"] .showcase-card__badges .is-rating svg {
  width: 15px !important;
  height: 15px !important;
  fill: currentColor !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size: clamp(27px, 2.15vw, 40px) !important;
}
body[data-page="home"] .showcase-card__content em {
  display: none !important;
}
body[data-page="home"] .showcase-card.is-active .showcase-card__actions {
  display: flex !important;
}
.showcase-action,
.showcase-card__actions span {
  min-height: 46px !important;
  min-width: 46px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  border-radius: 14px !important;
  background: rgba(245,245,247,.14) !important;
  color: #F5F5F7 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 16px 44px rgba(0,0,0,.34) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  font-weight: 850 !important;
}
.showcase-action--play,
.showcase-card__actions span:first-child {
  background: rgba(245,245,247,.94) !important;
  color: #050506 !important;
  border-color: transparent !important;
  padding: 0 22px !important;
}
.showcase-action:hover,
.showcase-action:focus-visible {
  background: #fff !important;
  color: #050506 !important;
  transform: none !important;
}

/* Rows: visible rating/quality chips, stable cards, wheel/drag friendly */
body[data-page="home"] .row-scroll {
  scroll-behavior: smooth !important;
  scroll-snap-type: x proximity !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 calc(100% - 72px), transparent 100%) !important;
}
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  width: clamp(230px, 16vw, 310px) !important;
  flex: 0 0 clamp(230px, 16vw, 310px) !important;
  transform: none !important;
}
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within {
  transform: translateY(-2px) !important;
}
body[data-page="home"] .media-card__poster,
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster {
  transform: none !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: 0 18px 54px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body[data-page="home"] .media-card__meta {
  display: flex !important;
  top: 9px !important;
  left: 9px !important;
  right: 9px !important;
}
body[data-page="home"] .media-card__meta span:first-child {
  display: none !important;
}

/* Fully centered search overlay; typing cannot shift or clip it */
body.search-modal-open {
  overflow: hidden !important;
}
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: auto !important;
  bottom: auto !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 100vw !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 !important;
  padding: clamp(72px, 9vh, 112px) 24px 56px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
  transform: translate3d(0,0,0) !important;
  background: rgba(0,0,0,.78) !important;
  backdrop-filter: blur(72px) brightness(.36) saturate(112%) !important;
  -webkit-backdrop-filter: blur(72px) brightness(.36) saturate(112%) !important;
}
#searchOverlay.search-overlay.is-hidden {
  display: none !important;
}
#searchOverlay .search-overlay__stage {
  position: relative !important;
  left: 0 !important;
  right: 0 !important;
  transform: none !important;
  width: min(980px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__field,
#searchOverlay .search-overlay__stage h2,
#searchOverlay .search-overlay__results {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__field input {
  min-width: 0 !important;
  max-width: 100% !important;
}
#searchOverlay .search-overlay__media-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 18px !important;
  overflow: visible !important;
  width: 100% !important;
  max-width: 100% !important;
}
#searchOverlay .search-overlay-card {
  width: 100% !important;
  max-width: 100% !important;
}

/* Auth accent cleanup: white Apple CTA instead of yellow */
.auth-submit,
.auth-logo-mark span {
  background: linear-gradient(180deg, #FFFFFF, #DDE1EA) !important;
  color: #050506 !important;
}
.auth-field .input:focus,
.auth-form .input:focus {
  border-color: rgba(255,255,255,.36) !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.12) !important;
}
.auth-help-row button,
.auth-support,
.auth-agree b {
  color: #F5F5F7 !important;
}

@media (max-width: 820px) {
  #searchOverlay.search-overlay {
    min-width: 100vw !important;
    padding: 74px 16px 40px !important;
  }
  #searchOverlay .search-overlay__stage {
    width: calc(100vw - 32px) !important;
    max-width: calc(100vw - 32px) !important;
  }
  body[data-page="home"] .showcase-card {
    flex-basis: min(74vw, 310px) !important;
    width: min(74vw, 310px) !important;
  }
}


/* v19: Apple TV stability repair — images, carousel clipping, neutral palette */
:root {
  --kinolot-accent: #f5f5f7 !important;
  --kinolot-yellow: #f5f5f7 !important;
  --apple-focus: 0 24px 92px rgba(0,0,0,.62) !important;
}
body { overflow-x:hidden !important; background:#000 !important; }
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: 720px !important;
  height: auto !important;
  padding: clamp(112px,13vh,150px) 0 clamp(48px,7vh,82px) !important;
  overflow: hidden !important;
  background:#000 !important;
}
body[data-page="home"] .showcase-deck {
  width:100vw !important;
  max-width:100vw !important;
  box-sizing:border-box !important;
  padding: 44px clamp(28px,5vw,96px) 58px !important;
  gap: clamp(18px,2.2vw,36px) !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-snap-type:x proximity !important;
  scroll-behavior:smooth !important;
  overscroll-behavior-x:contain !important;
  scrollbar-width:none !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 44px, #000 calc(100% - 44px), transparent 100%) !important;
}
body[data-page="home"] .showcase-deck::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .showcase-card {
  flex:0 0 clamp(250px, 21vw, 360px) !important;
  width:clamp(250px, 21vw, 360px) !important;
  aspect-ratio:2/3 !important;
  min-height:0 !important;
  height:auto !important;
  border-radius:26px !important;
  overflow:hidden !important;
  scroll-snap-align:start !important;
  background-color:#121317 !important;
  background-image: var(--showcase-bg) !important;
  background-position:center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 24px 80px rgba(0,0,0,.62) !important;
  opacity:1 !important;
  transform:none !important;
  transition:filter .18s ease, opacity .18s ease, box-shadow .18s ease !important;
}
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex-basis:clamp(250px, 21vw, 360px) !important;
  width:clamp(250px, 21vw, 360px) !important;
  transform:none !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:0 28px 86px rgba(0,0,0,.68) !important;
  filter:brightness(1.06) !important;
  outline:none !important;
}
body[data-page="home"] .showcase-card::before {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(0,0,0,0) 32%, rgba(0,0,0,.94) 100%) !important;
  pointer-events:none !important;
}
body[data-page="home"] .showcase-card::after {
  background:linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.90) 100%) !important;
}
body[data-page="home"] .showcase-card__badges b,
body[data-page="home"] .showcase-card__badges .is-quality,
body[data-page="home"] .quality-badge,
.quality-badge {
  background:rgba(245,245,247,.88) !important;
  color:#050506 !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:none !important;
}
body[data-page="home"] .showcase-card__badges .is-rating {
  background:rgba(0,0,0,.44) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.20) !important;
}
body[data-page="home"] .showcase-card__content {
  left:22px !important;
  right:22px !important;
  bottom:22px !important;
  gap:8px !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size:clamp(24px,2vw,36px) !important;
  letter-spacing:-.045em !important;
}
body[data-page="home"] .showcase-card__content em {
  display:-webkit-box !important;
  font-size:15px !important;
  line-height:1.34 !important;
  max-width:100% !important;
  -webkit-line-clamp:3 !important;
}
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active .showcase-card__actions {
  display:flex !important;
  gap:10px !important;
  align-items:center !important;
  margin-top:6px !important;
}
.showcase-action,
.showcase-card__actions button {
  min-height:44px !important;
  min-width:44px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  padding:0 13px !important;
  border-radius:14px !important;
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;
  backdrop-filter:blur(16px) !important;
  -webkit-backdrop-filter:blur(16px) !important;
  box-shadow:none !important;
}
.showcase-action--play,
.showcase-card__actions button:first-child {
  background:rgba(245,245,247,.92) !important;
  color:#050506 !important;
  border-color:rgba(255,255,255,.26) !important;
  padding:0 20px !important;
}
body[data-page="home"] .showcase-dots { display:none !important; }
body[data-page="home"] #homeSections {
  margin-top:0 !important;
  padding-top:32px !important;
  overflow:hidden !important;
}
body[data-page="home"] .row-scroll {
  scroll-behavior:smooth !important;
  overscroll-behavior-x:contain !important;
  cursor:grab !important;
}
body[data-page="home"] .row-scroll:active { cursor:grabbing !important; }
body[data-page="home"] .media-card__poster {
  background-color:#131419 !important;
  background-position:center !important;
  background-size:cover !important;
  background-repeat:no-repeat !important;
  border-color:rgba(255,255,255,.10) !important;
}
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within {
  transform:none !important;
}
@media (min-width: 1280px) {
  body[data-page="home"] .showcase-deck {
    padding-left:max(64px, calc((100vw - 1480px)/2)) !important;
    padding-right:max(64px, calc((100vw - 1480px)/2)) !important;
  }
}
@media (max-width: 820px) {
  body[data-page="home"] .hero.home-showcase.home-showcase--deck { min-height:560px !important; padding-top:90px !important; }
  body[data-page="home"] .showcase-deck { padding:24px 18px 38px !important; gap:16px !important; -webkit-mask-image:none !important; mask-image:none !important; }
  body[data-page="home"] .showcase-card,
  body[data-page="home"] .showcase-card.is-active,
  body[data-page="home"] .showcase-card:hover,
  body[data-page="home"] .showcase-card:focus-visible { flex-basis:min(76vw, 300px) !important; width:min(76vw, 300px) !important; }
}

/* v20: Apple TV reliability pass — stable carousel, real images, hover-only details, fixed overlay search */
html, body {
  max-width: 100% !important;
  overflow-x: hidden !important;
  background: #000 !important;
}
body {
  color: #F5F5F7 !important;
}
body.search-modal-open,
html.search-modal-open {
  overflow: hidden !important;
}

/* prevent old hidden/global search elements from stealing layout */
.search-shell,
#globalSearch,
#searchSuggest,
#searchClearBtn,
#deviceOverlay,
#changeControlModeBtn,
.mode-fab {
  display: none !important;
}

/* Main content should not jump when the hero auto-scrolls */
.content {
  scroll-behavior: auto !important;
  overscroll-behavior-y: contain !important;
}

body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  width: 100% !important;
  max-width: 100% !important;
  min-height: clamp(560px, 78svh, 820px) !important;
  padding: clamp(108px, 12vh, 150px) 0 clamp(42px, 7vh, 72px) !important;
  margin: 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.06), transparent 34rem),
    #000 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before {
  content:"" !important;
  position:absolute !important;
  inset:-60px !important;
  z-index:-2 !important;
  background: var(--hero-bg) center/cover no-repeat !important;
  opacity:.18 !important;
  filter: blur(48px) saturate(1.05) brightness(.72) !important;
  transform: scale(1.08) !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:-1 !important;
  background:
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.50) 8%, transparent 22%, transparent 78%, rgba(0,0,0,.56) 92%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,.18), #000 98%) !important;
}
body[data-page="home"] .showcase-deck {
  position: relative !important;
  z-index: 2 !important;
  display: flex !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  gap: clamp(20px, 2.2vw, 36px) !important;
  padding: 36px clamp(28px, 5vw, 88px) 52px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity !important;
  scroll-padding-inline: clamp(28px, 5vw, 88px) !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  cursor: grab !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 34px, #000 calc(100% - 34px), transparent 100%) !important;
}
body[data-page="home"] .showcase-deck:active,
body[data-page="home"] .showcase-deck.is-dragging { cursor: grabbing !important; }
body[data-page="home"] .showcase-deck::-webkit-scrollbar { display:none !important; }

body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 clamp(260px, 22vw, 390px) !important;
  width: clamp(260px, 22vw, 390px) !important;
  aspect-ratio: 2 / 3 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  transform: none !important;
  scroll-snap-align: start !important;
  border-radius: clamp(22px, 1.8vw, 34px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background-color: #111217 !important;
  background-image: var(--showcase-bg) !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: 0 24px 90px rgba(0,0,0,.66) !important;
  filter: none !important;
  outline: none !important;
  transition: border-color .18s ease, filter .18s ease, opacity .18s ease !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  border-color: rgba(255,255,255,.28) !important;
  filter: brightness(1.08) !important;
}
body[data-page="home"] .showcase-card__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 0 !important;
  opacity: 1 !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card.is-missing-image::before {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  background: linear-gradient(135deg, #181A20, #07080B) !important;
}
body[data-page="home"] .showcase-card::before {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  z-index:1 !important;
  background: linear-gradient(180deg, rgba(0,0,0,.02) 24%, rgba(0,0,0,.55) 66%, rgba(0,0,0,.94) 100%) !important;
  pointer-events:none !important;
}
body[data-page="home"] .showcase-card::after { display:none !important; }
body[data-page="home"] .showcase-card__badges {
  position:absolute !important;
  z-index:3 !important;
  top:18px !important;
  left:18px !important;
  right:18px !important;
  display:flex !important;
  gap:8px !important;
}
body[data-page="home"] .showcase-card__badges b,
body[data-page="home"] .showcase-card__badges .is-quality,
body[data-page="home"] .showcase-card__badges .is-rating {
  min-height:30px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  padding:0 10px !important;
  border-radius:10px !important;
  color:#101014 !important;
  background:rgba(245,245,247,.88) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  font-size:14px !important;
  font-weight:850 !important;
  box-shadow:none !important;
  backdrop-filter: blur(14px) !important;
}
body[data-page="home"] .showcase-card__badges .is-rating {
  color:#fff !important;
  background:rgba(0,0,0,.48) !important;
  border-color:rgba(255,255,255,.22) !important;
}
body[data-page="home"] .showcase-card__badges .is-rating svg { width:14px !important; height:14px !important; }
body[data-page="home"] .showcase-card__content {
  position:absolute !important;
  z-index:3 !important;
  left:22px !important;
  right:22px !important;
  bottom:22px !important;
  display:grid !important;
  gap:7px !important;
  text-align:left !important;
  pointer-events:none !important;
}
body[data-page="home"] .showcase-card__content strong {
  color:#fff !important;
  font-size:clamp(24px, 2vw, 36px) !important;
  line-height:1.03 !important;
  letter-spacing:-.052em !important;
  font-weight:900 !important;
  text-shadow:0 14px 42px rgba(0,0,0,.85) !important;
}
body[data-page="home"] .showcase-card__content small {
  color:rgba(245,245,247,.72) !important;
  font-size:14px !important;
  font-weight:800 !important;
}
body[data-page="home"] .showcase-card__reveal {
  display:grid !important;
  grid-template-rows: 0fr !important;
  opacity:0 !important;
  transform: translateY(8px) !important;
  transition: opacity .18s ease, transform .18s ease, grid-template-rows .18s ease !important;
  overflow:hidden !important;
  pointer-events:auto !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal {
  grid-template-rows: 1fr !important;
  opacity:1 !important;
  transform:none !important;
}
body[data-page="home"] .showcase-card__reveal > * { min-height:0 !important; }
body[data-page="home"] .showcase-card__content em {
  display:-webkit-box !important;
  color:rgba(255,255,255,.86) !important;
  font-style:normal !important;
  font-size:15px !important;
  line-height:1.34 !important;
  -webkit-line-clamp:3 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
  margin-top:8px !important;
}
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active .showcase-card__actions {
  display:flex !important;
  gap:9px !important;
  margin-top:12px !important;
  align-items:center !important;
}
.showcase-action,
.showcase-card__actions button {
  min-height:42px !important;
  min-width:42px !important;
  padding:0 12px !important;
  border-radius:13px !important;
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.16) !important;
  color:#fff !important;
  backdrop-filter:blur(18px) !important;
  box-shadow:none !important;
  pointer-events:auto !important;
}
.showcase-action--play,
.showcase-card__actions button:first-child {
  background:rgba(245,245,247,.94) !important;
  color:#050506 !important;
  border-color:rgba(255,255,255,.24) !important;
  padding:0 18px !important;
}
.showcase-action:hover,
.showcase-action:focus-visible {
  background:#fff !important;
  color:#050506 !important;
  transform:none !important;
}
body[data-page="home"] .showcase-dots { display:none !important; }

/* Rows: no clipping, mouse wheel / drag friendly */
.section { overflow: visible !important; }
.sections { overflow: visible !important; }
.row-scroll {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scroll-snap-type: x proximity !important;
  scroll-behavior: smooth !important;
  overscroll-behavior-x: contain !important;
  cursor: grab !important;
  padding-bottom: 22px !important;
}
.row-scroll.is-dragging { cursor: grabbing !important; scroll-snap-type:none !important; }
.row-scroll::-webkit-scrollbar { height: 0 !important; display:none !important; }
.media-card:hover .media-card__poster,
.media-card__poster:focus-visible,
.media-card:hover,
.media-card:focus-within {
  transform: none !important;
  box-shadow: none !important;
}
.media-card__poster { border-color: rgba(255,255,255,.10) !important; }
.media-card__poster::after { display:none !important; }
.poster-play { display:none !important; }

/* Fullscreen search: centered, fixed, no horizontal drift while typing */
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: 100vw !important;
  max-width: 100vw !important;
  min-width: 0 !important;
  height: 100dvh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: clamp(64px, 9vh, 104px) 24px 56px !important;
  box-sizing: border-box !important;
  background: rgba(0,0,0,.74) !important;
  backdrop-filter: blur(38px) saturate(.9) brightness(.72) !important;
  -webkit-backdrop-filter: blur(38px) saturate(.9) brightness(.72) !important;
}
#searchOverlay.search-overlay.is-hidden { display:none !important; }
#searchOverlay .search-overlay__stage {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
  width: min(940px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 28px !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__stage h2 {
  width: 100% !important;
  margin: 0 !important;
  text-align: left !important;
  font-size: clamp(48px, 5vw, 76px) !important;
  line-height: 1 !important;
  color:#fff !important;
}
#searchOverlay .search-overlay__field {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 76px !important;
  display: grid !important;
  grid-template-columns: 32px minmax(0, 1fr) 42px !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 0 18px 0 22px !important;
  border-radius: 16px !important;
  background:#fff !important;
  color:#111 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}
#searchOverlay .search-overlay__field input {
  width: 100% !important;
  min-width: 0 !important;
  height: 76px !important;
  border: 0 !important;
  background: transparent !important;
  color:#111 !important;
  font-size: clamp(22px, 2vw, 30px) !important;
}
#searchOverlay .search-overlay__quick-actions { display:flex !important; justify-content:center !important; gap:14px !important; margin-top:16px !important; }
#searchOverlay .search-overlay__results {
  width: min(1120px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  margin: 22px auto 0 !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__media-row {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 18px !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  padding: 0 !important;
}
#searchOverlay .search-overlay-card {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  transform: none !important;
}
#searchOverlay .search-overlay-card:hover,
#searchOverlay .search-overlay-card:focus-visible { transform:none !important; }
#searchOverlay .search-overlay__close {
  position: fixed !important;
  top: 24px !important;
  right: 28px !important;
  z-index: 1003 !important;
}
.search-modal-open .app-shell,
.search-modal-open .bottom-nav,
.search-modal-open .drawer {
  filter: blur(24px) brightness(.22) saturate(.75) !important;
  transform:none !important;
}

@media (min-width: 1280px) {
  body[data-page="home"] .showcase-deck {
    padding-left: max(52px, calc((100vw - 1560px) / 2)) !important;
    padding-right: max(52px, calc((100vw - 1560px) / 2)) !important;
  }
}
@media (max-width: 820px) {
  body[data-page="home"] .hero.home-showcase.home-showcase--deck {
    min-height: 570px !important;
    padding-top: 92px !important;
  }
  body[data-page="home"] .showcase-deck {
    padding: 22px 18px 38px !important;
    gap: 16px !important;
    mask-image:none !important;
    -webkit-mask-image:none !important;
  }
  body[data-page="home"] .showcase-card,
  body[data-page="home"] .showcase-card.is-active,
  body[data-page="home"] .showcase-card:hover,
  body[data-page="home"] .showcase-card:focus-visible {
    flex-basis: min(76vw, 310px) !important;
    width: min(76vw, 310px) !important;
  }
  body[data-page="home"] .showcase-card__reveal { display:none !important; }
  #searchOverlay.search-overlay { padding: 74px 16px 40px !important; }
  #searchOverlay .search-overlay__stage,
  #searchOverlay .search-overlay__results { width: calc(100vw - 32px) !important; max-width: calc(100vw - 32px) !important; }
  #searchOverlay .search-overlay__field { min-height: 64px !important; grid-template-columns: 24px minmax(0,1fr) !important; }
  #searchOverlay .search-overlay__field input { height:64px !important; font-size:18px !important; }
  #searchOverlay .search-overlay__field button { display:none !important; }
  #searchOverlay .search-overlay__media-row { grid-template-columns: 1fr !important; }
}

/* v21: centered Apple TV carousel, balanced edge fade, bottom indicator, fixed slider wheel */
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: clamp(600px, 82svh, 860px) !important;
  padding: clamp(110px, 12vh, 150px) 0 clamp(46px, 7vh, 78px) !important;
  overflow: hidden !important;
  background: #000 !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  background:
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.70) 9%, rgba(0,0,0,.16) 28%, rgba(0,0,0,.16) 72%, rgba(0,0,0,.70) 91%, #000 100%),
    linear-gradient(180deg, rgba(0,0,0,.20), #000 96%) !important;
}
body[data-page="home"] .showcase-deck {
  --showcase-card-w: clamp(300px, 23vw, 430px);
  width: 100vw !important;
  max-width: 100vw !important;
  margin: 0 !important;
  padding-top: 38px !important;
  padding-bottom: 34px !important;
  padding-left: max(34px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  padding-right: max(34px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  gap: clamp(20px, 2.4vw, 38px) !important;
  align-items: center !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-left: max(34px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  scroll-padding-right: max(34px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  overscroll-behavior-x: contain !important;
  touch-action: pan-x !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 10%, #000 90%, transparent 100%) !important;
}
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 var(--showcase-card-w) !important;
  width: var(--showcase-card-w) !important;
  aspect-ratio: 2 / 3 !important;
  scroll-snap-align: center !important;
  scroll-margin-inline: 0 !important;
  transform: none !important;
  filter: none !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: 0 26px 86px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  border-color: rgba(255,255,255,.22) !important;
  filter: brightness(1.045) !important;
}
body[data-page="home"] .showcase-card.is-active {
  border-color: rgba(255,255,255,.18) !important;
  opacity: 1 !important;
}
body[data-page="home"] .showcase-card__content {
  bottom: 24px !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size: clamp(25px, 2vw, 38px) !important;
}
body[data-page="home"] .showcase-card__reveal {
  grid-template-rows: 0fr !important;
  opacity: 0 !important;
  pointer-events: auto !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal {
  grid-template-rows: 1fr !important;
  opacity: 1 !important;
}
body[data-page="home"] .showcase-progress {
  position: relative !important;
  z-index: 5 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  max-width: min(620px, 86vw) !important;
}
body[data-page="home"] .showcase-progress button {
  width: 8px !important;
  height: 8px !important;
  min-width: 8px !important;
  min-height: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(245,245,247,.45) !important;
  opacity: .9 !important;
  transition: width .2s ease, background .2s ease, opacity .2s ease !important;
}
body[data-page="home"] .showcase-progress button.is-active {
  width: 32px !important;
  background: rgba(245,245,247,.95) !important;
  opacity: 1 !important;
}
body[data-page="home"] .showcase-dots { display: none !important; }
.showcase-progress--skeleton button.is-active { width: 32px !important; }

/* Keep vertical page scrolling usable at carousel edges; horizontal wheel/drag still works inside rails. */
.showcase-deck,
.row-scroll,
.search-overlay__media-row,
.player-episode-strip {
  overscroll-behavior-x: contain !important;
  overscroll-behavior-y: auto !important;
}
.showcase-deck.is-dragging,
.row-scroll.is-dragging { user-select: none !important; cursor: grabbing !important; }

/* Row edge fade should be symmetric and less aggressive. */
body[data-page="home"] .row-scroll {
  mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 28px, #000 calc(100% - 28px), transparent 100%) !important;
}

@media (max-width: 820px) {
  body[data-page="home"] .showcase-deck {
    --showcase-card-w: min(78vw, 320px);
    padding-left: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
    padding-right: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
    scroll-padding-left: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
    scroll-padding-right: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
    mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%) !important;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%) !important;
  }
  body[data-page="home"] .showcase-card,
  body[data-page="home"] .showcase-card.is-active,
  body[data-page="home"] .showcase-card:hover,
  body[data-page="home"] .showcase-card:focus-visible {
    flex-basis: var(--showcase-card-w) !important;
    width: var(--showcase-card-w) !important;
  }
}


/* v23: final Apple TV carousel pass — smaller centered cards, hover-only details, bottom centered dots. */
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: clamp(520px, 72svh, 720px) !important;
  padding: clamp(96px, 11vh, 132px) 0 76px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: stretch !important;
  overflow: hidden !important;
  background: #000 !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before { opacity: .32 !important; filter: blur(10px) saturate(.82) brightness(.50) !important; transform: scale(1.08) !important; }
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  background: linear-gradient(90deg, #000 0%, rgba(0,0,0,.88) 6%, rgba(0,0,0,.26) 18%, rgba(0,0,0,.18) 50%, rgba(0,0,0,.26) 82%, rgba(0,0,0,.88) 94%, #000 100%), linear-gradient(180deg, #000 0%, rgba(0,0,0,.04) 22%, rgba(0,0,0,.06) 70%, #000 100%) !important;
}
body[data-page="home"] .showcase-deck {
  --showcase-card-w: clamp(250px, 18.6vw, 350px) !important;
  width: 100vw !important; max-width: 100vw !important; margin: 0 !important;
  padding-top: 10px !important; padding-bottom: 22px !important;
  padding-left: max(32px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  padding-right: max(32px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  gap: clamp(18px, 2.2vw, 34px) !important; align-items: center !important;
  scroll-snap-type: x mandatory !important;
  scroll-padding-left: max(32px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  scroll-padding-right: max(32px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  overflow-x: auto !important; overflow-y: hidden !important; overscroll-behavior-x: contain !important; overscroll-behavior-y: auto !important; touch-action: pan-x pan-y !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9%, #000 91%, transparent 100%) !important;
}
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 var(--showcase-card-w) !important; width: var(--showcase-card-w) !important; aspect-ratio: 2 / 3 !important; scroll-snap-align: center !important; transform: none !important; filter: none !important; opacity: 1 !important;
  border: 1px solid rgba(245,245,247,.12) !important; box-shadow: 0 12px 34px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.06) !important; background: rgba(14,15,19,.92) !important;
}
body[data-page="home"] .showcase-card:hover, body[data-page="home"] .showcase-card:focus-visible { border-color: rgba(245,245,247,.32) !important; filter: brightness(1.03) !important; }
body[data-page="home"] .showcase-card.is-active { border-color: rgba(245,245,247,.18) !important; }
body[data-page="home"] .showcase-card__image { display: block !important; position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important; z-index: 0 !important; opacity: .96 !important; filter: none !important; }
body[data-page="home"] .showcase-card::after { content: "" !important; position: absolute !important; inset: 0 !important; z-index: 1 !important; background: linear-gradient(180deg, rgba(0,0,0,.03) 28%, rgba(0,0,0,.38) 58%, rgba(0,0,0,.86) 100%) !important; pointer-events: none !important; }
body[data-page="home"] .showcase-card__badges { top: 18px !important; left: 18px !important; z-index: 3 !important; }
body[data-page="home"] .showcase-card__badges b { background: rgba(245,245,247,.90) !important; color: #08090c !important; border: 0 !important; min-height: 30px !important; padding: 0 11px !important; border-radius: 11px !important; font-size: 14px !important; }
body[data-page="home"] .showcase-card__content { z-index: 3 !important; left: 20px !important; right: 20px !important; bottom: 20px !important; gap: 7px !important; }
body[data-page="home"] .showcase-card__content strong { font-size: clamp(22px, 1.8vw, 34px) !important; line-height: 1.03 !important; letter-spacing: -.045em !important; }
body[data-page="home"] .showcase-card__content small { font-size: 13px !important; color: rgba(245,245,247,.68) !important; }
body[data-page="home"] .showcase-card__reveal, body[data-page="home"] .showcase-card.is-active .showcase-card__reveal, body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal { display: grid !important; grid-template-rows: 0fr !important; opacity: 0 !important; transform: translateY(8px) !important; transition: opacity .18s ease, transform .18s ease, grid-template-rows .18s ease !important; pointer-events: none !important; }
body[data-page="home"] .showcase-card:hover .showcase-card__reveal { grid-template-rows: 1fr !important; opacity: 1 !important; transform: translateY(0) !important; pointer-events: auto !important; }
body[data-page="home"] .showcase-card__content em { display: -webkit-box !important; font-size: 14px !important; line-height: 1.34 !important; color: rgba(245,245,247,.82) !important; -webkit-line-clamp: 3 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
body[data-page="home"] .showcase-card__actions, body[data-page="home"] .showcase-card.is-active .showcase-card__actions, body[data-page="home"] .showcase-card:focus-within .showcase-card__actions { display: none !important; gap: 8px !important; margin-top: 8px !important; }
body[data-page="home"] .showcase-card:hover .showcase-card__actions { display: flex !important; }
body[data-page="home"] .showcase-action { min-height: 42px !important; border-radius: 13px !important; background: rgba(245,245,247,.13) !important; border: 1px solid rgba(245,245,247,.14) !important; color: #fff !important; box-shadow: none !important; }
body[data-page="home"] .showcase-action--play { background: rgba(245,245,247,.94) !important; color: #08090c !important; border-color: transparent !important; }
body[data-page="home"] .showcase-progress { position: absolute !important; left: 0 !important; right: 0 !important; bottom: 28px !important; width: 100% !important; max-width: none !important; display: flex !important; justify-content: center !important; align-items: center !important; gap: 7px !important; margin: 0 !important; padding: 0 24px !important; z-index: 9 !important; pointer-events: auto !important; }
body[data-page="home"] .showcase-progress button { width: 7px !important; height: 7px !important; min-width: 7px !important; min-height: 7px !important; background: rgba(245,245,247,.52) !important; }
body[data-page="home"] .showcase-progress button.is-active { width: 28px !important; background: rgba(245,245,247,.96) !important; }
body[data-page="home"] .showcase-deck--skeleton .skeleton-showcase-card, body[data-page="home"] .skeleton-showcase-card { width: var(--showcase-card-w, clamp(250px, 18.6vw, 350px)) !important; flex-basis: var(--showcase-card-w, clamp(250px, 18.6vw, 350px)) !important; }
@media (max-width: 820px) { body[data-page="home"] .hero.home-showcase.home-showcase--deck, body[data-page="home"] .hero.home-showcase--skeleton { min-height: 610px !important; padding-top: 88px !important; padding-bottom: 70px !important; } body[data-page="home"] .showcase-deck { --showcase-card-w: min(72vw, 300px) !important; } body[data-page="home"] .showcase-card__reveal { display:none !important; } }

/* v24: Apple TV nav morph + stable infinite hover carousel */
@media (min-width: 821px) {
  .sidebar {
    position: fixed !important;
    top: 22px !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    z-index: 240 !important;
    width: 100% !important;
    height: 74px !important;
    min-height: 74px !important;
    padding: 0 clamp(44px, 5vw, 92px) !important;
    display: grid !important;
    grid-template-columns: minmax(190px, 0.7fr) minmax(520px, 1fr) minmax(190px, 0.7fr) !important;
    align-items: center !important;
    gap: 24px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(0,0,0,.56), rgba(0,0,0,.08) 92%, transparent) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    transition: top .28s cubic-bezier(.2,.8,.2,1), width .28s cubic-bezier(.2,.8,.2,1), left .28s cubic-bezier(.2,.8,.2,1), right .28s cubic-bezier(.2,.8,.2,1), transform .28s cubic-bezier(.2,.8,.2,1), background .28s ease, border .28s ease, box-shadow .28s ease, border-radius .28s ease, padding .28s ease !important;
  }
  .brand {
    justify-self: start !important;
    height: 54px !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 12px !important;
  }
  .brand__logo {
    width: 34px !important;
    height: 34px !important;
    border-radius: 10px !important;
    background: linear-gradient(180deg, #fff, #cdd2dc) !important;
    color: #050506 !important;
    box-shadow: 0 12px 26px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.88) !important;
    font-size: 12px !important;
    font-weight: 950 !important;
  }
  .brand strong {
    display: block !important;
    color: #fff !important;
    font-size: 24px !important;
    line-height: 1 !important;
    font-weight: 850 !important;
    letter-spacing: -.045em !important;
    text-transform: uppercase !important;
  }
  .brand span { display: none !important; }
  .nav {
    justify-self: center !important;
    height: 64px !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(16px, 2.2vw, 34px) !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .nav__item {
    position: relative !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(245,245,247,.74) !important;
    box-shadow: none !important;
    font-size: clamp(15px, 1.03vw, 18px) !important;
    font-weight: 760 !important;
    letter-spacing: -.025em !important;
    white-space: nowrap !important;
    transform: none !important;
    transition: color .22s ease, opacity .22s ease, background .28s ease, border-radius .28s ease, padding .28s ease, box-shadow .28s ease !important;
  }
  .nav__item svg, .nav__item i, .nav__item::before { display: none !important; }
  .nav__item:hover, .nav__item:focus-visible { color: #fff !important; background: transparent !important; transform: none !important; }
  .nav__item.is-active {
    color: #fff !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .nav__item.is-active::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 5px !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: rgba(245,245,247,.94) !important;
    box-shadow: 0 0 28px rgba(255,255,255,.34) !important;
  }
  .nav__item--search {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    gap: 8px !important;
  }
  .nav__item--search svg, .nav__item--search i {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    color: rgba(245,245,247,.82) !important;
  }
  .nav__item--search span { display: inline !important; }
  .sidebar__bottom { display: none !important; }

  body.is-nav-condensed .sidebar,
  body:not([data-page="home"]) .sidebar {
    top: 24px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(1240px, calc(100vw - 72px)) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 18px !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    gap: 18px !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(37,38,44,.76), rgba(15,16,20,.68)) !important;
    box-shadow: 0 24px 86px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.14) !important;
    backdrop-filter: blur(44px) saturate(145%) !important;
    -webkit-backdrop-filter: blur(44px) saturate(145%) !important;
  }
  body.is-nav-condensed .brand,
  body:not([data-page="home"]) .brand {
    height: 54px !important;
    min-width: 188px !important;
    padding: 0 18px 0 4px !important;
    border-right: 1px solid rgba(255,255,255,.13) !important;
  }
  body.is-nav-condensed .brand__logo,
  body:not([data-page="home"]) .brand__logo { width: 46px !important; height: 46px !important; border-radius: 16px !important; }
  body.is-nav-condensed .brand strong,
  body:not([data-page="home"]) .brand strong { font-size: 20px !important; font-weight: 900 !important; }
  body.is-nav-condensed .nav,
  body:not([data-page="home"]) .nav { gap: 8px !important; height: 58px !important; overflow: hidden !important; }
  body.is-nav-condensed .nav__item,
  body:not([data-page="home"]) .nav__item {
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 clamp(14px,1.35vw,28px) !important;
    border-radius: 999px !important;
    color: rgba(245,245,247,.74) !important;
    font-size: clamp(14px,1vw,17px) !important;
    font-weight: 820 !important;
  }
  body.is-nav-condensed .nav__item.is-active,
  body:not([data-page="home"]) .nav__item.is-active {
    color: #070708 !important;
    background: linear-gradient(180deg,#fff,#E1E4EA) !important;
    box-shadow: 0 16px 48px rgba(255,255,255,.14), inset 0 1px 0 rgba(255,255,255,.88) !important;
  }
  body.is-nav-condensed .nav__item.is-active::after,
  body:not([data-page="home"]) .nav__item.is-active::after { display: none !important; }
  body.is-nav-condensed .nav__item--search,
  body:not([data-page="home"]) .nav__item--search {
    width: 58px !important;
    min-width: 58px !important;
    max-width: 58px !important;
    padding: 0 !important;
  }
  body.is-nav-condensed .nav__item--search span,
  body:not([data-page="home"]) .nav__item--search span { display: none !important; }
  body.is-nav-condensed .nav__item--search svg,
  body:not([data-page="home"]) .nav__item--search svg,
  body.is-nav-condensed .nav__item--search i,
  body:not([data-page="home"]) .nav__item--search i { display: block !important; width:25px !important; height:25px !important; }
}

body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: 720px !important;
  padding: 118px 0 92px !important;
  overflow: hidden !important;
}
body[data-page="home"] .showcase-deck {
  --showcase-card-w: clamp(238px, 15.8vw, 304px) !important;
  gap: clamp(24px, 3vw, 48px) !important;
  min-height: calc(var(--showcase-card-w) * 1.50 + 34px) !important;
  padding-top: 42px !important;
  padding-bottom: 62px !important;
  padding-left: max(40px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  padding-right: max(40px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  scroll-padding-left: max(40px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  scroll-padding-right: max(40px, calc((100vw - var(--showcase-card-w)) / 2)) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 8%, #000 92%, transparent 100%) !important;
}
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 var(--showcase-card-w) !important;
  width: var(--showcase-card-w) !important;
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
  border-radius: 25px !important;
  border: 1px solid rgba(245,245,247,.14) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
  background: #111217 !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible { border-color: rgba(245,245,247,.26) !important; }
body[data-page="home"] .showcase-card__image {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  z-index: 0 !important;
  opacity: .98 !important;
  filter: none !important;
}
body[data-page="home"] .showcase-card::before { display: none !important; }
body[data-page="home"] .showcase-card::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,.02) 18%, rgba(0,0,0,.18) 48%, rgba(0,0,0,.86) 100%) !important;
}
body[data-page="home"] .showcase-card__badges { top: 16px !important; left: 16px !important; right: auto !important; z-index: 3 !important; }
body[data-page="home"] .showcase-card__badges b { min-height: 28px !important; padding: 0 10px !important; border-radius: 10px !important; background: rgba(245,245,247,.90) !important; color: #08090c !important; font-size: 13px !important; border: 0 !important; }
body[data-page="home"] .showcase-card__content { z-index: 3 !important; left: 17px !important; right: 17px !important; bottom: 17px !important; gap: 6px !important; }
body[data-page="home"] .showcase-card__content strong { font-size: clamp(20px, 1.45vw, 27px) !important; line-height: 1.04 !important; letter-spacing: -.045em !important; }
body[data-page="home"] .showcase-card__content small { font-size: 12px !important; color: rgba(245,245,247,.70) !important; }
body[data-page="home"] .showcase-card__reveal,
body[data-page="home"] .showcase-card.is-active .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal {
  display: grid !important;
  grid-template-rows: 0fr !important;
  opacity: 0 !important;
  transform: translateY(8px) !important;
  transition: opacity .2s ease, transform .2s ease, grid-template-rows .2s ease !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__reveal {
  grid-template-rows: 1fr !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}
body[data-page="home"] .showcase-card__content em { font-size: 13px !important; line-height: 1.32 !important; -webkit-line-clamp: 3 !important; color: rgba(245,245,247,.82) !important; }
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active .showcase-card__actions,
body[data-page="home"] .showcase-card:focus-within .showcase-card__actions {
  display: none !important;
  gap: 7px !important;
  margin-top: 8px !important;
  min-width: 0 !important;
  width: 100% !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions { display: flex !important; }
body[data-page="home"] .showcase-action { height: 40px !important; min-height: 40px !important; border-radius: 13px !important; padding: 0 12px !important; background: rgba(245,245,247,.13) !important; border: 1px solid rgba(245,245,247,.16) !important; box-shadow: none !important; }
body[data-page="home"] .showcase-action--play { flex: 1 1 auto !important; min-width: 116px !important; max-width: 154px !important; background: rgba(245,245,247,.94) !important; color: #08090c !important; }
body[data-page="home"] .showcase-action:not(.showcase-action--play) { flex: 0 0 40px !important; width: 40px !important; padding: 0 !important; }
body[data-page="home"] .showcase-action svg { width: 20px !important; height: 20px !important; }
body[data-page="home"] .showcase-progress {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 34px !important;
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 7px !important;
  pointer-events: auto !important;
  z-index: 12 !important;
}
body[data-page="home"] .showcase-progress button { width: 7px !important; height: 7px !important; min-width: 7px !important; min-height: 7px !important; border-radius: 999px !important; background: rgba(245,245,247,.45) !important; transition: width .2s ease, background .2s ease !important; }
body[data-page="home"] .showcase-progress button.is-active { width: 28px !important; background: rgba(245,245,247,.96) !important; }
@media (max-width: 820px) {
  body[data-page="home"] .showcase-deck { --showcase-card-w: min(70vw, 280px) !important; gap: 18px !important; padding-left: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important; padding-right: max(18px, calc((100vw - var(--showcase-card-w)) / 2)) !important; }
}

/* v25: fixed card controls + floating info preview */
body[data-page="home"] .showcase-card {
  overflow: visible !important;
}
body[data-page="home"] .showcase-card__image,
body[data-page="home"] .showcase-card::after,
body[data-page="home"] .showcase-card__badges,
body[data-page="home"] .showcase-card__content {
  border-radius: inherit !important;
}
body[data-page="home"] .showcase-card__image,
body[data-page="home"] .showcase-card::after {
  overflow: hidden !important;
}
body[data-page="home"] .showcase-card::after {
  border-radius: inherit !important;
}
body[data-page="home"] .showcase-card__content {
  right: 15px !important;
  left: 15px !important;
  bottom: 16px !important;
  max-width: calc(100% - 30px) !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size: clamp(19px, 1.35vw, 25px) !important;
}
body[data-page="home"] .showcase-card__content em {
  font-size: 12.5px !important;
  line-height: 1.26 !important;
  -webkit-line-clamp: 2 !important;
  margin-top: 3px !important;
}
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card:hover .showcase-card__actions {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  display: none !important;
  grid-template-columns: minmax(0, 1fr) 36px 36px !important;
  gap: 7px !important;
  align-items: center !important;
  pointer-events: auto !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions {
  display: grid !important;
}
body[data-page="home"] .showcase-action,
body[data-page="home"] .showcase-card__actions button {
  width: auto !important;
  min-width: 0 !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 9px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
}
body[data-page="home"] .showcase-action:not(.showcase-action--play),
body[data-page="home"] .showcase-card__actions button:not(:first-child) {
  width: 36px !important;
  min-width: 36px !important;
  max-width: 36px !important;
  padding: 0 !important;
}
body[data-page="home"] .showcase-action--play,
body[data-page="home"] .showcase-card__actions button:first-child {
  min-width: 0 !important;
  max-width: none !important;
  width: 100% !important;
  padding: 0 10px !important;
}
body[data-page="home"] .showcase-action svg {
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
}
body[data-page="home"] .showcase-action--play svg {
  margin-left: -2px !important;
}

.showcase-info-popover {
  position: fixed !important;
  left: var(--info-left, 50%) !important;
  top: var(--info-top, 18px) !important;
  width: var(--info-width, 380px) !important;
  max-width: calc(100vw - 36px) !important;
  z-index: 999 !important;
  pointer-events: auto !important;
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
  transition: opacity .16s ease, transform .16s ease !important;
}
.showcase-info-popover.is-hidden {
  opacity: 0 !important;
  transform: translateY(10px) scale(.98) !important;
  pointer-events: none !important;
}
.showcase-info-card {
  position: relative !important;
  min-height: 520px !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  background: #111217 var(--info-bg) center/cover no-repeat !important;
  border: 1px solid rgba(245,245,247,.16) !important;
  box-shadow: 0 38px 120px rgba(0,0,0,.74), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(26px) saturate(1.1) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.1) !important;
}
.showcase-info-card__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  opacity: .78 !important;
}
.showcase-info-card__shade {
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.46) 42%, rgba(0,0,0,.92) 100%) !important;
  z-index: 1 !important;
}
.showcase-info-card__body {
  position: absolute !important;
  left: 24px !important;
  right: 24px !important;
  bottom: 24px !important;
  z-index: 2 !important;
  display: grid !important;
  gap: 10px !important;
}
.showcase-info-card__top {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 12px !important;
}
.showcase-info-card__top span,
.showcase-info-card__top b {
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 5px !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  background: rgba(245,245,247,.90) !important;
  color: #08090c !important;
  font-size: 13px !important;
  font-weight: 900 !important;
}
.showcase-info-card__top b {
  background: rgba(0,0,0,.48) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.20) !important;
}
.showcase-info-card__top svg { width: 14px !important; height: 14px !important; fill: currentColor !important; }
.showcase-info-card strong {
  color: #fff !important;
  font-size: clamp(28px, 2.2vw, 42px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  font-weight: 900 !important;
  text-shadow: 0 16px 42px rgba(0,0,0,.78) !important;
}
.showcase-info-card small {
  color: rgba(245,245,247,.72) !important;
  font-size: 15px !important;
  font-weight: 750 !important;
}
.showcase-info-card p {
  margin: 0 !important;
  color: rgba(245,245,247,.90) !important;
  font-size: 16px !important;
  line-height: 1.38 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.showcase-info-card__actions {
  display: grid !important;
  grid-template-columns: 48px 48px 1fr !important;
  gap: 9px !important;
  margin-top: 8px !important;
}
.showcase-info-card__actions button {
  height: 48px !important;
  border-radius: 15px !important;
  border: 1px solid rgba(245,245,247,.14) !important;
  background: rgba(245,245,247,.13) !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.showcase-info-card__actions button.is-primary {
  background: rgba(245,245,247,.94) !important;
  color: #050506 !important;
  border-color: transparent !important;
}
.showcase-info-card__actions svg { width: 21px !important; height: 21px !important; }

@media (max-width: 820px) {
  .showcase-info-popover { display: none !important; }
  body[data-page="home"] .showcase-card__actions { display: none !important; }
}

/* v27: real poster shelves + cache-visible Apple TV pass */
body[data-page="home"] .section {
  margin-top: clamp(34px, 4vw, 58px) !important;
  padding-inline: clamp(18px, 4.5vw, 82px) !important;
}
body[data-page="home"] .section__head { align-items:center !important; margin-bottom:16px !important; }
body[data-page="home"] .section__head h2 { font-size:clamp(26px, 2.4vw, 42px) !important; line-height:1 !important; letter-spacing:-.04em !important; font-weight:850 !important; }
body[data-page="home"] .section__head p, body[data-page="home"] .media-card__meta { display:none !important; }
body[data-page="home"] .section__more { background:rgba(245,245,247,.12) !important; color:rgba(245,245,247,.92) !important; border:1px solid rgba(245,245,247,.12) !important; box-shadow:none !important; padding:9px 15px !important; border-radius:999px !important; font-weight:800 !important; }
body[data-page="home"] .row-scroll { display:flex !important; gap:clamp(14px,1.35vw,24px) !important; overflow-x:auto !important; overflow-y:visible !important; padding:0 clamp(18px,5vw,84px) 20px 0 !important; scroll-snap-type:x proximity !important; scrollbar-width:none !important; }
body[data-page="home"] .row-scroll::-webkit-scrollbar { display:none !important; }
body[data-page="home"] .media-card { width:clamp(142px,10.4vw,190px) !important; flex:0 0 clamp(142px,10.4vw,190px) !important; scroll-snap-align:start !important; overflow:visible !important; color:#f5f5f7 !important; }
body[data-page="home"] .media-card__poster { width:100% !important; aspect-ratio:2 / 3 !important; padding:0 !important; border-radius:16px !important; background-color:#15161a !important; background-size:cover !important; background-position:center !important; border:0 !important; box-shadow:none !important; overflow:hidden !important; transform:none !important; transition:filter .22s ease, transform .22s ease !important; }
body[data-page="home"] .media-card__poster::before { content:"" !important; position:absolute !important; inset:0 !important; z-index:1 !important; background:linear-gradient(180deg,rgba(0,0,0,0) 54%,rgba(0,0,0,.62) 100%) !important; }
body[data-page="home"] .media-card__poster::after { display:none !important; }
body[data-page="home"] .media-card:hover .media-card__poster, body[data-page="home"] .media-card:focus-within .media-card__poster { transform:translateY(-3px) !important; filter:brightness(1.06) saturate(1.04) !important; box-shadow:none !important; border-color:transparent !important; }
body[data-page="home"] .media-card__body { padding:10px 0 0 !important; min-height:54px !important; }
body[data-page="home"] .media-card h3 { margin:0 !important; color:#f5f5f7 !important; font-size:clamp(14px,.95vw,18px) !important; line-height:1.12 !important; font-weight:800 !important; letter-spacing:-.02em !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
body[data-page="home"] .media-card p { margin:4px 0 0 !important; color:rgba(245,245,247,.62) !important; font-size:13px !important; line-height:1.2 !important; white-space:nowrap !important; overflow:hidden !important; text-overflow:ellipsis !important; }
body[data-page="home"] .poster-play { display:grid !important; place-items:center !important; position:absolute !important; inset:0 !important; z-index:3 !important; opacity:0 !important; background:rgba(0,0,0,.18) !important; transition:opacity .2s ease !important; }
body[data-page="home"] .media-card:hover .poster-play { opacity:1 !important; }
body[data-page="home"] .poster-play i, body[data-page="home"] .poster-play svg { width:46px !important; height:46px !important; padding:12px !important; border-radius:999px !important; background:rgba(245,245,247,.94) !important; color:#000 !important; box-shadow:none !important; }
body[data-page="home"] .showcase-action[data-showcase-action="info"], .showcase-info-popover { display:none !important; }


/* v28: full-bleed Apple TV shelves, drag-only sliders, skeleton images */
:root {
  --kinolot-surface: #000;
  --kinolot-panel: rgba(24, 25, 30, .72);
  --kinolot-panel-2: rgba(15, 16, 20, .88);
  --kinolot-text: #f5f5f7;
  --kinolot-muted: rgba(245,245,247,.62);
}
body[data-page="home"] .content {
  padding: 0 0 112px !important;
  background: #000 !important;
  overflow-x: hidden !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  min-height: clamp(560px, 76svh, 760px) !important;
  padding: clamp(112px, 15vh, 168px) 0 clamp(36px, 7vh, 70px) !important;
  overflow: hidden !important;
  background: #000 !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::before {
  opacity: .20 !important;
  filter: blur(34px) saturate(1.05) brightness(.48) !important;
  transform: scale(1.18) !important;
}
body[data-page="home"] .hero.home-showcase.home-showcase--deck::after {
  background:
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.32) 12%, rgba(0,0,0,.18) 50%, rgba(0,0,0,.32) 88%, #000 100%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.82) 16%, rgba(0,0,0,.05) 74%, #000 100%) !important;
}
body[data-page="home"] .showcase-deck {
  width: 100vw !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 28px 50vw 38px !important;
  gap: clamp(18px, 2.2vw, 34px) !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scroll-padding-inline: 50vw !important;
  scroll-snap-type: x mandatory !important;
  overscroll-behavior-x: auto !important;
  overscroll-behavior-y: auto !important;
  cursor: grab !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 9vw, #000 91vw, transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 9vw, #000 91vw, transparent 100%) !important;
}
body[data-page="home"] .showcase-deck.is-dragging { cursor: grabbing !important; }
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 clamp(250px, 20vw, 350px) !important;
  width: clamp(250px, 20vw, 350px) !important;
  aspect-ratio: 2 / 3 !important;
  min-height: 0 !important;
  border-radius: clamp(18px, 1.5vw, 26px) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  opacity: 1 !important;
  transform: none !important;
  box-shadow: none !important;
  background: #111216 !important;
  overflow: hidden !important;
  scroll-snap-align: center !important;
}
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible { filter: brightness(1.04) !important; }
body[data-page="home"] .showcase-card__image {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  user-select: none !important;
  -webkit-user-drag: none !important;
  opacity: 1 !important;
}
body[data-page="home"] .showcase-card::before,
body[data-page="home"] .media-card__poster::before,
body[data-page="home"] .skeleton-poster,
body[data-page="home"] .skeleton-showcase-card {
  background: linear-gradient(100deg, rgba(255,255,255,.045), rgba(255,255,255,.125), rgba(255,255,255,.045)) !important;
  background-size: 260% 100% !important;
  animation: shimmer 1.18s linear infinite !important;
}
body[data-page="home"] .showcase-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  opacity: 1 !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card.is-image-loaded::before { display: none !important; }
body[data-page="home"] .showcase-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.58) 75%, rgba(0,0,0,.80) 100%) !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card__badges { z-index: 4 !important; top: 16px !important; left: 16px !important; }
body[data-page="home"] .showcase-card__badges b,
body[data-page="home"] .showcase-card__badges .is-quality {
  background: rgba(245,245,247,.88) !important;
  color: #08090c !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  min-height: 30px !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  font-size: 14px !important;
}
body[data-page="home"] .showcase-card__content {
  z-index: 4 !important;
  left: 18px !important;
  right: 18px !important;
  bottom: 18px !important;
  gap: 6px !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size: clamp(22px, 1.7vw, 32px) !important;
  line-height: 1.04 !important;
  letter-spacing: -.045em !important;
}
body[data-page="home"] .showcase-card__content small { font-size: 13px !important; color: rgba(255,255,255,.72) !important; }
body[data-page="home"] .showcase-card__reveal,
body[data-page="home"] .showcase-card__content em,
body[data-page="home"] .showcase-card__actions { display: none !important; }
body[data-page="home"] .showcase-card:hover .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal { display: grid !important; gap: 8px !important; }
body[data-page="home"] .showcase-card:hover .showcase-card__content em,
body[data-page="home"] .showcase-card:focus-within .showcase-card__content em {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  color: rgba(255,255,255,.86) !important;
  font-size: 14px !important;
  line-height: 1.32 !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions,
body[data-page="home"] .showcase-card:focus-within .showcase-card__actions { display: flex !important; gap: 8px !important; margin-top: 4px !important; }
body[data-page="home"] .showcase-action { min-height: 42px !important; border-radius: 13px !important; }
body[data-page="home"] .showcase-action--play { padding: 0 16px !important; }
body[data-page="home"] .showcase-progress {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: clamp(18px, 4vh, 40px) !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  justify-content: center !important;
  gap: 7px !important;
  z-index: 8 !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-progress button {
  pointer-events: none !important;
  width: 8px !important;
  height: 8px !important;
  border-radius: 999px !important;
  padding: 0 !important;
  background: rgba(245,245,247,.46) !important;
  opacity: 1 !important;
  transition: width .18s ease, background .18s ease !important;
}
body[data-page="home"] .showcase-progress button.is-active { width: 32px !important; background: rgba(245,245,247,.92) !important; }
body[data-page="home"] #homeSections {
  width: 100vw !important;
  max-width: none !important;
  margin: 0 !important;
  padding: clamp(26px, 4vw, 56px) 0 104px !important;
  overflow: visible !important;
  background: #000 !important;
}
body[data-page="home"] .section {
  width: 100vw !important;
  max-width: none !important;
  margin: 0 0 clamp(34px, 5vw, 72px) !important;
  padding: 0 !important;
  overflow: visible !important;
}
body[data-page="home"] .section__head {
  padding: 0 clamp(18px, 4vw, 76px) !important;
  margin-bottom: 18px !important;
}
body[data-page="home"] .row-scroll {
  width: 100vw !important;
  max-width: none !important;
  display: flex !important;
  gap: clamp(14px, 1.35vw, 24px) !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  padding: 0 clamp(18px, 4vw, 76px) 24px !important;
  scroll-snap-type: x proximity !important;
  overscroll-behavior-x: auto !important;
  overscroll-behavior-y: auto !important;
  scrollbar-width: none !important;
  cursor: grab !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 clamp(18px,4vw,76px), #000 calc(100% - clamp(18px,4vw,76px)), transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 clamp(18px,4vw,76px), #000 calc(100% - clamp(18px,4vw,76px)), transparent 100%) !important;
}
body[data-page="home"] .row-scroll.is-dragging { cursor: grabbing !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  flex: 0 0 clamp(150px, 11.2vw, 215px) !important;
  width: clamp(150px, 11.2vw, 215px) !important;
  scroll-snap-align: start !important;
}
body[data-page="home"] .media-card__poster {
  position: relative !important;
  aspect-ratio: 2 / 3 !important;
  background-color: #111216 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
body[data-page="home"] .media-card__poster.is-loading-image::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  opacity: 1 !important;
}
body[data-page="home"] .media-card__poster.is-image-loaded::before { display: none !important; }
body[data-page="home"] .media-card__poster::after { display: none !important; }
body[data-page="home"] .media-card h3 { font-size: clamp(14px, .95vw, 18px) !important; }
body[data-page="home"] .media-card p { font-size: 13px !important; }
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster { transform: none !important; filter: brightness(1.05) !important; box-shadow: none !important; }
@media (max-width: 820px) {
  body[data-page="home"] .showcase-deck { padding-left: 50vw !important; padding-right: 50vw !important; }
  body[data-page="home"] .showcase-card,
  body[data-page="home"] .showcase-card.is-active,
  body[data-page="home"] .showcase-card:hover,
  body[data-page="home"] .showcase-card:focus-visible { flex-basis: min(70vw, 290px) !important; width: min(70vw, 290px) !important; }
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card { flex-basis: 142px !important; width: 142px !important; }
}

/* v0.9.9 — Apple TV carousel stability, hover blur, TMDb/SxEy badges */
body[data-page="home"] .hero.home-showcase.home-showcase--deck {
  --showcase-card-w: clamp(218px, 18vw, 318px) !important;
  min-height: clamp(520px, 70svh, 720px) !important;
  padding-top: clamp(112px, 14vh, 158px) !important;
  padding-bottom: clamp(52px, 8vh, 86px) !important;
}
body[data-page="home"] .showcase-deck {
  padding-left: max(18px, calc(50vw - (var(--showcase-card-w) / 2))) !important;
  padding-right: max(18px, calc(50vw - (var(--showcase-card-w) / 2))) !important;
  gap: clamp(18px, 2vw, 30px) !important;
  scroll-padding-left: max(18px, calc(50vw - (var(--showcase-card-w) / 2))) !important;
  scroll-padding-right: max(18px, calc(50vw - (var(--showcase-card-w) / 2))) !important;
  scroll-snap-type: x mandatory !important;
  overscroll-behavior-x: contain !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-y !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 8vw, #000 92vw, transparent 100%) !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 8vw, #000 92vw, transparent 100%) !important;
}
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 var(--showcase-card-w) !important;
  width: var(--showcase-card-w) !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: clamp(18px, 1.5vw, 25px) !important;
  transform: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
  scroll-snap-align: center !important;
  scroll-snap-stop: normal !important;
  background: #111318 !important;
}
body[data-page="home"] .showcase-card__image {
  transition: filter .22s ease, transform .22s ease, opacity .22s ease !important;
  will-change: filter !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__image,
body[data-page="home"] .showcase-card:focus-within .showcase-card__image {
  filter: blur(4px) brightness(.72) saturate(.94) !important;
  transform: scale(1.035) !important;
}
body[data-page="home"] .showcase-card::after {
  background: linear-gradient(180deg, rgba(0,0,0,.02) 26%, rgba(0,0,0,.45) 58%, rgba(0,0,0,.82) 100%) !important;
}
body[data-page="home"] .showcase-card:hover::after,
body[data-page="home"] .showcase-card:focus-within::after {
  background: linear-gradient(180deg, rgba(0,0,0,.22) 0%, rgba(0,0,0,.56) 48%, rgba(0,0,0,.88) 100%) !important;
}
body[data-page="home"] .showcase-card__badges--left {
  position: absolute !important;
  top: 14px !important;
  left: 14px !important;
  right: auto !important;
  z-index: 5 !important;
  display: grid !important;
  justify-items: start !important;
  gap: 7px !important;
}
body[data-page="home"] .showcase-card__badges b,
body[data-page="home"] .showcase-card__badges .is-quality,
body[data-page="home"] .showcase-card__episode-badge {
  min-height: 28px !important;
  padding: 0 9px !important;
  border-radius: 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.32) !important;
  backdrop-filter: blur(14px) saturate(1.05) !important;
}
body[data-page="home"] .showcase-card__badges .is-quality {
  background: rgba(245,245,247,.90) !important;
  color: #08090c !important;
}
body[data-page="home"] .showcase-card__badges .is-tmdb {
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.18) !important;
}
body[data-page="home"] .showcase-card__badges .is-tmdb.is-good { background: rgba(24, 181, 88, .78) !important; }
body[data-page="home"] .showcase-card__badges .is-tmdb.is-mid { background: rgba(102, 107, 118, .82) !important; }
body[data-page="home"] .showcase-card__badges .is-tmdb.is-low { background: rgba(211, 64, 64, .78) !important; }
body[data-page="home"] .showcase-card__episode-badge {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 5 !important;
  background: rgba(8,9,12,.56) !important;
  color: rgba(255,255,255,.92) !important;
  border: 1px solid rgba(255,255,255,.32) !important;
}
body[data-page="home"] .showcase-card__content {
  left: 16px !important;
  right: 16px !important;
  bottom: 16px !important;
  z-index: 5 !important;
}
body[data-page="home"] .showcase-card__content strong {
  font-size: clamp(22px, 1.55vw, 30px) !important;
  line-height: 1.04 !important;
}
body[data-page="home"] .showcase-card__reveal,
body[data-page="home"] .showcase-card__content em,
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active .showcase-card__reveal,
body[data-page="home"] .showcase-card.is-active .showcase-card__content em,
body[data-page="home"] .showcase-card.is-active .showcase-card__actions {
  display: none !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal {
  display: grid !important;
  gap: 8px !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__content em,
body[data-page="home"] .showcase-card:focus-within .showcase-card__content em {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  color: rgba(255,255,255,.88) !important;
  font-size: 14px !important;
  line-height: 1.34 !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions,
body[data-page="home"] .showcase-card:focus-within .showcase-card__actions {
  display: flex !important;
  gap: 8px !important;
  margin-top: 6px !important;
  max-width: 100% !important;
  overflow: visible !important;
}
body[data-page="home"] .showcase-action {
  height: 39px !important;
  min-height: 39px !important;
  border-radius: 12px !important;
  padding: 0 10px !important;
  white-space: nowrap !important;
}
body[data-page="home"] .showcase-action--play {
  min-width: 120px !important;
  max-width: none !important;
  flex: 1 1 auto !important;
}
body[data-page="home"] .showcase-action:not(.showcase-action--play) {
  width: 39px !important;
  min-width: 39px !important;
  flex: 0 0 39px !important;
  padding: 0 !important;
}
body[data-page="home"] .showcase-progress {
  bottom: clamp(18px, 4vh, 34px) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-progress button { background: rgba(245,245,247,.38) !important; }
body[data-page="home"] .showcase-progress button.is-active { background: rgba(245,245,247,.94) !important; }
body[data-page="home"] .media-card__meta {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: start !important;
  gap: 6px !important;
}
body[data-page="home"] .media-card__meta span { justify-self: start !important; }
body[data-page="home"] .media-card__meta .is-episode { justify-self: end !important; }
body[data-page="home"] .media-card__meta .is-tmdb.is-good { background: rgba(24, 181, 88, .78) !important; color: #fff !important; }
body[data-page="home"] .media-card__meta .is-tmdb.is-mid { background: rgba(102, 107, 118, .82) !important; color: #fff !important; }
body[data-page="home"] .media-card__meta .is-tmdb.is-low { background: rgba(211, 64, 64, .78) !important; color: #fff !important; }
body[data-page="home"] .media-card__meta .is-quality { background: rgba(245,245,247,.88) !important; color: #08090c !important; }
body[data-page="home"] .media-card__meta .is-episode { background: rgba(8,9,12,.55) !important; border-color: rgba(255,255,255,.30) !important; color: #fff !important; }
@media (max-width: 820px) {
  body[data-page="home"] .hero.home-showcase.home-showcase--deck { --showcase-card-w: min(72vw, 286px) !important; }
  body[data-page="home"] .showcase-card:hover .showcase-card__reveal,
  body[data-page="home"] .showcase-card:focus-within .showcase-card__reveal { display: none !important; }
}


/* v1.0.0 — carousel hotfix: first logical slide in infinite middle copy, hover-only blur/reveal */
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__image {
  filter: none !important;
  transform: none !important;
}
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__reveal,
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__content em,
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active:not(:hover) .showcase-card__reveal,
body[data-page="home"] .showcase-card.is-active:not(:hover) .showcase-card__content em,
body[data-page="home"] .showcase-card.is-active:not(:hover) .showcase-card__actions,
body[data-page="home"] .showcase-card:focus-within:not(:hover) .showcase-card__reveal,
body[data-page="home"] .showcase-card:focus-within:not(:hover) .showcase-card__content em,
body[data-page="home"] .showcase-card:focus-within:not(:hover) .showcase-card__actions {
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__image {
  filter: blur(4px) brightness(.70) saturate(.94) !important;
  transform: scale(1.025) !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__reveal {
  display: grid !important;
  grid-template-rows: 1fr !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 7px !important;
  max-width: 100% !important;
  overflow: visible !important;
}
body[data-page="home"] .showcase-card__content { bottom: 15px !important; }
body[data-page="home"] .showcase-card__content strong {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="home"] .showcase-action { height: 38px !important; min-height: 38px !important; }
body[data-page="home"] .showcase-action--play { min-width: 112px !important; }
body[data-page="home"] .showcase-progress { pointer-events: none !important; }


/* v1.0.1 — stable initial carousel, toast notifications, calmer Apple TV shelves */
#notice { display: none !important; }
.toast-root {
  position: fixed !important;
  right: clamp(16px, 2vw, 34px) !important;
  top: clamp(82px, 10vh, 118px) !important;
  z-index: 1400 !important;
  display: grid !important;
  gap: 12px !important;
  width: min(420px, calc(100vw - 32px)) !important;
  pointer-events: none !important;
}
.toast {
  min-height: 56px !important;
  display: grid !important;
  grid-template-columns: 34px 1fr 32px !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 12px 12px 14px !important;
  border-radius: 20px !important;
  color: rgba(245,245,247,.95) !important;
  background: rgba(24,25,30,.78) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(28px) saturate(1.12) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.12) !important;
  transform: translateY(-10px) scale(.98) !important;
  opacity: 0 !important;
  transition: opacity .2s ease, transform .2s ease !important;
  pointer-events: auto !important;
}
.toast.is-visible { opacity: 1 !important; transform: none !important; }
.toast__icon {
  width: 34px !important;
  height: 34px !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  background: rgba(245,245,247,.92) !important;
  color: #050506 !important;
  font-weight: 950 !important;
}
.toast--danger .toast__icon { background: rgba(255, 69, 58, .95) !important; color: #fff !important; }
.toast--success .toast__icon { background: rgba(48, 209, 88, .95) !important; color: #06120a !important; }
.toast__body { min-width: 0 !important; font-size: 15px !important; line-height: 1.32 !important; font-weight: 700 !important; }
.toast__close {
  width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(245,245,247,.80) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  cursor: pointer !important;
}
.toast__close:hover { background: rgba(255,255,255,.16) !important; color: #fff !important; }

body[data-page="home"] .hero.home-showcase.home-showcase--deck.is-showcase-preparing .showcase-deck,
body[data-page="home"] .hero.home-showcase.home-showcase--deck.is-showcase-preparing .showcase-progress {
  opacity: 0 !important;
  transition: none !important;
}
body[data-page="home"] .showcase-deck {
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
  overscroll-behavior-x: auto !important;
  touch-action: pan-y !important;
}
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card.is-active,
body[data-page="home"] .showcase-card:hover,
body[data-page="home"] .showcase-card:focus-visible {
  flex: 0 0 clamp(236px, 17.5vw, 330px) !important;
  width: clamp(236px, 17.5vw, 330px) !important;
  aspect-ratio: 2 / 3 !important;
  scroll-snap-align: none !important;
  box-shadow: none !important;
}
body[data-page="home"] .showcase-card:hover { filter: none !important; border-color: rgba(255,255,255,.22) !important; }
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__image { filter: none !important; transform: none !important; }
body[data-page="home"] .showcase-card:hover .showcase-card__image { filter: blur(4px) brightness(.70) saturate(.95) !important; transform: scale(1.018) !important; }
body[data-page="home"] .showcase-progress { bottom: clamp(16px, 3.5vh, 30px) !important; pointer-events: none !important; }

body[data-page="home"] #homeSections {
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: hidden !important;
}
body[data-page="home"] .section__head {
  padding-inline: clamp(24px, 5vw, 92px) !important;
}
body[data-page="home"] .row-scroll {
  gap: clamp(14px, 1.35vw, 22px) !important;
  padding: 6px clamp(24px, 5vw, 92px) 26px !important;
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 42px, #000 calc(100% - 42px), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 42px, #000 calc(100% - 42px), transparent 100%) !important;
}
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  flex: 0 0 clamp(154px, 11.4vw, 210px) !important;
  width: clamp(154px, 11.4vw, 210px) !important;
}
body[data-page="home"] .media-card__poster {
  aspect-ratio: 2 / 3 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: none !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}
body[data-page="home"] .media-card__poster::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 48%, rgba(0,0,0,.78) 100%) !important;
}
body[data-page="home"] .media-card__poster.is-loading-image::before {
  background: linear-gradient(100deg, rgba(255,255,255,.04), rgba(255,255,255,.12), rgba(255,255,255,.04)) !important;
  background-size: 220% 100% !important;
  animation: shimmer 1.2s linear infinite !important;
}
body[data-page="home"] .poster-badges {
  position: absolute !important;
  left: 9px !important;
  top: 9px !important;
  z-index: 3 !important;
  display: flex !important;
  gap: 6px !important;
  align-items: center !important;
}
body[data-page="home"] .poster-badges span,
body[data-page="home"] .poster-episode {
  min-height: 24px !important;
  padding: 0 7px !important;
  border-radius: 8px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}
body[data-page="home"] .poster-badges .is-quality { background: rgba(245,245,247,.90) !important; color: #050506 !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-good { background: rgba(24,181,88,.78) !important; color:#fff !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-mid { background: rgba(102,107,118,.82) !important; color:#fff !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-low { background: rgba(211,64,64,.78) !important; color:#fff !important; }
body[data-page="home"] .poster-episode {
  position: absolute !important;
  z-index: 3 !important;
  top: 9px !important;
  right: 9px !important;
  background: rgba(8,9,12,.56) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.26) !important;
}
body[data-page="home"] .poster-play {
  z-index: 4 !important;
  opacity: 0 !important;
  transform: translate(-50%, -50%) scale(.96) !important;
  transition: opacity .16s ease, transform .16s ease !important;
}
body[data-page="home"] .media-card:hover .poster-play,
body[data-page="home"] .media-card:focus-within .poster-play {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1) !important;
}
body[data-page="home"] .media-card__body { margin-top: 10px !important; }
body[data-page="home"] .media-card__meta { display: none !important; }

@media (max-width: 820px) {
  .toast-root { top: 16px !important; right: 12px !important; left: 12px !important; width: auto !important; }
  body[data-page="home"] .showcase-card,
  body[data-page="home"] .showcase-card.is-active,
  body[data-page="home"] .showcase-card:hover,
  body[data-page="home"] .showcase-card:focus-visible { flex-basis: min(68vw, 280px) !important; width: min(68vw, 280px) !important; }
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card { flex-basis: 142px !important; width: 142px !important; }
}

/* v1.0.2 — bottom Russian toasts + Apple TV poster shelf overlays */
.toast-root {
  top: auto !important;
  bottom: clamp(18px, 3.2vh, 36px) !important;
  right: clamp(18px, 2.4vw, 42px) !important;
  width: min(420px, calc(100vw - 36px)) !important;
}
.toast {
  grid-template-columns: 34px 1fr 30px !important;
  border-radius: 18px !important;
  background: rgba(22, 23, 28, .82) !important;
  transform: translateY(14px) scale(.985) !important;
}
.toast.is-visible { transform: none !important; }
.toast__body { font-size: 15px !important; font-weight: 800 !important; }
.toast__icon { font-size: 18px !important; }

body[data-page="home"] #homeSections {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
body[data-page="home"] .section { margin-block: clamp(34px, 5vh, 70px) !important; }
body[data-page="home"] .section__head {
  padding-inline: clamp(26px, 4.8vw, 96px) !important;
  margin-bottom: 16px !important;
}
body[data-page="home"] .section__head p { display: none !important; }
body[data-page="home"] .section__head h2 {
  font-size: clamp(30px, 3.4vw, 56px) !important;
  line-height: .94 !important;
  letter-spacing: -.055em !important;
}
body[data-page="home"] .section__more {
  min-height: 42px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.12) !important;
  color: rgba(245,245,247,.96) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: none !important;
}
body[data-page="home"] .row-scroll {
  cursor: grab !important;
  gap: clamp(18px, 1.55vw, 28px) !important;
  padding: 4px clamp(26px, 4.8vw, 96px) 30px !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 5vw, #000 calc(100% - 5vw), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5vw, #000 calc(100% - 5vw), transparent 100%) !important;
}
body[data-page="home"] .row-scroll.is-dragging { cursor: grabbing !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  flex: 0 0 clamp(166px, 12.4vw, 230px) !important;
  width: clamp(166px, 12.4vw, 230px) !important;
}
body[data-page="home"] .media-card__poster {
  aspect-ratio: 2 / 3 !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: border-color .18s ease, filter .18s ease !important;
}
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster,
body[data-page="home"] .media-card__poster:focus-visible {
  transform: none !important;
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: none !important;
  filter: none !important;
}
body[data-page="home"] .media-card__poster::before {
  background: linear-gradient(180deg, rgba(0,0,0,.02) 30%, rgba(0,0,0,.34) 62%, rgba(0,0,0,.88) 100%) !important;
}
body[data-page="home"] .poster-overlay {
  position: absolute !important;
  left: 12px !important;
  right: 12px !important;
  bottom: 12px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 4px !important;
  pointer-events: none !important;
  text-shadow: 0 6px 18px rgba(0,0,0,.82) !important;
}
body[data-page="home"] .poster-overlay strong {
  color: #fff !important;
  font-size: clamp(15px, 1.02vw, 20px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.045em !important;
  font-weight: 950 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="home"] .poster-overlay small {
  color: rgba(245,245,247,.66) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}
body[data-page="home"] .media-card__body { display: none !important; }
body[data-page="home"] .poster-play {
  background: rgba(0,0,0,.26) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}
body[data-page="home"] .poster-play svg,
body[data-page="home"] .poster-play i {
  width: 48px !important;
  height: 48px !important;
  padding: 14px !important;
  background: rgba(245,245,247,.94) !important;
}
body[data-page="home"] .poster-badges {
  left: 10px !important;
  top: 10px !important;
  gap: 5px !important;
  max-width: calc(100% - 20px) !important;
}
body[data-page="home"] .poster-badges span,
body[data-page="home"] .poster-episode {
  min-height: 25px !important;
  padding: 0 8px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
}
body[data-page="home"] .poster-episode { right: 10px !important; top: 10px !important; }

@media (max-width: 820px) {
  .toast-root { left: 12px !important; right: 12px !important; bottom: 14px !important; width: auto !important; }
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card { flex-basis: 146px !important; width: 146px !important; }
}

/* v33: rebuilt lazy Apple TV shelves */
body[data-page="home"] .sections,
body[data-page="home"] #homeSections {
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: visible !important;
}
body[data-page="home"] .section {
  position: relative !important;
  margin: clamp(38px, 6vh, 82px) 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
body[data-page="home"] .section__head {
  padding: 0 clamp(30px, 5vw, 104px) !important;
  margin: 0 0 18px !important;
  display: flex !important;
  align-items: flex-end !important;
}
body[data-page="home"] .section__head h2 {
  font-size: clamp(30px, 3vw, 54px) !important;
  line-height: .95 !important;
  letter-spacing: -.06em !important;
  font-weight: 930 !important;
}
body[data-page="home"] .section__head p {
  display: block !important;
  margin-top: 8px !important;
  color: rgba(245,245,247,.42) !important;
  font-size: 13px !important;
}
body[data-page="home"] .section__more {
  min-height: 38px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  color: rgba(245,245,247,.88) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}
body[data-page="home"] .section__more:hover,
body[data-page="home"] .section__more:focus-visible {
  background: rgba(255,255,255,.92) !important;
  color: #08090b !important;
}
body[data-page="home"] .row-scroll {
  width: 100vw !important;
  display: flex !important;
  align-items: flex-start !important;
  gap: clamp(18px, 1.45vw, 28px) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 4px clamp(30px, 5vw, 104px) 28px !important;
  scroll-padding-inline: clamp(30px, 5vw, 104px) !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 3.6vw, #000 calc(100% - 3.6vw), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 3.6vw, #000 calc(100% - 3.6vw), transparent 100%) !important;
}
body[data-page="home"] .row-scroll::-webkit-scrollbar { display: none !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card {
  width: clamp(150px, 10.4vw, 205px) !important;
  flex: 0 0 clamp(150px, 10.4vw, 205px) !important;
  scroll-snap-align: start !important;
  border-radius: 18px !important;
  transform: none !important;
  transition: transform .18s ease, opacity .18s ease !important;
}
body[data-page="home"] .media-card__poster {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  padding: 0 !important;
  border-radius: 17px !important;
  overflow: hidden !important;
  background-color: #111319 !important;
  background-size: cover !important;
  background-position: center !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: border-color .18s ease, filter .18s ease, opacity .18s ease !important;
}
body[data-page="home"] .media-card__poster::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.10) 52%, rgba(0,0,0,.32) 100%) !important;
}
body[data-page="home"] .media-card__poster::after { display: none !important; }
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within { transform: translateY(-3px) !important; z-index: 5 !important; }
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.32) !important;
  filter: brightness(1.05) contrast(1.02) !important;
  box-shadow: none !important;
}
body[data-page="home"] .poster-overlay {
  position: absolute !important;
  inset: auto 8px 8px 8px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 3px !important;
  padding: 9px 10px !important;
  border-radius: 12px !important;
  background: rgba(10,11,14,.62) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  backdrop-filter: blur(18px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.15) !important;
  opacity: 0 !important;
  transform: translateY(7px) !important;
  transition: opacity .18s ease, transform .18s ease !important;
}
body[data-page="home"] .media-card:hover .poster-overlay,
body[data-page="home"] .media-card:focus-within .poster-overlay { opacity: 1 !important; transform: none !important; }
body[data-page="home"] .poster-overlay strong {
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.08 !important;
  font-weight: 850 !important;
  letter-spacing: -.035em !important;
  text-shadow: none !important;
}
body[data-page="home"] .poster-overlay small {
  color: rgba(245,245,247,.68) !important;
  font-size: 11px !important;
  font-weight: 650 !important;
}
body[data-page="home"] .media-card__body {
  display: block !important;
  padding-top: 10px !important;
}
body[data-page="home"] .media-card h3 {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin: 0 !important;
  color: rgba(245,245,247,.96) !important;
  font-size: clamp(14px, .92vw, 18px) !important;
  line-height: 1.13 !important;
  font-weight: 820 !important;
  letter-spacing: -.03em !important;
}
body[data-page="home"] .media-card p {
  display: block !important;
  margin: 5px 0 0 !important;
  color: rgba(245,245,247,.46) !important;
  font-size: 12px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body[data-page="home"] .media-card__meta { display: none !important; }
body[data-page="home"] .poster-badges {
  position: absolute !important;
  z-index: 4 !important;
  left: 9px !important;
  top: 9px !important;
  right: auto !important;
  display: grid !important;
  gap: 5px !important;
}
body[data-page="home"] .poster-badges span,
body[data-page="home"] .poster-episode {
  min-height: 24px !important;
  padding: 0 8px !important;
  border-radius: 8px !important;
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,.22) !important;
}
body[data-page="home"] .poster-badges .is-quality,
body[data-page="home"] .poster-episode {
  background: rgba(245,245,247,.92) !important;
  color: #090A0D !important;
}
body[data-page="home"] .poster-badges .is-tmdb.is-good { background: rgba(38, 208, 124, .92) !important; color:#05110a !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-mid { background: rgba(245, 190, 70, .92) !important; color:#130d02 !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-low { background: rgba(245, 82, 82, .92) !important; color:#160404 !important; }
body[data-page="home"] .poster-episode {
  position: absolute !important;
  z-index: 4 !important;
  right: 9px !important;
  top: 9px !important;
}
body[data-page="home"] .poster-play {
  z-index: 5 !important;
  background: rgba(0,0,0,.12) !important;
  opacity: 0 !important;
}
body[data-page="home"] .media-card:hover .poster-play,
body[data-page="home"] .media-card:focus-within .poster-play { opacity: 1 !important; }
body[data-page="home"] .poster-play svg,
body[data-page="home"] .poster-play i {
  width: 44px !important;
  height: 44px !important;
  padding: 13px !important;
  background: rgba(245,245,247,.92) !important;
  color: #08090b !important;
  border-radius: 999px !important;
}
body[data-page="home"] .section-loading .row-scroll { pointer-events: none !important; }
body[data-page="home"] .skeleton-card {
  width: clamp(150px, 10.4vw, 205px) !important;
  flex-basis: clamp(150px, 10.4vw, 205px) !important;
}
body[data-page="home"] .skeleton-poster {
  aspect-ratio: 2 / 3 !important;
  height: auto !important;
  border-radius: 17px !important;
  background: linear-gradient(110deg, rgba(255,255,255,.055), rgba(255,255,255,.12), rgba(255,255,255,.055)) !important;
  background-size: 220% 100% !important;
  animation: skeletonShimmer 1.15s ease-in-out infinite !important;
}
body[data-page="home"] .skeleton-line { height: 15px !important; border-radius: 999px !important; background: rgba(255,255,255,.08) !important; margin-top: 10px !important; }
body[data-page="home"] .skeleton-line--short { width: 64% !important; opacity: .65 !important; }
.media-card__poster.is-loading-image::before,
.showcase-card.is-loading-image::before {
  background: linear-gradient(110deg, rgba(255,255,255,.06), rgba(255,255,255,.14), rgba(255,255,255,.06)) !important;
  background-size: 220% 100% !important;
  animation: skeletonShimmer 1.15s ease-in-out infinite !important;
  z-index: 6 !important;
}
.media-card__poster.is-image-loaded::before { z-index: 1 !important; }
@keyframes skeletonShimmer { 0% { background-position: 120% 0; } 100% { background-position: -120% 0; } }
@media (max-width: 820px) {
  body[data-page="home"] .section__head { padding-inline: 18px !important; }
  body[data-page="home"] .row-scroll { padding-inline: 18px !important; scroll-padding-inline: 18px !important; }
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card,
  body[data-page="home"] .skeleton-card { flex-basis: 138px !important; width: 138px !important; }
}

/* v34: clean poster shelves and hover-only card reveal */
body[data-page="home"] #homeSections,
body[data-page="home"] .sections {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
body[data-page="home"] .section {
  margin: clamp(44px, 7vh, 92px) 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
body[data-page="home"] .section__head {
  padding: 0 clamp(26px, 4.8vw, 96px) !important;
  margin-bottom: 18px !important;
}
body[data-page="home"] .section__head h2 {
  font-size: clamp(30px, 3.2vw, 58px) !important;
  letter-spacing: -.065em !important;
  line-height: .92 !important;
}
body[data-page="home"] .section__head p { display: none !important; }
body[data-page="home"] .row-scroll {
  width: 100vw !important;
  gap: clamp(18px, 1.35vw, 28px) !important;
  padding: 4px clamp(26px, 4.8vw, 96px) 30px !important;
  scroll-padding-inline: clamp(26px, 4.8vw, 96px) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  mask-image: linear-gradient(90deg, transparent 0, #000 2.8vw, #000 calc(100% - 2.8vw), transparent 100%) !important;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 2.8vw, #000 calc(100% - 2.8vw), transparent 100%) !important;
}
body[data-page="home"] .row-scroll::-webkit-scrollbar { display: none !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card,
body[data-page="home"] .skeleton-card {
  width: clamp(184px, 11.2vw, 238px) !important;
  flex: 0 0 clamp(184px, 11.2vw, 238px) !important;
  border-radius: 23px !important;
  scroll-snap-align: start !important;
  transform: none !important;
  transition: transform .18s ease, opacity .18s ease !important;
}
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within { transform: translateY(-4px) !important; z-index: 8 !important; }
body[data-page="home"] .media-card__poster {
  aspect-ratio: 2 / 3 !important;
  padding: 0 !important;
  border-radius: 23px !important;
  overflow: hidden !important;
  background-color: #111217 !important;
  background-position: center !important;
  background-size: cover !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  transition: border-color .18s ease, transform .18s ease !important;
}
body[data-page="home"] .media-card__poster::before { display: none !important; }
body[data-page="home"] .media-card__poster::after { display: none !important; }
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
body[data-page="home"] .poster-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.02) 0%, rgba(0,0,0,.08) 46%, rgba(0,0,0,.84) 100%) !important;
  backdrop-filter: blur(0) saturate(1) !important;
  -webkit-backdrop-filter: blur(0) saturate(1) !important;
  transition: background .2s ease, backdrop-filter .2s ease, -webkit-backdrop-filter .2s ease !important;
}
body[data-page="home"] .media-card:hover .poster-shade,
body[data-page="home"] .media-card:focus-within .poster-shade {
  background:
    linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.30) 42%, rgba(0,0,0,.90) 100%) !important;
  backdrop-filter: blur(8px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.05) !important;
}
body[data-page="home"] .poster-overlay {
  position: absolute !important;
  inset: auto 16px 17px 16px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 5px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  opacity: 1 !important;
  transform: none !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.86) !important;
  pointer-events: none !important;
}
body[data-page="home"] .poster-overlay strong {
  font-size: clamp(20px, 1.38vw, 32px) !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
  font-weight: 950 !important;
  color: #fff !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="home"] .poster-overlay small {
  color: rgba(245,245,247,.72) !important;
  font-size: clamp(12px, .78vw, 15px) !important;
  line-height: 1.18 !important;
  font-weight: 850 !important;
}
body[data-page="home"] .poster-overlay em {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  max-height: 0 !important;
  opacity: 0 !important;
  margin-top: 0 !important;
  color: rgba(245,245,247,.88) !important;
  font-size: clamp(13px, .86vw, 16px) !important;
  line-height: 1.33 !important;
  font-style: normal !important;
  transition: max-height .2s ease, opacity .2s ease, margin .2s ease !important;
}
body[data-page="home"] .poster-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  max-height: 0 !important;
  opacity: 0 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  transition: max-height .2s ease, opacity .2s ease, margin .2s ease !important;
}
body[data-page="home"] .media-card:hover .poster-overlay em,
body[data-page="home"] .media-card:focus-within .poster-overlay em {
  max-height: 94px !important;
  opacity: 1 !important;
  margin-top: 8px !important;
}
body[data-page="home"] .media-card:hover .poster-actions,
body[data-page="home"] .media-card:focus-within .poster-actions {
  max-height: 46px !important;
  opacity: 1 !important;
  margin-top: 10px !important;
}
body[data-page="home"] .poster-action {
  min-height: 40px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 0 13px !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
body[data-page="home"] .poster-action--play {
  flex: 1 1 auto !important;
  background: rgba(245,245,247,.94) !important;
  color: #07080a !important;
}
body[data-page="home"] .poster-action:not(.poster-action--play) { width: 42px !important; padding: 0 !important; }
body[data-page="home"] .poster-action svg,
body[data-page="home"] .poster-action i { width: 18px !important; height: 18px !important; }
body[data-page="home"] .media-card__body { display: none !important; }
body[data-page="home"] .media-card__meta { display: none !important; }
body[data-page="home"] .poster-badges {
  position: absolute !important;
  z-index: 5 !important;
  left: 13px !important;
  top: 13px !important;
  display: flex !important;
  gap: 6px !important;
}
body[data-page="home"] .poster-badges span,
body[data-page="home"] .poster-episode {
  min-height: 29px !important;
  padding: 0 9px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.28) !important;
}
body[data-page="home"] .poster-badges .is-quality,
body[data-page="home"] .poster-episode {
  background: rgba(245,245,247,.92) !important;
  color: #08090b !important;
}
body[data-page="home"] .poster-badges .is-tmdb.is-good { background: rgba(33, 210, 130, .92) !important; color:#02110a !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-mid { background: rgba(236, 174, 59, .92) !important; color:#120d02 !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-low { background: rgba(237, 84, 84, .92) !important; color:#170606 !important; }
body[data-page="home"] .poster-episode { position: absolute !important; top: 13px !important; right: 13px !important; z-index: 5 !important; }
body[data-page="home"] .poster-play { display: none !important; }
body[data-page="home"] .skeleton-poster { aspect-ratio: 2 / 3 !important; padding-bottom: 0 !important; height: auto !important; border-radius: 23px !important; }
body[data-page="home"] .skeleton-line { display: none !important; }
@media (max-width: 820px) {
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card,
  body[data-page="home"] .skeleton-card { width: 154px !important; flex-basis: 154px !important; }
  body[data-page="home"] .poster-overlay { inset-inline: 11px !important; bottom: 13px !important; }
  body[data-page="home"] .poster-overlay strong { font-size: 18px !important; }
}
body[data-page="home"] .poster-badges { display: grid !important; grid-auto-flow: row !important; justify-items: start !important; }
body[data-page="home"] .poster-badges { display: grid !important; grid-auto-flow: row !important; justify-items: start !important; }

/* v35 — rebuilt shelf poster cards: clean Apple TV overlay, no duplicated footer, stable hover */
body[data-page="home"] .section { margin: clamp(42px, 6vh, 82px) 0 !important; }
body[data-page="home"] .section__head {
  padding-inline: clamp(28px, 5vw, 108px) !important;
  margin-bottom: clamp(14px, 1.6vw, 24px) !important;
}
body[data-page="home"] .section__head h2 {
  font-size: clamp(32px, 3.15vw, 56px) !important;
  letter-spacing: -.06em !important;
  line-height: .95 !important;
}
body[data-page="home"] .row-scroll {
  gap: clamp(18px, 1.45vw, 30px) !important;
  padding: 6px clamp(28px, 5vw, 108px) 34px !important;
  scroll-padding-inline: clamp(28px, 5vw, 108px) !important;
  cursor: grab !important;
}
body[data-page="home"] .row-scroll.is-dragging { cursor: grabbing !important; }
body[data-page="home"] .media-card,
body[data-page="home"] .section--featured .media-card,
body[data-page="home"] .section--genre .media-card,
body[data-page="home"] .skeleton-card {
  width: clamp(184px, 12.2vw, 244px) !important;
  flex: 0 0 clamp(184px, 12.2vw, 244px) !important;
  border-radius: 22px !important;
  overflow: visible !important;
  transform: none !important;
}
body[data-page="home"] .media-card__poster {
  aspect-ratio: 2 / 3 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: #101116 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
}
body[data-page="home"] .media-card:hover,
body[data-page="home"] .media-card:focus-within { transform: translateY(-3px) !important; z-index: 10 !important; }
body[data-page="home"] .media-card:hover .media-card__poster,
body[data-page="home"] .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: none !important;
  filter: none !important;
}
body[data-page="home"] .poster-art {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  background-size: cover !important;
  background-position: center !important;
  transform: scale(1) !important;
  filter: none !important;
  transition: filter .22s ease, transform .22s ease, opacity .22s ease !important;
}
body[data-page="home"] .poster-art--empty {
  background: radial-gradient(circle at 35% 20%, rgba(255,255,255,.12), transparent 28%), linear-gradient(145deg, #191b22, #090a0e) !important;
}
body[data-page="home"] .media-card:hover .poster-art,
body[data-page="home"] .media-card:focus-within .poster-art {
  filter: blur(7px) brightness(.62) saturate(1.06) !important;
  transform: scale(1.045) !important;
}
body[data-page="home"] .media-card__poster::before { display: none !important; }
body[data-page="home"] .media-card__poster.is-loading-image .poster-art,
body[data-page="home"] .media-card__poster.is-missing-image .poster-art {
  background: linear-gradient(110deg, rgba(255,255,255,.055), rgba(255,255,255,.13), rgba(255,255,255,.055)) !important;
  background-size: 220% 100% !important;
  animation: skeletonShimmer 1.15s ease-in-out infinite !important;
}
body[data-page="home"] .poster-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.38) 70%, rgba(0,0,0,.78) 100%),
    linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,0) 38%) !important;
  pointer-events: none !important;
}
body[data-page="home"] .media-card:hover .poster-shade,
body[data-page="home"] .media-card:focus-within .poster-shade {
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.36) 42%, rgba(0,0,0,.82) 100%) !important;
}
body[data-page="home"] .poster-overlay {
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: none !important;
  text-shadow: 0 8px 24px rgba(0,0,0,.95) !important;
}
body[data-page="home"] .poster-overlay strong {
  color: #fff !important;
  font-size: clamp(18px, 1.25vw, 25px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  font-weight: 950 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="home"] .poster-overlay small {
  color: rgba(245,245,247,.78) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
}
body[data-page="home"] .poster-overlay em,
body[data-page="home"] .poster-actions {
  display: none !important;
  opacity: 0 !important;
  transform: translateY(6px) !important;
}
body[data-page="home"] .media-card:hover .poster-overlay em,
body[data-page="home"] .media-card:focus-within .poster-overlay em {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  opacity: 1 !important;
  transform: none !important;
  color: rgba(245,245,247,.88) !important;
  font-size: 13px !important;
  line-height: 1.28 !important;
  font-style: normal !important;
  font-weight: 520 !important;
  margin-top: 6px !important;
}
body[data-page="home"] .media-card:hover .poster-actions,
body[data-page="home"] .media-card:focus-within .poster-actions {
  display: flex !important;
  opacity: 1 !important;
  transform: none !important;
  gap: 8px !important;
  margin-top: 8px !important;
  pointer-events: auto !important;
}
body[data-page="home"] .poster-action {
  height: 36px !important;
  min-width: 38px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(245,245,247,.92) !important;
  color: #07080b !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}
body[data-page="home"] .poster-action:not(.poster-action--play) {
  width: 38px !important;
  padding: 0 !important;
  background: rgba(245,245,247,.16) !important;
  color: #fff !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}
body[data-page="home"] .poster-action svg,
body[data-page="home"] .poster-action i { width: 17px !important; height: 17px !important; }
body[data-page="home"] .poster-badges {
  position: absolute !important;
  z-index: 5 !important;
  top: 10px !important;
  left: 10px !important;
  display: grid !important;
  gap: 6px !important;
}
body[data-page="home"] .poster-badges span,
body[data-page="home"] .poster-episode {
  min-height: 27px !important;
  padding: 0 9px !important;
  border-radius: 9px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.02em !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: none !important;
}
body[data-page="home"] .poster-badges .is-quality,
body[data-page="home"] .poster-episode { background: rgba(245,245,247,.92) !important; color: #050608 !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-good { background: rgba(41,211,128,.88) !important; color:#041006 !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-mid { background: rgba(225,229,236,.86) !important; color:#07080b !important; }
body[data-page="home"] .poster-badges .is-tmdb.is-low { background: rgba(235,91,91,.88) !important; color:#160303 !important; }
body[data-page="home"] .poster-episode { position: absolute !important; right: 10px !important; top: 10px !important; z-index: 5 !important; }
body[data-page="home"] .media-card__body,
body[data-page="home"] .media-card__meta,
body[data-page="home"] .poster-play { display: none !important; }
body[data-page="home"] .skeleton-card .media-card__body { display: block !important; }
@media (max-width: 820px) {
  body[data-page="home"] .media-card,
  body[data-page="home"] .section--featured .media-card,
  body[data-page="home"] .section--genre .media-card,
  body[data-page="home"] .skeleton-card { width: 150px !important; flex-basis: 150px !important; }
  body[data-page="home"] .poster-overlay strong { font-size: 17px !important; }
  body[data-page="home"] .media-card:hover .poster-overlay em,
  body[data-page="home"] .media-card:focus-within .poster-overlay em { display: none !important; }
  body[data-page="home"] .media-card:hover .poster-actions,
  body[data-page="home"] .media-card:focus-within .poster-actions { display: none !important; }
}

/* v36 — final home-card interaction repair: hover-only reveal, no poster descriptions, draggable posters */
body[data-page="home"] .media-card,
body[data-page="home"] .media-card__poster,
body[data-page="home"] .poster-art,
body[data-page="home"] .showcase-card,
body[data-page="home"] .showcase-card__image {
  user-select: none !important;
  -webkit-user-drag: none !important;
}

body[data-page="home"] .poster-art,
body[data-page="home"] .poster-shade,
body[data-page="home"] .poster-overlay strong,
body[data-page="home"] .poster-overlay small,
body[data-page="home"] .showcase-card__image,
body[data-page="home"] .showcase-card__content strong,
body[data-page="home"] .showcase-card__content small {
  pointer-events: none !important;
}

body[data-page="home"] .poster-actions,
body[data-page="home"] .poster-action,
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-action {
  pointer-events: auto !important;
}

/* Small shelf cards: keep only title/meta on poster. No description block, no focus/click blur. */
body[data-page="home"] .poster-overlay em,
body[data-page="home"] .media-card:hover .poster-overlay em,
body[data-page="home"] .media-card:focus-within .poster-overlay em,
body[data-page="home"] .media-card__poster:focus-visible .poster-overlay em {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

body[data-page="home"] .media-card:focus-within,
body[data-page="home"] .media-card__poster:focus-visible {
  transform: none !important;
  outline: none !important;
}

body[data-page="home"] .media-card:not(:hover) .poster-art,
body[data-page="home"] .media-card:focus-within:not(:hover) .poster-art,
body[data-page="home"] .media-card__poster:focus-visible:not(:hover) .poster-art {
  filter: none !important;
  transform: none !important;
}

body[data-page="home"] .media-card:not(:hover) .poster-actions,
body[data-page="home"] .media-card:focus-within:not(:hover) .poster-actions,
body[data-page="home"] .media-card__poster:focus-visible:not(:hover) .poster-actions {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

body[data-page="home"] .media-card:hover {
  transform: translateY(-3px) !important;
  z-index: 12 !important;
}
body[data-page="home"] .media-card:hover .poster-art {
  filter: blur(6px) brightness(.66) saturate(1.02) !important;
  transform: scale(1.035) !important;
}
body[data-page="home"] .media-card:hover .poster-actions {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

/* Make the shelf card closer to the large slider card, but keep it compact. */
body[data-page="home"] .poster-overlay {
  left: 15px !important;
  right: 15px !important;
  bottom: 16px !important;
  gap: 5px !important;
  align-content: end !important;
}
body[data-page="home"] .poster-overlay strong {
  font-size: clamp(18px, 1.28vw, 25px) !important;
  line-height: 1.02 !important;
  text-align: left !important;
}
body[data-page="home"] .poster-overlay small {
  font-size: 12px !important;
  text-align: left !important;
}
body[data-page="home"] .media-card__poster {
  cursor: grab !important;
}
body[data-page="home"] .row-scroll.is-dragging .media-card__poster,
body[data-page="home"] .showcase-deck.is-dragging .showcase-card {
  cursor: grabbing !important;
}

/* Main showcase: click opens card, reveal/blur only on real hover, not active/focus/click. */
body[data-page="home"] .showcase-card:focus-visible,
body[data-page="home"] .showcase-card.is-active {
  transform: none !important;
  outline: none !important;
}
body[data-page="home"] .showcase-card:not(:hover) .showcase-card__image,
body[data-page="home"] .showcase-card.is-active:not(:hover) .showcase-card__image,
body[data-page="home"] .showcase-card:focus-visible:not(:hover) .showcase-card__image {
  filter: none !important;
  transform: none !important;
}
body[data-page="home"] .showcase-card__content em,
body[data-page="home"] .showcase-card__actions,
body[data-page="home"] .showcase-card.is-active .showcase-card__content em,
body[data-page="home"] .showcase-card.is-active .showcase-card__actions,
body[data-page="home"] .showcase-card:focus-visible .showcase-card__content em,
body[data-page="home"] .showcase-card:focus-visible .showcase-card__actions {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__image {
  filter: blur(5px) brightness(.70) saturate(.96) !important;
  transform: scale(1.018) !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__content em {
  display: -webkit-box !important;
  opacity: 1 !important;
  visibility: visible !important;
}
body[data-page="home"] .showcase-card:hover .showcase-card__actions {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
}

@media (max-width: 820px) {
  body[data-page="home"] .poster-actions,
  body[data-page="home"] .media-card:hover .poster-actions { display: none !important; }
}

/* v1.0.7 — poster lazy loading + KINOLOT placeholders + click-focus blur fix */
body[data-page="home"] .media-card__poster {
  background: #08090c !important;
  isolation: isolate !important;
}
body[data-page="home"] .poster-placeholder {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.12), transparent 26%),
    linear-gradient(145deg, #1b1d23 0%, #0d0e12 48%, #050507 100%) !important;
  color: rgba(245,245,247,.30) !important;
  font-size: clamp(18px, 1.4vw, 30px) !important;
  font-weight: 950 !important;
  letter-spacing: .22em !important;
  text-align: center !important;
  pointer-events: none !important;
  opacity: 1 !important;
  transition: opacity .22s ease !important;
}
body[data-page="home"] .poster-placeholder::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  background: linear-gradient(110deg, transparent 20%, rgba(255,255,255,.09) 45%, transparent 70%) !important;
  transform: translateX(-110%) !important;
  animation: skeletonSweep 1.25s ease-in-out infinite !important;
  opacity: .7 !important;
}
@keyframes skeletonSweep { to { transform: translateX(110%); } }
body[data-page="home"] .media-card__poster.is-image-loaded .poster-placeholder {
  opacity: 0 !important;
}
body[data-page="home"] .media-card__poster.is-missing-image .poster-placeholder {
  opacity: 1 !important;
}
body[data-page="home"] .media-card__poster.is-missing-image .poster-placeholder::after {
  opacity: .28 !important;
}
body[data-page="home"] .poster-art,
body[data-page="home"] .poster-art--img {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  background-size: cover !important;
  background-position: center !important;
  opacity: 0 !important;
  transform: scale(1) !important;
  filter: none !important;
  transition: opacity .24s ease, filter .22s ease, transform .22s ease !important;
  pointer-events: none !important;
}
body[data-page="home"] .media-card__poster.is-image-loaded .poster-art,
body[data-page="home"] .media-card__poster:not(.is-loading-image):not(.is-missing-image) .poster-art {
  opacity: 1 !important;
}
body[data-page="home"] .media-card__poster.is-loading-image .poster-art,
body[data-page="home"] .media-card__poster.is-missing-image .poster-art {
  opacity: 0 !important;
  animation: none !important;
  background: transparent !important;
}
body[data-page="home"] .media-card:not(:hover) .poster-art,
body[data-page="home"] .media-card:focus-within:not(:hover) .poster-art,
body[data-page="home"] .media-card__poster:focus-visible:not(:hover) .poster-art {
  filter: none !important;
  transform: scale(1) !important;
}
body[data-page="home"] .media-card:hover .media-card__poster.is-image-loaded .poster-art {
  filter: blur(6px) brightness(.66) saturate(1.02) !important;
  transform: scale(1.035) !important;
}
body[data-page="home"] .media-card:focus-within:not(:hover) .poster-overlay,
body[data-page="home"] .media-card__poster:focus-visible:not(:hover) .poster-overlay {
  opacity: 1 !important;
  transform: none !important;
}
body[data-page="home"] .media-card:focus-within:not(:hover) .poster-actions,
body[data-page="home"] .media-card__poster:focus-visible:not(:hover) .poster-actions {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
body[data-page="home"] .media-card.is-clicked .poster-art,
body[data-page="home"] .media-card.is-clicked .poster-actions {
  filter: none !important;
}

/* v1.0.8 — Apple TV menu rebuild + click blur repair */
@media (min-width: 821px) {
  .sidebar {
    top: 28px !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(1360px, calc(100vw - 88px)) !important;
    height: 76px !important;
    min-height: 76px !important;
    padding: 0 clamp(16px, 1.6vw, 28px) !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: clamp(18px, 2.4vw, 44px) !important;
    align-items: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.26) 70%, transparent) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  body.is-nav-condensed .sidebar,
  body:not([data-page="home"]) .sidebar {
    top: 20px !important;
    width: min(1280px, calc(100vw - 76px)) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 18px !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: clamp(14px, 1.8vw, 30px) !important;
    border: 1px solid rgba(245,245,247,.14) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(31,32,37,.82), rgba(13,14,17,.74)) !important;
    box-shadow: 0 24px 86px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.13) !important;
    backdrop-filter: blur(34px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(34px) saturate(135%) !important;
  }
  .brand.brand--home,
  body.is-nav-condensed .brand.brand--home,
  body:not([data-page="home"]) .brand.brand--home {
    justify-self: start !important;
    min-width: 0 !important;
    height: 58px !important;
    padding: 0 !important;
    padding-right: clamp(16px, 2vw, 34px) !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 14px !important;
    color: #fff !important;
    cursor: pointer !important;
    appearance: none !important;
    -webkit-appearance: none !important;
  }
  .brand.brand--home:hover strong { color: #fff !important; }
  .brand.brand--home .brand__logo,
  body.is-nav-condensed .brand.brand--home .brand__logo,
  body:not([data-page="home"]) .brand.brand--home .brand__logo {
    width: 44px !important;
    height: 44px !important;
    border-radius: 14px !important;
    background: linear-gradient(180deg, #fff, #d5d9e1) !important;
    color: #050608 !important;
    font-size: 12px !important;
    font-weight: 950 !important;
  }
  .brand.brand--home strong,
  body.is-nav-condensed .brand.brand--home strong,
  body:not([data-page="home"]) .brand.brand--home strong {
    color: #fff !important;
    font-size: clamp(22px, 1.55vw, 30px) !important;
    font-weight: 950 !important;
    letter-spacing: -.06em !important;
    text-transform: uppercase !important;
  }
  .brand.brand--home span { display: none !important; }

  .nav {
    justify-self: center !important;
    height: 60px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(22px, 2.7vw, 48px) !important;
    padding: 0 !important;
    overflow: visible !important;
  }
  .nav__item[data-page="home"],
  .nav__item--account { display: none !important; }
  .nav__item,
  body.is-nav-condensed .nav__item,
  body:not([data-page="home"]) .nav__item {
    height: 56px !important;
    min-height: 56px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(245,245,247,.70) !important;
    font-size: clamp(15px, 1.02vw, 18px) !important;
    font-weight: 820 !important;
    letter-spacing: -.025em !important;
    box-shadow: none !important;
  }
  .nav__item svg, .nav__item i, .nav__item::before,
  body.is-nav-condensed .nav__item svg,
  body.is-nav-condensed .nav__item i,
  body:not([data-page="home"]) .nav__item svg,
  body:not([data-page="home"]) .nav__item i { display: none !important; }
  .nav__item:hover,
  .nav__item:focus-visible,
  .nav__item.is-active { color: #fff !important; background: transparent !important; box-shadow: none !important; }
  .nav__item.is-active::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 6px !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: rgba(245,245,247,.96) !important;
  }
  .nav__item--search,
  body.is-nav-condensed .nav__item--search,
  body:not([data-page="home"]) .nav__item--search {
    display: inline-flex !important;
    align-items: center !important;
    gap: 9px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
  }
  .nav__item--search svg,
  .nav__item--search i,
  body.is-nav-condensed .nav__item--search svg,
  body.is-nav-condensed .nav__item--search i,
  body:not([data-page="home"]) .nav__item--search svg,
  body:not([data-page="home"]) .nav__item--search i {
    display: block !important;
    width: 27px !important;
    height: 27px !important;
    opacity: .88 !important;
  }
  .nav__item--search span,
  body.is-nav-condensed .nav__item--search span,
  body:not([data-page="home"]) .nav__item--search span { display: inline !important; }

  .nav-actions {
    justify-self: end !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: clamp(12px, 1.35vw, 22px) !important;
    height: 58px !important;
  }
  .nav-action {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: rgba(245,245,247,.74) !important;
    display: inline-grid !important;
    place-items: center !important;
    padding: 0 !important;
    cursor: pointer !important;
    transition: color .18s ease, background .18s ease, transform .18s ease !important;
  }
  .nav-action:hover,
  .nav-action:focus-visible {
    color: #fff !important;
    background: rgba(255,255,255,.095) !important;
    transform: translateY(-1px) !important;
  }
  .nav-action svg, .nav-action i { width: 24px !important; height: 24px !important; }
  .nav-action span {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
  }
  .nav-action--profile {
    background: rgba(255,255,255,.10) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
  }
  .sidebar__bottom { display:none !important; }
}

@media (max-width: 820px) {
  .nav-actions { display: none !important; }
}

/* v1.0.8 — do not keep hover blur after click/focus */
body[data-page="home"] .media-card.is-clicked .poster-art,
body[data-page="home"] .media-card.is-clicked:hover .poster-art,
body[data-page="home"] .media-card.is-clicked:focus-within .poster-art,
body[data-page="home"] .media-card.is-clicked .media-card__poster.is-image-loaded .poster-art {
  filter: none !important;
  transform: scale(1) !important;
}
body[data-page="home"] .media-card.is-clicked .poster-actions,
body[data-page="home"] .media-card.is-clicked:hover .poster-actions,
body[data-page="home"] .media-card.is-clicked:focus-within .poster-actions {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
body[data-page="home"] .showcase-card.is-clicked .showcase-card__image,
body[data-page="home"] .showcase-card.is-clicked:hover .showcase-card__image,
body[data-page="home"] .showcase-card.is-clicked:focus-within .showcase-card__image {
  filter: none !important;
  transform: none !important;
}
body[data-page="home"] .showcase-card.is-clicked .showcase-card__actions,
body[data-page="home"] .showcase-card.is-clicked:hover .showcase-card__actions,
body[data-page="home"] .showcase-card.is-clicked:focus-within .showcase-card__actions {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

/* v39 — Apple TV filter overlay and simplified menu */
.nav__item[data-type="MOVIE"],
.nav__item[data-type="SERIAL"],
.bottom-nav__item[data-type="MOVIE"],
.bottom-nav__item[data-type="SERIAL"] { display: none !important; }

.nav__item--filter svg,
.nav__item--filter i { display: inline-flex !important; }
.nav__item--filter::before { display: none !important; }

#catalogPage .toolbar { display: none !important; }
#catalogPage .catalog-meta { margin-top: 18px; }

.filter-modal-open { overflow: hidden; }
.filter-overlay {
  position: fixed;
  inset: 0;
  z-index: 260;
  display: grid;
  place-items: start center;
  padding: clamp(16px, 3vw, 42px) 24px;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(34px) saturate(135%);
  -webkit-backdrop-filter: blur(34px) saturate(135%);
  opacity: 1;
  transform: translateY(0);
  transition: opacity .22s ease, transform .22s ease;
}
.filter-overlay.is-hidden {
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10px);
}
.filter-sheet {
  position: relative;
  width: min(1780px, calc(100vw - 48px));
  max-height: min(92vh, 940px);
  overflow: auto;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(23,24,29,.94), rgba(14,15,19,.96));
  box-shadow: 0 40px 120px rgba(0,0,0,.58);
  padding: clamp(28px, 4vw, 58px) clamp(26px, 5vw, 88px) clamp(26px, 4vw, 48px);
  color: #F5F5F7;
}
.filter-sheet::-webkit-scrollbar { width: 0; height: 0; }
.filter-sheet__collapse {
  position: absolute;
  right: 28px;
  top: 22px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.filter-sheet__collapse:hover,
.filter-sheet__collapse:focus-visible { background: rgba(255,255,255,.14); color: #fff; }
.filter-sheet h2 {
  margin: 0 0 50px;
  text-align: center;
  font-size: clamp(38px, 4.2vw, 60px);
  line-height: .95;
  letter-spacing: -.04em;
}
.filter-tabs {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(22px, 3vw, 54px);
  margin-bottom: clamp(38px, 5vw, 72px);
}
.filter-tab {
  min-width: 154px;
  height: 58px;
  padding: 0 34px;
  border-radius: 18px;
  color: rgba(255,255,255,.86);
  background: transparent;
  border: 1px solid transparent;
  font-size: 18px;
  font-weight: 900;
  transition: .18s ease;
}
.filter-tab:hover,
.filter-tab:focus-visible { background: rgba(255,255,255,.08); }
.filter-tab.is-active {
  background: #F5F5F7;
  color: #06070A;
  box-shadow: 0 18px 52px rgba(255,255,255,.13);
}
.filter-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 36px 42px;
}
.filter-field {
  display: grid;
  gap: 12px;
  color: rgba(255,255,255,.74);
  font-size: 16px;
  font-weight: 800;
}
.filter-field select,
.filter-field input {
  width: 100%;
  height: 62px;
  border: 1px solid rgba(255,255,255,.06);
  border-radius: 14px;
  background: rgba(255,255,255,.055);
  color: #F5F5F7;
  padding: 0 20px;
  outline: none;
  font-size: 17px;
  font-weight: 700;
  appearance: auto;
}
.filter-field select:focus,
.filter-field input:focus {
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.09);
  box-shadow: 0 0 0 5px rgba(255,255,255,.055);
}
.filter-field option { background: #15161B; color: #F5F5F7; }
.filter-toggle {
  align-self: end;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-height: 62px;
  color: #F5F5F7;
  font-weight: 900;
}
.filter-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.filter-toggle b {
  position: relative;
  width: 66px;
  height: 36px;
  border-radius: 999px;
  background: rgba(255,255,255,.24);
  border: 1px solid rgba(255,255,255,.12);
  transition: .18s ease;
}
.filter-toggle b::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 3px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #F5F5F7;
  transition: .18s ease;
}
.filter-toggle input:checked + b { background: #F5F5F7; }
.filter-toggle input:checked + b::after { transform: translateX(30px); background: #07080B; }
.filter-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  gap: 16px;
  padding-top: 36px;
}
.filter-btn {
  min-width: 230px;
  height: 58px;
  padding: 0 28px;
  border-radius: 14px;
  font-weight: 950;
  font-size: 17px;
  border: 1px solid rgba(255,255,255,.08);
}
.filter-btn--ghost { background: rgba(255,255,255,.06); color: #F5F5F7; }
.filter-btn--primary { background: #F5F5F7; color: #06070A; }
.filter-btn:hover,
.filter-btn:focus-visible { transform: translateY(-1px); filter: brightness(1.05); }

@media (max-width: 900px) {
  .filter-overlay { padding: 10px; place-items: stretch; }
  .filter-sheet { width: 100%; max-height: calc(100vh - 20px); padding: 28px 18px 24px; border-radius: 22px; }
  .filter-sheet h2 { font-size: 40px; margin-bottom: 28px; }
  .filter-tabs { gap: 8px; margin-bottom: 26px; }
  .filter-tab { min-width: 0; flex: 1; height: 52px; padding: 0 12px; }
  .filter-form { grid-template-columns: 1fr; gap: 20px; }
  .filter-actions { flex-direction: column; padding-top: 20px; }
  .filter-btn { width: 100%; }
}

/* v1.0.10 — Apple TV boot loader for KINOLOT */
body.is-booting .app-shell,
body.is-booting .bottom-nav,
body.is-booting .mode-fab,
body.is-booting .drawer {
  visibility: hidden;
}
.boot-loader {
  position: fixed;
  inset: 0;
  z-index: 5000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.08), transparent 22rem),
    radial-gradient(circle at 30% 64%, rgba(255,185,0,.07), transparent 18rem),
    linear-gradient(180deg, #000 0%, #030303 48%, #000 100%);
  color: #F5F5F7;
  opacity: 1;
  transition: opacity .48s ease, visibility .48s ease;
}
.boot-loader::before {
  content: "";
  position: absolute;
  inset: -20%;
  background:
    linear-gradient(110deg, transparent 0%, rgba(255,255,255,.035) 45%, transparent 58%),
    radial-gradient(circle at 70% 30%, rgba(255,255,255,.06), transparent 26rem);
  filter: blur(1px);
  transform: translate3d(-12%, 0, 0);
  animation: bootAurora 3.8s ease-in-out infinite alternate;
}
.boot-loader__glow {
  position: absolute;
  width: min(720px, 70vw);
  height: min(360px, 42vh);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.12), rgba(255,190,0,.055) 34%, transparent 72%);
  filter: blur(48px);
  opacity: .78;
}
.boot-loader__card {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: 28px;
  text-align: center;
  transform: translateY(-1.5vh);
}
.boot-logo {
  display: inline-flex;
  align-items: center;
  gap: 24px;
  letter-spacing: -.065em;
  text-shadow: 0 24px 90px rgba(0,0,0,.9);
}
.boot-logo__mark {
  width: clamp(58px, 6vw, 86px);
  height: clamp(58px, 6vw, 86px);
  display: grid;
  place-items: center;
  border-radius: clamp(18px, 2vw, 26px);
  background: linear-gradient(180deg, #ffffff 0%, #dadddf 100%);
  color: #050506;
  font-size: clamp(17px, 1.55vw, 24px);
  font-weight: 950;
  letter-spacing: -.05em;
  box-shadow:
    0 32px 90px rgba(255,255,255,.10),
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -16px 30px rgba(0,0,0,.08);
}
.boot-logo strong {
  font-size: clamp(52px, 7.2vw, 96px);
  line-height: .86;
  font-weight: 950;
  color: #fff;
}
.boot-loader p {
  margin: 0;
  color: rgba(245,245,247,.58);
  font-size: clamp(18px, 1.55vw, 26px);
  font-weight: 760;
  letter-spacing: -.025em;
}
.boot-loader__line {
  width: min(340px, 44vw);
  height: 3px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
}
.boot-loader__line span {
  display: block;
  width: 45%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, #fff, #ffbd00, transparent);
  animation: bootLine 1.08s ease-in-out infinite;
}
.boot-loader.is-hiding {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
@keyframes bootLine {
  from { transform: translateX(-115%); }
  to { transform: translateX(255%); }
}
@keyframes bootAurora {
  from { transform: translate3d(-10%, -2%, 0) scale(1); opacity: .62; }
  to { transform: translate3d(10%, 2%, 0) scale(1.05); opacity: .95; }
}
@media (max-width: 640px) {
  .boot-logo { gap: 15px; }
  .boot-logo strong { font-size: clamp(40px, 13vw, 58px); }
  .boot-loader__line { width: min(280px, 64vw); }
}
@media (prefers-reduced-motion: reduce) {
  .boot-loader::before,
  .boot-loader__line span { animation: none; }
}

/* v41: clean Apple TV authorization page */
body[data-page="login"] .topbar,
body[data-page="login"] .account-panels,
body[data-page="login"] .auth-close,
body[data-page="login"] .auth-visual-side,
body[data-page="login"] .auth-social,
body[data-page="login"] .auth-support,
body[data-page="login"] .auth-agree {
  display: none !important;
}

body[data-page="login"] .content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.11), transparent 28rem),
    radial-gradient(circle at 18% 72%, rgba(112,120,140,.16), transparent 24rem),
    radial-gradient(circle at 84% 48%, rgba(255,255,255,.07), transparent 30rem),
    #000 !important;
}

body[data-page="login"] #notice {
  position: fixed !important;
  left: 50% !important;
  top: 92px !important;
  transform: translateX(-50%) !important;
  z-index: 60 !important;
  width: min(620px, calc(100vw - 42px)) !important;
}

.auth-page.is-active {
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
}

.auth-modal-page.auth-modal-page--clean {
  position: relative !important;
  width: 100% !important;
  min-height: 100vh !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(96px, 13vh, 150px) clamp(18px, 4vw, 54px) 54px !important;
  overflow: hidden !important;
}

.auth-modal-page.auth-modal-page--clean::before {
  content: "" !important;
  position: fixed !important;
  inset: -18% !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 24%, rgba(255,255,255,.18), transparent 15rem),
    radial-gradient(circle at 50% 72%, rgba(120,128,148,.12), transparent 24rem),
    linear-gradient(180deg, rgba(255,255,255,.035), transparent 36%) !important;
  filter: blur(18px) !important;
  opacity: .95 !important;
}

.auth-modal-card.auth-modal-card--clean {
  position: relative !important;
  z-index: 1 !important;
  width: min(540px, 100%) !important;
  min-height: auto !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 24px !important;
  overflow: hidden !important;
  padding: clamp(24px, 3vw, 34px) !important;
  border-radius: 36px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.145), rgba(255,255,255,.055)),
    rgba(18,19,23,.70) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow:
    0 44px 140px rgba(0,0,0,.82),
    inset 0 1px 0 rgba(255,255,255,.18) !important;
  backdrop-filter: blur(44px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(44px) saturate(135%) !important;
}

.auth-card-glow {
  position: absolute !important;
  inset: -2px !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.22), transparent 15rem),
    radial-gradient(circle at 100% 100%, rgba(255,255,255,.08), transparent 16rem) !important;
  opacity: .88 !important;
}

.auth-brand-head {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  margin-top: 4px !important;
  color: #F5F5F7 !important;
  font-size: 30px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.055em !important;
}

.auth-brand-mark {
  width: 54px !important;
  height: 54px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 18px !important;
  background: linear-gradient(180deg, #FFFFFF, #D9DEE8) !important;
  color: #050507 !important;
  font-size: 14px !important;
  font-weight: 1000 !important;
  letter-spacing: -.04em !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.80), 0 14px 44px rgba(0,0,0,.36) !important;
}

.auth-modal-card--clean .auth-tabs {
  width: 100% !important;
  height: 54px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 6px !important;
  padding: 6px !important;
  margin: 0 !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.auth-modal-card--clean .auth-tab {
  height: 42px !important;
  border: 0 !important;
  border-radius: 13px !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(245,245,247,.68) !important;
  background: transparent !important;
  font-weight: 900 !important;
  font-size: 14px !important;
  letter-spacing: -.01em !important;
  transition: transform .18s ease, background .18s ease, color .18s ease, box-shadow .18s ease !important;
}

.auth-modal-card--clean .auth-tab:hover,
.auth-modal-card--clean .auth-tab:focus-visible {
  color: #F5F5F7 !important;
  transform: translateY(-1px) !important;
}

.auth-modal-card--clean .auth-tab.is-active {
  background: #F5F5F7 !important;
  color: #060607 !important;
  box-shadow: 0 10px 32px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.75) !important;
}

.auth-form-side.auth-form-side--clean {
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
}

.auth-modal-card--clean .auth-form {
  width: 100% !important;
  gap: 14px !important;
  animation: authFade .22s ease both !important;
}

.auth-modal-card--clean .auth-form h2 {
  margin: 0 !important;
  color: #F5F5F7 !important;
  text-align: center !important;
  font-size: clamp(30px, 3.4vw, 44px) !important;
  line-height: 1.04 !important;
  font-weight: 920 !important;
  letter-spacing: -.065em !important;
}

.auth-subtitle {
  margin: -2px auto 8px !important;
  width: min(390px, 100%) !important;
  color: rgba(245,245,247,.58) !important;
  text-align: center !important;
  font-size: 14px !important;
  line-height: 1.48 !important;
  font-weight: 650 !important;
}

.auth-modal-card--clean .auth-field {
  position: relative !important;
  display: grid !important;
  gap: 7px !important;
}

.auth-modal-card--clean .auth-field span {
  display: none !important;
}

.auth-modal-card--clean .auth-field .input,
.auth-modal-card--clean .auth-form .input {
  width: 100% !important;
  height: 60px !important;
  min-height: 60px !important;
  padding: 0 20px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  background: rgba(255,255,255,.075) !important;
  color: #F5F5F7 !important;
  font-size: 16px !important;
  font-weight: 760 !important;
  outline: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  transition: background .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

.auth-modal-card--clean .auth-field .input::placeholder,
.auth-modal-card--clean .auth-form .input::placeholder {
  color: rgba(245,245,247,.44) !important;
}

.auth-modal-card--clean .auth-field .input:focus,
.auth-modal-card--clean .auth-form .input:focus {
  background: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.42) !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.105), inset 0 1px 0 rgba(255,255,255,.12) !important;
  transform: translateY(-1px) !important;
}

.auth-modal-card--clean .auth-submit {
  width: 100% !important;
  height: 62px !important;
  margin-top: 6px !important;
  border: 0 !important;
  border-radius: 19px !important;
  background: linear-gradient(180deg, #FFFFFF, #DDE3EC) !important;
  color: #050507 !important;
  font-size: 17px !important;
  font-weight: 1000 !important;
  letter-spacing: -.015em !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.82) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.auth-modal-card--clean .auth-submit:hover,
.auth-modal-card--clean .auth-submit:focus-visible {
  transform: translateY(-2px) scale(1.012) !important;
  filter: brightness(1.03) !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.64), 0 0 0 4px rgba(255,255,255,.10), inset 0 1px 0 rgba(255,255,255,.88) !important;
}

.auth-modal-card--clean .auth-help-row {
  margin-top: 4px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 7px !important;
  color: rgba(245,245,247,.52) !important;
  font-size: 14px !important;
  font-weight: 720 !important;
}

.auth-modal-card--clean .auth-help-row button {
  border: 0 !important;
  background: transparent !important;
  color: #F5F5F7 !important;
  font-size: 14px !important;
  font-weight: 920 !important;
  padding: 0 !important;
  text-decoration: none !important;
}

.auth-modal-card--clean .auth-help-row button:hover,
.auth-modal-card--clean .auth-help-row button:focus-visible {
  opacity: .78 !important;
}

@keyframes authFade {
  from { opacity: 0; transform: translateY(10px) scale(.988); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 820px) {
  body[data-page="login"] .content {
    padding: 0 !important;
    min-height: 100svh !important;
  }
  .auth-modal-page.auth-modal-page--clean {
    min-height: 100svh !important;
    padding: 90px 14px 34px !important;
  }
  .auth-modal-card.auth-modal-card--clean {
    width: min(460px, 100%) !important;
    border-radius: 28px !important;
    padding: 20px !important;
    gap: 18px !important;
  }
  .auth-brand-head {
    font-size: 24px !important;
  }
  .auth-brand-mark {
    width: 46px !important;
    height: 46px !important;
    border-radius: 15px !important;
  }
  .auth-modal-card--clean .auth-form h2 {
    font-size: 30px !important;
  }
  .auth-subtitle {
    font-size: 13px !important;
  }
  .auth-modal-card--clean .auth-field .input,
  .auth-modal-card--clean .auth-form .input,
  .auth-modal-card--clean .auth-submit {
    height: 56px !important;
    min-height: 56px !important;
    border-radius: 16px !important;
  }
}

/* v41 strict auth screen: no catalog chrome around the form */
body[data-page="login"] .sidebar,
body[data-page="login"] .bottom-nav {
  display: none !important;
}
body[data-page="login"] .app-shell {
  display: block !important;
  min-height: 100vh !important;
  background: #000 !important;
}
body[data-page="login"] .content {
  width: 100% !important;
  height: 100vh !important;
  min-height: 100vh !important;
  overflow: hidden auto !important;
}

/* v42: compact Apple TV auth screen, no page scroll, back action */
html:has(body[data-page="login"]),
body[data-page="login"] {
  height: 100dvh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
}

body[data-page="login"] .content {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  padding: 0 !important;
  overflow: hidden !important;
  scrollbar-width: none !important;
}

body[data-page="login"] .content::-webkit-scrollbar {
  display: none !important;
}

body[data-page="login"] #loginPage.auth-page.is-active {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
}

body[data-page="login"] .auth-modal-page.auth-modal-page--clean {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  padding: clamp(18px, 4vh, 38px) 18px !important;
  overflow: hidden !important;
  align-items: center !important;
}

body[data-page="login"] .auth-modal-card.auth-modal-card--clean {
  width: min(430px, calc(100vw - 32px)) !important;
  max-height: calc(100dvh - 36px) !important;
  padding: 22px !important;
  gap: 15px !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  transform: translateZ(0) !important;
}

.auth-back-btn {
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  z-index: 3 !important;
  height: 38px !important;
  min-width: 38px !important;
  padding: 0 12px 0 9px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.075) !important;
  color: rgba(245,245,247,.82) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  letter-spacing: -.015em !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease !important;
}

.auth-back-btn svg,
.auth-back-btn i {
  width: 17px !important;
  height: 17px !important;
}

.auth-back-btn:hover,
.auth-back-btn:focus-visible {
  transform: translateY(-1px) scale(1.025) !important;
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.22) !important;
  color: #fff !important;
}

body[data-page="login"] .auth-brand-head {
  margin-top: 2px !important;
  gap: 11px !important;
  font-size: 25px !important;
}

body[data-page="login"] .auth-brand-mark {
  width: 46px !important;
  height: 46px !important;
  border-radius: 15px !important;
  font-size: 12px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-tabs {
  height: 48px !important;
  padding: 5px !important;
  border-radius: 16px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-tab {
  height: 38px !important;
  border-radius: 12px !important;
  font-size: 13px !important;
}

body[data-page="login"] .auth-form-side.auth-form-side--clean {
  min-height: 0 !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-form {
  gap: 10px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-form h2 {
  font-size: clamp(26px, 3vw, 34px) !important;
  line-height: 1.02 !important;
}

body[data-page="login"] .auth-subtitle {
  margin: -1px auto 5px !important;
  width: min(340px, 100%) !important;
  font-size: 12.5px !important;
  line-height: 1.36 !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-field .input,
body[data-page="login"] .auth-modal-card--clean .auth-form .input {
  height: 52px !important;
  min-height: 52px !important;
  padding: 0 16px !important;
  border-radius: 16px !important;
  font-size: 14px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-submit {
  height: 54px !important;
  min-height: 54px !important;
  margin-top: 4px !important;
  border-radius: 17px !important;
  font-size: 15px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-help-row {
  margin-top: 2px !important;
  font-size: 12.5px !important;
}

body[data-page="login"] .auth-modal-card--clean .auth-help-row button {
  font-size: 12.5px !important;
}

@media (max-width: 520px) {
  .auth-back-btn span { display: none !important; }
  .auth-back-btn { padding: 0 !important; }
  body[data-page="login"] .auth-modal-card.auth-modal-card--clean {
    width: min(390px, calc(100vw - 24px)) !important;
    padding: 18px !important;
    gap: 13px !important;
    border-radius: 24px !important;
  }
  body[data-page="login"] .auth-brand-head {
    font-size: 22px !important;
  }
  body[data-page="login"] .auth-brand-mark {
    width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
  }
}

/* v43: separate profile page, login remains isolated at /login/ */
.profile-page.is-active {
  display: block !important;
}

.profile-layout {
  width: min(1320px, 100%);
  margin: 0 auto;
  display: grid;
  gap: 18px;
}

.profile-hero-card {
  position: relative;
  min-height: 330px;
  overflow: hidden;
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr);
  align-items: center;
  gap: clamp(22px, 4vw, 54px);
  padding: clamp(28px, 5vw, 64px);
  border: 1px solid rgba(255,255,255,.115);
  border-radius: 38px;
  background:
    radial-gradient(circle at 18% 10%, rgba(255,255,255,.18), transparent 21rem),
    radial-gradient(circle at 82% 86%, rgba(150,158,180,.10), transparent 24rem),
    linear-gradient(135deg, rgba(255,255,255,.105), rgba(255,255,255,.035)),
    rgba(13,14,18,.82);
  box-shadow: 0 38px 120px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14);
  backdrop-filter: blur(34px) saturate(130%);
  -webkit-backdrop-filter: blur(34px) saturate(130%);
}

.profile-hero-card__glow {
  position: absolute;
  inset: -35%;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 20%, rgba(245,245,247,.18), transparent 17rem),
    radial-gradient(circle at 78% 58%, rgba(245,245,247,.08), transparent 20rem);
  filter: blur(24px);
  opacity: .9;
}

.profile-avatar-xl {
  position: relative;
  z-index: 1;
  width: clamp(104px, 10vw, 150px);
  height: clamp(104px, 10vw, 150px);
  display: grid;
  place-items: center;
  border-radius: 38px;
  background: linear-gradient(180deg, #FFFFFF, #DDE3EC);
  color: #050507;
  font-size: clamp(24px, 3vw, 38px);
  font-weight: 1000;
  letter-spacing: -.055em;
  box-shadow: 0 28px 90px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.82);
}

.profile-hero-card__main {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.profile-hero-card h2 {
  margin: 2px 0 16px;
  color: #F5F5F7;
  font-size: clamp(42px, 6vw, 82px);
  line-height: .96;
  font-weight: 950;
  letter-spacing: -.075em;
}

.profile-card-mini {
  display: grid;
  gap: 5px;
  width: min(520px, 100%);
  padding: 16px 18px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.062);
  color: rgba(245,245,247,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.profile-card-mini b {
  color: #F5F5F7;
  font-size: 18px;
  letter-spacing: -.02em;
}

.profile-card-mini span {
  color: rgba(245,245,247,.56);
  font-size: 14px;
  font-weight: 680;
}

.profile-actions-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.profile-stats-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.profile-panel {
  min-height: 220px;
  padding: 24px;
  border: 1px solid rgba(255,255,255,.095);
  border-radius: 30px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.026)),
    rgba(13,14,18,.78);
  box-shadow: 0 24px 80px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08);
}

.profile-panel--wide {
  grid-column: 1 / -1;
}

.profile-panel__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  color: #F5F5F7;
}

.profile-panel__head svg,
.profile-panel__head i {
  width: 22px;
  height: 22px;
  color: rgba(245,245,247,.82);
}

.profile-panel__head h3 {
  margin: 0;
  font-size: 22px;
  line-height: 1.05;
  font-weight: 920;
  letter-spacing: -.04em;
}

.profile-list {
  display: grid;
  gap: 10px;
  color: rgba(245,245,247,.55);
  font-weight: 680;
}

.profile-list .mini-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(255,255,255,.044);
}

.profile-list .mini-row b {
  color: #F5F5F7;
  font-size: 14px;
}

.profile-list .mini-row .btn {
  min-height: 36px;
  padding: 0 13px;
  border-radius: 999px;
}

@media (max-width: 820px) {
  .profile-hero-card {
    grid-template-columns: 1fr;
    min-height: auto;
    border-radius: 30px;
    padding: 26px;
  }
  .profile-avatar-xl {
    width: 92px;
    height: 92px;
    border-radius: 28px;
  }
  .profile-hero-card h2 {
    font-size: 44px;
  }
  .profile-stats-grid {
    grid-template-columns: 1fr;
  }
}

/* v44: premium Apple TV profile redesign */
body[data-page="account"] .content {
  background:
    radial-gradient(circle at 76% 8%, rgba(255,255,255,.07), transparent 26rem),
    radial-gradient(circle at 18% 24%, rgba(120,128,150,.11), transparent 28rem),
    linear-gradient(180deg, rgba(255,255,255,.015), transparent 26rem);
}

.profile-page.is-active {
  display: block !important;
}

.profile-studio {
  width: min(1360px, calc(100vw - 92px));
  margin: 0 auto;
  display: grid;
  gap: 18px;
}

.profile-cover {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  padding: clamp(22px, 3vw, 34px);
  border-radius: 44px;
  border: 1px solid rgba(255,255,255,.13);
  background:
    radial-gradient(circle at 18% 10%, rgba(255,255,255,.20), transparent 18rem),
    radial-gradient(circle at 88% 72%, rgba(135,141,154,.16), transparent 26rem),
    linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.046) 48%, rgba(255,255,255,.02)),
    rgba(12,13,17,.84);
  box-shadow:
    0 42px 120px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(255,255,255,.055);
  backdrop-filter: blur(42px) saturate(135%);
  -webkit-backdrop-filter: blur(42px) saturate(135%);
  isolation: isolate;
}

.profile-cover__aurora,
.profile-cover__noise {
  position: absolute;
  pointer-events: none;
  inset: 0;
}

.profile-cover__aurora {
  z-index: -2;
  background:
    radial-gradient(circle at 10% 16%, rgba(245,245,247,.16), transparent 20rem),
    radial-gradient(circle at 50% -20%, rgba(255,255,255,.12), transparent 18rem),
    radial-gradient(circle at 96% 36%, rgba(255,255,255,.055), transparent 28rem);
  filter: blur(4px);
}

.profile-cover__noise {
  z-index: -1;
  opacity: .18;
  background-image: linear-gradient(115deg, transparent 0 44%, rgba(255,255,255,.10) 45%, transparent 56% 100%);
  transform: translateX(-28%);
}

.profile-cover__top {
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: clamp(22px, 3vw, 42px);
}

.profile-back,
.profile-exit {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.075);
  color: rgba(245,245,247,.86);
  font-weight: 900;
  letter-spacing: -.02em;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 38px rgba(0,0,0,.26);
  transition: transform .2s ease, background .2s ease, color .2s ease;
}

.profile-back:hover,
.profile-exit:hover,
.profile-back:focus-visible,
.profile-exit:focus-visible {
  transform: translateY(-1px) scale(1.018);
  background: rgba(255,255,255,.16);
  color: #fff;
}

.profile-back svg,
.profile-exit svg,
.profile-back i,
.profile-exit i { width: 18px; height: 18px; }

.profile-exit {
  background: rgba(255,255,255,.055);
  color: rgba(245,245,247,.72);
}

.profile-cover__body {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(128px, 168px) minmax(0, 1fr) minmax(260px, 330px);
  align-items: center;
  gap: clamp(22px, 4vw, 54px);
}

.profile-avatar-stage {
  position: relative;
  width: fit-content;
}

.profile-avatar-premium {
  width: clamp(118px, 12vw, 164px);
  height: clamp(118px, 12vw, 164px);
  display: grid;
  place-items: center;
  border-radius: 42px;
  background:
    radial-gradient(circle at 35% 20%, #FFFFFF, #F2F5FA 34%, #CFD6E1 100%);
  color: #050507;
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.075em;
  box-shadow:
    0 34px 110px rgba(0,0,0,.58),
    inset 0 1px 0 rgba(255,255,255,.94),
    inset 0 -18px 42px rgba(20,24,32,.10);
}

.profile-avatar-badge {
  position: absolute;
  right: -8px;
  bottom: -8px;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(18,19,24,.78);
  color: #fff;
  box-shadow: 0 18px 42px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.profile-avatar-badge svg,
.profile-avatar-badge i { width: 18px; height: 18px; }

.profile-identity {
  min-width: 0;
}

.profile-kicker {
  margin: 0 0 10px;
  color: rgba(245,245,247,.52);
  font-size: 12px;
  font-weight: 1000;
  letter-spacing: .34em;
  text-transform: uppercase;
}

.profile-identity h2 {
  margin: 0;
  color: #F5F5F7;
  font-size: clamp(48px, 7vw, 92px);
  line-height: .88;
  font-weight: 1000;
  letter-spacing: -.085em;
  text-shadow: 0 24px 80px rgba(0,0,0,.42);
  max-width: 760px;
  overflow-wrap: anywhere;
}

.profile-card-mini--premium {
  width: min(580px, 100%);
  min-height: 70px;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 18px;
  padding: 13px 14px 13px 18px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(255,255,255,.115) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.045)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 52px rgba(0,0,0,.25) !important;
}

.profile-card-mini--premium b {
  display: block;
  color: #F5F5F7 !important;
  font-size: 16px !important;
  font-weight: 900;
  letter-spacing: -.025em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-card-mini--premium span {
  color: rgba(245,245,247,.56) !important;
  font-size: 13px !important;
  font-weight: 760;
}

.profile-card-mini__status {
  flex: 0 0 auto;
  min-height: 34px;
  display: inline-grid;
  place-items: center;
  padding: 0 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #07080B !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  letter-spacing: -.02em;
}

.profile-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.profile-metric {
  min-width: 116px;
  padding: 12px 14px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.056);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}

.profile-metric strong {
  display: block;
  color: #fff;
  font-size: 24px;
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.05em;
}

.profile-metric span {
  display: block;
  margin-top: 5px;
  color: rgba(245,245,247,.52);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.profile-side-card {
  min-height: 210px;
  padding: 22px;
  border-radius: 30px;
  border: 1px solid rgba(255,255,255,.115);
  background:
    linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.045)),
    rgba(8,9,12,.44);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 26px 70px rgba(0,0,0,.28);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.profile-side-card__icon {
  width: 50px;
  height: 50px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  color: #08090C;
}

.profile-side-card__icon svg,
.profile-side-card__icon i { width: 22px; height: 22px; }

.profile-side-card p {
  margin: 0 0 5px;
  color: rgba(245,245,247,.50);
  font-weight: 900;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-size: 11px;
}

.profile-side-card strong {
  display: block;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.055em;
}

.profile-side-card span {
  display: block;
  margin-top: 12px;
  color: rgba(245,245,247,.58);
  font-size: 14px;
  line-height: 1.45;
  font-weight: 700;
}

.profile-dashboard {
  display: grid;
  grid-template-columns: minmax(360px, 1.22fr) minmax(260px, .9fr) minmax(260px, .9fr);
  grid-auto-rows: minmax(224px, auto);
  gap: 18px;
}

.profile-panel {
  position: relative;
  overflow: hidden;
  min-height: 224px !important;
  padding: 22px !important;
  border-radius: 32px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.08), transparent 17rem),
    linear-gradient(180deg, rgba(255,255,255,.062), rgba(255,255,255,.027)),
    rgba(11,12,16,.82) !important;
  box-shadow: 0 26px 84px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.09) !important;
  backdrop-filter: blur(28px) saturate(120%);
  -webkit-backdrop-filter: blur(28px) saturate(120%);
}

.profile-panel--continue {
  grid-row: span 2;
  min-height: 466px !important;
}

.profile-panel--compact {
  min-height: 224px !important;
}

.profile-panel__head {
  display: flex !important;
  align-items: flex-start !important;
  gap: 13px !important;
  margin-bottom: 18px !important;
  color: #F5F5F7 !important;
}

.profile-panel__icon {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.095);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}

.profile-panel__icon svg,
.profile-panel__icon i {
  width: 20px !important;
  height: 20px !important;
  color: rgba(245,245,247,.9) !important;
}

.profile-panel__head h3 {
  margin: 1px 0 4px !important;
  color: #F5F5F7;
  font-size: 24px !important;
  line-height: .96 !important;
  font-weight: 1000 !important;
  letter-spacing: -.055em !important;
}

.profile-panel__head p {
  margin: 0;
  color: rgba(245,245,247,.48);
  font-size: 13px;
  line-height: 1.35;
  font-weight: 720;
}

.profile-list {
  display: grid !important;
  gap: 10px !important;
  color: rgba(245,245,247,.58) !important;
  font-weight: 760 !important;
}

.profile-list--poster {
  gap: 12px !important;
}

.profile-media-row {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  padding: 9px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.075);
  background: rgba(255,255,255,.045);
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.profile-media-row:hover,
.profile-media-row:focus-within {
  transform: translateY(-1px);
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.082);
}

.profile-media-row__poster {
  width: 68px;
  height: 86px;
  display: grid;
  place-items: center;
  overflow: hidden;
  border-radius: 16px;
  background:
    radial-gradient(circle at 35% 20%, rgba(255,255,255,.18), transparent 56%),
    linear-gradient(145deg, #20222B, #0E0F14);
  background-size: cover;
  background-position: center;
  color: rgba(245,245,247,.62);
  font-weight: 1000;
  box-shadow: 0 16px 36px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.10);
}

.profile-media-row__body {
  min-width: 0;
  display: grid;
  gap: 5px;
}

.profile-media-row__body b {
  color: #F5F5F7 !important;
  font-size: 15px !important;
  line-height: 1.14;
  font-weight: 930;
  letter-spacing: -.03em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-media-row__body small {
  color: rgba(245,245,247,.45);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 760;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-media-row__open {
  min-height: 36px;
  padding: 0 13px;
  border-radius: 999px;
  background: rgba(255,255,255,.92);
  color: #08090C;
  font-size: 13px;
  font-weight: 1000;
  letter-spacing: -.025em;
  box-shadow: 0 12px 26px rgba(0,0,0,.22);
}

.profile-media-row__open:hover,
.profile-media-row__open:focus-visible {
  background: #fff;
  transform: scale(1.025);
}

.profile-progress-bar {
  width: min(220px, 100%);
  height: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
}

.profile-progress-bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #F5F5F7, rgba(245,245,247,.42));
}

.profile-empty-state {
  min-height: 124px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  padding: 22px;
  border-radius: 22px;
  border: 1px dashed rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  text-align: center;
}

.profile-empty-state span {
  width: 36px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
}

.profile-empty-state b {
  color: rgba(245,245,247,.78);
  font-size: 14px;
  font-weight: 900;
}

.profile-empty-state small {
  max-width: 260px;
  color: rgba(245,245,247,.42);
  font-size: 12px;
  line-height: 1.35;
}

.profile-chip-card,
.profile-device-row {
  display: grid;
  grid-template-columns: 44px minmax(0,1fr);
  align-items: center;
  gap: 12px;
  padding: 11px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.075);
  background: rgba(255,255,255,.043);
}

.profile-chip-card > span,
.profile-device-row__icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: rgba(255,255,255,.90);
  color: #07080B;
  font-weight: 1000;
  letter-spacing: -.05em;
}

.profile-chip-card.is-default {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.075);
}

.profile-chip-card b,
.profile-device-row b {
  display: block;
  color: #F5F5F7;
  font-size: 14px;
  line-height: 1.1;
  font-weight: 930;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-chip-card small,
.profile-device-row small {
  display: block;
  margin-top: 4px;
  color: rgba(245,245,247,.43);
  font-size: 12px;
  line-height: 1.2;
  font-weight: 730;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-device-row__icon svg,
.profile-device-row__icon i { width: 18px; height: 18px; }

.profile-skeleton-line {
  height: 62px;
  border-radius: 20px;
  background: linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.10), rgba(255,255,255,.04));
  background-size: 240% 100%;
  animation: profileSkeleton 1.25s ease-in-out infinite;
}

.profile-skeleton-line--short { width: 68%; }

@keyframes profileSkeleton {
  0% { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

@media (max-width: 1180px) {
  .profile-studio { width: min(100%, calc(100vw - 40px)); }
  .profile-cover__body { grid-template-columns: 130px minmax(0,1fr); }
  .profile-side-card { grid-column: 1 / -1; min-height: auto; }
  .profile-dashboard { grid-template-columns: 1fr 1fr; }
  .profile-panel--continue { grid-column: 1 / -1; min-height: 360px !important; }
}

@media (max-width: 760px) {
  .profile-studio { width: 100%; }
  .profile-cover { border-radius: 30px; padding: 18px; }
  .profile-cover__body { grid-template-columns: 1fr; gap: 20px; }
  .profile-avatar-premium { width: 104px; height: 104px; border-radius: 30px; font-size: 30px; }
  .profile-identity h2 { font-size: 46px; }
  .profile-card-mini--premium { flex-direction: column; align-items: flex-start; }
  .profile-dashboard { grid-template-columns: 1fr; }
  .profile-panel--continue { grid-column: auto; }
  .profile-media-row { grid-template-columns: 58px minmax(0,1fr); }
  .profile-media-row__poster { width: 58px; height: 76px; border-radius: 14px; }
  .profile-media-row__open { grid-column: 1 / -1; width: 100%; }
}

/* v45: TVOE-like profile dashboard in KINOLOT colors */
:root {
  --kl-bg: #06060A;
  --kl-section: #10111A;
  --kl-card: #171927;
  --kl-card-2: #1D2030;
  --kl-border: #262A3D;
  --kl-text: #F4F4F8;
  --kl-muted: #A7AEC0;
  --kl-primary: #7C5CFF;
  --kl-secondary: #A855F7;
  --kl-accent: #22D3EE;
}

body[data-page="account"] {
  background:
    radial-gradient(circle at 17% 10%, rgba(124,92,255,.16), transparent 34rem),
    radial-gradient(circle at 88% 28%, rgba(34,211,238,.09), transparent 30rem),
    var(--kl-bg) !important;
}

body[data-page="account"] .topbar {
  display: none !important;
}

.profile-page--account.is-active {
  display: block !important;
}

.profile-office {
  width: min(1420px, calc(100vw - 116px));
  margin: clamp(18px, 2.8vw, 42px) auto 0;
  padding-bottom: 72px;
}

.profile-office__head {
  display: flex;
  align-items: center;
  gap: 18px;
  margin: 0 0 24px;
}

.profile-office__head h2 {
  margin: 2px 0 0;
  color: var(--kl-text);
  font-size: clamp(34px, 4vw, 58px);
  line-height: .95;
  font-weight: 1000;
  letter-spacing: -.07em;
}

.profile-office__back,
.profile-logout-wide,
.profile-edit-btn,
.profile-id-copy button,
.profile-edit-card__head button {
  appearance: none;
  border: 0;
  cursor: pointer;
  font-family: inherit;
}

.profile-office__back {
  height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 17px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  color: var(--kl-text);
  border: 1px solid rgba(255,255,255,.10);
  font-weight: 900;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.profile-office__back:hover,
.profile-office__back:focus-visible {
  transform: translateY(-1px);
  background: rgba(124,92,255,.18);
  border-color: rgba(124,92,255,.45);
}

.profile-office__back svg,
.profile-office__back i { width: 18px; height: 18px; }

.profile-office-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 20px;
}

.profile-tile,
.profile-content-card {
  position: relative;
  overflow: hidden;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at 12% 0%, rgba(124,92,255,.15), transparent 22rem),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)),
    var(--kl-card) !important;
  box-shadow: 0 30px 110px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}

.profile-tile::before,
.profile-content-card::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(135deg, rgba(255,255,255,.09), transparent 32%, rgba(34,211,238,.05));
  opacity: .65;
}

.profile-tile > *,
.profile-content-card > * { position: relative; z-index: 1; }

.profile-tile {
  min-height: 190px;
  padding: 25px;
}

.profile-tile--personal { grid-column: span 8; }
.profile-tile--subscription { grid-column: span 4; }
.profile-tile--small { grid-column: span 4; min-height: 190px; }
.profile-tile--social { grid-column: span 8; min-height: 190px; display: flex; align-items: center; justify-content: space-between; }

.profile-tile h3,
.profile-content-card h3,
.profile-edit-card h3 {
  margin: 0;
  color: var(--kl-text);
  font-size: clamp(20px, 1.8vw, 28px);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.05em;
}

.profile-tile p,
.profile-tile small,
.profile-content-card p,
.profile-personal-main span,
.profile-personal-main small {
  color: var(--kl-muted);
  font-weight: 750;
}

.profile-tile__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}

.profile-id-copy {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(167,174,192,.64);
  font-size: 14px;
  font-weight: 760;
}

.profile-id-copy span {
  max-width: min(420px, 36vw);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.profile-id-copy b { color: rgba(244,244,248,.72); font-weight: 800; }

.profile-id-copy button {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 11px;
  color: var(--kl-text);
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
}

.profile-id-copy button:hover,
.profile-id-copy button:focus-visible {
  background: rgba(34,211,238,.16);
  border-color: rgba(34,211,238,.42);
}

.profile-id-copy svg,
.profile-id-copy i { width: 16px; height: 16px; }

.profile-personal-row {
  display: flex;
  align-items: center;
  gap: 22px;
}

.profile-avatar-control {
  flex: 0 0 auto;
  width: 84px;
  height: 84px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 10%, rgba(255,255,255,.95), rgba(244,244,248,.78)),
    linear-gradient(135deg, var(--kl-primary), var(--kl-accent));
  background-size: cover;
  background-position: center;
  color: #07070B;
  font-size: 26px;
  font-weight: 1000;
  letter-spacing: -.06em;
  box-shadow: 0 24px 80px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.45) inset;
}

.profile-avatar-control.has-image {
  color: transparent;
  background-color: #11131c;
}

.profile-personal-main {
  min-width: 0;
  display: grid;
  gap: 6px;
  margin-right: auto;
}

.profile-personal-main strong {
  max-width: 640px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--kl-text);
  font-size: clamp(28px, 4vw, 58px);
  line-height: .92;
  font-weight: 1000;
  letter-spacing: -.075em;
}

.profile-edit-btn {
  min-height: 48px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 0 18px;
  border-radius: 999px;
  color: var(--kl-text);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.11);
  font-weight: 930;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}

.profile-edit-btn:hover,
.profile-edit-btn:focus-visible {
  transform: translateY(-1px);
  background: linear-gradient(135deg, rgba(124,92,255,.32), rgba(168,85,247,.22));
  border-color: rgba(124,92,255,.55);
}

.profile-edit-btn svg,
.profile-edit-btn i { width: 17px; height: 17px; }

.profile-tile__huge-icon {
  position: absolute;
  right: 26px;
  bottom: 22px;
  color: rgba(244,244,248,.16);
}

.profile-tile__huge-icon svg,
.profile-tile__huge-icon i {
  width: clamp(76px, 9vw, 132px);
  height: clamp(76px, 9vw, 132px);
  stroke-width: 1.45;
}

.profile-tile__bottom {
  position: absolute;
  left: 25px;
  right: 25px;
  bottom: 22px;
  display: grid;
  gap: 5px;
  color: var(--kl-text);
}

.profile-tile__bottom span {
  font-size: 18px;
  font-weight: 950;
  letter-spacing: -.03em;
}

.profile-tile__bottom small { max-width: 62%; color: rgba(167,174,192,.68); }

.profile-tile--subscription {
  background:
    radial-gradient(circle at 78% 15%, rgba(124,92,255,.22), transparent 16rem),
    linear-gradient(145deg, rgba(29,32,48,.98), rgba(16,17,26,.98)) !important;
}

.profile-tile--subscription .profile-tile__bottom span {
  color: var(--kl-accent);
}

.profile-tile--referral {
  background:
    radial-gradient(circle at 80% 16%, rgba(168,85,247,.22), transparent 14rem),
    var(--kl-card) !important;
}

.profile-tile--social {
  border-color: rgba(34,211,238,.20);
  background:
    radial-gradient(circle at 75% 28%, rgba(34,211,238,.24), transparent 15rem),
    radial-gradient(circle at 86% 76%, rgba(124,92,255,.22), transparent 16rem),
    linear-gradient(135deg, rgba(16,17,26,.96), rgba(6,6,10,.98)) !important;
}

.profile-tile--social p { margin: 10px 0 22px; }

.profile-social-icons {
  display: flex;
  gap: 14px;
}

.profile-social-icons span {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: var(--kl-text);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.11);
}

.profile-social-icons svg,
.profile-social-icons i { width: 18px; height: 18px; }

.profile-social-orbs {
  position: relative;
  width: 320px;
  height: 145px;
  margin-right: -24px;
}

.profile-social-orbs span {
  position: absolute;
  border-radius: 32px;
  transform: rotate(-10deg);
  box-shadow: 0 24px 80px rgba(0,0,0,.32);
}

.profile-social-orbs span:nth-child(1) { width: 150px; height: 104px; right: 124px; top: 12px; background: linear-gradient(135deg, #7C5CFF, #A855F7); }
.profile-social-orbs span:nth-child(2) { width: 170px; height: 116px; right: 32px; top: 46px; background: linear-gradient(135deg, #22D3EE, #7C5CFF); transform: rotate(-16deg); }
.profile-social-orbs span:nth-child(3) { width: 118px; height: 118px; right: -40px; top: 8px; background: linear-gradient(135deg, #A855F7, #22D3EE); border-radius: 38px; transform: rotate(9deg); }

.profile-office-lists {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  margin-top: 20px;
}

.profile-content-card {
  min-height: 240px;
  padding: 22px;
}

.profile-content-card--wide {
  grid-column: 1 / -1;
  min-height: 260px;
}

.profile-content-card__head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 18px;
}

.profile-content-card__head svg,
.profile-content-card__head i {
  width: 22px;
  height: 22px;
  color: var(--kl-accent);
}

.profile-content-card__head span {
  margin-left: auto;
  min-width: 36px;
  height: 28px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: var(--kl-text);
  background: rgba(124,92,255,.24);
  border: 1px solid rgba(124,92,255,.38);
  font-weight: 950;
}

.profile-logout-wide {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
  padding: 0 22px;
  border-radius: 16px;
  color: var(--kl-text);
  background: rgba(255,255,255,.075);
  border: 1px solid rgba(255,255,255,.11);
  font-weight: 930;
}

.profile-logout-wide:hover,
.profile-logout-wide:focus-visible {
  background: rgba(239,68,68,.16);
  border-color: rgba(239,68,68,.36);
}

.profile-card-mini.is-hidden { display: none !important; }

.profile-edit-overlay {
  position: fixed;
  inset: 0;
  z-index: 1300;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0,0,0,.72);
  backdrop-filter: blur(24px) saturate(120%);
  -webkit-backdrop-filter: blur(24px) saturate(120%);
}

.profile-edit-overlay.is-hidden { display: none !important; }

.profile-edit-card {
  width: min(560px, 100%);
  display: grid;
  gap: 18px;
  padding: 28px;
  border-radius: 30px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 12% 0%, rgba(124,92,255,.20), transparent 18rem),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.03)),
    #10111A;
  box-shadow: 0 42px 160px rgba(0,0,0,.68), inset 0 1px 0 rgba(255,255,255,.10);
}

.profile-edit-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 4px;
}

.profile-edit-card__head button {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  color: var(--kl-text);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.10);
}

.profile-edit-field {
  display: grid;
  gap: 8px;
}

.profile-edit-field span {
  color: var(--kl-muted);
  font-size: 13px;
  font-weight: 850;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.profile-edit-field .input {
  min-height: 58px !important;
  border-radius: 18px !important;
  color: var(--kl-text) !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}

.profile-edit-field .input:focus {
  border-color: rgba(34,211,238,.48) !important;
  box-shadow: 0 0 0 4px rgba(34,211,238,.12) !important;
}

.profile-edit-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 4px;
}

.profile-edit-actions .btn--primary {
  color: #06060A !important;
  background: linear-gradient(135deg, var(--kl-accent), var(--kl-primary)) !important;
  border: 0 !important;
}

.profile-media-row,
.profile-chip-card,
.profile-device-row {
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.075) !important;
}

.profile-media-row__open,
.profile-chip-card > span,
.profile-device-row__icon {
  color: var(--kl-text) !important;
  background: linear-gradient(135deg, rgba(124,92,255,.88), rgba(34,211,238,.72)) !important;
}

.profile-empty-state {
  border-color: rgba(124,92,255,.24) !important;
  background: rgba(124,92,255,.045) !important;
}

@media (max-width: 1180px) {
  .profile-office { width: min(100%, calc(100vw - 40px)); }
  .profile-tile--personal,
  .profile-tile--subscription,
  .profile-tile--small,
  .profile-tile--social { grid-column: span 6; }
  .profile-social-orbs { display: none; }
}

@media (max-width: 760px) {
  .profile-office { width: calc(100vw - 24px); }
  .profile-office__head { align-items: flex-start; flex-direction: column; }
  .profile-tile--personal,
  .profile-tile--subscription,
  .profile-tile--small,
  .profile-tile--social { grid-column: 1 / -1; }
  .profile-personal-row { align-items: flex-start; flex-direction: column; }
  .profile-edit-btn { width: 100%; justify-content: center; }
  .profile-id-copy span { max-width: 52vw; }
  .profile-office-lists { grid-template-columns: 1fr; }
  .profile-content-card--wide { grid-column: auto; }
  .profile-edit-actions { flex-direction: column-reverse; }
  .profile-edit-actions .btn { width: 100%; }
}

/* v47: profile rewrite, stable invisible auth refresh, avatar presets, advanced device sessions */
body[data-page="account"] {
  background:
    radial-gradient(circle at 12% 0%, rgba(124,92,255,.16), transparent 34rem),
    radial-gradient(circle at 83% 16%, rgba(34,211,238,.11), transparent 30rem),
    linear-gradient(180deg, #06060A 0%, #050509 100%) !important;
}

.profile-office-grid--compact {
  align-items: stretch;
}
.profile-tile--personal-v47 { grid-column: span 8 !important; min-height: 210px; }
.profile-tile--subscription-v47 { grid-column: span 4 !important; min-height: 210px; }
.profile-tile--referral-v47 { grid-column: span 4 !important; }
.profile-tile--social-v47 { grid-column: span 8 !important; }
.profile-personal-row--v47 { gap: 24px; }
.profile-avatar-control--editable {
  border: 0;
  cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.profile-avatar-control--editable:hover,
.profile-avatar-control--editable:focus-visible {
  transform: translateY(-2px) scale(1.02);
  filter: brightness(1.06);
  box-shadow: 0 26px 90px rgba(124,92,255,.35), 0 0 0 3px rgba(34,211,238,.24), 0 0 0 1px rgba(255,255,255,.48) inset;
}
.profile-office-lists--v47 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.profile-content-card--sessions {
  grid-column: 1 / -1;
  min-height: 330px;
}
.profile-content-card--profiles {
  grid-column: 1 / -1;
  min-height: 190px;
}
.profile-card-note {
  margin: -6px 0 18px;
  color: rgba(167,174,192,.72);
  font-weight: 760;
  line-height: 1.45;
}
.profile-edit-card--v47 {
  width: min(720px, 100%);
}
.profile-avatar-picker {
  display: grid;
  gap: 12px;
}
.profile-avatar-picker__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}
.profile-avatar-picker__head span {
  color: var(--kl-muted);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.profile-avatar-picker__head small {
  color: rgba(167,174,192,.58);
  font-weight: 760;
}
.avatar-preset-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
.avatar-preset {
  appearance: none;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 20px;
  background: rgba(255,255,255,.045);
  color: var(--kl-text);
  display: grid;
  gap: 8px;
  padding: 10px;
  cursor: pointer;
  text-align: center;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.avatar-preset:hover,
.avatar-preset:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(34,211,238,.42);
  background: rgba(34,211,238,.08);
}
.avatar-preset.is-selected {
  border-color: rgba(124,92,255,.75);
  background: linear-gradient(180deg, rgba(124,92,255,.24), rgba(34,211,238,.10));
  box-shadow: 0 0 0 3px rgba(124,92,255,.15), inset 0 1px 0 rgba(255,255,255,.14);
}
.avatar-preset__image {
  width: 76px;
  height: 76px;
  justify-self: center;
  border-radius: 24px;
  background-size: cover;
  background-position: center;
  box-shadow: 0 14px 38px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.18);
}
.avatar-preset small {
  color: rgba(244,244,248,.72);
  font-size: 11px;
  font-weight: 850;
  line-height: 1.12;
}
.profile-device-row--v47 {
  grid-template-columns: 54px minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 16px !important;
  padding: 16px !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028)) !important;
}
.profile-device-row--v47.is-current {
  border-color: rgba(34,211,238,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(34,211,238,.10);
}
.profile-device-row--v47 .profile-device-row__icon {
  width: 54px !important;
  height: 54px !important;
  border-radius: 18px !important;
}
.profile-device-row__main {
  min-width: 0;
  display: grid;
  gap: 8px;
}
.profile-device-row__title {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.profile-device-row__title b {
  font-size: 16px !important;
}
.profile-device-row__title em {
  flex: 0 0 auto;
  min-height: 24px;
  display: inline-flex;
  align-items: center;
  padding: 0 9px;
  border-radius: 999px;
  color: #061014;
  background: linear-gradient(135deg, var(--kl-accent), var(--kl-primary));
  font-size: 11px;
  font-style: normal;
  font-weight: 1000;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.profile-device-facts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 2px 0 0;
  padding: 0;
  list-style: none;
}
.profile-device-facts li {
  min-width: 0;
  padding: 9px 10px;
  border-radius: 14px;
  background: rgba(255,255,255,.045);
  border: 1px solid rgba(255,255,255,.07);
}
.profile-device-facts span,
.profile-device-facts b {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.profile-device-facts span {
  color: rgba(167,174,192,.62);
  font-size: 11px;
  font-weight: 850;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.profile-device-facts b {
  margin-top: 4px;
  color: rgba(244,244,248,.88);
  font-size: 12px;
  font-weight: 900;
}
.profile-device-row__actions {
  display: flex;
  align-items: center;
  gap: 8px;
}
.profile-device-action {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border-radius: 13px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.07);
  color: var(--kl-text);
  cursor: pointer;
  font-weight: 900;
}
.profile-device-action svg,
.profile-device-action i { width: 15px; height: 15px; }
.profile-device-action:hover,
.profile-device-action:focus-visible {
  background: rgba(124,92,255,.18);
  border-color: rgba(124,92,255,.45);
}
.profile-device-action--danger:hover,
.profile-device-action--danger:focus-visible {
  background: rgba(239,68,68,.16);
  border-color: rgba(239,68,68,.40);
}
.device-edit-card { width: min(520px, 100%); }

@media (max-width: 1180px) {
  .profile-tile--personal-v47,
  .profile-tile--subscription-v47,
  .profile-tile--referral-v47,
  .profile-tile--social-v47 { grid-column: 1 / -1 !important; }
  .profile-device-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-device-row--v47 { grid-template-columns: 54px minmax(0, 1fr) !important; }
  .profile-device-row__actions { grid-column: 2; }
}
@media (max-width: 760px) {
  .avatar-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .profile-avatar-picker__head { align-items: flex-start; flex-direction: column; }
  .profile-device-row--v47 { grid-template-columns: 1fr !important; }
  .profile-device-row__actions { grid-column: auto; flex-direction: column; align-items: stretch; }
  .profile-device-action { justify-content: center; width: 100%; }
  .profile-device-facts { grid-template-columns: 1fr; }
}
.profile-chip-card__avatar {
  background-size: cover !important;
  background-position: center !important;
  color: transparent !important;
}


/* v48: cleaned KINOLOT profile, fixed modals, password/avatar edit, stable device naming */
body[data-page="account"] {
  background:
    radial-gradient(circle at 18% 0%, rgba(124,92,255,.10), transparent 34rem),
    radial-gradient(circle at 84% 18%, rgba(34,211,238,.07), transparent 30rem),
    #06060A !important;
}

.profile-content-card--profiles,
#profilesBox {
  display: none !important;
}

.profile-office {
  width: min(1320px, calc(100vw - 116px)) !important;
}

.profile-tile,
.profile-content-card {
  border-color: rgba(38,42,61,.92) !important;
  background:
    linear-gradient(180deg, rgba(244,244,248,.035), rgba(244,244,248,.012)),
    #10111A !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.42), inset 0 1px 0 rgba(244,244,248,.05) !important;
}

.profile-tile::before,
.profile-content-card::before {
  background:
    radial-gradient(circle at 16% 0%, rgba(124,92,255,.10), transparent 22rem),
    radial-gradient(circle at 100% 0%, rgba(34,211,238,.055), transparent 20rem) !important;
  opacity: 1 !important;
}

.profile-tile--subscription,
.profile-tile--referral,
.profile-tile--social,
.profile-content-card {
  background:
    linear-gradient(180deg, rgba(244,244,248,.04), rgba(244,244,248,.014)),
    #171927 !important;
}

.profile-avatar-control {
  background-color: #171927 !important;
  border: 1px solid rgba(38,42,61,.95) !important;
}

.profile-avatar-control:not(.has-image) {
  background:
    radial-gradient(circle at 28% 18%, rgba(244,244,248,.96), rgba(167,174,192,.84)) !important;
  color: #06060A !important;
}

.profile-edit-btn,
.profile-office__back,
.profile-logout-wide,
.profile-device-action,
.profile-id-copy button {
  background: rgba(244,244,248,.065) !important;
  border-color: rgba(38,42,61,.95) !important;
  color: #F4F4F8 !important;
}

.profile-edit-btn:hover,
.profile-office__back:hover,
.profile-device-action:hover,
.profile-id-copy button:hover,
.profile-edit-btn:focus-visible,
.profile-office__back:focus-visible,
.profile-device-action:focus-visible,
.profile-id-copy button:focus-visible {
  background: rgba(124,92,255,.16) !important;
  border-color: rgba(124,92,255,.52) !important;
}

body.is-profile-edit-open {
  overflow: hidden !important;
}

body.is-profile-edit-open .sidebar {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

body.is-profile-edit-open .content {
  overflow: hidden !important;
}

.profile-edit-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 99999 !important;
  width: 100vw !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(18px, 3vw, 42px) !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 50% 8%, rgba(124,92,255,.12), transparent 34rem),
    rgba(6,6,10,.88) !important;
  backdrop-filter: blur(28px) saturate(112%) brightness(.82) !important;
  -webkit-backdrop-filter: blur(28px) saturate(112%) brightness(.82) !important;
  box-sizing: border-box !important;
}

.profile-edit-overlay.is-hidden {
  display: none !important;
}

.profile-edit-card {
  position: relative !important;
  z-index: 1 !important;
  width: min(620px, calc(100vw - 36px)) !important;
  max-height: calc(100dvh - 54px) !important;
  overflow-y: auto !important;
  margin: auto !important;
  padding: clamp(22px, 2.2vw, 30px) !important;
  border-radius: 28px !important;
  border: 1px solid rgba(38,42,61,.96) !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(124,92,255,.10), transparent 20rem),
    linear-gradient(180deg, rgba(244,244,248,.045), rgba(244,244,248,.018)),
    #10111A !important;
  box-shadow: 0 44px 150px rgba(0,0,0,.72), inset 0 1px 0 rgba(244,244,248,.06) !important;
  scrollbar-width: thin;
  scrollbar-color: rgba(167,174,192,.35) transparent;
}

.profile-edit-card::-webkit-scrollbar {
  width: 8px;
}

.profile-edit-card::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(167,174,192,.30);
}

.profile-edit-card--v47 {
  width: min(720px, calc(100vw - 36px)) !important;
}

.device-edit-card {
  width: min(520px, calc(100vw - 36px)) !important;
}

.profile-edit-card__head h3 {
  font-size: clamp(28px, 3vw, 42px) !important;
}

.profile-edit-card__head button {
  flex: 0 0 auto !important;
  background: rgba(244,244,248,.075) !important;
  border-color: rgba(244,244,248,.12) !important;
}

.profile-edit-field .input {
  background: #171927 !important;
  border-color: #262A3D !important;
  color: #F4F4F8 !important;
  box-shadow: none !important;
}

.profile-edit-field .input:focus {
  border-color: rgba(34,211,238,.60) !important;
  box-shadow: 0 0 0 4px rgba(34,211,238,.13) !important;
}

.profile-avatar-picker--first {
  margin-top: 4px !important;
}

.profile-password-panel {
  display: grid;
  gap: 14px;
  margin-top: 2px;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(38,42,61,.96);
  background: rgba(23,25,39,.74);
}

.profile-password-panel__head,
.profile-avatar-picker__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.profile-password-panel__head span,
.profile-avatar-picker__head span {
  color: #A7AEC0;
  font-size: 13px;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.profile-password-panel__head small,
.profile-avatar-picker__head small {
  color: rgba(167,174,192,.62);
  font-size: 12px;
  font-weight: 760;
  text-align: right;
}

.avatar-preset-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  max-height: min(320px, 34vh);
  overflow-y: auto;
  padding-right: 2px;
}

.avatar-preset {
  background: #171927 !important;
  border-color: #262A3D !important;
}

.avatar-preset:hover,
.avatar-preset:focus-visible {
  background: rgba(34,211,238,.08) !important;
  border-color: rgba(34,211,238,.48) !important;
}

.avatar-preset.is-selected {
  background: linear-gradient(180deg, rgba(124,92,255,.22), rgba(34,211,238,.075)), #171927 !important;
  border-color: rgba(124,92,255,.82) !important;
  box-shadow: 0 0 0 3px rgba(124,92,255,.16), inset 0 1px 0 rgba(244,244,248,.10) !important;
}

.profile-edit-actions .btn {
  min-height: 46px !important;
  border-radius: 999px !important;
}

.profile-edit-actions .btn--primary {
  color: #F4F4F8 !important;
  background: linear-gradient(135deg, #7C5CFF, #A855F7) !important;
  box-shadow: 0 16px 42px rgba(124,92,255,.26) !important;
}

.profile-device-row--v47 {
  background: linear-gradient(180deg, rgba(244,244,248,.035), rgba(244,244,248,.014)), #171927 !important;
  border-color: #262A3D !important;
}

.profile-device-row--v47.is-current {
  border-color: rgba(34,211,238,.46) !important;
  box-shadow: 0 0 0 1px rgba(34,211,238,.12), inset 0 1px 0 rgba(244,244,248,.06) !important;
}

.profile-device-row--v47 .profile-device-row__icon,
.profile-media-row__open,
.profile-chip-card > span {
  background: linear-gradient(135deg, #7C5CFF, #22D3EE) !important;
  color: #F4F4F8 !important;
}

.profile-device-facts li {
  background: rgba(16,17,26,.82) !important;
  border-color: rgba(38,42,61,.92) !important;
}

@media (max-width: 760px) {
  .profile-edit-overlay {
    align-items: flex-start !important;
    padding: 14px !important;
  }

  .profile-edit-card,
  .profile-edit-card--v47,
  .device-edit-card {
    width: 100% !important;
    max-height: calc(100dvh - 28px) !important;
    border-radius: 24px !important;
  }

  .avatar-preset-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-height: 260px;
  }

  .profile-password-panel__head,
  .profile-avatar-picker__head {
    align-items: flex-start;
    flex-direction: column;
  }

  .profile-password-panel__head small,
  .profile-avatar-picker__head small {
    text-align: left;
  }
}

/* v49: account modal hardening, KINOLOT palette consistency, watched history without timeline */
body.is-account-modal-open {
  overflow: hidden !important;
}

body.is-account-modal-open .topbar,
body.is-account-modal-open .sidebar,
body.is-account-modal-open .bottom-nav,
body.is-account-modal-open .mode-fab,
body.is-account-modal-open .device-overlay {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.profile-edit-overlay {
  z-index: 2147483000 !important;
  isolation: isolate !important;
  background:
    radial-gradient(circle at 50% 4%, rgba(124,92,255,.14), transparent 34rem),
    radial-gradient(circle at 72% 20%, rgba(34,211,238,.08), transparent 28rem),
    rgba(6,6,10,.92) !important;
}

.profile-edit-overlay::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(6,6,10,.32), rgba(6,6,10,.72));
  z-index: -1;
}

.profile-edit-card,
.profile-edit-card--v47,
.device-edit-card {
  background:
    radial-gradient(circle at 12% 0%, rgba(124,92,255,.12), transparent 20rem),
    radial-gradient(circle at 92% 0%, rgba(34,211,238,.07), transparent 18rem),
    linear-gradient(180deg, rgba(244,244,248,.04), rgba(244,244,248,.014)),
    #10111A !important;
  border-color: #262A3D !important;
  color: #F4F4F8 !important;
}

.profile-content-card--wide .profile-content-card__head i,
.profile-content-card--wide .profile-content-card__head svg {
  color: #22D3EE !important;
}

.profile-list--poster .profile-media-row .profile-progress-bar {
  display: none !important;
}

.profile-list--poster .profile-media-row__body small {
  color: #A7AEC0 !important;
}

/* v51: final account cabinet cleanup, black/white palette, fixed viewport modals */
body[data-page="account"] {
  background:
    radial-gradient(circle at 50% -12%, rgba(244,244,248,.075), transparent 34rem),
    radial-gradient(circle at 100% 12%, rgba(244,244,248,.035), transparent 28rem),
    #000 !important;
}

body[data-page="account"] .topbar,
body[data-page="account"] .profile-office__head,
.profile-office__back {
  display: none !important;
}

.profile-office {
  width: min(1240px, calc(100vw - 116px)) !important;
  margin: clamp(34px, 4vw, 62px) auto 0 !important;
  padding-bottom: 82px !important;
}

.profile-office-grid,
.profile-office-lists,
.profile-office-lists--v47 {
  gap: 18px !important;
}

.profile-tile,
.profile-content-card,
.profile-tile--subscription,
.profile-tile--referral,
.profile-tile--social,
.profile-content-card {
  border-color: rgba(255,255,255,.12) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    #111 !important;
  box-shadow: 0 32px 95px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.06) !important;
}

.profile-tile::before,
.profile-content-card::before {
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.075), transparent 19rem),
    radial-gradient(circle at 100% 0%, rgba(255,255,255,.04), transparent 22rem) !important;
  opacity: 1 !important;
}

.profile-tile h3,
.profile-content-card h3,
.profile-personal-main strong,
.profile-edit-card h3 {
  color: #fff !important;
}

.profile-tile p,
.profile-tile small,
.profile-content-card p,
.profile-personal-main span,
.profile-personal-main small,
.profile-card-note,
.profile-id-copy,
.profile-id-copy b {
  color: rgba(255,255,255,.62) !important;
}

.profile-content-card__head svg,
.profile-content-card__head i,
.profile-content-card--wide .profile-content-card__head i,
.profile-content-card--wide .profile-content-card__head svg {
  color: #fff !important;
}

.profile-content-card__head span,
.profile-tile--subscription .profile-tile__bottom span {
  color: #050505 !important;
  background: #fff !important;
  border-color: rgba(255,255,255,.80) !important;
}

.profile-edit-btn,
.profile-logout-wide,
.profile-device-action,
.profile-id-copy button,
.profile-edit-card__head button {
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.profile-edit-btn:hover,
.profile-edit-btn:focus-visible,
.profile-logout-wide:hover,
.profile-logout-wide:focus-visible,
.profile-device-action:hover,
.profile-device-action:focus-visible,
.profile-id-copy button:hover,
.profile-id-copy button:focus-visible,
.profile-edit-card__head button:hover,
.profile-edit-card__head button:focus-visible {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

.profile-tile__huge-icon {
  color: rgba(255,255,255,.11) !important;
}

.profile-social-icons span,
.profile-social-orbs span {
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: #fff !important;
}

.profile-social-orbs span:nth-child(1),
.profile-social-orbs span:nth-child(2),
.profile-social-orbs span:nth-child(3) {
  background: linear-gradient(135deg, rgba(255,255,255,.22), rgba(255,255,255,.06)) !important;
}

.profile-media-row,
.profile-device-row--v47,
.profile-chip-card {
  background: linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.018)), #151515 !important;
  border-color: rgba(255,255,255,.12) !important;
}

.profile-device-row--v47.is-current {
  border-color: rgba(255,255,255,.48) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.profile-device-row--v47 .profile-device-row__icon,
.profile-media-row__open,
.profile-chip-card > span {
  background: #fff !important;
  color: #000 !important;
}

.profile-device-row__title em {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

.profile-device-facts li {
  background: rgba(0,0,0,.32) !important;
  border-color: rgba(255,255,255,.10) !important;
}

body.is-account-modal-open,
body.is-profile-edit-open,
body.is-device-edit-open {
  overflow: hidden !important;
}

body.is-account-modal-open .topbar,
body.is-account-modal-open .sidebar,
body.is-account-modal-open .bottom-nav,
body.is-account-modal-open .mode-fab,
body.is-account-modal-open .device-overlay {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.profile-edit-overlay {
  position: fixed !important;
  inset: 0 !important;
  left: 0 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 2147483647 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: clamp(18px, 3vw, 34px) !important;
  overflow: hidden !important;
  background: rgba(0,0,0,.84) !important;
  backdrop-filter: blur(32px) saturate(98%) brightness(.72) !important;
  -webkit-backdrop-filter: blur(32px) saturate(98%) brightness(.72) !important;
  isolation: isolate !important;
  box-sizing: border-box !important;
}

.profile-edit-overlay.is-hidden {
  display: none !important;
}

.profile-edit-overlay::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.08), transparent 28rem),
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.70)) !important;
}

.profile-edit-card,
.profile-edit-card--v47,
.device-edit-card {
  position: relative !important;
  z-index: 2 !important;
  width: min(600px, calc(100vw - 42px)) !important;
  max-height: calc(100dvh - 68px) !important;
  overflow-y: auto !important;
  margin: 0 !important;
  padding: clamp(22px, 2.2vw, 30px) !important;
  border-radius: 28px !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.024)),
    #101010 !important;
  box-shadow: 0 46px 170px rgba(0,0,0,.86), inset 0 1px 0 rgba(255,255,255,.08) !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255,255,255,.32) transparent !important;
}

.profile-edit-card--v47 {
  width: min(680px, calc(100vw - 42px)) !important;
}

.device-edit-card {
  width: min(520px, calc(100vw - 42px)) !important;
}

.profile-edit-card::-webkit-scrollbar,
.avatar-preset-grid::-webkit-scrollbar {
  width: 8px !important;
}

.profile-edit-card::-webkit-scrollbar-thumb,
.avatar-preset-grid::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: rgba(255,255,255,.28) !important;
}

.profile-edit-card__head {
  gap: 16px !important;
}

.profile-edit-card__head h3 {
  font-size: clamp(26px, 2.8vw, 38px) !important;
  letter-spacing: -.06em !important;
}

.profile-edit-card .eyebrow {
  color: rgba(255,255,255,.50) !important;
}

.profile-avatar-picker,
.profile-password-panel {
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.035) !important;
  border-radius: 22px !important;
}

.profile-avatar-picker__head span,
.profile-password-panel__head span,
.profile-edit-field span {
  color: rgba(255,255,255,.72) !important;
}

.profile-avatar-picker__head small,
.profile-password-panel__head small {
  color: rgba(255,255,255,.45) !important;
}

.profile-edit-field .input,
.device-edit-card .input {
  background: #050505 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.profile-edit-field .input:focus,
.device-edit-card .input:focus {
  border-color: #fff !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.12) !important;
}

.avatar-preset-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  max-height: min(260px, 30dvh) !important;
  overflow-y: auto !important;
  padding-right: 3px !important;
}

.avatar-preset {
  background: #151515 !important;
  border: 1px solid rgba(255,255,255,.11) !important;
}

.avatar-preset:hover,
.avatar-preset:focus-visible {
  background: rgba(255,255,255,.075) !important;
  border-color: rgba(255,255,255,.42) !important;
}

.avatar-preset.is-selected {
  background: #1d1d1d !important;
  border-color: #fff !important;
  box-shadow: 0 0 0 3px rgba(255,255,255,.12), inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.avatar-preset small {
  color: rgba(255,255,255,.72) !important;
}

.profile-edit-actions {
  position: sticky !important;
  bottom: -1px !important;
  z-index: 3 !important;
  margin: 4px -2px -2px !important;
  padding-top: 14px !important;
  background: linear-gradient(180deg, rgba(16,16,16,0), #101010 34%) !important;
}

.profile-edit-actions .btn {
  min-height: 48px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.075) !important;
  border-color: rgba(255,255,255,.14) !important;
  color: #fff !important;
}

.profile-edit-actions .btn--primary {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
  box-shadow: 0 18px 50px rgba(255,255,255,.13) !important;
}

.profile-edit-actions .btn:hover,
.profile-edit-actions .btn:focus-visible {
  transform: translateY(-1px) !important;
}

@media (max-width: 760px) {
  .profile-office {
    width: calc(100vw - 24px) !important;
    margin-top: 18px !important;
  }
  .profile-edit-overlay {
    align-items: center !important;
    padding: 12px !important;
  }
  .profile-edit-card,
  .profile-edit-card--v47,
  .device-edit-card {
    width: 100% !important;
    max-height: calc(100dvh - 24px) !important;
    border-radius: 22px !important;
  }
  .avatar-preset-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* v52: rebuilt account cabinet and filter-style settings modals */
body[data-page="account"] {
  --cabinet-bg: #000;
  --cabinet-panel: #111113;
  --cabinet-panel-2: #17171a;
  --cabinet-line: rgba(255,255,255,.13);
  --cabinet-line-strong: rgba(255,255,255,.24);
  --cabinet-text: #fff;
  --cabinet-muted: rgba(255,255,255,.58);
  --cabinet-soft: rgba(255,255,255,.075);
  background: #000 !important;
}

body[data-page="account"] .content {
  padding-top: clamp(94px, 8vw, 132px) !important;
  padding-bottom: 96px !important;
}

body[data-page="account"] .topbar__title,
body[data-page="account"] .profile-office__head,
body[data-page="account"] .profile-office__back,
body[data-page="account"] .eyebrow:not(.profile-edit-card .eyebrow) {
  display: none !important;
}

.profile-office {
  width: min(1280px, calc(100vw - 112px)) !important;
  margin: 0 auto !important;
  padding: 0 0 96px !important;
}

.profile-office-grid,
.profile-office-grid--compact {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.profile-office-lists,
.profile-office-lists--v47 {
  display: grid !important;
  grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin-top: 18px !important;
}

.profile-tile,
.profile-content-card {
  border-radius: 28px !important;
  border: 1px solid var(--cabinet-line) !important;
  background:
    radial-gradient(circle at 22% 0%, rgba(255,255,255,.08), transparent 22rem),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)),
    var(--cabinet-panel) !important;
  box-shadow: 0 28px 90px rgba(0,0,0,.54), inset 0 1px 0 rgba(255,255,255,.055) !important;
  color: var(--cabinet-text) !important;
}

.profile-tile::before,
.profile-content-card::before {
  background: linear-gradient(135deg, rgba(255,255,255,.055), transparent 36%, rgba(255,255,255,.02)) !important;
  opacity: 1 !important;
}

.profile-tile--personal,
.profile-tile--personal-v47 {
  grid-column: span 8 !important;
  min-height: 184px !important;
  padding: 24px !important;
}

.profile-tile--subscription,
.profile-tile--subscription-v47 {
  grid-column: span 4 !important;
  min-height: 184px !important;
  padding: 24px !important;
}

.profile-tile--referral,
.profile-tile--referral-v47 {
  grid-column: span 4 !important;
  min-height: 154px !important;
  padding: 22px !important;
}

.profile-tile--social,
.profile-tile--social-v47 {
  grid-column: span 8 !important;
  min-height: 154px !important;
  padding: 22px !important;
}

.profile-content-card--wide { grid-column: 1 / -1 !important; }
.profile-content-card:not(.profile-content-card--wide):not(.profile-content-card--sessions) { grid-column: span 6 !important; }
.profile-content-card--sessions { grid-column: 1 / -1 !important; }

.profile-tile h3,
.profile-content-card h3,
.profile-personal-main strong {
  color: #fff !important;
  text-shadow: none !important;
}

.profile-tile h3,
.profile-content-card h3 {
  font-size: clamp(22px, 1.7vw, 30px) !important;
  letter-spacing: -.055em !important;
}

.profile-personal-main strong {
  font-size: clamp(38px, 4.4vw, 62px) !important;
  letter-spacing: -.075em !important;
}

.profile-tile p,
.profile-tile small,
.profile-content-card p,
.profile-personal-main span,
.profile-personal-main small,
.profile-card-note,
.profile-id-copy,
.profile-id-copy b {
  color: var(--cabinet-muted) !important;
}

.profile-avatar-control {
  width: 92px !important;
  height: 92px !important;
  border-radius: 28px !important;
  background-color: #18181b !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 18px 54px rgba(0,0,0,.44) !important;
}

.profile-edit-btn,
.profile-logout-wide,
.profile-device-action,
.profile-id-copy button {
  color: #fff !important;
  background: rgba(255,255,255,.085) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  box-shadow: none !important;
}

.profile-edit-btn:hover,
.profile-edit-btn:focus-visible,
.profile-logout-wide:hover,
.profile-logout-wide:focus-visible,
.profile-device-action:hover,
.profile-device-action:focus-visible,
.profile-id-copy button:hover,
.profile-id-copy button:focus-visible {
  color: #000 !important;
  background: #fff !important;
  border-color: #fff !important;
}

.profile-tile__huge-icon { color: rgba(255,255,255,.115) !important; }
.profile-social-orbs span { background: rgba(255,255,255,.10) !important; }
.profile-social-icons span { background: rgba(255,255,255,.075) !important; border-color: rgba(255,255,255,.14) !important; color:#fff !important; }

#subscriptionStatus {
  width: auto !important;
  max-width: max-content !important;
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: #000 !important;
  background: #fff !important;
  font-size: 13px !important;
  line-height: 1 !important;
}

.profile-content-card__head span {
  min-width: 32px !important;
  height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  color: #000 !important;
  background: #fff !important;
  border: 1px solid #fff !important;
}

.profile-media-row,
.profile-device-row--v47 {
  border-radius: 20px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.018)), #111 !important;
  border-color: rgba(255,255,255,.12) !important;
}

.profile-device-row--v47.is-current {
  border-color: rgba(255,255,255,.40) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.profile-device-row--v47 .profile-device-row__icon,
.profile-media-row__open {
  background: #fff !important;
  color: #000 !important;
}

.profile-device-row__title em {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

.profile-device-facts li {
  background: #070707 !important;
  border-color: rgba(255,255,255,.10) !important;
}

.profile-empty-state {
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.025) !important;
}

body.is-account-modal-open,
body.is-profile-edit-open,
body.is-device-edit-open {
  overflow: hidden !important;
}

body.is-account-modal-open .topbar,
body.is-account-modal-open .sidebar,
body.is-account-modal-open .bottom-nav,
body.is-account-modal-open .mode-fab,
body.is-account-modal-open .drawer {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

.profile-edit-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483647 !important;
  width: 100vw !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  display: block !important;
  padding: clamp(24px, 4vw, 48px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background: rgba(0,0,0,.78) !important;
  backdrop-filter: blur(26px) brightness(.70) !important;
  -webkit-backdrop-filter: blur(26px) brightness(.70) !important;
  box-sizing: border-box !important;
}

.profile-edit-overlay.is-hidden { display: none !important; }

.profile-edit-overlay::before {
  content: "" !important;
  position: fixed !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: radial-gradient(circle at 50% -8%, rgba(255,255,255,.11), transparent 32rem) !important;
}

.profile-edit-card,
.profile-edit-card--v47,
.device-edit-card {
  position: relative !important;
  width: min(1500px, calc(100vw - 64px)) !important;
  max-height: none !important;
  min-height: auto !important;
  margin: 0 auto !important;
  padding: clamp(44px, 5vw, 76px) clamp(40px, 6vw, 92px) !important;
  overflow: visible !important;
  border-radius: 34px !important;
  color: #fff !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.08), transparent 36rem),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.018)),
    #111114 !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 40px 150px rgba(0,0,0,.82), inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.device-edit-card {
  width: min(980px, calc(100vw - 64px)) !important;
  min-height: auto !important;
}

.profile-edit-card__head {
  display: flex !important;
  justify-content: center !important;
  align-items: flex-start !important;
  margin: 0 0 clamp(28px, 4vw, 56px) !important;
  text-align: center !important;
}

.profile-edit-card__head .eyebrow {
  display: none !important;
}

.profile-edit-card__head h3 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(44px, 5.2vw, 82px) !important;
  line-height: .92 !important;
  font-weight: 1000 !important;
  letter-spacing: -.075em !important;
}

.profile-edit-card__head button {
  position: absolute !important;
  top: 32px !important;
  right: 32px !important;
  width: 60px !important;
  height: 60px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  background: rgba(255,255,255,.085) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

.profile-edit-card__head button:hover,
.profile-edit-card__head button:focus-visible {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
}

.profile-avatar-picker,
.profile-password-panel {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  margin: 0 !important;
}

.profile-avatar-picker__head,
.profile-password-panel__head {
  margin: 0 0 18px !important;
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 18px !important;
}

.profile-avatar-picker__head span,
.profile-password-panel__head span,
.profile-edit-field span {
  color: rgba(255,255,255,.78) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  font-size: 18px !important;
  font-weight: 900 !important;
}

.profile-avatar-picker__head small,
.profile-password-panel__head small,
#deviceEditMeta {
  color: rgba(255,255,255,.48) !important;
  font-weight: 700 !important;
}

.avatar-preset-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 16px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin-bottom: 34px !important;
}

.avatar-preset {
  min-height: 158px !important;
  border-radius: 24px !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #fff !important;
}

.avatar-preset:hover,
.avatar-preset:focus-visible,
.avatar-preset.is-selected {
  background: #fff !important;
  color: #000 !important;
  border-color: #fff !important;
  box-shadow: 0 18px 54px rgba(255,255,255,.13) !important;
}

.avatar-preset__image {
  width: 82px !important;
  height: 82px !important;
  border-radius: 24px !important;
}

.avatar-preset small { color: currentColor !important; }

.profile-password-panel {
  padding-top: 28px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}

.profile-password-panel .profile-edit-field {
  display: grid !important;
  gap: 10px !important;
  margin: 0 !important;
}

.profile-password-panel {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
}

.profile-password-panel__head {
  grid-column: 1 / -1 !important;
}

.profile-edit-field .input,
.device-edit-card .input {
  min-height: 76px !important;
  border-radius: 20px !important;
  background: rgba(255,255,255,.065) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #fff !important;
  padding: 0 22px !important;
  box-shadow: none !important;
}

.profile-edit-field .input:focus,
.device-edit-card .input:focus {
  background: rgba(255,255,255,.085) !important;
  border-color: #fff !important;
  box-shadow: 0 0 0 4px rgba(255,255,255,.10) !important;
}

.profile-edit-actions {
  position: static !important;
  display: flex !important;
  justify-content: center !important;
  gap: 16px !important;
  margin: clamp(30px, 4vw, 54px) 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

.profile-edit-actions .btn {
  min-height: 62px !important;
  min-width: 180px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.085) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  font-weight: 1000 !important;
}

.profile-edit-actions .btn--primary {
  background: #fff !important;
  border-color: #fff !important;
  color: #000 !important;
  box-shadow: 0 18px 56px rgba(255,255,255,.12) !important;
}

.profile-edit-actions .btn:hover,
.profile-edit-actions .btn:focus-visible {
  transform: translateY(-2px) !important;
}

.device-edit-card .profile-edit-field {
  width: min(760px, 100%) !important;
  margin: 0 auto !important;
}

.device-edit-card #deviceEditMeta {
  width: min(760px, 100%) !important;
  margin: 16px auto 0 !important;
  line-height: 1.55 !important;
  text-align: center !important;
}

.profile-edit-actions .btn:disabled,
.profile-device-action:disabled,
.profile-edit-btn:disabled {
  opacity: .55 !important;
  pointer-events: none !important;
}

@media (max-width: 980px) {
  .profile-office { width: min(100%, calc(100vw - 28px)) !important; }
  .profile-office-grid,
  .profile-office-lists,
  .profile-office-lists--v47 { grid-template-columns: 1fr !important; }
  .profile-tile,
  .profile-content-card,
  .profile-tile--personal,
  .profile-tile--subscription,
  .profile-tile--referral,
  .profile-tile--social,
  .profile-content-card--wide,
  .profile-content-card--sessions,
  .profile-content-card:not(.profile-content-card--wide):not(.profile-content-card--sessions) { grid-column: 1 / -1 !important; }
  .profile-personal-row { align-items: flex-start !important; flex-wrap: wrap !important; }
  .profile-edit-btn { width: 100% !important; justify-content: center !important; }
  .avatar-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .profile-password-panel { grid-template-columns: 1fr !important; }
}

@media (max-width: 640px) {
  .profile-edit-overlay { padding: 12px !important; }
  .profile-edit-card,
  .profile-edit-card--v47,
  .device-edit-card {
    width: 100% !important;
    padding: 34px 18px 22px !important;
    border-radius: 26px !important;
  }
  .profile-edit-card__head h3 { font-size: 38px !important; }
  .profile-edit-card__head button { width: 48px !important; height: 48px !important; top: 18px !important; right: 18px !important; }
  .profile-edit-actions { flex-direction: column-reverse !important; }
  .profile-edit-actions .btn { width: 100% !important; }
}

/* v53: account profile/device modals reuse the exact filter sheet chrome */
body.is-profile-edit-open,
body.is-device-edit-open,
body.is-account-modal-open {
  overflow: hidden !important;
}

.account-modal-overlay.filter-overlay {
  z-index: 2147483647 !important;
  display: grid !important;
  place-items: start center !important;
  padding: clamp(16px, 3vw, 42px) 24px !important;
  background: rgba(0,0,0,.72) !important;
  backdrop-filter: blur(34px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(34px) saturate(135%) !important;
}

.account-modal-overlay.filter-overlay.is-hidden {
  display: grid !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(-10px) !important;
}

.account-settings-sheet.filter-sheet {
  position: relative !important;
  width: min(1780px, calc(100vw - 48px)) !important;
  max-height: min(92vh, 940px) !important;
  min-height: auto !important;
  overflow: auto !important;
  margin: 0 auto !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(23,24,29,.94), rgba(14,15,19,.96)) !important;
  box-shadow: 0 40px 120px rgba(0,0,0,.58) !important;
  padding: clamp(28px, 4vw, 58px) clamp(26px, 5vw, 88px) clamp(26px, 4vw, 48px) !important;
  color: #F5F5F7 !important;
  box-sizing: border-box !important;
}

.account-settings-sheet.filter-sheet::-webkit-scrollbar { width: 0 !important; height: 0 !important; }
.account-settings-sheet.filter-sheet { scrollbar-width: none !important; }

.account-settings-sheet .filter-sheet__collapse {
  position: absolute !important;
  right: 28px !important;
  top: 22px !important;
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  display: grid !important;
  place-items: center !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.account-settings-sheet .filter-sheet__collapse:hover,
.account-settings-sheet .filter-sheet__collapse:focus-visible {
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
}

.account-settings-sheet h2 {
  margin: 0 0 50px !important;
  text-align: center !important;
  font-size: clamp(38px, 4.2vw, 60px) !important;
  line-height: .95 !important;
  letter-spacing: -.04em !important;
  font-weight: 1000 !important;
  color: #F5F5F7 !important;
}

.account-settings-sheet .profile-avatar-picker,
.account-settings-sheet .profile-password-panel {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.account-settings-sheet .profile-avatar-picker__head,
.account-settings-sheet .profile-password-panel__head {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 0 0 22px !important;
}

.account-settings-sheet .profile-avatar-picker__head span,
.account-settings-sheet .profile-password-panel__head span,
.account-settings-sheet .profile-edit-field span {
  color: rgba(255,255,255,.74) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

.account-settings-sheet .profile-avatar-picker__head small,
.account-settings-sheet .profile-password-panel__head small,
.account-settings-sheet #deviceEditMeta {
  color: rgba(255,255,255,.42) !important;
  font-size: 14px !important;
  font-weight: 750 !important;
}

.account-settings-sheet .avatar-preset-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  max-height: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 0 52px !important;
}

.account-settings-sheet .avatar-preset {
  min-height: 182px !important;
  padding: 20px 14px !important;
  border-radius: 18px !important;
  color: rgba(255,255,255,.86) !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
  transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease, box-shadow .18s ease !important;
}

.account-settings-sheet .avatar-preset:hover,
.account-settings-sheet .avatar-preset:focus-visible {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.14) !important;
  transform: translateY(-1px) !important;
}

.account-settings-sheet .avatar-preset.is-selected {
  background: #F5F5F7 !important;
  color: #06070A !important;
  border-color: #F5F5F7 !important;
  box-shadow: 0 18px 52px rgba(255,255,255,.13) !important;
}

.account-settings-sheet .avatar-preset__image {
  width: 96px !important;
  height: 96px !important;
  border-radius: 28px !important;
  margin-bottom: 18px !important;
}

.account-settings-sheet .avatar-preset small {
  color: currentColor !important;
  font-size: 14px !important;
  font-weight: 900 !important;
}

.account-settings-sheet .profile-password-panel {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 36px 42px !important;
  padding-top: 36px !important;
  border-top: 1px solid rgba(255,255,255,.10) !important;
}

.account-settings-sheet .profile-password-panel__head {
  grid-column: 1 / -1 !important;
  margin-bottom: -14px !important;
}

.account-settings-sheet .profile-edit-field {
  display: grid !important;
  gap: 12px !important;
  margin: 0 !important;
}

.account-settings-sheet .profile-edit-field .input,
.account-settings-sheet #deviceEditName {
  width: 100% !important;
  height: 62px !important;
  min-height: 62px !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.055) !important;
  color: #F5F5F7 !important;
  padding: 0 20px !important;
  outline: none !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}

.account-settings-sheet .profile-edit-field .input::placeholder,
.account-settings-sheet #deviceEditName::placeholder { color: rgba(255,255,255,.42) !important; }

.account-settings-sheet .profile-edit-field .input:focus,
.account-settings-sheet #deviceEditName:focus {
  border-color: rgba(255,255,255,.22) !important;
  background: rgba(255,255,255,.09) !important;
  box-shadow: 0 0 0 5px rgba(255,255,255,.055) !important;
}

.account-settings-sheet .profile-edit-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 16px !important;
  padding-top: 36px !important;
  margin: 0 !important;
  background: transparent !important;
  position: static !important;
}

.account-settings-sheet .profile-edit-actions .btn,
.account-settings-sheet .profile-edit-actions .filter-btn {
  min-width: 230px !important;
  height: 58px !important;
  min-height: 58px !important;
  padding: 0 28px !important;
  border-radius: 14px !important;
  font-weight: 950 !important;
  font-size: 17px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.06) !important;
  color: #F5F5F7 !important;
  box-shadow: none !important;
}

.account-settings-sheet .profile-edit-actions .btn--primary {
  background: #F5F5F7 !important;
  color: #06070A !important;
  border-color: #F5F5F7 !important;
}

.account-settings-sheet .profile-edit-actions .btn:hover,
.account-settings-sheet .profile-edit-actions .btn:focus-visible {
  transform: translateY(-1px) !important;
  filter: brightness(1.05) !important;
}

.account-device-sheet.filter-sheet {
  width: min(1780px, calc(100vw - 48px)) !important;
}

.account-device-sheet .profile-edit-field {
  width: min(760px, 100%) !important;
  margin: 0 auto !important;
}

.account-device-sheet #deviceEditMeta {
  width: min(760px, 100%) !important;
  margin: 18px auto 0 !important;
  line-height: 1.55 !important;
  text-align: left !important;
}

@media (max-width: 900px) {
  .account-modal-overlay.filter-overlay {
    padding: 10px !important;
    place-items: stretch !important;
  }
  .account-settings-sheet.filter-sheet {
    width: 100% !important;
    max-height: calc(100vh - 20px) !important;
    padding: 28px 18px 24px !important;
    border-radius: 22px !important;
  }
  .account-settings-sheet h2 {
    font-size: 40px !important;
    margin-bottom: 28px !important;
  }
  .account-settings-sheet .avatar-preset-grid,
  .account-settings-sheet .profile-password-panel {
    grid-template-columns: 1fr !important;
    gap: 20px !important;
  }
  .account-settings-sheet .profile-edit-actions {
    flex-direction: column !important;
    padding-top: 20px !important;
  }
  .account-settings-sheet .profile-edit-actions .btn {
    width: 100% !important;
  }
}

/* ===== KINOLOT account cabinet v54 — final rebuild ===== */
body[data-page="account"] .content {
  padding-top: 112px !important;
  background:
    radial-gradient(circle at 22% 8%, rgba(255,255,255,.055), transparent 28rem),
    radial-gradient(circle at 86% 20%, rgba(255,255,255,.035), transparent 28rem),
    #000 !important;
}
body[data-page="account"] .page-title,
body[data-page="account"] .topbar__title,
body[data-page="account"] .profile-office__head,
body[data-page="account"] .profile-office__back { display: none !important; }
.account-v54-page { padding: 0 !important; }
.account-v54 {
  width: min(1180px, calc(100vw - 56px));
  margin: 0 auto 70px !important;
  display: grid;
  gap: 18px;
  color: #f7f7f7;
}
.account-v54 * { box-sizing: border-box; }
.account-v54-hero,
.account-v54-stats article,
.account-v54-summary-card,
.account-v54-panel,
.account-v54-sessions,
.account-v54-logout {
  border: 1px solid rgba(255,255,255,.12) !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035) 58%, rgba(255,255,255,.07)),
    #111113 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 26px 70px rgba(0,0,0,.46) !important;
  backdrop-filter: blur(22px);
}
.account-v54-hero {
  position: relative;
  min-height: 264px;
  overflow: hidden;
  border-radius: 34px;
  padding: 34px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 28px;
}
.account-v54-hero::before {
  content: "";
  position: absolute;
  inset: -40% -18% auto auto;
  width: 520px;
  height: 360px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255,255,255,.12), transparent 65%);
  pointer-events: none;
}
.account-v54-hero::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 84px;
  background: linear-gradient(180deg, transparent, rgba(0,0,0,.32));
  pointer-events: none;
}
.account-v54-hero > * { position: relative; z-index: 1; }
.account-v54-hero__identity {
  display: flex;
  align-items: center;
  gap: 28px;
  min-width: 0;
}
.account-v54-avatar {
  flex: 0 0 auto;
  width: 132px !important;
  height: 132px !important;
  border-radius: 38px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: linear-gradient(145deg, #fff, #dfe3eb) !important;
  color: #050505 !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.75) !important;
  font-size: 34px !important;
  font-weight: 950 !important;
}
.account-v54-avatar.has-image { color: transparent !important; }
.account-v54-avatar:hover,
.account-v54-avatar:focus-visible { transform: translateY(-2px); box-shadow: 0 32px 74px rgba(0,0,0,.48), 0 0 0 4px rgba(255,255,255,.08) !important; }
.account-v54-hero__text { display: grid; min-width: 0; }
.account-v54-kicker {
  color: rgba(255,255,255,.54);
  letter-spacing: .42em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 900;
  margin-bottom: 8px;
}
.account-v54-hero__text strong {
  max-width: 660px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: clamp(46px, 7vw, 76px);
  line-height: .9;
  letter-spacing: -.075em;
  font-weight: 1000;
  color: #fff;
}
.account-v54-hero__text span:not(.account-v54-kicker) {
  margin-top: 12px;
  font-size: 17px;
  font-weight: 800;
  color: rgba(255,255,255,.74);
}
.account-v54-hero__text small {
  margin-top: 5px;
  color: rgba(255,255,255,.50);
  font-size: 14px;
  font-weight: 800;
}
.account-v54-hero__actions {
  display: grid;
  justify-items: end;
  gap: 14px;
  align-self: stretch;
  align-content: center;
  min-width: 230px;
}
.account-v54-id {
  max-width: 290px;
  height: 48px;
  padding: 0 10px 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.24);
  display: flex;
  align-items: center;
  gap: 8px;
  color: rgba(255,255,255,.58);
  font-size: 12px;
  font-weight: 900;
}
.account-v54-id b {
  max-width: 150px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-v54-id button,
.account-v54-socials button {
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(255,255,255,.10);
  color: #fff;
}
.account-v54-id svg,
.account-v54-socials svg { width: 16px; height: 16px; }
.account-v54-primary {
  min-height: 54px;
  padding: 0 24px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff !important;
  color: #050505 !important;
  font-size: 15px;
  font-weight: 1000;
  box-shadow: 0 18px 42px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.9);
}
.account-v54-primary svg { width: 18px; height: 18px; }
.account-v54-primary:hover,
.account-v54-primary:focus-visible { transform: translateY(-2px); }
.account-v54-online {
  position: absolute !important;
  left: 34px;
  right: 34px;
  bottom: 22px;
  min-height: 44px;
  padding: 0 16px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.22) !important;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(255,255,255,.72) !important;
  font-size: 13px;
  font-weight: 800;
}
.account-v54-online b { color: #fff; }
.account-v54-online span { color: rgba(255,255,255,.50); margin-left: 10px; }
.account-v54-online .profile-card-mini__status {
  border-radius: 999px;
  padding: 6px 10px;
  color: #050505;
  background: #fff;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.account-v54-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}
.account-v54-stats article {
  min-height: 118px;
  border-radius: 28px;
  padding: 20px 22px;
  display: grid;
  align-content: end;
}
.account-v54-stats span {
  font-size: 42px;
  line-height: .92;
  font-weight: 1000;
  letter-spacing: -.06em;
  color: #fff;
}
.account-v54-stats b {
  margin-top: 7px;
  font-size: 14px;
  color: rgba(255,255,255,.64);
}
.account-v54-summary,
.account-v54-library {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 14px;
}
.account-v54-summary-card {
  position: relative;
  min-height: 174px;
  overflow: hidden;
  border-radius: 30px;
  padding: 24px;
  grid-column: span 3;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.account-v54-summary-card--wide { grid-column: span 6; }
.account-v54-summary-card > i,
.account-v54-summary-card > svg {
  align-self: center;
  width: 92px;
  height: 92px;
  color: rgba(255,255,255,.13);
}
.account-v54-summary-card span,
.account-v54-summary-card small,
.account-v54-summary-card p {
  color: rgba(255,255,255,.56);
  font-size: 13px;
  font-weight: 850;
  margin: 0;
}
.account-v54-summary-card strong {
  display: block;
  margin: 14px 0 7px;
  color: #fff;
  font-size: 26px;
  letter-spacing: -.04em;
  line-height: 1;
  font-weight: 1000;
}
.account-v54-summary-card--subscription strong { color: #fff !important; background: transparent !important; }
.account-v54-socials {
  display: flex;
  align-items: end;
  gap: 10px;
  margin-top: auto;
}
.account-v54-panel,
.account-v54-sessions {
  border-radius: 30px;
  padding: 22px;
}
.account-v54-panel { grid-column: span 6; min-height: 220px; }
.account-v54-panel--wide { grid-column: 1 / -1; min-height: 238px; }
.account-v54-panel header,
.account-v54-sessions header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 16px;
}
.account-v54-panel header > div,
.account-v54-sessions header > div {
  display: flex;
  align-items: center;
  gap: 10px;
}
.account-v54-panel h3,
.account-v54-sessions h3 {
  margin: 0;
  font-size: 26px;
  line-height: 1;
  letter-spacing: -.045em;
  color: #fff;
  font-weight: 1000;
}
.account-v54-panel svg,
.account-v54-sessions header svg { width: 20px; height: 20px; color: rgba(255,255,255,.72); }
.account-v54-sessions { display: grid; gap: 8px; }
.account-v54-sessions header { margin-bottom: 0; }
.account-v54-sessions p { margin: 6px 0 0; color: rgba(255,255,255,.52); font-weight: 750; }
.account-v54-logout {
  width: max-content;
  min-height: 50px;
  border-radius: 18px;
  padding: 0 20px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(255,255,255,.84);
  font-weight: 950;
}
.account-v54-logout svg { width: 19px; height: 19px; }
.account-v54-logout:hover,
.account-v54-logout:focus-visible { background: #fff !important; color: #050505 !important; }

/* Cabinet lists */
.account-v54 .profile-list {
  display: grid !important;
  gap: 10px !important;
  color: rgba(255,255,255,.70) !important;
}
.account-v54 .profile-media-row {
  min-height: 82px !important;
  border-radius: 22px !important;
  padding: 10px !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(0,0,0,.25) !important;
}
.account-v54 .profile-media-row__poster {
  width: 58px !important;
  height: 58px !important;
  border-radius: 16px !important;
  background-size: cover !important;
  background-position: center !important;
  background-color: rgba(255,255,255,.08) !important;
}
.account-v54 .profile-media-row__poster span { color: rgba(255,255,255,.7); font-weight: 1000; }
.account-v54 .profile-media-row__body { min-width: 0; display: grid; gap: 4px; }
.account-v54 .profile-media-row__body b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 14px;
  font-weight: 950;
}
.account-v54 .profile-media-row__body small { color: rgba(255,255,255,.50); font-size: 12px; font-weight: 800; }
.account-v54 .profile-media-row__open,
.account-v54 .profile-device-action {
  min-height: 38px !important;
  border-radius: 999px !important;
  padding: 0 15px !important;
  background: #fff !important;
  color: #050505 !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
}
.account-v54 .profile-empty-state {
  min-height: 108px;
  border-radius: 22px;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 8px;
  border: 1px dashed rgba(255,255,255,.13);
  background: rgba(0,0,0,.16);
  color: rgba(255,255,255,.58);
}
.account-v54 .profile-empty-state span { width: 48px; height: 5px; border-radius: 999px; background: rgba(255,255,255,.16); }
.account-v54 .profile-empty-state b { color: #fff; }
.account-v54 .profile-empty-state small { color: rgba(255,255,255,.46); }
.account-v54 .profile-device-row {
  min-height: auto !important;
  border-radius: 24px !important;
  padding: 16px !important;
  display: grid !important;
  grid-template-columns: 54px minmax(0, 1fr) auto !important;
  gap: 16px !important;
  align-items: center !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.22) !important;
}
.account-v54 .profile-device-row.is-current { border-color: rgba(255,255,255,.34) !important; }
.account-v54 .profile-device-row__icon {
  width: 54px !important;
  height: 54px !important;
  border-radius: 16px !important;
  display: grid !important;
  place-items: center !important;
  background: #fff !important;
  color: #050505 !important;
}
.account-v54 .profile-device-row__icon svg { width: 23px; height: 23px; }
.account-v54 .profile-device-row__title { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.account-v54 .profile-device-row__title b { color: #fff; font-size: 15px; font-weight: 1000; }
.account-v54 .profile-device-row__title em {
  padding: 4px 8px;
  border-radius: 999px;
  background: #fff;
  color: #050505;
  font-style: normal;
  font-size: 10px;
  font-weight: 1000;
  text-transform: uppercase;
}
.account-v54 .profile-device-row__main small { display:block; margin-top:4px; color: rgba(255,255,255,.50); font-size: 12px; font-weight: 800; }
.account-v54 .profile-device-facts {
  list-style: none;
  padding: 0;
  margin: 12px 0 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}
.account-v54 .profile-device-facts li {
  min-width: 0;
  border-radius: 13px;
  padding: 8px 10px;
  background: rgba(0,0,0,.28);
}
.account-v54 .profile-device-facts span {
  display: block;
  color: rgba(255,255,255,.40);
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 950;
}
.account-v54 .profile-device-facts b {
  display: block;
  margin-top: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
  font-size: 11px;
  font-weight: 850;
}
.account-v54 .profile-device-row__actions { display: flex; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.account-v54 .profile-device-action { display:inline-flex !important; align-items:center; gap:7px; }
.account-v54 .profile-device-action svg { width: 14px; height: 14px; }
.account-v54 .profile-device-action--danger { background: rgba(255,255,255,.10) !important; color: #fff !important; border: 1px solid rgba(255,255,255,.10) !important; }

/* Exact filter-like account sheets */
body.filter-modal-open .content { overflow: hidden !important; }
.account-modal-v54.filter-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 100000 !important;
  display: grid !important;
  place-items: center !important;
  padding: 32px !important;
  overflow: auto !important;
  background: rgba(0,0,0,.72) !important;
  backdrop-filter: blur(26px) saturate(116%) !important;
}
.account-modal-v54.filter-overlay.is-hidden { display: none !important; }
.account-settings-sheet--v54.filter-sheet {
  position: relative !important;
  width: min(1800px, calc(100vw - 64px)) !important;
  max-width: none !important;
  max-height: calc(100vh - 64px) !important;
  overflow: auto !important;
  border-radius: 30px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,255,255,.085), transparent 34rem),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
    #151519 !important;
  box-shadow: 0 40px 120px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.10) !important;
  padding: 86px 108px 48px !important;
  color: #fff !important;
  scrollbar-width: none !important;
}
.account-settings-sheet--v54.filter-sheet::-webkit-scrollbar { width: 0 !important; height: 0 !important; }
.account-settings-sheet--v54 .filter-sheet__collapse {
  position: absolute !important;
  top: 30px !important;
  right: 30px !important;
  width: 58px !important;
  height: 58px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
}
.account-settings-sheet--v54 .filter-sheet__collapse svg { width: 24px !important; height: 24px !important; }
.account-settings-sheet--v54 h2 {
  margin: 0 0 64px !important;
  text-align: center !important;
  color: #fff !important;
  font-size: clamp(54px, 7vw, 92px) !important;
  line-height: .92 !important;
  letter-spacing: -.075em !important;
  font-weight: 1000 !important;
}
.account-modal-v54__content { display: grid; gap: 30px; }
.account-modal-v54__block { display: grid; gap: 20px; }
.account-modal-v54__block-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 20px;
  color: rgba(255,255,255,.56);
  font-size: 14px;
  font-weight: 950;
}
.account-modal-v54__block-head span {
  color: rgba(255,255,255,.82);
  font-size: 22px;
  letter-spacing: -.035em;
  font-weight: 1000;
}
.account-modal-v54__block-head small { color: rgba(255,255,255,.48); font-size: 14px; font-weight: 850; }
.account-settings-sheet--v54 .avatar-preset-grid {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  max-height: none !important;
  overflow: visible !important;
}
.account-settings-sheet--v54 .avatar-preset {
  min-height: 180px !important;
  border-radius: 26px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  gap: 10px !important;
  padding: 18px !important;
}
.account-settings-sheet--v54 .avatar-preset:hover,
.account-settings-sheet--v54 .avatar-preset:focus-visible {
  border-color: rgba(255,255,255,.34) !important;
  background: rgba(255,255,255,.10) !important;
  transform: translateY(-2px);
}
.account-settings-sheet--v54 .avatar-preset.is-selected {
  background: #fff !important;
  color: #050505 !important;
  border-color: #fff !important;
  box-shadow: 0 24px 70px rgba(255,255,255,.13) !important;
}
.account-settings-sheet--v54 .avatar-preset__image {
  width: 86px !important;
  height: 86px !important;
  border-radius: 24px !important;
  background-size: cover !important;
  background-position: center !important;
}
.account-settings-sheet--v54 .avatar-preset small {
  color: currentColor !important;
  font-size: 13px !important;
  line-height: 1.12 !important;
  text-align: center !important;
  font-weight: 1000 !important;
}
.account-modal-v54__fields {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.account-settings-sheet--v54 .profile-edit-field { display: grid !important; gap: 10px !important; }
.account-settings-sheet--v54 .profile-edit-field span {
  color: rgba(255,255,255,.70) !important;
  font-size: 13px !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
}
.account-settings-sheet--v54 .input {
  min-height: 74px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(0,0,0,.28) !important;
  color: #fff !important;
  padding: 0 24px !important;
  font-size: 18px !important;
  font-weight: 850 !important;
}
.account-settings-sheet--v54 .input:focus { border-color: rgba(255,255,255,.58) !important; box-shadow: 0 0 0 5px rgba(255,255,255,.08) !important; }
.account-modal-v54__actions {
  margin-top: 34px !important;
  display: flex !important;
  justify-content: center !important;
  gap: 14px !important;
}
.account-settings-sheet--v54 .profile-edit-actions .btn,
.account-settings-sheet--v54 .profile-edit-actions .btn--primary {
  min-width: 190px !important;
  min-height: 62px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 1000 !important;
}
.account-settings-sheet--v54 .profile-edit-actions .btn--primary { background: #fff !important; color: #050505 !important; border-color: #fff !important; }
.account-device-sheet--v54.filter-sheet { width: min(1250px, calc(100vw - 64px)) !important; }
.account-device-sheet--v54 .account-modal-v54__device { max-width: 940px; margin: 0 auto; display: grid; gap: 18px; }
.account-device-sheet--v54 #deviceEditMeta {
  min-height: 72px;
  border-radius: 20px;
  padding: 18px 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.20);
  color: rgba(255,255,255,.62) !important;
  font-size: 15px;
  line-height: 1.45;
  font-weight: 850;
}

@media (max-width: 980px) {
  .account-v54 { width: min(100%, calc(100vw - 24px)); }
  .account-v54-hero { grid-template-columns: 1fr; padding: 24px; min-height: 0; }
  .account-v54-hero__identity { align-items: flex-start; }
  .account-v54-avatar { width: 94px !important; height: 94px !important; border-radius: 28px !important; }
  .account-v54-hero__actions { justify-items: start; min-width: 0; }
  .account-v54-online { position: static !important; margin-top: 18px; }
  .account-v54-stats { grid-template-columns: repeat(2, 1fr); }
  .account-v54-summary-card,
  .account-v54-summary-card--wide,
  .account-v54-panel,
  .account-v54-panel--wide { grid-column: 1 / -1; }
  .account-v54 .profile-device-row { grid-template-columns: 48px 1fr !important; }
  .account-v54 .profile-device-row__actions { grid-column: 1 / -1; justify-content: flex-start; }
  .account-v54 .profile-device-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .account-settings-sheet--v54.filter-sheet { width: calc(100vw - 20px) !important; max-height: calc(100vh - 20px) !important; padding: 68px 18px 26px !important; border-radius: 24px !important; }
  .account-settings-sheet--v54 h2 { font-size: 42px !important; margin-bottom: 34px !important; }
  .account-settings-sheet--v54 .avatar-preset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .account-modal-v54__fields { grid-template-columns: 1fr; }
}


/* ===== KINOLOT account cabinet v55 — clean black/white rebuild ===== */
body[data-page="account"] {
  background: #000 !important;
}
body[data-page="account"] .content {
  padding-top: 108px !important;
  background:
    radial-gradient(circle at 50% -10%, rgba(255,255,255,.055), transparent 42rem),
    radial-gradient(circle at 90% 8%, rgba(255,255,255,.025), transparent 32rem),
    #000 !important;
}
body[data-page="account"] .page-title,
body[data-page="account"] .topbar__title,
body[data-page="account"] .profile-office__head,
body[data-page="account"] .profile-office__back { display: none !important; }
.account-v55-page { padding: 0 !important; }
.account-v55 {
  --panel: #141416;
  --panel-2: #1b1b1e;
  --line: rgba(255,255,255,.13);
  --line-soft: rgba(255,255,255,.08);
  --text: #f5f5f7;
  --muted: rgba(245,245,247,.58);
  --soft: rgba(245,245,247,.36);
  width: min(1180px, calc(100vw - 52px));
  margin: 0 auto 80px !important;
  display: grid;
  gap: 16px;
  color: var(--text);
}
.account-v55 * { box-sizing: border-box; }
.account-v55-card,
.account-v55-logout,
.account-v55 .profile-media-row,
.account-v55 .profile-device-row {
  border: 1px solid var(--line) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.025)),
    var(--panel) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 24px 70px rgba(0,0,0,.48) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
}
.account-v55-grid { display: grid; gap: 16px; }
.account-v55-grid--top { grid-template-columns: minmax(0, 2fr) minmax(300px, .95fr); align-items: stretch; }
.account-v55-grid--summary { grid-template-columns: minmax(300px, .78fr) minmax(0, 1.6fr); }
.account-v55-identity {
  position: relative;
  min-height: 230px;
  border-radius: 34px;
  padding: 30px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-rows: 1fr auto;
  gap: 22px 26px;
  overflow: hidden;
}
.account-v55-identity::after,
.account-v55-subscription::after,
.account-v55-tile--wide::after {
  content: "";
  position: absolute;
  pointer-events: none;
  inset: 0;
  background: radial-gradient(circle at 82% 0%, rgba(255,255,255,.12), transparent 21rem);
  opacity: .58;
}
.account-v55-identity > *, .account-v55-subscription > *, .account-v55-tile--wide > * { position: relative; z-index: 1; }
.account-v55-identity__main { display:flex; align-items:center; gap: 24px; min-width:0; }
.account-v55-avatar {
  width: 116px !important;
  height: 116px !important;
  flex: 0 0 116px;
  border-radius: 32px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  background: linear-gradient(145deg, #fff, #dfe3ea) !important;
  background-size: cover !important;
  background-position: center !important;
  color: #050505 !important;
  font-size: 28px !important;
  font-weight: 1000 !important;
  box-shadow: 0 22px 60px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.75) !important;
}
.account-v55-avatar.has-image { color: transparent !important; }
.account-v55-avatar:hover,
.account-v55-avatar:focus-visible { transform: translateY(-2px); box-shadow: 0 30px 76px rgba(0,0,0,.48), 0 0 0 4px rgba(255,255,255,.08) !important; }
.account-v55-identity__text { min-width:0; display:grid; align-content:center; }
.account-v55-label {
  display:block;
  color: var(--soft);
  font-size: 12px;
  letter-spacing: .24em;
  text-transform: uppercase;
  font-weight: 950;
}
.account-v55-identity__text strong {
  margin-top: 8px;
  max-width: 520px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color: #fff;
  font-size: clamp(42px, 4.8vw, 62px);
  line-height: .92;
  letter-spacing: -.07em;
  font-weight: 1000;
}
.account-v55-identity__text span:not(.account-v55-label) {
  margin-top: 10px;
  color: rgba(255,255,255,.78);
  font-size: 16px;
  line-height:1.2;
  font-weight: 850;
}
.account-v55-identity__text small { margin-top:5px; color: var(--muted); font-size:13px; font-weight:800; }
.account-v55-identity__aside { display:grid; justify-items:end; align-content:center; gap: 14px; min-width: 250px; }
.account-v55-id {
  max-width: 285px;
  min-height: 44px;
  border-radius: 999px;
  padding: 6px 7px 6px 15px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.28);
  display:flex;
  align-items:center;
  gap:8px;
}
.account-v55-id span { color: var(--soft); font-size: 10px; letter-spacing:.09em; text-transform:uppercase; font-weight:1000; }
.account-v55-id b { max-width:150px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:12px; font-weight:950; }
.account-v55-id button,
.account-v55-socials button {
  width:34px; height:34px; border-radius:50%; display:grid; place-items:center;
  background: rgba(255,255,255,.10); color:#fff; border:1px solid rgba(255,255,255,.08);
}
.account-v55-id button:hover,
.account-v55-socials button:hover { background:#fff; color:#050505; }
.account-v55-id svg, .account-v55-socials svg { width:16px; height:16px; }
.account-v55-primary,
.account-v55 .profile-media-row__open,
.account-v55 .profile-device-action {
  min-height: 46px !important;
  border-radius: 999px !important;
  padding: 0 20px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap: 9px !important;
  background: #fff !important;
  color: #050505 !important;
  border: 1px solid #fff !important;
  font-size: 13px !important;
  line-height:1 !important;
  font-weight: 1000 !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.30) !important;
}
.account-v55-primary svg, .account-v55 .profile-device-action svg { width:16px; height:16px; }
.account-v55-primary:hover,
.account-v55 .profile-media-row__open:hover,
.account-v55 .profile-device-action:hover { transform: translateY(-1px); filter: brightness(.96); }
.account-v55-status {
  grid-column: 1 / -1;
  min-height: 50px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(0,0,0,.28) !important;
  display:flex !important;
  align-items:center;
  gap:12px;
  padding: 0 16px !important;
  color: var(--muted) !important;
}
.account-v55-status__dot { width:8px; height:8px; border-radius:50%; background:#fff; box-shadow:0 0 0 5px rgba(255,255,255,.08); flex:0 0 auto; }
.account-v55-status b { color:#fff; font-size:13px; font-weight:950; }
.account-v55-status span { color:var(--muted); margin-left:8px; font-size:12px; font-weight:800; }
.account-v55-subscription { position:relative; overflow:hidden; border-radius:34px; padding:28px; display:flex; justify-content:space-between; gap:18px; min-height:230px; }
.account-v55-subscription strong { display:block; margin: 18px 0 9px; color:#fff !important; background:transparent !important; font-size:32px; line-height:1; letter-spacing:-.05em; font-weight:1000; }
.account-v55-subscription small, .account-v55-subscription p { color: var(--muted); font-size:13px; line-height:1.35; font-weight:850; margin:0; }
.account-v55-subscription > svg { width:112px; height:112px; align-self:center; color:rgba(255,255,255,.12); }
.account-v55-stats { display:grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap:16px; }
.account-v55-stats article { min-height:126px; border-radius:28px; padding:22px; display:grid; align-content:end; }
.account-v55-stats span { color:#fff; font-size:46px; line-height:.9; letter-spacing:-.07em; font-weight:1000; }
.account-v55-stats b { margin-top:9px; color:var(--muted); font-size:14px; font-weight:900; }
.account-v55-tile { position:relative; min-height:170px; overflow:hidden; border-radius:30px; padding:26px; display:flex; justify-content:space-between; gap:18px; }
.account-v55-tile strong { display:block; margin:14px 0 8px; color:#fff; font-size:30px; line-height:.98; letter-spacing:-.055em; font-weight:1000; }
.account-v55-tile small { color:var(--muted); font-size:13px; font-weight:850; }
.account-v55-tile > i, .account-v55-tile > svg { width:100px; height:100px; color:rgba(255,255,255,.11); align-self:center; }
.account-v55-tile--wide { min-height:170px; }
.account-v55-socials { display:flex; gap:10px; margin-top:20px; }
.account-v55-shapes { position:absolute !important; right: 30px; bottom: -26px; width:260px; height:140px; opacity:.68; }
.account-v55-shapes span { position:absolute; width:124px; height:94px; border-radius:34px; background:rgba(255,255,255,.12); transform:rotate(-10deg); }
.account-v55-shapes span:nth-child(2){ right:24px; top:18px; background:rgba(255,255,255,.20); }
.account-v55-library { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap:16px; }
.account-v55-panel { border-radius:30px; padding:22px; min-height:210px; }
.account-v55-panel--wide { grid-column:1 / -1; min-height:240px; }
.account-v55-panel header, .account-v55-sessions header { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin:0 0 16px; }
.account-v55-panel header > div, .account-v55-sessions header > div { display:flex; align-items:center; gap:10px; min-width:0; }
.account-v55-panel h3, .account-v55-sessions h3 { margin:0; color:#fff; font-size:28px; line-height:1; letter-spacing:-.05em; font-weight:1000; }
.account-v55-panel svg, .account-v55-sessions header svg { width:20px; height:20px; color:rgba(255,255,255,.76); }
.account-v55-panel header small { min-width:30px; height:30px; border-radius:50%; background:#fff; color:#050505; display:grid; place-items:center; font-size:12px; font-weight:1000; }
.account-v55 .profile-list { display:grid !important; gap:10px !important; color:var(--muted) !important; }
.account-v55 .profile-media-row { min-height:86px !important; border-radius:22px !important; padding:10px !important; display:grid !important; grid-template-columns:62px minmax(0, 1fr) auto !important; align-items:center !important; gap:14px !important; background:rgba(0,0,0,.32) !important; box-shadow:none !important; }
.account-v55 .profile-media-row__poster { width:62px !important; height:62px !important; border-radius:17px !important; background-size:cover !important; background-position:center !important; background-color:rgba(255,255,255,.08) !important; }
.account-v55 .profile-media-row__poster span { color:rgba(255,255,255,.62); font-weight:1000; }
.account-v55 .profile-media-row__body { min-width:0; display:grid; gap:4px; }
.account-v55 .profile-media-row__body b { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:14px; font-weight:1000; }
.account-v55 .profile-media-row__body small { color:var(--muted); font-size:12px; font-weight:800; }
.account-v55 .profile-empty-state { min-height:120px; border-radius:22px; display:grid; place-items:center; text-align:center; gap:7px; border:1px dashed rgba(255,255,255,.13); background:rgba(0,0,0,.22); color:var(--muted); }
.account-v55 .profile-empty-state span { width:46px; height:5px; border-radius:999px; background:rgba(255,255,255,.16); }
.account-v55 .profile-empty-state b { color:#fff; }
.account-v55 .profile-empty-state small { color:var(--soft); }
.account-v55-sessions { border-radius:30px; padding:22px; display:grid; gap:12px; }
.account-v55-sessions p { margin:4px 0 0; color:var(--muted); font-size:13px; font-weight:850; }
.account-v55 .profile-device-row { min-height:auto !important; border-radius:24px !important; padding:16px !important; display:grid !important; grid-template-columns:54px minmax(0,1fr) auto !important; gap:16px !important; align-items:center !important; background:rgba(0,0,0,.30) !important; box-shadow:none !important; }
.account-v55 .profile-device-row.is-current { border-color:rgba(255,255,255,.42) !important; }
.account-v55 .profile-device-row__icon { width:54px !important; height:54px !important; border-radius:16px !important; display:grid !important; place-items:center !important; background:#fff !important; color:#050505 !important; }
.account-v55 .profile-device-row__icon svg { width:23px; height:23px; }
.account-v55 .profile-device-row__title { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.account-v55 .profile-device-row__title b { color:#fff; font-size:15px; font-weight:1000; }
.account-v55 .profile-device-row__title em { padding:4px 8px; border-radius:999px; background:#fff; color:#050505; font-style:normal; font-size:10px; font-weight:1000; text-transform:uppercase; }
.account-v55 .profile-device-row__main small { display:block; margin-top:4px; color:var(--muted); font-size:12px; font-weight:850; }
.account-v55 .profile-device-facts { list-style:none; padding:0; margin:12px 0 0; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:8px; }
.account-v55 .profile-device-facts li { min-width:0; border-radius:13px; padding:8px 10px; background:#070707; }
.account-v55 .profile-device-facts span { display:block; color:var(--soft); font-size:10px; text-transform:uppercase; letter-spacing:.08em; font-weight:950; }
.account-v55 .profile-device-facts b { display:block; margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#fff; font-size:11px; font-weight:850; }
.account-v55 .profile-device-row__actions { display:flex; justify-content:flex-end; gap:8px; flex-wrap:wrap; }
.account-v55 .profile-device-action--danger { background:rgba(255,255,255,.10) !important; color:#fff !important; border-color:rgba(255,255,255,.12) !important; box-shadow:none !important; }
.account-v55-logout { width:max-content; min-height:50px; border-radius:18px; padding:0 20px; display:inline-flex; align-items:center; gap:10px; color:rgba(255,255,255,.86); font-size:13px; font-weight:950; }
.account-v55-logout:hover { background:#fff !important; color:#050505 !important; }
.account-v55-logout svg { width:18px; height:18px; }

/* v55 account modals: exact filter sheet style, but scoped */
body.is-account-modal-open { overflow:hidden !important; }
body.is-account-modal-open .topbar,
body.is-account-modal-open .sidebar,
body.is-account-modal-open .bottom-nav,
body.is-account-modal-open .mode-fab,
body.is-account-modal-open .drawer { z-index:1 !important; pointer-events:none !important; filter:blur(8px) brightness(.45) !important; }
.account-modal-v55.filter-overlay {
  position:fixed !important;
  inset:0 !important;
  z-index:2147483647 !important;
  display:grid !important;
  place-items:start center !important;
  padding:42px 28px !important;
  overflow:auto !important;
  background:rgba(0,0,0,.74) !important;
  backdrop-filter:blur(30px) saturate(125%) !important;
  -webkit-backdrop-filter:blur(30px) saturate(125%) !important;
}
.account-modal-v55.filter-overlay.is-hidden { display:none !important; }
.account-settings-sheet--v55.filter-sheet {
  position:relative !important;
  width:min(1500px, calc(100vw - 56px)) !important;
  max-width:none !important;
  max-height:calc(100vh - 84px) !important;
  overflow:auto !important;
  border-radius:34px !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:linear-gradient(180deg, rgba(28,28,30,.97), rgba(16,16,18,.98)) !important;
  color:#fff !important;
  box-shadow:0 42px 130px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.10) !important;
  padding:76px clamp(28px,5vw,88px) 42px !important;
  scrollbar-width:none !important;
}
.account-settings-sheet--v55.filter-sheet::-webkit-scrollbar { width:0 !important; height:0 !important; }
.account-settings-sheet--v55 .filter-sheet__collapse {
  position:absolute !important;
  top:28px !important;
  right:28px !important;
  width:58px !important;
  height:58px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  border:1px solid rgba(255,255,255,.14) !important;
  background:rgba(255,255,255,.10) !important;
  color:#fff !important;
}
.account-settings-sheet--v55 .filter-sheet__collapse:hover { background:#fff !important; color:#050505 !important; }
.account-settings-sheet--v55 .filter-sheet__collapse svg { width:24px !important; height:24px !important; }
.account-settings-sheet--v55 h2 { margin:0 0 56px !important; text-align:center !important; color:#fff !important; font-size:clamp(48px, 6vw, 74px) !important; line-height:.92 !important; letter-spacing:-.075em !important; font-weight:1000 !important; }
.account-settings-v55 { display:grid; gap:30px; }
.account-settings-v55__section { display:grid; gap:20px; }
.account-settings-v55__head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; }
.account-settings-v55__head span { color:#fff; font-size:20px; letter-spacing:-.035em; font-weight:1000; }
.account-settings-v55__head small { color:rgba(255,255,255,.46); font-size:14px; font-weight:850; }
.account-settings-sheet--v55 .avatar-preset-grid { display:grid !important; grid-template-columns:repeat(5, minmax(0,1fr)) !important; gap:16px !important; max-height:none !important; overflow:visible !important; }
.account-settings-sheet--v55 .avatar-preset { min-height:158px !important; border-radius:24px !important; border:1px solid rgba(255,255,255,.12) !important; background:rgba(255,255,255,.055) !important; color:#fff !important; display:grid !important; place-items:center !important; gap:10px !important; padding:16px !important; box-shadow:none !important; }
.account-settings-sheet--v55 .avatar-preset:hover,
.account-settings-sheet--v55 .avatar-preset:focus-visible { border-color:rgba(255,255,255,.38) !important; background:rgba(255,255,255,.10) !important; transform:translateY(-2px); }
.account-settings-sheet--v55 .avatar-preset.is-selected { background:#fff !important; color:#050505 !important; border-color:#fff !important; box-shadow:0 22px 58px rgba(255,255,255,.12) !important; }
.account-settings-sheet--v55 .avatar-preset__image { width:78px !important; height:78px !important; border-radius:22px !important; background-size:cover !important; background-position:center !important; }
.account-settings-sheet--v55 .avatar-preset small { color:currentColor !important; font-size:13px !important; line-height:1.12 !important; text-align:center !important; font-weight:1000 !important; }
.account-settings-v55__section--password { padding-top:28px; border-top:1px solid rgba(255,255,255,.10); }
.account-settings-v55__fields { display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px; }
.account-settings-sheet--v55 .profile-edit-field { display:grid !important; gap:10px !important; }
.account-settings-sheet--v55 .profile-edit-field span { color:rgba(255,255,255,.70) !important; font-size:12px !important; letter-spacing:.10em !important; text-transform:uppercase !important; font-weight:1000 !important; }
.account-settings-sheet--v55 .input { width:100% !important; min-height:66px !important; border-radius:20px !important; border:1px solid rgba(255,255,255,.12) !important; background:rgba(0,0,0,.32) !important; color:#fff !important; padding:0 22px !important; font-size:17px !important; font-weight:850 !important; outline:none !important; }
.account-settings-sheet--v55 .input::placeholder { color:rgba(255,255,255,.35) !important; }
.account-settings-sheet--v55 .input:focus { border-color:rgba(255,255,255,.58) !important; box-shadow:0 0 0 5px rgba(255,255,255,.08) !important; }
.account-settings-v55__actions { display:flex !important; justify-content:center !important; gap:14px !important; margin-top:32px !important; padding:0 !important; background:transparent !important; position:static !important; }
.account-settings-v55__actions .btn { min-width:190px !important; min-height:58px !important; border-radius:999px !important; border:1px solid rgba(255,255,255,.14) !important; background:rgba(255,255,255,.10) !important; color:#fff !important; font-size:16px !important; font-weight:1000 !important; box-shadow:none !important; }
.account-settings-v55__actions .btn--primary { background:#fff !important; color:#050505 !important; border-color:#fff !important; }
.account-device-sheet--v55.filter-sheet { width:min(980px, calc(100vw - 56px)) !important; }
.account-device-v55 { width:min(760px, 100%); margin:0 auto; display:grid; gap:18px; }
.account-device-v55 #deviceEditMeta { margin:0 !important; border-radius:20px; border:1px solid rgba(255,255,255,.10); background:rgba(0,0,0,.26); padding:18px 20px; color:rgba(255,255,255,.62) !important; line-height:1.48; font-size:14px; font-weight:850; }
@media (max-width: 980px) {
  body[data-page="account"] .content { padding-top:88px !important; }
  .account-v55 { width:min(100%, calc(100vw - 22px)); }
  .account-v55-grid--top,
  .account-v55-grid--summary,
  .account-v55-library { grid-template-columns:1fr; }
  .account-v55-identity { grid-template-columns:1fr; padding:22px; border-radius:28px; min-height:0; }
  .account-v55-identity__main { align-items:flex-start; }
  .account-v55-avatar { width:88px !important; height:88px !important; flex-basis:88px; border-radius:26px !important; }
  .account-v55-identity__text strong { font-size:38px; white-space:normal; }
  .account-v55-identity__aside { justify-items:start; min-width:0; }
  .account-v55-id { max-width:100%; }
  .account-v55-stats { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .account-v55 .profile-media-row { grid-template-columns:56px minmax(0, 1fr) !important; }
  .account-v55 .profile-media-row__open { grid-column:1 / -1; width:100%; }
  .account-v55 .profile-device-row { grid-template-columns:48px minmax(0,1fr) !important; }
  .account-v55 .profile-device-row__actions { grid-column:1 / -1; justify-content:stretch; }
  .account-v55 .profile-device-action { flex:1; }
  .account-v55 .profile-device-facts { grid-template-columns:repeat(2, minmax(0,1fr)); }
  .account-modal-v55.filter-overlay { padding:10px !important; }
  .account-settings-sheet--v55.filter-sheet { width:100% !important; max-height:calc(100vh - 20px) !important; padding:70px 18px 24px !important; border-radius:26px !important; }
  .account-settings-sheet--v55 h2 { font-size:42px !important; margin-bottom:32px !important; }
  .account-settings-v55__head { display:grid; align-items:start; }
  .account-settings-sheet--v55 .avatar-preset-grid { grid-template-columns:repeat(2, minmax(0,1fr)) !important; }
  .account-settings-v55__fields { grid-template-columns:1fr; }
  .account-settings-v55__actions { flex-direction:column-reverse !important; }
  .account-settings-v55__actions .btn { width:100%; }
}
@media (max-width: 560px) {
  .account-v55-stats { grid-template-columns:1fr; }
  .account-v55-identity__main { flex-direction:column; }
  .account-v55 .profile-device-facts { grid-template-columns:1fr; }
}

/* v55 final small overrides against older profile-card-mini styles */
.account-v55-status.profile-card-mini,
.account-v55-status.profile-card-mini--premium {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  min-height: 50px !important;
  padding: 0 16px !important;
  border-radius: 18px !important;
  background: rgba(0,0,0,.28) !important;
  display: flex !important;
  justify-content: flex-start !important;
  box-shadow: none !important;
}
.account-v55-status.profile-card-mini--premium b { font-size: 13px !important; }
.account-v55-status div span { margin-left: 8px !important; }
.account-v55-status .account-v55-status__dot { margin-left: 0 !important; }

/* v56: detail page rebuild + account cleanup */
.account-v55-stats,
.account-v55-grid--summary,
.account-v56-hidden-metrics { display: none !important; }

body[data-page="account"] .account-v55 {
  gap: 18px !important;
}

body[data-page="media"] .content {
  background:
    radial-gradient(circle at 72% 5%, rgba(255,255,255,.075), transparent 34rem),
    radial-gradient(circle at 8% 30%, rgba(255,255,255,.04), transparent 30rem),
    #000 !important;
}

body[data-page="media"] .topbar__title { display:none !important; }
body[data-page="media"] .media-content { width: min(1440px, calc(100vw - 96px)); margin: 0 auto; }

.apple-detail-shell {
  display: grid;
  gap: clamp(18px, 2.2vw, 32px);
  padding-bottom: 64px;
}

.apple-detail-hero {
  position: relative;
  min-height: clamp(560px, 72vh, 860px);
  display: grid;
  grid-template-columns: minmax(220px, 330px) minmax(0, 1fr);
  align-items: end;
  gap: clamp(26px, 4vw, 62px);
  padding: clamp(32px, 6vw, 86px);
  overflow: hidden;
  isolation: isolate;
  border-radius: clamp(30px, 3.2vw, 54px);
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035) 52%, rgba(255,255,255,.015)), #09090b;
  box-shadow: 0 48px 180px rgba(0,0,0,.78), inset 0 1px 0 rgba(255,255,255,.14);
}

.apple-detail-backdrop {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image:
    linear-gradient(90deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.78) 34%, rgba(0,0,0,.34) 70%, rgba(0,0,0,.78) 100%),
    linear-gradient(0deg, #000 0%, rgba(0,0,0,.64) 28%, rgba(0,0,0,.14) 72%),
    var(--detail-bg);
  background-size: cover;
  background-position: center;
  filter: saturate(1.04) contrast(1.03);
  transform: scale(1.02);
}

.apple-detail-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.14), transparent 19rem),
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.08), transparent 25rem),
    linear-gradient(180deg, rgba(255,255,255,.05), transparent 30%);
}

.apple-detail-poster {
  width: min(100%, 320px);
  aspect-ratio: 2 / 3;
  border-radius: 28px;
  background: linear-gradient(135deg, rgba(255,255,255,.16), rgba(255,255,255,.035));
  background-size: cover;
  background-position: center;
  box-shadow: 0 36px 110px rgba(0,0,0,.7), 0 0 0 1px rgba(255,255,255,.13), inset 0 1px 0 rgba(255,255,255,.16);
  display: grid;
  place-items: center;
  color: rgba(255,255,255,.78);
  font-weight: 950;
  letter-spacing: -.06em;
}

.apple-detail-copy {
  max-width: 900px;
  display: grid;
  gap: 18px;
}

.apple-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.apple-detail-meta span,
.apple-detail-tags button,
.apple-episode-meta span {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0 12px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.09);
  color: rgba(245,245,247,.84);
  font-size: 13px;
  font-weight: 850;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.apple-detail-copy h1 {
  margin: 0;
  max-width: 920px;
  color: #f5f5f7;
  font-size: clamp(52px, 7.4vw, 132px);
  line-height: .86;
  font-weight: 1000;
  letter-spacing: -.085em;
}

.apple-detail-tagline {
  margin: 0;
  color: rgba(245,245,247,.82);
  font-size: clamp(18px, 1.6vw, 26px);
  font-weight: 880;
  letter-spacing: -.03em;
}

.apple-detail-overview {
  max-width: 860px;
  margin: 0;
  color: rgba(245,245,247,.72);
  font-size: clamp(16px, 1.05vw, 20px);
  line-height: 1.58;
  font-weight: 620;
}

.apple-detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 4px;
}

.apple-detail-play,
.apple-detail-btn {
  min-height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 0 24px;
  border: 0;
  border-radius: 999px;
  cursor: pointer;
  text-decoration: none;
  font-size: 15px;
  font-weight: 950;
  transition: transform .18s ease, filter .18s ease, background .18s ease;
}

.apple-detail-play {
  background: #f5f5f7;
  color: #050506;
  box-shadow: 0 18px 46px rgba(255,255,255,.18);
}

.apple-detail-btn {
  background: rgba(255,255,255,.11);
  color: #f5f5f7;
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09);
}

.apple-detail-play:hover,
.apple-detail-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.04);
}

.apple-detail-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 380px);
  gap: clamp(18px, 2vw, 28px);
}

.apple-detail-main {
  display: grid;
  gap: clamp(18px, 2vw, 28px);
  min-width: 0;
}

.apple-detail-side {
  display: grid;
  align-content: start;
  gap: 18px;
}

.apple-detail-panel {
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.032) 54%, rgba(255,255,255,.018)),
    rgba(15,15,17,.86);
  box-shadow: 0 26px 86px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.10);
  padding: clamp(22px, 2.4vw, 34px);
  overflow: hidden;
}

.apple-detail-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 18px;
}

.apple-detail-section-head span {
  color: rgba(245,245,247,.48);
  text-transform: uppercase;
  letter-spacing: .18em;
  font-size: 12px;
  font-weight: 950;
}

.apple-detail-section-head h2 {
  margin: 0;
  color: #f5f5f7;
  font-size: clamp(28px, 2.7vw, 46px);
  line-height: .95;
  font-weight: 1000;
  letter-spacing: -.06em;
}

.apple-detail-description p {
  margin: 0;
  color: rgba(245,245,247,.74);
  font-size: 18px;
  line-height: 1.68;
  font-weight: 620;
}

.apple-detail-facts dl {
  display: grid;
  gap: 12px;
  margin: 0;
}

.apple-detail-facts dl > div {
  display: grid;
  grid-template-columns: 100px minmax(0,1fr);
  gap: 12px;
  align-items: baseline;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}

.apple-detail-facts dt {
  color: rgba(245,245,247,.45);
  font-weight: 850;
}

.apple-detail-facts dd {
  margin: 0;
  color: #f5f5f7;
  font-weight: 800;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.apple-detail-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 18px;
}

.apple-detail-tags button {
  border: 1px solid rgba(255,255,255,.12);
  cursor: pointer;
}

.apple-detail-country {
  margin-top: 14px;
  color: rgba(245,245,247,.55);
  font-weight: 760;
  line-height: 1.45;
}

.apple-season-layout {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 18px;
}

.apple-season-tabs {
  display: grid;
  align-content: start;
  gap: 10px;
}

.apple-season-tab {
  min-height: 68px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.055);
  color: rgba(245,245,247,.62);
  cursor: pointer;
  font-weight: 900;
}

.apple-season-tab span {
  color: #f5f5f7;
  font-size: 28px;
  letter-spacing: -.06em;
}

.apple-season-tab.is-active {
  background: #f5f5f7;
  color: #08080a;
  box-shadow: 0 20px 54px rgba(255,255,255,.12);
}

.apple-season-tab.is-active span { color:#08080a; }

.apple-season-pane { display: none; }
.apple-season-pane.is-active { display: grid; gap: 14px; }

.apple-season-translations,
.apple-episode-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}

.apple-season-translations span {
  color: rgba(245,245,247,.5);
  font-weight: 850;
  margin-right: 4px;
}

.apple-season-translations button,
.apple-episode-actions button,
.apple-translation-card,
.apple-rec-chip {
  min-height: 36px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 999px;
  background: rgba(255,255,255,.09);
  color: rgba(245,245,247,.90);
  padding: 0 13px;
  font-weight: 850;
  cursor: pointer;
}

.apple-episode-list { display: grid; gap: 12px; }

.apple-episode-card {
  display: grid;
  grid-template-columns: minmax(160px, 230px) minmax(0, 1fr);
  gap: 16px;
  padding: 14px;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.24);
}

.apple-episode-thumb {
  position: relative;
  min-height: 128px;
  border: 0;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.04));
  background-size: cover;
  background-position: center;
  overflow: hidden;
  cursor: pointer;
  color: #fff;
  font-weight: 1000;
  font-size: 42px;
}

.apple-episode-thumb::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.58));
}

.apple-episode-thumb svg,
.apple-episode-thumb i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
  padding: 12px;
  border-radius: 999px;
  background: rgba(245,245,247,.94);
  color: #08080a;
  box-sizing: content-box;
}

.apple-episode-thumb span { position: relative; z-index: 1; }

.apple-episode-copy { min-width: 0; display: grid; gap: 9px; align-content: center; }
.apple-episode-title { display: grid; gap: 4px; }
.apple-episode-title span { color: rgba(245,245,247,.52); font-weight: 880; }
.apple-episode-title b { color: #f5f5f7; font-size: 19px; line-height: 1.18; letter-spacing: -.03em; }
.apple-episode-meta { display:flex; flex-wrap:wrap; gap:6px; }
.apple-episode-meta span { min-height:26px; font-size:12px; }
.apple-episode-copy p { margin:0; color: rgba(245,245,247,.58); line-height:1.5; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

.apple-translation-grid,
.apple-person-grid,
.apple-rec-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.apple-translation-card {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.apple-person-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 14px;
}

.apple-person-card {
  display: grid;
  gap: 10px;
  padding: 12px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: #f5f5f7;
  text-align: left;
  cursor: pointer;
}

.apple-person-card span {
  width: 100%;
  aspect-ratio: 1 / 1.18;
  border-radius: 16px;
  background: rgba(255,255,255,.10) center/cover no-repeat;
}

.apple-person-card b { font-size: 14px; line-height:1.2; }
.apple-person-card small { color: rgba(245,245,247,.52); font-weight: 760; }

.apple-empty {
  min-height: 110px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  border: 1px dashed rgba(255,255,255,.12);
  background: rgba(255,255,255,.035);
  color: rgba(245,245,247,.50);
  font-weight: 820;
  text-align: center;
}

@media (max-width: 1100px) {
  body[data-page="media"] .media-content { width: min(100%, calc(100vw - 28px)); }
  .apple-detail-hero { grid-template-columns: 1fr; min-height: auto; }
  .apple-detail-poster { width: min(220px, 52vw); }
  .apple-detail-body { grid-template-columns: 1fr; }
  .apple-season-layout { grid-template-columns: 1fr; }
  .apple-season-tabs { display:flex; overflow-x:auto; padding-bottom:6px; }
  .apple-season-tab { flex: 0 0 150px; }
}

@media (max-width: 720px) {
  .apple-detail-hero { padding: 22px; border-radius: 28px; }
  .apple-detail-copy h1 { font-size: 46px; }
  .apple-detail-actions { display:grid; }
  .apple-detail-play, .apple-detail-btn { width:100%; }
  .apple-episode-card { grid-template-columns: 1fr; }
}

/* v58: streaming-like detail social layer */
.apple-social-panel {
  position: relative;
  overflow: hidden;
}

.apple-social-panel::before {
  content: "";
  position: absolute;
  inset: -40% -20% auto auto;
  width: 420px;
  height: 420px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(255,255,255,.11), transparent 62%);
  pointer-events: none;
}

.apple-social-grid {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: 14px;
}

.apple-rating-box,
.apple-reaction-box,
.apple-comments-block {
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07);
}

.apple-rating-box,
.apple-reaction-box {
  padding: 18px;
}

.apple-rating-score {
  display: flex;
  align-items: baseline;
  gap: 6px;
}

.apple-rating-score strong {
  color: #f5f5f7;
  font-size: clamp(54px, 5vw, 82px);
  line-height: .86;
  letter-spacing: -.08em;
  font-weight: 1000;
}

.apple-rating-score span,
.apple-rating-box p,
.apple-rating-box small,
.apple-reaction-head span,
.apple-comments-head span,
.apple-comment-top span {
  color: rgba(245,245,247,.52);
  font-weight: 780;
}

.apple-rating-box p { margin: 8px 0 14px; }
.apple-rating-box small { display: block; margin-top: 10px; line-height: 1.45; }

.apple-star-rate {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.apple-star-rate button {
  width: 34px;
  height: 34px;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 12px;
  background: rgba(255,255,255,.07);
  color: rgba(245,245,247,.42);
  cursor: pointer;
  font-size: 18px;
  transition: transform .16s ease, background .16s ease, color .16s ease;
}

.apple-star-rate button.is-active,
.apple-star-rate button:hover {
  background: #f5f5f7;
  color: #050506;
  transform: translateY(-2px);
}

.apple-reaction-head,
.apple-comments-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
}

.apple-reaction-head b,
.apple-comments-head b {
  color: #f5f5f7;
  font-size: 18px;
  letter-spacing: -.03em;
}

.apple-reaction-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.apple-reaction-row button {
  min-height: 84px;
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 4px;
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 22px;
  background: rgba(255,255,255,.055);
  color: #f5f5f7;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}

.apple-reaction-row button:hover,
.apple-reaction-row button.is-active {
  transform: translateY(-2px);
  background: rgba(255,255,255,.15);
  border-color: rgba(255,255,255,.24);
}

.apple-reaction-row button span { font-size: 28px; }
.apple-reaction-row button b { font-size: 12px; }
.apple-reaction-row button em { color: rgba(245,245,247,.54); font-style: normal; font-size: 12px; }

.apple-comments-block {
  position: relative;
  margin-top: 14px;
  padding: 18px;
}

.apple-comment-form,
.apple-comment-login {
  display: grid;
  gap: 10px;
  margin-bottom: 16px;
}

.apple-comment-form textarea {
  width: 100%;
  min-height: 92px;
  resize: vertical;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 22px;
  background: rgba(255,255,255,.07);
  color: #f5f5f7;
  padding: 16px 18px;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.apple-comment-form textarea:focus { border-color: rgba(255,255,255,.32); }

.apple-comment-form button,
.apple-comment-login button {
  justify-self: start;
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 999px;
  background: #f5f5f7;
  color: #050506;
  padding: 0 16px;
  font-weight: 950;
  cursor: pointer;
}

.apple-comment-login {
  align-items: center;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.06);
  color: rgba(245,245,247,.68);
  font-weight: 760;
}

.apple-comment-list {
  display: grid;
  gap: 12px;
}

.apple-comment {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
}

.apple-comment-avatar {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255,255,255,.18), rgba(255,255,255,.05));
  background-size: cover;
  background-position: center;
  color: #f5f5f7;
  font-weight: 950;
}

.apple-comment-body {
  min-width: 0;
  padding: 14px;
  border-radius: 22px;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.08);
}

.apple-comment-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.apple-comment-top b { color: #f5f5f7; }
.apple-comment-body p { margin: 0; color: rgba(245,245,247,.78); line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; }

.apple-comment-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.apple-comment-actions button {
  border: 0;
  background: transparent;
  color: rgba(245,245,247,.56);
  cursor: pointer;
  font-weight: 850;
  padding: 0;
}

.apple-comment-form--reply { margin: 12px 0 0; }
.apple-comment-form--reply textarea { min-height: 70px; }

.apple-comment-replies {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding-left: 14px;
  border-left: 1px solid rgba(255,255,255,.10);
}

.apple-comments-empty {
  min-height: 86px;
  display: grid;
  place-items: center;
  border-radius: 22px;
  border: 1px dashed rgba(255,255,255,.12);
  color: rgba(245,245,247,.50);
  font-weight: 820;
  text-align: center;
}

@media (max-width: 900px) {
  .apple-social-grid { grid-template-columns: 1fr; }
  .apple-reaction-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .apple-comment-login { grid-template-columns: 1fr; }
}

/* v59: reliable card opening + rebuilt streaming detail page */
.media-card,
.media-card__poster {
  cursor: pointer !important;
}
.media-card__poster {
  appearance: none !important;
  -webkit-appearance: none !important;
  user-select: none !important;
}
.media-card__poster:focus-visible {
  outline: 3px solid rgba(255,255,255,.88) !important;
  outline-offset: 4px !important;
}
.poster-overlay,
.poster-shade,
.poster-badges,
.poster-episode,
.poster-placeholder,
.poster-art {
  pointer-events: none;
}
.poster-actions,
.poster-actions * {
  pointer-events: auto;
}

body[data-page="media"] {
  background: #000 !important;
}
body[data-page="media"] .topbar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
body[data-page="media"] #mediaPage.page {
  padding: 0 !important;
}
body[data-page="media"] #mediaContent {
  margin: 0 !important;
}
.stream-detail-shell {
  --stream-panel: rgba(16, 17, 23, .78);
  --stream-border: rgba(255,255,255,.11);
  color: #f5f5f7 !important;
  min-height: 100vh !important;
  background: #000 !important;
}
.stream-detail-hero {
  position: relative !important;
  min-height: min(840px, 92vh) !important;
  isolation: isolate !important;
  overflow: hidden !important;
  display: grid !important;
  align-items: end !important;
  padding: clamp(92px, 10vh, 150px) clamp(24px, 5.8vw, 110px) clamp(42px, 7vh, 88px) !important;
  background: #000 !important;
}
.stream-detail-hero__bg {
  position: absolute !important;
  inset: -4% !important;
  z-index: -3 !important;
  background: var(--detail-bg, none) center/cover no-repeat !important;
  filter: saturate(1.05) contrast(1.02) brightness(.68) !important;
  transform: scale(1.04) !important;
}
.stream-detail-hero::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -2 !important;
  background:
    radial-gradient(circle at 20% 26%, rgba(255,255,255,.10), transparent 24%),
    linear-gradient(90deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.78) 38%, rgba(0,0,0,.24) 100%),
    linear-gradient(180deg, rgba(0,0,0,.14) 0%, rgba(0,0,0,.22) 52%, #000 100%) !important;
}
.stream-detail-hero::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 0 0 !important;
  height: 32vh !important;
  z-index: -1 !important;
  background: linear-gradient(180deg, transparent, #000 72%) !important;
}
.stream-detail-back {
  position: absolute !important;
  left: clamp(18px, 4.2vw, 78px) !important;
  top: clamp(18px, 3.2vw, 54px) !important;
  z-index: 4 !important;
  min-height: 44px !important;
  padding: 0 16px 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  background: rgba(12,12,16,.46) !important;
  backdrop-filter: blur(20px) !important;
}
.stream-detail-back svg { width: 18px !important; height: 18px !important; }
.stream-detail-back:hover { background: rgba(255,255,255,.14) !important; }
.stream-detail-hero__inner {
  width: min(1440px, 100%) !important;
  display: grid !important;
  grid-template-columns: minmax(190px, 300px) minmax(0, 820px) !important;
  align-items: end !important;
  gap: clamp(28px, 4vw, 64px) !important;
}
.stream-detail-poster {
  width: min(300px, 24vw) !important;
  min-width: 190px !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 26px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: linear-gradient(135deg, #17181f, #050506) center/cover no-repeat !important;
  box-shadow: 0 38px 110px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.10) !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(255,255,255,.34) !important;
  font-weight: 1000 !important;
  letter-spacing: -.06em !important;
}
.stream-detail-copy {
  display: grid !important;
  gap: 18px !important;
  max-width: 860px !important;
  text-shadow: 0 20px 60px rgba(0,0,0,.72) !important;
}
.stream-detail-kicker {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: rgba(255,255,255,.72) !important;
  font-size: 13px !important;
  text-transform: uppercase !important;
  letter-spacing: .18em !important;
  font-weight: 850 !important;
}
.stream-detail-kicker span {
  color: #fff !important;
}
.stream-detail-kicker b {
  padding: 7px 10px !important;
  border-radius: 999px !important;
  color: #0a0a0c !important;
  background: rgba(255,255,255,.90) !important;
  letter-spacing: .05em !important;
}
.stream-detail-copy h1 {
  margin: 0 !important;
  max-width: 980px !important;
  font-size: clamp(48px, 7vw, 118px) !important;
  line-height: .9 !important;
  letter-spacing: -.085em !important;
  font-weight: 1000 !important;
}
.stream-detail-meta,
.stream-detail-meta span {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}
.stream-detail-meta span {
  min-height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  backdrop-filter: blur(18px) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
}
.stream-detail-tagline {
  margin: 0 !important;
  color: rgba(255,255,255,.86) !important;
  font-size: clamp(18px, 1.5vw, 24px) !important;
  font-weight: 760 !important;
}
.stream-detail-overview {
  margin: 0 !important;
  max-width: 780px !important;
  color: rgba(245,245,247,.78) !important;
  font-size: clamp(16px, 1.18vw, 20px) !important;
  line-height: 1.58 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.stream-detail-actions {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;
  margin-top: 4px !important;
}
.stream-detail-play,
.stream-detail-btn {
  min-height: 52px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  border-radius: 16px !important;
  padding: 0 20px !important;
  text-decoration: none !important;
  font-weight: 900 !important;
  letter-spacing: -.02em !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  backdrop-filter: blur(20px) !important;
}
.stream-detail-play {
  color: #050506 !important;
  background: #fff !important;
  border-color: #fff !important;
  box-shadow: 0 18px 60px rgba(255,255,255,.20) !important;
}
.stream-detail-btn {
  color: #fff !important;
  background: rgba(255,255,255,.12) !important;
}
.stream-detail-play:hover,
.stream-detail-btn:hover {
  transform: translateY(-1px) !important;
}
.stream-detail-play svg,
.stream-detail-btn svg { width: 19px !important; height: 19px !important; }
.stream-detail-stats {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(96px, 1fr)) !important;
  gap: 10px !important;
  max-width: 800px !important;
  margin-top: 10px !important;
}
.stream-detail-stats div {
  min-height: 78px !important;
  display: grid !important;
  align-content: center !important;
  gap: 3px !important;
  padding: 12px 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.085) !important;
  backdrop-filter: blur(22px) !important;
}
.stream-detail-stats span {
  font-size: 24px !important;
  font-weight: 1000 !important;
  letter-spacing: -.04em !important;
  color: #fff !important;
}
.stream-detail-stats b {
  font-size: 12px !important;
  color: rgba(255,255,255,.62) !important;
  font-weight: 800 !important;
}
.stream-detail-content {
  width: min(1440px, calc(100% - clamp(28px, 7vw, 132px))) !important;
  margin: -10px auto 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 360px) !important;
  gap: clamp(24px, 3vw, 42px) !important;
  align-items: start !important;
  padding-bottom: 90px !important;
}
.stream-detail-main {
  display: grid !important;
  gap: 22px !important;
  min-width: 0 !important;
}
.stream-detail-aside {
  position: sticky !important;
  top: 92px !important;
  display: grid !important;
  gap: 18px !important;
}
.stream-detail-section,
.stream-detail-shell .apple-detail-panel {
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.040)) !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(24px) !important;
  padding: clamp(20px, 2.2vw, 32px) !important;
}
.stream-section-head,
.stream-detail-shell .apple-detail-section-head {
  display: grid !important;
  gap: 5px !important;
  margin: 0 0 18px !important;
}
.stream-section-head span,
.stream-detail-shell .apple-detail-section-head span {
  color: rgba(255,255,255,.48) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
.stream-section-head h2,
.stream-detail-shell .apple-detail-section-head h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.055em !important;
}
.stream-detail-about p {
  margin: 0 !important;
  color: rgba(245,245,247,.76) !important;
  font-size: 17px !important;
  line-height: 1.68 !important;
}
.stream-detail-shell .apple-detail-facts {
  padding: 22px !important;
}
.stream-detail-shell .apple-detail-facts dl {
  display: grid !important;
  gap: 10px !important;
}
.stream-detail-shell .apple-detail-facts dl > div {
  display: grid !important;
  gap: 4px !important;
  padding: 12px !important;
  border-radius: 16px !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
}
.stream-detail-shell .apple-detail-facts dt {
  color: rgba(255,255,255,.46) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-weight: 900 !important;
}
.stream-detail-shell .apple-detail-facts dd {
  margin: 0 !important;
  color: #fff !important;
  font-weight: 800 !important;
}
.stream-detail-shell .apple-series-panel,
.stream-detail-shell .apple-translations-panel {
  overflow: hidden !important;
}
.stream-detail-shell .apple-season-tabs {
  display: flex !important;
  gap: 10px !important;
  overflow-x: auto !important;
  padding-bottom: 10px !important;
}
.stream-detail-shell .apple-season-tab,
.stream-detail-shell .apple-translation-card,
.stream-detail-shell .apple-rec-chip,
.stream-detail-shell .apple-person-card {
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
}
.stream-detail-shell .apple-season-tab.is-active,
.stream-detail-shell .apple-season-tab:hover,
.stream-detail-shell .apple-translation-card:hover,
.stream-detail-shell .apple-rec-chip:hover,
.stream-detail-shell .apple-person-card:hover {
  background: rgba(255,255,255,.14) !important;
  border-color: rgba(255,255,255,.22) !important;
}
.stream-detail-shell .apple-social-panel {
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.12), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)) !important;
}
.stream-detail-shell .apple-rating-box,
.stream-detail-shell .apple-reaction-box,
.stream-detail-shell .apple-comment,
.stream-detail-shell .apple-comment-form,
.stream-detail-shell .apple-comment-login {
  background: rgba(0,0,0,.20) !important;
  border-color: rgba(255,255,255,.10) !important;
}
.stream-detail-shell .apple-star-rate button {
  color: rgba(255,255,255,.30) !important;
}
.stream-detail-shell .apple-star-rate button.is-active,
.stream-detail-shell .apple-star-rate button:hover {
  color: #fff !important;
  text-shadow: 0 0 22px rgba(255,255,255,.65) !important;
}
.stream-detail-shell .apple-reaction-row button {
  background: rgba(255,255,255,.06) !important;
  border-color: rgba(255,255,255,.09) !important;
}
.stream-detail-shell .apple-reaction-row button.is-active,
.stream-detail-shell .apple-reaction-row button:hover {
  background: rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.22) !important;
}
@media (max-width: 1180px) {
  .stream-detail-hero__inner { grid-template-columns: 220px minmax(0, 1fr) !important; }
  .stream-detail-content { grid-template-columns: 1fr !important; }
  .stream-detail-aside { position: static !important; }
}
@media (max-width: 760px) {
  .stream-detail-hero { min-height: auto !important; padding: 86px 18px 38px !important; }
  .stream-detail-hero__inner { grid-template-columns: 1fr !important; align-items: start !important; }
  .stream-detail-poster { width: 158px !important; min-width: 0 !important; border-radius: 20px !important; }
  .stream-detail-copy h1 { font-size: clamp(38px, 12vw, 62px) !important; }
  .stream-detail-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .stream-detail-content { width: calc(100% - 28px) !important; gap: 16px !important; }
  .stream-detail-actions { align-items: stretch !important; }
  .stream-detail-play, .stream-detail-btn { width: 100% !important; }
}


/* KINOLOT v61: hard fix card clicks + full streaming detail redesign */
.media-card,
.media-card__poster,
.showcase-card {
  cursor: pointer !important;
}
.media-card__poster,
.poster-overlay,
.poster-shade,
.poster-badges,
.poster-episode,
.media-card__body {
  pointer-events: auto !important;
}
.media-card__poster::before,
.media-card__poster::after,
.poster-placeholder,
.poster-art,
.poster-art--img {
  pointer-events: none !important;
}
.media-card.is-clicked .media-card__poster {
  transform: scale(.985) !important;
  filter: brightness(1.14) saturate(1.08) !important;
}

body[data-page="media"] .app-shell,
body[data-page="media"] .content,
body[data-page="media"] #mediaPage,
body[data-page="media"] #mediaContent {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
body[data-page="media"] .topbar {
  position: fixed !important;
  top: 18px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: min(1120px, calc(100% - 32px)) !important;
  z-index: 30 !important;
  background: rgba(16,16,18,.48) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  backdrop-filter: blur(28px) saturate(150%) !important;
  box-shadow: 0 20px 70px rgba(0,0,0,.34) !important;
}
body[data-page="media"] .page-head { display:none !important; }

.stream-detail-shell {
  --sd-bg:#030304;
  --sd-panel:rgba(18,18,22,.72);
  --sd-border:rgba(255,255,255,.115);
  --sd-text:#f5f5f7;
  --sd-muted:rgba(245,245,247,.68);
  min-height:100vh !important;
  background: var(--sd-bg) !important;
  color:var(--sd-text) !important;
  overflow:hidden !important;
}
.stream-detail-hero {
  min-height: min(910px, 96vh) !important;
  padding: clamp(112px, 12vh, 168px) clamp(22px, 6vw, 118px) clamp(78px, 11vh, 128px) !important;
  display:flex !important;
  align-items:flex-end !important;
  background:#000 !important;
  position:relative !important;
}
.stream-detail-hero__bg {
  inset:-2% !important;
  opacity:.88 !important;
  filter:saturate(1.05) contrast(1.04) brightness(.58) blur(0) !important;
  transform:scale(1.03) !important;
}
.stream-detail-hero::before {
  background:
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.12), transparent 24%),
    linear-gradient(90deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.84) 34%, rgba(0,0,0,.36) 68%, rgba(0,0,0,.72) 100%),
    linear-gradient(180deg, rgba(0,0,0,.26) 0%, rgba(0,0,0,.12) 48%, #030304 100%) !important;
}
.stream-detail-hero::after {
  height:42vh !important;
  background:linear-gradient(180deg, transparent 0%, rgba(3,3,4,.72) 48%, #030304 100%) !important;
}
.stream-detail-back {
  top:86px !important;
  left:clamp(18px, 5vw, 86px) !important;
  height:44px !important;
  background:rgba(255,255,255,.08) !important;
  border-color:rgba(255,255,255,.16) !important;
  box-shadow:none !important;
}
.stream-detail-hero__inner {
  width:min(1540px,100%) !important;
  grid-template-columns:minmax(170px, 260px) minmax(0, 950px) !important;
  gap:clamp(24px, 4.2vw, 76px) !important;
  align-items:end !important;
}
.stream-detail-poster {
  width:min(260px, 21vw) !important;
  min-width:170px !important;
  border-radius:28px !important;
  border:1px solid rgba(255,255,255,.18) !important;
  box-shadow:0 34px 120px rgba(0,0,0,.82), 0 0 0 1px rgba(255,255,255,.05) inset !important;
  background-size:cover !important;
  background-position:center !important;
}
.stream-detail-copy {
  max-width:960px !important;
  gap:18px !important;
}
.stream-detail-kicker {
  gap:12px !important;
  font-size:12px !important;
  letter-spacing:.22em !important;
  opacity:.92 !important;
}
.stream-detail-kicker b {
  background:#fff !important;
  color:#050506 !important;
  padding:7px 12px !important;
}
.stream-detail-copy h1 {
  max-width:1050px !important;
  font-size:clamp(58px, 7.9vw, 126px) !important;
  letter-spacing:-.095em !important;
  line-height:.84 !important;
  text-wrap:balance !important;
}
.stream-detail-meta span {
  min-height:34px !important;
  padding:0 13px !important;
  background:rgba(255,255,255,.12) !important;
  border-color:rgba(255,255,255,.17) !important;
  font-weight:850 !important;
}
.stream-detail-overview {
  max-width:820px !important;
  color:rgba(245,245,247,.80) !important;
  font-size:clamp(16px, 1.12vw, 20px) !important;
  line-height:1.64 !important;
}
.stream-detail-actions { margin-top:8px !important; gap:12px !important; }
.stream-detail-play,
.stream-detail-btn {
  min-height:54px !important;
  border-radius:18px !important;
  padding:0 22px !important;
}
.stream-detail-btn { background:rgba(255,255,255,.105) !important; }
.stream-detail-stats {
  max-width:860px !important;
  grid-template-columns:repeat(5, minmax(108px,1fr)) !important;
  gap:12px !important;
}
.stream-detail-stats div {
  min-height:82px !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.085) !important;
  border-color:rgba(255,255,255,.12) !important;
}
.stream-detail-stats span { font-size:26px !important; }

.stream-detail-content {
  width:min(1540px, calc(100% - clamp(32px, 7vw, 142px))) !important;
  margin:-34px auto 0 !important;
  grid-template-columns:minmax(0, 1fr) minmax(300px, 392px) !important;
  gap:clamp(22px,3vw,44px) !important;
  position:relative !important;
  z-index:3 !important;
}
.stream-detail-main { gap:24px !important; }
.stream-detail-section,
.stream-detail-shell .apple-detail-panel {
  border-radius:32px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.045)) !important;
  border:1px solid var(--sd-border) !important;
  box-shadow:0 28px 90px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.075) !important;
  backdrop-filter:blur(28px) saturate(145%) !important;
}
.stream-section-head h2,
.stream-detail-shell .apple-detail-section-head h2 {
  font-size:clamp(26px,2.2vw,38px) !important;
  letter-spacing:-.065em !important;
}
.stream-detail-about p { font-size:18px !important; color:rgba(245,245,247,.78) !important; }
.stream-detail-aside { top:102px !important; gap:18px !important; }
.stream-detail-shell .apple-detail-facts { border-radius:32px !important; }
.stream-detail-shell .apple-detail-facts dl > div {
  display:grid !important;
  grid-template-columns:112px 1fr !important;
  align-items:center !important;
  padding:14px !important;
  background:rgba(255,255,255,.065) !important;
}
.stream-detail-shell .apple-detail-facts dt { font-size:10px !important; }
.stream-detail-shell .apple-detail-facts dd { text-align:right !important; }
.stream-detail-shell .apple-social-panel { padding:26px !important; }
.stream-detail-shell .apple-rating-box,
.stream-detail-shell .apple-reaction-box,
.stream-detail-shell .apple-comment-form,
.stream-detail-shell .apple-comment,
.stream-detail-shell .apple-comment-login {
  border-radius:24px !important;
  background:rgba(0,0,0,.24) !important;
  border:1px solid rgba(255,255,255,.10) !important;
}
.stream-detail-shell .apple-reaction-row button,
.stream-detail-shell .apple-star-rate button {
  cursor:pointer !important;
}

body[data-page="home"] .media-card__poster {
  border-radius: 26px !important;
}
body[data-page="home"] .media-card__poster:hover {
  box-shadow: 0 24px 90px rgba(255,255,255,.14), 0 0 0 2px rgba(255,255,255,.92) !important;
}
@media (max-width:1180px) {
  body[data-page="media"] .topbar { top:10px !important; width:calc(100% - 20px) !important; }
  .stream-detail-content { grid-template-columns:1fr !important; margin-top:-22px !important; }
  .stream-detail-aside { position:static !important; }
}
@media (max-width:760px) {
  .stream-detail-hero { padding:96px 16px 46px !important; min-height:auto !important; }
  .stream-detail-hero__inner { grid-template-columns:1fr !important; gap:22px !important; }
  .stream-detail-poster { width:150px !important; min-width:0 !important; border-radius:22px !important; }
  .stream-detail-copy h1 { font-size:clamp(40px, 13vw, 64px) !important; letter-spacing:-.08em !important; }
  .stream-detail-stats { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .stream-detail-content { width:calc(100% - 24px) !important; gap:16px !important; }
  .stream-detail-shell .apple-detail-facts dl > div { grid-template-columns:1fr !important; }
  .stream-detail-shell .apple-detail-facts dd { text-align:left !important; }
}

/* KINOLOT v62: detail page polish — main-like header, smaller title, cleaner streaming layout */
body[data-page="media"] .topbar {
  top: 16px !important;
  width: min(1180px, calc(100% - 44px)) !important;
  min-height: 64px !important;
  border-radius: 999px !important;
  padding: 8px 12px !important;
  background: rgba(7, 7, 9, .22) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: none !important;
  backdrop-filter: blur(10px) saturate(120%) !important;
  transition: background .32s ease, border-color .32s ease, box-shadow .32s ease, backdrop-filter .32s ease, transform .32s ease, top .32s ease !important;
}
body[data-page="media"].detail-nav-solid .topbar {
  background: rgba(17, 17, 20, .76) !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: 0 20px 70px rgba(0,0,0,.34) !important;
  backdrop-filter: blur(28px) saturate(155%) !important;
}
body[data-page="media"] .topbar__title,
body[data-page="media"] #refreshBtn,
body[data-page="media"] .mobile-menu {
  display: none !important;
}
body[data-page="media"] .topbar__actions {
  width: 100% !important;
  min-width: 0 !important;
  justify-content: flex-end !important;
}
body[data-page="media"] .brand,
body[data-page="media"] .nav,
body[data-page="media"] .nav-actions {
  filter: none !important;
}
.stream-detail-back,
.stream-detail-kicker { display: none !important; }
.stream-detail-hero {
  min-height: min(760px, 86vh) !important;
  padding: clamp(104px, 12vh, 150px) clamp(22px, 6vw, 112px) clamp(58px, 9vh, 96px) !important;
}
.stream-detail-hero::before {
  background:
    linear-gradient(90deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.76) 38%, rgba(0,0,0,.25) 72%, rgba(0,0,0,.58) 100%),
    linear-gradient(180deg, rgba(0,0,0,.2) 0%, rgba(0,0,0,.08) 48%, #030304 100%) !important;
}
.stream-detail-hero__inner {
  grid-template-columns: minmax(178px, 250px) minmax(0, 780px) !important;
  gap: clamp(26px, 4vw, 58px) !important;
}
.stream-detail-poster {
  width: min(250px, 20vw) !important;
  border-radius: 30px !important;
}
.stream-detail-copy h1 {
  font-size: clamp(40px, 5.1vw, 78px) !important;
  line-height: .94 !important;
  letter-spacing: -.065em !important;
  max-width: 820px !important;
  margin: 0 !important;
}
.stream-detail-meta {
  gap: 8px !important;
}
.stream-detail-meta span {
  min-height: 30px !important;
  padding: 0 11px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
}
.stream-detail-overview {
  max-width: 720px !important;
  font-size: clamp(15px, 1vw, 18px) !important;
  line-height: 1.58 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
.stream-detail-actions {
  margin-top: 4px !important;
}
.stream-detail-play,
.stream-detail-btn {
  min-height: 48px !important;
  border-radius: 16px !important;
  padding: 0 18px !important;
}
.stream-detail-stats {
  max-width: 760px !important;
  grid-template-columns: repeat(5, minmax(92px, 1fr)) !important;
}
.stream-detail-stats div {
  min-height: 68px !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.07) !important;
}
.stream-detail-stats span { font-size: 22px !important; }
.stream-detail-content {
  width: min(1320px, calc(100% - clamp(28px, 6vw, 112px))) !important;
  margin: -24px auto 96px !important;
  grid-template-columns: minmax(0, 1fr) minmax(286px, 350px) !important;
  gap: clamp(18px, 2.6vw, 36px) !important;
}
.stream-detail-main { gap: 18px !important; }
.stream-detail-section,
.stream-detail-shell .apple-detail-panel,
.stream-detail-shell .apple-detail-facts {
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.032)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: 0 20px 72px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.055) !important;
}
.stream-section-head,
.stream-detail-shell .apple-detail-section-head {
  margin-bottom: 14px !important;
}
.stream-section-head span,
.stream-detail-shell .apple-detail-section-head span {
  color: rgba(255,255,255,.42) !important;
  letter-spacing: .18em !important;
}
.stream-section-head h2,
.stream-detail-shell .apple-detail-section-head h2 {
  font-size: clamp(22px, 1.7vw, 30px) !important;
  letter-spacing: -.045em !important;
}
.stream-detail-about p {
  font-size: 16px !important;
  line-height: 1.7 !important;
}
.stream-detail-aside { top: 96px !important; }
.stream-detail-shell .apple-detail-facts dl > div {
  grid-template-columns: 100px 1fr !important;
  padding: 12px 13px !important;
  border-radius: 16px !important;
}
.stream-detail-shell .apple-social-panel { padding: 22px !important; }
.stream-detail-shell .apple-rating-box,
.stream-detail-shell .apple-reaction-box,
.stream-detail-shell .apple-comment-form,
.stream-detail-shell .apple-comment,
.stream-detail-shell .apple-comment-login {
  border-radius: 20px !important;
}
.stream-detail-shell .apple-reaction-grid,
.stream-detail-shell .apple-translation-grid,
.stream-detail-shell .apple-person-grid,
.stream-detail-shell .apple-recommend-grid {
  gap: 10px !important;
}
@media (max-width: 760px) {
  body[data-page="media"] .topbar { width: calc(100% - 20px) !important; top: 10px !important; }
  .stream-detail-hero { padding: 92px 16px 42px !important; }
  .stream-detail-copy h1 { font-size: clamp(34px, 11vw, 52px) !important; }
  .stream-detail-overview { -webkit-line-clamp: 5 !important; }
  .stream-detail-stats { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .stream-detail-content { width: calc(100% - 24px) !important; grid-template-columns: 1fr !important; }
}

/* KINOLOT v63: one Apple TV navigation model on every page + hard card-open surface */
@media (min-width: 821px) {
  body:not([data-page="login"]) .app-shell {
    display: block !important;
    min-height: 100vh !important;
    grid-template-columns: none !important;
  }

  body:not([data-page="login"]) .topbar {
    display: none !important;
  }

  body:not([data-page="home"]):not([data-page="media"]):not([data-page="login"]) .content {
    height: 100vh !important;
    overflow-y: auto !important;
    padding: 128px clamp(24px, 4.8vw, 86px) 90px !important;
  }

  body[data-page="media"] .content,
  body[data-page="media"] #mediaPage,
  body[data-page="media"] #mediaContent {
    height: auto !important;
    min-height: 100vh !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body:not([data-page="login"]) .sidebar {
    position: fixed !important;
    z-index: 80 !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    overflow: hidden !important;
    transition:
      top .34s cubic-bezier(.2,.8,.2,1),
      width .34s cubic-bezier(.2,.8,.2,1),
      height .34s cubic-bezier(.2,.8,.2,1),
      padding .34s cubic-bezier(.2,.8,.2,1),
      border-radius .34s cubic-bezier(.2,.8,.2,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .34s ease,
      backdrop-filter .34s ease,
      -webkit-backdrop-filter .34s ease !important;
  }

  body:not(.is-nav-condensed):not([data-page="login"]) .sidebar {
    top: 28px !important;
    width: min(1360px, calc(100vw - 88px)) !important;
    height: 78px !important;
    min-height: 78px !important;
    padding: 0 clamp(16px, 1.7vw, 28px) !important;
    gap: clamp(18px, 2.4vw, 44px) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(0,0,0,.58), rgba(0,0,0,.18) 72%, transparent) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.is-nav-condensed:not([data-page="login"]) .sidebar {
    top: 20px !important;
    width: min(1280px, calc(100vw - 76px)) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 18px !important;
    gap: clamp(14px, 1.8vw, 30px) !important;
    border: 1px solid rgba(245,245,247,.14) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(31,32,37,.82), rgba(13,14,17,.74)) !important;
    box-shadow: 0 24px 86px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.13) !important;
    backdrop-filter: blur(34px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(34px) saturate(135%) !important;
  }

  body:not([data-page="login"]) .brand.brand--home {
    justify-self: start !important;
    min-width: 0 !important;
    height: 58px !important;
    padding: 0 clamp(16px, 2vw, 34px) 0 0 !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 18px !important;
  }

  body:not([data-page="login"]) .brand__logo {
    width: 54px !important;
    height: 54px !important;
    border-radius: 16px !important;
    background: #f5f5f7 !important;
    color: #050506 !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 950 !important;
    letter-spacing: -.045em !important;
  }

  body:not([data-page="login"]) .brand strong {
    display: block !important;
    color: #fff !important;
    font-size: clamp(21px, 1.6vw, 30px) !important;
    line-height: 1 !important;
    font-weight: 1000 !important;
    letter-spacing: -.07em !important;
    text-transform: uppercase !important;
  }

  body:not([data-page="login"]) .brand span,
  body:not([data-page="login"]) .sidebar__bottom,
  body:not([data-page="login"]) .control-current,
  body:not([data-page="login"]) #changeControlModeBtn {
    display: none !important;
  }

  body:not([data-page="login"]) .nav {
    justify-self: center !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(16px, 2.1vw, 34px) !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body:not([data-page="login"]) .nav__item {
    position: relative !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(245,245,247,.74) !important;
    box-shadow: none !important;
    font-size: clamp(15px, 1.03vw, 18px) !important;
    font-weight: 820 !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    transform: none !important;
    transition: color .22s ease, opacity .22s ease !important;
  }

  body:not([data-page="login"]) .nav__item svg,
  body:not([data-page="login"]) .nav__item i,
  body:not([data-page="login"]) .nav__item::before {
    display: none !important;
  }

  body:not([data-page="login"]) .nav__item--search svg,
  body:not([data-page="login"]) .nav__item--search i {
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    color: rgba(245,245,247,.82) !important;
  }

  body:not([data-page="login"]) .nav__item:hover,
  body:not([data-page="login"]) .nav__item:focus-visible,
  body:not([data-page="login"]) .nav__item.is-active {
    color: #fff !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body:not([data-page="login"]) .nav__item.is-active::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 5px !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: rgba(245,245,247,.94) !important;
    box-shadow: 0 0 28px rgba(255,255,255,.34) !important;
  }

  body:not([data-page="login"]) .nav-actions {
    justify-self: end !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(12px, 1.5vw, 28px) !important;
  }

  body:not([data-page="login"]) .nav-action {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: rgba(245,245,247,.78) !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    transform: none !important;
  }

  body:not([data-page="login"]) .nav-action:hover,
  body:not([data-page="login"]) .nav-action:focus-visible {
    color: #fff !important;
    background: rgba(255,255,255,.08) !important;
  }

  body:not([data-page="login"]) .nav-action svg,
  body:not([data-page="login"]) .nav-action i {
    width: 26px !important;
    height: 26px !important;
  }

  body:not([data-page="login"]) .nav-action span {
    display: none !important;
  }

  body:not([data-page="login"]) .nav-action--profile {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    background: rgba(255,255,255,.075) !important;
    border: 1px solid rgba(255,255,255,.11) !important;
  }
}

.media-card,
.media-card__poster,
.showcase-card {
  cursor: pointer !important;
  touch-action: pan-x pan-y !important;
}
.media-card::before,
.media-card::after,
.showcase-card::before,
.showcase-card::after,
.poster-shade,
.poster-placeholder,
.poster-art,
.poster-art--img,
.showcase-card__image,
.showcase-blur-layer {
  pointer-events: none !important;
}
.media-card__poster,
.media-card__body,
.poster-overlay,
.showcase-card__content,
.showcase-card__badges {
  pointer-events: auto !important;
}
.poster-actions,
.showcase-card__actions,
.poster-action,
.showcase-action {
  pointer-events: auto !important;
}

body[data-page="media"] .stream-detail-hero {
  min-height: min(780px, 88vh) !important;
  padding-top: clamp(126px, 14vh, 178px) !important;
}
body[data-page="media"] .stream-detail-copy h1 {
  max-width: 920px !important;
  font-size: clamp(44px, 5.6vw, 88px) !important;
  line-height: .92 !important;
  letter-spacing: -.075em !important;
}
body[data-page="media"] .stream-detail-overview {
  max-width: 760px !important;
  font-size: clamp(15px, 1vw, 18px) !important;
  line-height: 1.56 !important;
}
body.is-account-modal-open .sidebar,
body.is-profile-edit-open .sidebar,
body[data-page="login"] .sidebar {
  display: none !important;
}


/* KINOLOT v64: stable page scroll, one nav morph model, and reliable card tap zones */
@media (min-width: 821px) {
  body:not([data-page="login"]) .app-shell {
    display: block !important;
    min-height: 100vh !important;
  }

  body:not([data-page="login"]) .topbar {
    display: none !important;
  }

  body:not([data-page="login"]) .content {
    height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scroll-behavior: smooth !important;
  }

  body[data-page="home"] .content {
    padding: 0 0 96px !important;
  }

  body[data-page="media"] .content {
    height: 100vh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    margin: 0 !important;
    overscroll-behavior-y: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body[data-page="media"] #mediaPage,
  body[data-page="media"] #mediaContent {
    min-height: 100vh !important;
    height: auto !important;
    overflow: visible !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  body:not([data-page="home"]):not([data-page="media"]):not([data-page="login"]) .content {
    padding: 128px clamp(24px, 4.8vw, 86px) 90px !important;
  }

  body:not([data-page="login"]) .sidebar {
    position: fixed !important;
    z-index: 120 !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    align-items: center !important;
    transition:
      top .34s cubic-bezier(.2,.8,.2,1),
      width .34s cubic-bezier(.2,.8,.2,1),
      height .34s cubic-bezier(.2,.8,.2,1),
      min-height .34s cubic-bezier(.2,.8,.2,1),
      padding .34s cubic-bezier(.2,.8,.2,1),
      gap .34s cubic-bezier(.2,.8,.2,1),
      border-radius .34s cubic-bezier(.2,.8,.2,1),
      background .34s ease,
      border-color .34s ease,
      box-shadow .34s ease,
      backdrop-filter .34s ease,
      -webkit-backdrop-filter .34s ease !important;
  }

  body:not(.is-nav-condensed):not([data-page="login"]) .sidebar {
    top: 28px !important;
    width: min(1360px, calc(100vw - 88px)) !important;
    height: 78px !important;
    min-height: 78px !important;
    padding: 0 clamp(16px, 1.7vw, 28px) !important;
    gap: clamp(18px, 2.4vw, 44px) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(0,0,0,.52), rgba(0,0,0,.18) 72%, transparent) !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  body.is-nav-condensed:not([data-page="login"]) .sidebar {
    top: 20px !important;
    width: min(1280px, calc(100vw - 76px)) !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 0 18px !important;
    gap: clamp(14px, 1.8vw, 30px) !important;
    border: 1px solid rgba(245,245,247,.14) !important;
    border-radius: 999px !important;
    background: linear-gradient(180deg, rgba(31,32,37,.82), rgba(13,14,17,.74)) !important;
    box-shadow: 0 24px 86px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.13) !important;
    backdrop-filter: blur(34px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(34px) saturate(135%) !important;
  }

  body:not([data-page="login"]) .brand.brand--home {
    justify-self: start !important;
    height: 58px !important;
    min-width: 0 !important;
    padding: 0 clamp(16px, 2vw, 34px) 0 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 18px !important;
    border: 0 !important;
    border-right: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  body:not([data-page="login"]) .brand__logo {
    width: 54px !important;
    height: 54px !important;
    border-radius: 16px !important;
    background: #f5f5f7 !important;
    color: #050506 !important;
    box-shadow: none !important;
  }

  body:not([data-page="login"]) .brand strong {
    display: block !important;
    color: #fff !important;
    font-size: clamp(21px, 1.6vw, 30px) !important;
    font-weight: 1000 !important;
    letter-spacing: -.07em !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  body:not([data-page="login"]) .brand span,
  body:not([data-page="login"]) .sidebar__bottom,
  body:not([data-page="login"]) .control-current,
  body:not([data-page="login"]) #changeControlModeBtn {
    display: none !important;
  }

  body:not([data-page="login"]) .nav {
    justify-self: center !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: clamp(16px, 2.1vw, 34px) !important;
    height: 58px !important;
    min-width: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  body:not([data-page="login"]) .nav__item {
    position: relative !important;
    height: 54px !important;
    min-height: 54px !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: rgba(245,245,247,.74) !important;
    box-shadow: none !important;
    font-size: clamp(15px, 1.03vw, 18px) !important;
    font-weight: 820 !important;
    letter-spacing: -.035em !important;
    white-space: nowrap !important;
    transform: none !important;
  }

  body:not([data-page="login"]) .nav__item svg,
  body:not([data-page="login"]) .nav__item i,
  body:not([data-page="login"]) .nav__item::before {
    display: none !important;
  }

  body:not([data-page="login"]) .nav__item--search svg,
  body:not([data-page="login"]) .nav__item--search i {
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    color: rgba(245,245,247,.82) !important;
  }

  body:not([data-page="login"]) .nav__item:hover,
  body:not([data-page="login"]) .nav__item:focus-visible,
  body:not([data-page="login"]) .nav__item.is-active {
    color: #fff !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
  }

  body:not([data-page="login"]) .nav__item.is-active::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 5px !important;
    height: 3px !important;
    border-radius: 999px !important;
    background: rgba(245,245,247,.94) !important;
    box-shadow: 0 0 28px rgba(255,255,255,.34) !important;
  }

  body:not([data-page="login"]) .nav-actions {
    justify-self: end !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: clamp(12px, 1.5vw, 28px) !important;
  }

  body:not([data-page="login"]) .nav-action {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: rgba(245,245,247,.78) !important;
    box-shadow: none !important;
    padding: 0 !important;
    display: inline-grid !important;
    place-items: center !important;
    transform: none !important;
  }

  body:not([data-page="login"]) .nav-action--profile {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    background: rgba(255,255,255,.075) !important;
    border: 1px solid rgba(255,255,255,.11) !important;
  }
}

.media-card,
.showcase-card,
.media-card__poster {
  cursor: pointer !important;
}

.media-card__poster,
.showcase-card {
  position: relative !important;
}

.media-card__body,
.poster-overlay,
.poster-badges,
.poster-shade,
.poster-placeholder,
.poster-art,
.poster-art--img,
.showcase-card__image,
.showcase-card__content,
.showcase-card__badges,
.showcase-card__episode-badge,
.showcase-blur-layer {
  pointer-events: none !important;
}

.poster-actions,
.showcase-card__actions,
.poster-action,
.showcase-action,
.poster-action *,
.showcase-action * {
  pointer-events: auto !important;
}

body[data-page="media"] .stream-detail-hero {
  min-height: min(720px, 84vh) !important;
  padding-top: clamp(116px, 13vh, 162px) !important;
}

body[data-page="media"] .stream-detail-copy h1 {
  max-width: 860px !important;
  font-size: clamp(36px, 4.4vw, 68px) !important;
  line-height: .95 !important;
  letter-spacing: -.065em !important;
}

/* v65 — click hardening for movie/series cards */
.showcase-card,
.media-card,
.media-card__poster,
[data-rec-id],
[data-overlay-media],
[data-suggest-media] {
  cursor: pointer !important;
  pointer-events: auto !important;
}
.showcase-card::before,
.showcase-card::after,
.media-card__poster::before,
.media-card__poster::after,
.poster-placeholder,
.poster-art,
.poster-shade,
.showcase-card__image,
.showcase-blur-layer {
  pointer-events: none !important;
}
.showcase-card__actions,
.showcase-action,
.poster-actions,
.poster-action,
[data-card-action],
[data-showcase-action],
[data-info-action] {
  pointer-events: auto !important;
}

/* v66 catalog/search card grid polish + auto pagination */
body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage {
  padding-top: clamp(10px, 2vw, 32px) !important;
}

body[data-page="catalog"] .toolbar {
  position: sticky !important;
  top: 112px !important;
  z-index: 20 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  width: max-content !important;
  max-width: 100% !important;
  margin: 0 0 22px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 24px !important;
  background: rgba(12,13,17,.58) !important;
  backdrop-filter: blur(28px) saturate(130%) !important;
  box-shadow: 0 20px 70px rgba(0,0,0,.30) !important;
}

body.is-nav-condensed[data-page="catalog"] .toolbar { top: 96px !important; }

body[data-page="catalog"] .catalog-meta,
body[data-page="search"] #searchPageMeta {
  margin: 0 0 22px !important;
  color: rgba(245,245,247,.56) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(clamp(158px, 11.8vw, 232px), 1fr)) !important;
  align-items: start !important;
  gap: clamp(22px, 2vw, 36px) clamp(14px, 1.6vw, 28px) !important;
  overflow: visible !important;
}

body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card {
  width: 100% !important;
  min-width: 0 !important;
  flex: none !important;
  color: #f5f5f7 !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: transparent !important;
  box-shadow: none !important;
  cursor: pointer !important;
  overflow: visible !important;
  transform: none !important;
}

body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card__poster {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 20px !important;
  background: #111318 !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.32) !important;
  overflow: hidden !important;
  transform: none !important;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), filter .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover,
body[data-page="catalog"] #catalogGrid .media-card:focus-within,
body[data-page="search"] #searchGrid.grid .media-card:hover,
body[data-page="search"] #searchGrid.grid .media-card:focus-within {
  z-index: 18 !important;
  transform: translateY(-4px) !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .media-card__poster {
  transform: none !important;
  filter: brightness(1.06) saturate(1.04) !important;
  border-color: rgba(255,255,255,.30) !important;
  box-shadow: 0 24px 72px rgba(0,0,0,.50) !important;
}

body[data-page="catalog"] #catalogGrid .poster-placeholder,
body[data-page="search"] #searchGrid.grid .poster-placeholder {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(245,245,247,.28) !important;
  font-size: clamp(16px, 1.3vw, 24px) !important;
  font-weight: 950 !important;
  letter-spacing: .32em !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-art,
body[data-page="search"] #searchGrid.grid .poster-art {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-shade,
body[data-page="search"] #searchGrid.grid .poster-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.28) 58%, rgba(0,0,0,.92) 100%) !important;
  opacity: .95 !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid.grid .poster-badges {
  position: absolute !important;
  left: 14px !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 4 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="catalog"] #catalogGrid .media-card__meta span,
body[data-page="search"] #searchGrid.grid .poster-badges span,
body[data-page="search"] #searchGrid.grid .media-card__meta span {
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: rgba(245,245,247,.92) !important;
  color: #07080b !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .01em !important;
  backdrop-filter: blur(12px) !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-good,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-good { background: rgba(23,185,96,.88) !important; color: #fff !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-mid { background: rgba(92,98,110,.92) !important; color: #fff !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-low,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-low { background: rgba(194,64,64,.88) !important; color: #fff !important; }

body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-episode {
  position: absolute !important;
  z-index: 5 !important;
  top: 14px !important;
  right: 14px !important;
  min-height: 30px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 12px !important;
  border-radius: 9px !important;
  background: rgba(245,245,247,.92) !important;
  color: #08090c !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid.grid .poster-overlay {
  position: absolute !important;
  left: 16px !important;
  right: 16px !important;
  bottom: 16px !important;
  z-index: 4 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 6px !important;
  color: #f5f5f7 !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid.grid .poster-overlay strong {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  max-width: 100% !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(18px, 1.45vw, 30px) !important;
  line-height: .98 !important;
  font-weight: 950 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 6px 24px rgba(0,0,0,.65) !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid.grid .poster-overlay small {
  color: rgba(245,245,247,.82) !important;
  font-size: clamp(12px, .8vw, 15px) !important;
  font-weight: 850 !important;
  text-shadow: 0 4px 18px rgba(0,0,0,.65) !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="search"] #searchGrid.grid .poster-overlay em {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  max-height: 0 !important;
  opacity: 0 !important;
  margin-top: 4px !important;
  color: rgba(245,245,247,.78) !important;
  font-size: 13px !important;
  font-style: normal !important;
  line-height: 1.35 !important;
  transition: max-height .22s ease, opacity .22s ease !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-overlay em {
  max-height: 76px !important;
  opacity: 1 !important;
}

body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid.grid .poster-actions {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-top: 8px !important;
  opacity: 0 !important;
  transform: translateY(6px) !important;
  transition: opacity .18s ease, transform .18s ease !important;
  pointer-events: auto !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-actions {
  opacity: 1 !important;
  transform: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-action,
body[data-page="search"] #searchGrid.grid .poster-action {
  min-height: 34px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: rgba(245,245,247,.94) !important;
  color: #07080b !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.35) !important;
}

body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="search"] #searchGrid.grid .media-card__body,
body[data-page="search"] #searchGrid.grid .media-card__meta {
  display: none !important;
}

.catalog-auto-load {
  min-height: 118px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin: 28px 0 0 !important;
}

.catalog-auto-sentinel {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  border: 3px solid rgba(245,245,247,.15) !important;
  border-top-color: rgba(245,245,247,.82) !important;
  animation: kinolotSpin .9s linear infinite !important;
}
.catalog-auto-sentinel.is-hidden { display: none !important; }
.catalog-auto-status {
  color: rgba(245,245,247,.46) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
}
@keyframes kinolotSpin { to { transform: rotate(360deg); } }

@media (max-width: 820px) {
  body[data-page="catalog"] .toolbar {
    top: 76px !important;
    width: 100% !important;
    overflow-x: auto !important;
    justify-content: flex-start !important;
    border-radius: 18px !important;
  }
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid {
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
    gap: 18px 12px !important;
  }
  body[data-page="catalog"] #catalogGrid .poster-overlay,
  body[data-page="search"] #searchGrid.grid .poster-overlay {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
  }
  body[data-page="catalog"] #catalogGrid .poster-overlay strong,
  body[data-page="search"] #searchGrid.grid .poster-overlay strong { font-size: 17px !important; }
  body[data-page="catalog"] #catalogGrid .poster-overlay em,
  body[data-page="catalog"] #catalogGrid .poster-actions,
  body[data-page="search"] #searchGrid.grid .poster-overlay em,
  body[data-page="search"] #searchGrid.grid .poster-actions { display: none !important; }
}


/* v67 — catalog/search cards use the exact home shelf-card language; buttons expose selected state */
body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(clamp(184px, 12.2vw, 244px), clamp(184px, 12.2vw, 244px))) !important;
  justify-content: start !important;
  align-items: start !important;
  gap: clamp(22px, 2vw, 34px) clamp(18px, 1.45vw, 30px) !important;
  padding: 18px clamp(28px, 5vw, 108px) 36px !important;
  margin-left: calc(-1 * clamp(28px, 5vw, 108px)) !important;
  margin-right: calc(-1 * clamp(28px, 5vw, 108px)) !important;
  overflow: visible !important;
}
body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card {
  width: clamp(184px, 12.2vw, 244px) !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: none !important;
  border-radius: 22px !important;
  overflow: visible !important;
  transform: none !important;
  transition: transform .18s ease, opacity .18s ease !important;
  cursor: pointer !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover,
body[data-page="search"] #searchGrid.grid .media-card:hover { transform: translateY(-3px) !important; z-index: 12 !important; }
body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card__poster {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  padding: 0 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: #101116 !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: none !important;
  transform: none !important;
  filter: none !important;
  transition: border-color .18s ease, transform .18s ease !important;
  cursor: pointer !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: none !important;
  filter: none !important;
  transform: none !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster::before,
body[data-page="catalog"] #catalogGrid .media-card__poster::after,
body[data-page="search"] #searchGrid.grid .media-card__poster::before,
body[data-page="search"] #searchGrid.grid .media-card__poster::after { display:none !important; }
body[data-page="catalog"] #catalogGrid .poster-placeholder,
body[data-page="search"] #searchGrid.grid .poster-placeholder {
  position:absolute !important; inset:0 !important; z-index:0 !important; display:grid !important; place-items:center !important;
  padding:18px !important; border-radius:inherit !important;
  background: radial-gradient(circle at 28% 18%, rgba(255,255,255,.12), transparent 26%), linear-gradient(145deg,#1b1d23 0%,#0d0e12 48%,#050507 100%) !important;
  color:rgba(245,245,247,.30) !important; font-size:clamp(18px,1.4vw,30px) !important; font-weight:950 !important; letter-spacing:.22em !important; text-align:center !important; pointer-events:none !important; opacity:1 !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster.is-image-loaded .poster-placeholder,
body[data-page="search"] #searchGrid.grid .media-card__poster.is-image-loaded .poster-placeholder { opacity:0 !important; }
body[data-page="catalog"] #catalogGrid .poster-art,
body[data-page="catalog"] #catalogGrid .poster-art--img,
body[data-page="search"] #searchGrid.grid .poster-art,
body[data-page="search"] #searchGrid.grid .poster-art--img {
  position:absolute !important; inset:0 !important; z-index:0 !important; display:block !important; width:100% !important; height:100% !important; object-fit:cover !important; object-position:center !important;
  opacity:0 !important; transform:scale(1) !important; filter:none !important; transition:opacity .24s ease, filter .22s ease, transform .22s ease !important; pointer-events:none !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster.is-image-loaded .poster-art,
body[data-page="catalog"] #catalogGrid .media-card__poster:not(.is-loading-image):not(.is-missing-image) .poster-art,
body[data-page="search"] #searchGrid.grid .media-card__poster.is-image-loaded .poster-art,
body[data-page="search"] #searchGrid.grid .media-card__poster:not(.is-loading-image):not(.is-missing-image) .poster-art { opacity:1 !important; }
body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster.is-image-loaded .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster.is-image-loaded .poster-art { filter: blur(6px) brightness(.66) saturate(1.02) !important; transform: scale(1.035) !important; }
body[data-page="catalog"] #catalogGrid .poster-shade,
body[data-page="search"] #searchGrid.grid .poster-shade {
  position:absolute !important; inset:0 !important; z-index:1 !important; display:block !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.38) 70%, rgba(0,0,0,.78) 100%), linear-gradient(90deg, rgba(0,0,0,.18), rgba(0,0,0,0) 38%) !important;
  pointer-events:none !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-shade,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-shade { background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.36) 42%, rgba(0,0,0,.82) 100%) !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid.grid .poster-overlay {
  position:absolute !important; left:15px !important; right:15px !important; bottom:16px !important; z-index:4 !important; display:grid !important; gap:5px !important; padding:0 !important;
  background:transparent !important; border:0 !important; border-radius:0 !important; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; opacity:1 !important; transform:none !important; pointer-events:none !important; text-shadow:0 8px 24px rgba(0,0,0,.95) !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid.grid .poster-overlay strong {
  color:#fff !important; font-size:clamp(18px,1.28vw,25px) !important; line-height:1.02 !important; letter-spacing:-.055em !important; font-weight:950 !important; display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; text-align:left !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid.grid .poster-overlay small { color:rgba(245,245,247,.78) !important; font-size:12px !important; line-height:1.2 !important; font-weight:850 !important; text-align:left !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid.grid .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-overlay em { display:none !important; opacity:0 !important; visibility:hidden !important; }
body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid.grid .poster-actions {
  display:none !important; opacity:0 !important; transform:translateY(6px) !important; pointer-events:auto !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions {
  display:flex !important; opacity:1 !important; transform:none !important; gap:8px !important; margin-top:8px !important; visibility:visible !important;
}
body[data-page="catalog"] #catalogGrid .poster-action,
body[data-page="search"] #searchGrid.grid .poster-action {
  height:36px !important; min-width:38px !important; min-height:36px !important; padding:0 12px !important; border-radius:999px !important; border:1px solid rgba(255,255,255,.14) !important; background:rgba(245,245,247,.92) !important; color:#07080b !important; font-size:13px !important; font-weight:900 !important; box-shadow:none !important;
}
body[data-page="catalog"] #catalogGrid .poster-action:not(.poster-action--play),
body[data-page="search"] #searchGrid.grid .poster-action:not(.poster-action--play) { width:38px !important; padding:0 !important; background:rgba(245,245,247,.16) !important; color:#fff !important; backdrop-filter:blur(14px) !important; -webkit-backdrop-filter:blur(14px) !important; }
body[data-page="catalog"] #catalogGrid .poster-action svg,
body[data-page="catalog"] #catalogGrid .poster-action i,
body[data-page="search"] #searchGrid.grid .poster-action svg,
body[data-page="search"] #searchGrid.grid .poster-action i { width:17px !important; height:17px !important; }
body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid.grid .poster-badges { position:absolute !important; z-index:5 !important; top:10px !important; left:10px !important; right:auto !important; display:grid !important; gap:6px !important; pointer-events:none !important; }
body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-badges span,
body[data-page="search"] #searchGrid.grid .poster-episode {
  min-height:27px !important; padding:0 9px !important; border-radius:9px !important; font-size:12px !important; line-height:1 !important; font-weight:950 !important; letter-spacing:-.02em !important; border:1px solid rgba(255,255,255,.18) !important; box-shadow:none !important;
}
body[data-page="catalog"] #catalogGrid .poster-badges .is-quality,
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-badges .is-quality,
body[data-page="search"] #searchGrid.grid .poster-episode { background:rgba(245,245,247,.92) !important; color:#050608 !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-good,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-good { background:rgba(41,211,128,.88) !important; color:#041006 !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-mid { background:rgba(225,229,236,.86) !important; color:#07080b !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-low,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-low { background:rgba(235,91,91,.88) !important; color:#160303 !important; }
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-episode { position:absolute !important; right:10px !important; top:10px !important; z-index:5 !important; }
body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="catalog"] #catalogGrid .poster-play,
body[data-page="search"] #searchGrid.grid .media-card__body,
body[data-page="search"] #searchGrid.grid .media-card__meta,
body[data-page="search"] #searchGrid.grid .poster-play { display:none !important; }

[data-user-action].is-active,
.poster-action.is-active,
.showcase-action.is-active,
.stream-detail-btn.is-active,
.showcase-info-popover [data-info-action].is-active {
  background: rgba(41,211,128,.92) !important;
  border-color: rgba(41,211,128,.95) !important;
  color: #031108 !important;
  box-shadow: 0 0 0 1px rgba(41,211,128,.32), 0 14px 34px rgba(41,211,128,.18) !important;
}
[data-user-action].is-active svg,
.poster-action.is-active svg,
.showcase-action.is-active svg,
.stream-detail-btn.is-active svg { fill: currentColor !important; stroke-width: 2.4 !important; }
[data-user-action].is-pending,
.poster-action.is-pending,
.showcase-action.is-pending,
.stream-detail-btn.is-pending { opacity:.72 !important; pointer-events:none !important; }
.apple-star-rate button.is-active { color:#ffd166 !important; text-shadow:0 0 18px rgba(255,209,102,.45) !important; transform:translateY(-1px) scale(1.04) !important; }
.apple-reaction-row button.is-active {
  background: rgba(41,211,128,.18) !important;
  border-color: rgba(41,211,128,.62) !important;
  box-shadow: 0 0 0 1px rgba(41,211,128,.18), inset 0 0 0 1px rgba(255,255,255,.04) !important;
}
.apple-reaction-row button.is-active span { transform: scale(1.14) !important; }
@media (max-width: 820px) {
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 12px !important;
    padding-inline: 18px !important;
    margin-inline: 0 !important;
  }
  body[data-page="catalog"] #catalogGrid .media-card,
  body[data-page="search"] #searchGrid.grid .media-card { width:100% !important; }
  body[data-page="catalog"] #catalogGrid .poster-actions,
  body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
  body[data-page="search"] #searchGrid.grid .poster-actions,
  body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions { display:none !important; }
  body[data-page="catalog"] #catalogGrid .poster-overlay strong,
  body[data-page="search"] #searchGrid.grid .poster-overlay strong { font-size:17px !important; }
}


/* KINOLOT v68: centered catalog/search grids, icon-only active states, redesigned search */
:root {
  --kinolot-heart: #ff375f;
  --kinolot-bookmark: #ff9f0a;
}

body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage {
  width: min(1760px, 100%) !important;
  margin-inline: auto !important;
  padding-inline: clamp(22px, 4vw, 86px) !important;
  box-sizing: border-box !important;
}

body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-media-grid {
  width: 100% !important;
  max-width: 1640px !important;
  margin: 0 auto !important;
  padding-inline: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(216px, 236px)) !important;
  justify-content: center !important;
  justify-items: center !important;
  gap: clamp(28px, 2.35vw, 42px) clamp(18px, 1.9vw, 30px) !important;
}

body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card,
body[data-page="search"] .search-media-grid .media-card {
  width: 100% !important;
  max-width: 236px !important;
  min-width: 0 !important;
  margin: 0 !important;
}

body[data-page="catalog"] .catalog-meta,
body[data-page="catalog"] .toolbar,
body[data-page="catalog"] .catalog-auto-load,
body[data-page="search"] .search-page-head,
body[data-page="search"] .search-composer,
body[data-page="search"] .search-scopes,
body[data-page="search"] #searchPageMeta {
  max-width: 1640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Do not paint the whole button as selected. Only the symbol changes. */
[data-user-action].is-active,
.poster-action.is-active,
.showcase-action.is-active,
.stream-detail-btn.is-active,
.showcase-info-popover [data-info-action].is-active {
  background: inherit !important;
  border-color: rgba(255,255,255,.18) !important;
  color: inherit !important;
  box-shadow: none !important;
}

.stream-detail-btn.is-active {
  background: rgba(255,255,255,.12) !important;
  color: #fff !important;
}

body[data-page="catalog"] #catalogGrid .poster-action.is-active:not(.poster-action--play),
body[data-page="search"] #searchGrid.grid .poster-action.is-active:not(.poster-action--play),
body[data-page="search"] .search-media-grid .poster-action.is-active:not(.poster-action--play),
body[data-page="home"] .showcase-action.is-active:not(.showcase-action--play),
.showcase-info-popover [data-info-action="bookmark"].is-active {
  background: rgba(245,245,247,.16) !important;
  border-color: rgba(255,255,255,.22) !important;
  color: #fff !important;
  box-shadow: none !important;
}

[data-user-action] svg,
.poster-action svg,
.showcase-action svg,
.stream-detail-btn svg,
.showcase-info-popover [data-info-action] svg {
  fill: transparent !important;
  transition: fill .16s ease, color .16s ease, stroke .16s ease, transform .16s ease !important;
}

[data-user-action="favorite"].is-active svg,
#favoriteBtn.is-active svg,
[data-info-action="favorite"].is-active svg {
  color: var(--kinolot-heart) !important;
  stroke: var(--kinolot-heart) !important;
  fill: var(--kinolot-heart) !important;
  filter: drop-shadow(0 0 12px rgba(255,55,95,.36)) !important;
  transform: scale(1.05) !important;
}

[data-user-action="watchlist"].is-active svg,
[data-card-action="bookmark"].is-active svg,
[data-showcase-action="bookmark"].is-active svg,
[data-info-action="bookmark"].is-active svg,
#watchlistBtn.is-active svg {
  color: var(--kinolot-bookmark) !important;
  stroke: var(--kinolot-bookmark) !important;
  fill: var(--kinolot-bookmark) !important;
  filter: drop-shadow(0 0 12px rgba(255,159,10,.35)) !important;
  transform: scale(1.05) !important;
}

.stream-detail-btn.is-active span,
.poster-action.is-active span,
.showcase-action.is-active span { color: inherit !important; }

/* Search redesign */
.search-page {
  padding-top: clamp(118px, 13vh, 160px) !important;
  padding-bottom: 120px !important;
}
.search-page-head {
  display: flex !important;
  align-items: end !important;
  justify-content: space-between !important;
  gap: 24px !important;
  margin-bottom: 18px !important;
}
.search-page-head .eyebrow {
  color: rgba(245,245,247,.52) !important;
  letter-spacing: .28em !important;
  text-transform: uppercase !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}
.search-page-head h2 {
  margin: 4px 0 0 !important;
  font-size: clamp(42px, 5.2vw, 86px) !important;
  line-height: .92 !important;
  letter-spacing: -.08em !important;
}
.search-composer {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  gap: 12px !important;
  padding: 12px !important;
  border-radius: 30px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.055)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 30px 120px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(28px) saturate(1.25) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.25) !important;
}
.search-composer__field {
  min-height: 66px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  border-radius: 22px !important;
  padding: 0 20px !important;
  background: rgba(0,0,0,.34) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}
.search-composer__field svg { width: 28px !important; height: 28px !important; color: rgba(245,245,247,.72) !important; }
.search-composer__field .input {
  height: 64px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: clamp(20px, 2vw, 30px) !important;
  font-weight: 850 !important;
  letter-spacing: -.04em !important;
  box-shadow: none !important;
}
.search-composer__field .input::placeholder { color: rgba(245,245,247,.34) !important; }
#searchPageBtn {
  min-width: 156px !important;
  min-height: 66px !important;
  border-radius: 22px !important;
  background: #f5f5f7 !important;
  color: #07080b !important;
  border: 0 !important;
  font-weight: 950 !important;
  box-shadow: 0 14px 45px rgba(245,245,247,.14) !important;
}
.search-scopes {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin-top: 16px !important;
  margin-bottom: clamp(26px, 4vw, 50px) !important;
}
.search-scope {
  height: 44px !important;
  border-radius: 999px !important;
  padding: 0 15px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: rgba(245,245,247,.08) !important;
  border: 1px solid rgba(245,245,247,.12) !important;
  color: rgba(245,245,247,.78) !important;
  font-weight: 900 !important;
  box-shadow: none !important;
}
.search-scope.is-active {
  background: rgba(245,245,247,.94) !important;
  color: #07080b !important;
  border-color: transparent !important;
}
.search-scope small {
  min-width: 20px !important;
  height: 20px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 999px !important;
  padding: 0 6px !important;
  background: rgba(0,0,0,.18) !important;
  font-size: 11px !important;
}
.search-lobby {
  max-width: 1640px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
}
.search-lobby__panel {
  min-height: 190px !important;
  padding: 24px !important;
  border-radius: 30px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
.search-lobby__title {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
  margin-bottom: 16px !important;
}
.chip-cloud {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}
.quick-search,
.quick-genre {
  min-height: 40px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.075) !important;
  color: rgba(245,245,247,.86) !important;
  font-weight: 850 !important;
}
.search-results {
  width: 100% !important;
  max-width: 1640px !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: clamp(30px, 4vw, 58px) !important;
}
.search-results__section {
  display: grid !important;
  gap: 16px !important;
}
.search-results__head {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
}
.search-results__head span {
  display: block !important;
  color: rgba(245,245,247,.52) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: .24em !important;
  font-weight: 950 !important;
}
.search-results__head strong {
  display: block !important;
  margin-top: 3px !important;
  color: #fff !important;
  font-size: 26px !important;
  letter-spacing: -.055em !important;
}
.search-results__head button {
  min-height: 40px !important;
  border-radius: 999px !important;
  padding: 0 14px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.075) !important;
  color: #fff !important;
  font-weight: 900 !important;
}
.search-entity-grid,
.entity-grid.search-entity-grid {
  max-width: 1640px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
  gap: 14px !important;
}
.entity-card {
  min-height: 104px !important;
  border-radius: 24px !important;
  padding: 14px !important;
  display: grid !important;
  grid-template-columns: 62px minmax(0, 1fr) !important;
  grid-template-rows: 1fr auto !important;
  align-items: center !important;
  column-gap: 14px !important;
  text-align: left !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.065) !important;
  color: #fff !important;
}
.entity-card__avatar {
  grid-row: 1 / span 2 !important;
  width: 62px !important;
  height: 62px !important;
  border-radius: 20px !important;
  background-color: rgba(255,255,255,.10) !important;
  background-size: cover !important;
  background-position: center !important;
  display: grid !important;
  place-items: center !important;
}
.entity-card b { font-size: 16px !important; line-height: 1.1 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; }
.entity-card small { color: rgba(245,245,247,.58) !important; font-weight: 750 !important; }
.search-empty-state {
  min-height: 180px !important;
  display: grid !important;
  place-items: center !important;
  text-align: center !important;
  border-radius: 30px !important;
}
.search-empty-state b { display: block !important; font-size: 26px !important; margin-bottom: 6px !important; }
.search-empty-state span { color: rgba(245,245,247,.62) !important; }

.search-overlay {
  backdrop-filter: blur(34px) saturate(1.2) !important;
  -webkit-backdrop-filter: blur(34px) saturate(1.2) !important;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.12), transparent 34%), rgba(0,0,0,.82) !important;
}
.search-overlay__stage {
  width: min(1180px, calc(100vw - 40px)) !important;
  padding: clamp(26px, 5vw, 70px) !important;
  margin: clamp(38px, 8vh, 92px) auto !important;
  border-radius: 38px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 46px 160px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.search-overlay__stage h2 {
  margin: 0 0 20px !important;
  font-size: clamp(44px, 6vw, 96px) !important;
  line-height: .9 !important;
  letter-spacing: -.08em !important;
}
.search-overlay__field {
  min-height: 74px !important;
  border-radius: 26px !important;
  padding: 0 16px 0 22px !important;
  background: rgba(0,0,0,.38) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
}
.search-overlay__field input {
  height: 74px !important;
  font-size: clamp(22px, 2.4vw, 34px) !important;
  font-weight: 850 !important;
  letter-spacing: -.045em !important;
}
.search-overlay__media-row {
  display: grid !important;
  grid-auto-flow: column !important;
  grid-auto-columns: minmax(154px, 184px) !important;
  gap: 14px !important;
  overflow-x: auto !important;
  padding-bottom: 8px !important;
}
.search-overlay-card {
  min-height: 280px !important;
  border-radius: 24px !important;
  padding: 10px !important;
  display: grid !important;
  align-content: start !important;
  text-align: left !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
}
.search-overlay-card__image {
  aspect-ratio: 2 / 3 !important;
  border-radius: 18px !important;
  background-size: cover !important;
  background-position: center !important;
  margin-bottom: 10px !important;
}
.search-overlay-card b { font-size: 15px !important; line-height: 1.12 !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
.search-overlay-card small { margin-top: 4px !important; color: rgba(245,245,247,.58) !important; font-size: 12px !important; }

@media (max-width: 900px) {
  body[data-page="catalog"] #catalogPage,
  body[data-page="search"] #searchPage { padding-inline: 16px !important; }
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 18px 12px !important;
  }
  body[data-page="catalog"] #catalogGrid .media-card,
  body[data-page="search"] #searchGrid.grid .media-card,
  body[data-page="search"] .search-media-grid .media-card { max-width: none !important; }
  .search-page { padding-top: 104px !important; }
  .search-page-head { display: grid !important; gap: 8px !important; }
  .search-composer { grid-template-columns: 1fr !important; border-radius: 24px !important; }
  #searchPageBtn { width: 100% !important; }
  .search-lobby { grid-template-columns: 1fr !important; }
  .search-results__head { align-items: start !important; }
  .search-overlay__stage { width: calc(100vw - 22px) !important; padding: 22px !important; border-radius: 28px !important; }
}


/* KINOLOT v69: exact poster grids, fixed search modal, TMDb-popular-ready UI */
body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage {
  width: 100% !important;
  max-width: none !important;
  margin-inline: auto !important;
  padding-inline: clamp(24px, 5vw, 96px) !important;
  box-sizing: border-box !important;
}

body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-media-grid {
  width: 100% !important;
  max-width: 1370px !important;
  margin: 32px auto 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 246px)) !important;
  justify-content: center !important;
  justify-items: stretch !important;
  align-items: start !important;
  gap: 38px 28px !important;
  overflow: visible !important;
}

body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card,
body[data-page="search"] .search-media-grid .media-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  display: block !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  transform: none !important;
}

body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card__poster,
body[data-page="search"] .search-media-grid .media-card__poster {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  height: auto !important;
  padding: 0 !important;
  display: block !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: #111318 !important;
  overflow: hidden !important;
  box-shadow: 0 18px 56px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.05) !important;
  transition: transform .22s cubic-bezier(.2,.8,.2,1), border-color .22s ease, box-shadow .22s ease, filter .22s ease !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover,
body[data-page="catalog"] #catalogGrid .media-card:focus-within,
body[data-page="search"] #searchGrid.grid .media-card:hover,
body[data-page="search"] #searchGrid.grid .media-card:focus-within,
body[data-page="search"] .search-media-grid .media-card:hover,
body[data-page="search"] .search-media-grid .media-card:focus-within {
  z-index: 22 !important;
  transform: translateY(-4px) !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:hover .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:focus-within .media-card__poster {
  transform: none !important;
  border-color: rgba(255,255,255,.32) !important;
  box-shadow: 0 26px 82px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.05) !important;
}

body[data-page="catalog"] #catalogGrid .poster-placeholder,
body[data-page="search"] #searchGrid.grid .poster-placeholder,
body[data-page="search"] .search-media-grid .poster-placeholder {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: grid !important;
  place-items: center !important;
  color: rgba(245,245,247,.27) !important;
  font-size: clamp(15px, 1.1vw, 22px) !important;
  font-weight: 950 !important;
  letter-spacing: .32em !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-art,
body[data-page="catalog"] #catalogGrid .poster-art--img,
body[data-page="search"] #searchGrid.grid .poster-art,
body[data-page="search"] #searchGrid.grid .poster-art--img,
body[data-page="search"] .search-media-grid .poster-art,
body[data-page="search"] .search-media-grid .poster-art--img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: none !important;
  transform: scale(1) !important;
  transition: filter .22s ease, transform .22s ease, opacity .22s ease !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-art,
body[data-page="search"] .search-media-grid .media-card:hover .poster-art {
  filter: blur(5px) brightness(.66) saturate(1.05) !important;
  transform: scale(1.035) !important;
}

body[data-page="catalog"] #catalogGrid .poster-shade,
body[data-page="search"] #searchGrid.grid .poster-shade,
body[data-page="search"] .search-media-grid .poster-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,.35) 67%, rgba(0,0,0,.86) 100%) !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid.grid .poster-badges,
body[data-page="search"] .search-media-grid .poster-badges {
  position: absolute !important;
  z-index: 5 !important;
  top: 10px !important;
  left: 10px !important;
  right: auto !important;
  display: grid !important;
  gap: 6px !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-badges span,
body[data-page="search"] #searchGrid.grid .poster-episode,
body[data-page="search"] .search-media-grid .poster-badges span,
body[data-page="search"] .search-media-grid .poster-episode {
  min-height: 27px !important;
  padding: 0 9px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 9px !important;
  background: rgba(245,245,247,.92) !important;
  color: #050608 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -.02em !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.20) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
}

body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-good,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-good,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-good { background: rgba(41,211,128,.88) !important; color:#041006 !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-mid { background: rgba(225,229,236,.86) !important; color:#07080b !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-low,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-low,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-low { background: rgba(235,91,91,.88) !important; color:#160303 !important; }

body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-episode,
body[data-page="search"] .search-media-grid .poster-episode {
  position: absolute !important;
  top: 10px !important;
  right: 10px !important;
  z-index: 5 !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid.grid .poster-overlay,
body[data-page="search"] .search-media-grid .poster-overlay {
  position: absolute !important;
  left: 15px !important;
  right: 15px !important;
  bottom: 15px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  color: #fff !important;
  text-align: left !important;
  text-shadow: 0 8px 24px rgba(0,0,0,.94) !important;
  pointer-events: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid.grid .poster-overlay strong,
body[data-page="search"] .search-media-grid .poster-overlay strong {
  color: #fff !important;
  font-size: clamp(18px, 1.2vw, 24px) !important;
  line-height: 1.04 !important;
  letter-spacing: -.055em !important;
  font-weight: 950 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid.grid .poster-overlay small,
body[data-page="search"] .search-media-grid .poster-overlay small {
  color: rgba(245,245,247,.78) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
}

body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="search"] #searchGrid.grid .poster-overlay em,
body[data-page="search"] .search-media-grid .poster-overlay em {
  display: none !important;
  color: rgba(245,245,247,.84) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-style: normal !important;
  font-weight: 650 !important;
  max-height: 92px !important;
  overflow: hidden !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:hover .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-overlay em {
  display: -webkit-box !important;
  -webkit-line-clamp: 4 !important;
  -webkit-box-orient: vertical !important;
}

body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid.grid .poster-actions,
body[data-page="search"] .search-media-grid .poster-actions {
  display: none !important;
  opacity: 0 !important;
  transform: translateY(6px) !important;
  gap: 8px !important;
  margin-top: 8px !important;
  pointer-events: auto !important;
}

body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-actions,
body[data-page="search"] .search-media-grid .media-card:hover .poster-actions,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-actions {
  display: flex !important;
  opacity: 1 !important;
  transform: none !important;
}

body[data-page="catalog"] #catalogGrid .poster-action,
body[data-page="search"] #searchGrid.grid .poster-action,
body[data-page="search"] .search-media-grid .poster-action {
  height: 36px !important;
  min-width: 38px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(245,245,247,.92) !important;
  color: #07080b !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-action:not(.poster-action--play),
body[data-page="search"] #searchGrid.grid .poster-action:not(.poster-action--play),
body[data-page="search"] .search-media-grid .poster-action:not(.poster-action--play) {
  width: 38px !important;
  padding: 0 !important;
  background: rgba(245,245,247,.16) !important;
  color: #fff !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}

body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="search"] #searchGrid.grid .media-card__body,
body[data-page="search"] .search-media-grid .media-card__body {
  display: block !important;
  padding-top: 12px !important;
  color: #f5f5f7 !important;
}
body[data-page="catalog"] #catalogGrid .media-card__body h3,
body[data-page="search"] #searchGrid.grid .media-card__body h3,
body[data-page="search"] .search-media-grid .media-card__body h3 {
  margin: 0 !important;
  color: #f5f5f7 !important;
  font-size: 15px !important;
  line-height: 1.22 !important;
  font-weight: 880 !important;
  letter-spacing: -.035em !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="catalog"] #catalogGrid .media-card__body p,
body[data-page="search"] #searchGrid.grid .media-card__body p,
body[data-page="search"] .search-media-grid .media-card__body p {
  margin: 5px 0 0 !important;
  color: rgba(245,245,247,.52) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="search"] #searchGrid.grid .media-card__meta,
body[data-page="search"] .search-media-grid .media-card__meta {
  position: static !important;
  display: flex !important;
  gap: 6px !important;
  flex-wrap: wrap !important;
  margin-top: 8px !important;
}
body[data-page="catalog"] #catalogGrid .media-card__meta span,
body[data-page="search"] #searchGrid.grid .media-card__meta span,
body[data-page="search"] .search-media-grid .media-card__meta span {
  min-height: 22px !important;
  padding: 0 7px !important;
  border-radius: 7px !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(245,245,247,.72) !important;
  font-size: 10px !important;
  font-weight: 850 !important;
}

body[data-page="catalog"] .catalog-meta,
body[data-page="catalog"] .toolbar,
body[data-page="catalog"] .catalog-auto-load,
body[data-page="search"] .search-page-head,
body[data-page="search"] .search-composer,
body[data-page="search"] .search-scopes,
body[data-page="search"] #searchPageMeta {
  max-width: 1370px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Search modal — compact, centered, and functional. */
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  display: grid !important;
  place-items: start center !important;
  width: 100vw !important;
  height: 100dvh !important;
  padding: clamp(64px, 8vh, 92px) 24px 48px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  background: radial-gradient(circle at 50% 0%, rgba(255,255,255,.11), transparent 36%), rgba(0,0,0,.82) !important;
  backdrop-filter: blur(44px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(44px) saturate(1.18) !important;
}
#searchOverlay.search-overlay.is-hidden { display: none !important; }
#searchOverlay .search-overlay__close {
  position: fixed !important;
  top: 24px !important;
  right: 28px !important;
  z-index: 1003 !important;
  width: 46px !important;
  height: 46px !important;
  color: rgba(245,245,247,.72) !important;
}
#searchOverlay .search-overlay__stage {
  width: min(1120px, calc(100vw - 48px)) !important;
  max-width: calc(100vw - 48px) !important;
  min-width: 0 !important;
  margin: 0 auto !important;
  padding: clamp(24px, 3.2vw, 42px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 18px !important;
  border-radius: 34px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
  box-shadow: 0 46px 150px rgba(0,0,0,.70), inset 0 1px 0 rgba(255,255,255,.10) !important;
  transform: none !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__stage h2 {
  width: 100% !important;
  margin: 0 !important;
  font-size: clamp(42px, 5.2vw, 72px) !important;
  line-height: .92 !important;
  letter-spacing: -.075em !important;
}
#searchOverlay .search-overlay__field {
  width: 100% !important;
  min-height: 68px !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0,1fr) 44px !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 0 14px 0 20px !important;
  border-radius: 22px !important;
  background: #f5f5f7 !important;
  color: #07080b !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#searchOverlay .search-overlay__field input {
  width: 100% !important;
  min-width: 0 !important;
  height: 68px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #07080b !important;
  font-size: clamp(20px, 2vw, 28px) !important;
  font-weight: 850 !important;
  letter-spacing: -.045em !important;
}
#searchOverlay .search-overlay__field input::placeholder { color: rgba(7,8,11,.40) !important; }
#searchOverlay .search-overlay__field button {
  width: 44px !important;
  height: 44px !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.07) !important;
  color: #07080b !important;
}
#searchOverlay .search-overlay__quick-actions {
  display: flex !important;
  justify-content: center !important;
  gap: 12px !important;
  margin: 4px 0 0 !important;
}
#searchOverlay .search-overlay__popular {
  margin-top: 18px !important;
  text-align: center !important;
}
#searchOverlay .search-overlay__popular strong {
  display: block !important;
  margin-bottom: 16px !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
  letter-spacing: -.03em !important;
}
#searchOverlay .search-overlay__popular div,
#searchOverlay .search-overlay__chips {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 10px !important;
}
#searchOverlay .search-overlay__popular button,
#searchOverlay .search-overlay__chips button {
  min-height: 40px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(245,245,247,.09) !important;
  color: rgba(245,245,247,.88) !important;
  font-weight: 850 !important;
}
#searchOverlay .search-overlay__results {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 8px !important;
  overflow: visible !important;
}
#searchOverlay .search-overlay__results section h3 {
  margin: 0 0 14px !important;
  color: #fff !important;
  font-size: 18px !important;
  font-weight: 950 !important;
}
#searchOverlay .search-overlay__media-row {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  gap: 14px !important;
  overflow: visible !important;
  padding: 0 !important;
}
#searchOverlay .search-overlay-card {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  align-content: start !important;
  border-radius: 20px !important;
  padding: 10px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.06) !important;
  color: #fff !important;
  transform: none !important;
}
#searchOverlay .search-overlay-card__image {
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 15px !important;
  background-size: cover !important;
  background-position: center !important;
  margin-bottom: 10px !important;
}
#searchOverlay .search-overlay__empty {
  min-height: 130px !important;
  display: grid !important;
  place-items: center !important;
  gap: 8px !important;
  text-align: center !important;
  color: rgba(245,245,247,.78) !important;
}
#searchOverlay .search-overlay__empty b { color: #fff !important; font-size: 22px !important; }
#searchOverlay .search-overlay__empty button {
  min-height: 38px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  background: #f5f5f7 !important;
  color: #07080b !important;
  font-weight: 900 !important;
}

@media (max-width: 1420px) {
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid { grid-template-columns: repeat(4, minmax(0, 238px)) !important; max-width: 1040px !important; }
  body[data-page="catalog"] .catalog-meta,
  body[data-page="catalog"] .toolbar,
  body[data-page="catalog"] .catalog-auto-load,
  body[data-page="search"] .search-page-head,
  body[data-page="search"] .search-composer,
  body[data-page="search"] .search-scopes,
  body[data-page="search"] #searchPageMeta { max-width: 1040px !important; }
}
@media (max-width: 1100px) {
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid { grid-template-columns: repeat(3, minmax(0, 220px)) !important; max-width: 720px !important; gap: 30px 20px !important; }
  body[data-page="catalog"] .catalog-meta,
  body[data-page="catalog"] .toolbar,
  body[data-page="catalog"] .catalog-auto-load,
  body[data-page="search"] .search-page-head,
  body[data-page="search"] .search-composer,
  body[data-page="search"] .search-scopes,
  body[data-page="search"] #searchPageMeta { max-width: 720px !important; }
}
@media (max-width: 760px) {
  body[data-page="catalog"] #catalogPage,
  body[data-page="search"] #searchPage { padding-inline: 16px !important; }
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; max-width: none !important; gap: 22px 12px !important; }
  body[data-page="catalog"] #catalogGrid .poster-overlay em,
  body[data-page="catalog"] #catalogGrid .poster-actions,
  body[data-page="search"] #searchGrid.grid .poster-overlay em,
  body[data-page="search"] #searchGrid.grid .poster-actions,
  body[data-page="search"] .search-media-grid .poster-overlay em,
  body[data-page="search"] .search-media-grid .poster-actions { display: none !important; }
  #searchOverlay.search-overlay { padding: 70px 12px 34px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 24px) !important; max-width: calc(100vw - 24px) !important; border-radius: 28px !important; padding: 20px !important; }
  #searchOverlay .search-overlay__stage h2 { font-size: 44px !important; }
  #searchOverlay .search-overlay__field { min-height: 60px !important; grid-template-columns: 24px minmax(0,1fr) !important; }
  #searchOverlay .search-overlay__field input { height: 60px !important; font-size: 18px !important; }
  #searchOverlay .search-overlay__field button { display: none !important; }
}

/* KINOLOT v70: strict 5-card catalog grid + compact live search */
:root { --kl-card-max: 252px; --kl-card-gap-x: 32px; }
body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage { padding-inline: clamp(20px, 4.6vw, 92px) !important; }
body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-media-grid {
  width: 100% !important; max-width: calc((var(--kl-card-max) * 5) + (var(--kl-card-gap-x) * 4)) !important;
  margin: 30px auto 0 !important; padding: 0 !important; display: grid !important;
  grid-template-columns: repeat(5, minmax(0, var(--kl-card-max))) !important;
  justify-content: center !important; justify-items: stretch !important; align-items: start !important;
  gap: 42px var(--kl-card-gap-x) !important; overflow: visible !important;
}
body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card,
body[data-page="search"] .search-media-grid .media-card {
  width: 100% !important; max-width: var(--kl-card-max) !important; min-width: 0 !important; display: block !important;
  overflow: visible !important; background: transparent !important; border: 0 !important; box-shadow: none !important; transform: none !important; cursor: pointer !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card__poster,
body[data-page="search"] .search-media-grid .media-card__poster {
  position: relative !important; width: 100% !important; aspect-ratio: 2 / 3 !important; height: auto !important; padding: 0 !important;
  border-radius: 22px !important; overflow: hidden !important; background: #111319 !important; border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 20px 58px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.06) !important;
  transform: none !important; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover,
body[data-page="catalog"] #catalogGrid .media-card:focus-within,
body[data-page="search"] #searchGrid.grid .media-card:hover,
body[data-page="search"] #searchGrid.grid .media-card:focus-within,
body[data-page="search"] .search-media-grid .media-card:hover,
body[data-page="search"] .search-media-grid .media-card:focus-within { z-index: 20 !important; transform: translateY(-4px) !important; }
body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:hover .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.34) !important; box-shadow: 0 26px 82px rgba(0,0,0,.58), 0 0 0 1px rgba(255,255,255,.05) !important; transform: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-art,
body[data-page="catalog"] #catalogGrid .poster-art--img,
body[data-page="search"] #searchGrid.grid .poster-art,
body[data-page="search"] #searchGrid.grid .poster-art--img,
body[data-page="search"] .search-media-grid .poster-art,
body[data-page="search"] .search-media-grid .poster-art--img {
  position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: center !important;
  opacity: 1 !important; transform: scale(1) !important; filter: none !important; pointer-events: none !important; transition: filter .2s ease, transform .2s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-art,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-art,
body[data-page="search"] .search-media-grid .media-card:hover .poster-art,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-art { filter: blur(5px) brightness(.64) saturate(1.06) !important; transform: scale(1.035) !important; }
body[data-page="catalog"] #catalogGrid .poster-shade,
body[data-page="search"] #searchGrid.grid .poster-shade,
body[data-page="search"] .search-media-grid .poster-shade {
  position: absolute !important; inset: 0 !important; z-index: 1 !important; background: linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.34) 66%, rgba(0,0,0,.86) 100%) !important; pointer-events: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid.grid .poster-overlay,
body[data-page="search"] .search-media-grid .poster-overlay {
  position: absolute !important; left: 16px !important; right: 16px !important; bottom: 16px !important; z-index: 4 !important; display: grid !important; gap: 5px !important;
  color: #fff !important; background: transparent !important; border: 0 !important; text-align: left !important; text-shadow: 0 8px 24px rgba(0,0,0,.94) !important; pointer-events: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid.grid .poster-overlay strong,
body[data-page="search"] .search-media-grid .poster-overlay strong {
  font-size: clamp(18px, 1.2vw, 25px) !important; line-height: 1.02 !important; font-weight: 950 !important; letter-spacing: -.055em !important;
  display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid.grid .poster-overlay small,
body[data-page="search"] .search-media-grid .poster-overlay small { color: rgba(245,245,247,.78) !important; font-size: 12px !important; font-weight: 850 !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="search"] #searchGrid.grid .poster-overlay em,
body[data-page="search"] .search-media-grid .poster-overlay em { display: none !important; font-style: normal !important; color: rgba(245,245,247,.86) !important; font-size: 13px !important; line-height: 1.36 !important; max-height: 92px !important; overflow: hidden !important; }
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:hover .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-overlay em { display: -webkit-box !important; -webkit-line-clamp: 4 !important; -webkit-box-orient: vertical !important; }
body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid.grid .poster-actions,
body[data-page="search"] .search-media-grid .poster-actions { display: none !important; align-items: center !important; gap: 8px !important; margin-top: 9px !important; pointer-events: auto !important; }
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-actions,
body[data-page="search"] .search-media-grid .media-card:hover .poster-actions,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-actions { display: flex !important; }
body[data-page="catalog"] #catalogGrid .poster-action,
body[data-page="search"] #searchGrid.grid .poster-action,
body[data-page="search"] .search-media-grid .poster-action { min-height: 38px !important; height: 38px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.15) !important; background: rgba(245,245,247,.94) !important; color: #07080b !important; font-size: 13px !important; font-weight: 930 !important; text-shadow: none !important; }
body[data-page="catalog"] #catalogGrid .poster-action:not(.poster-action--play),
body[data-page="search"] #searchGrid.grid .poster-action:not(.poster-action--play),
body[data-page="search"] .search-media-grid .poster-action:not(.poster-action--play) { width: 40px !important; min-width: 40px !important; padding: 0 !important; background: rgba(245,245,247,.16) !important; color: #fff !important; backdrop-filter: blur(14px) !important; -webkit-backdrop-filter: blur(14px) !important; }
body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid.grid .poster-badges,
body[data-page="search"] .search-media-grid .poster-badges { position: absolute !important; top: 11px !important; left: 11px !important; right: auto !important; z-index: 5 !important; display: grid !important; gap: 6px !important; pointer-events: none !important; }
body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-badges span,
body[data-page="search"] #searchGrid.grid .poster-episode,
body[data-page="search"] .search-media-grid .poster-badges span,
body[data-page="search"] .search-media-grid .poster-episode { min-height: 28px !important; padding: 0 10px !important; border-radius: 9px !important; border: 1px solid rgba(255,255,255,.18) !important; background: rgba(245,245,247,.92) !important; color: #050608 !important; font-size: 12px !important; font-weight: 950 !important; line-height: 1 !important; box-shadow: 0 8px 22px rgba(0,0,0,.20) !important; }
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-episode,
body[data-page="search"] .search-media-grid .poster-episode { position: absolute !important; top: 11px !important; right: 11px !important; z-index: 5 !important; }
body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="search"] #searchGrid.grid .media-card__body,
body[data-page="search"] .search-media-grid .media-card__body { display: block !important; padding-top: 13px !important; }
body[data-page="catalog"] #catalogGrid .media-card__body h3,
body[data-page="search"] #searchGrid.grid .media-card__body h3,
body[data-page="search"] .search-media-grid .media-card__body h3 { margin: 0 !important; color: #f5f5f7 !important; font-size: 16px !important; line-height: 1.18 !important; font-weight: 900 !important; letter-spacing: -.04em !important; display: -webkit-box !important; -webkit-line-clamp: 2 !important; -webkit-box-orient: vertical !important; overflow: hidden !important; }
body[data-page="catalog"] #catalogGrid .media-card__body p,
body[data-page="search"] #searchGrid.grid .media-card__body p,
body[data-page="search"] .search-media-grid .media-card__body p { margin: 6px 0 0 !important; color: rgba(245,245,247,.52) !important; font-size: 12px !important; font-weight: 720 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="search"] #searchGrid.grid .media-card__meta,
body[data-page="search"] .search-media-grid .media-card__meta { position: static !important; display: flex !important; flex-wrap: wrap !important; gap: 6px !important; margin-top: 9px !important; }
body[data-page="catalog"] #catalogGrid .media-card__meta span,
body[data-page="search"] #searchGrid.grid .media-card__meta span,
body[data-page="search"] .search-media-grid .media-card__meta span { min-height: 22px !important; padding: 0 8px !important; border-radius: 7px !important; background: rgba(255,255,255,.08) !important; color: rgba(245,245,247,.72) !important; font-size: 10px !important; font-weight: 850 !important; }
body[data-page="catalog"] .catalog-meta,
body[data-page="catalog"] .toolbar,
body[data-page="catalog"] .catalog-auto-load,
body[data-page="search"] .search-page-head,
body[data-page="search"] .search-composer,
body[data-page="search"] .search-scopes,
body[data-page="search"] #searchPageMeta { max-width: calc((var(--kl-card-max) * 5) + (var(--kl-card-gap-x) * 4)) !important; margin-left: auto !important; margin-right: auto !important; }

/* compact overlay */
#searchOverlay.search-overlay { display: flex !important; align-items: flex-start !important; justify-content: center !important; padding: clamp(54px, 8vh, 82px) 18px 36px !important; overflow-x: hidden !important; overflow-y: auto !important; background: radial-gradient(circle at 50% -10%, rgba(255,255,255,.13), transparent 36%), rgba(0,0,0,.82) !important; backdrop-filter: blur(34px) saturate(1.16) !important; -webkit-backdrop-filter: blur(34px) saturate(1.16) !important; }
#searchOverlay.search-overlay.is-hidden { display: none !important; }
#searchOverlay .search-overlay__stage { width: min(860px, calc(100vw - 36px)) !important; max-width: calc(100vw - 36px) !important; margin: 0 auto !important; padding: clamp(18px, 2.4vw, 26px) !important; border-radius: 28px !important; display: flex !important; flex-direction: column !important; align-items: stretch !important; gap: 14px !important; background: linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.045)) !important; border: 1px solid rgba(255,255,255,.12) !important; box-shadow: 0 40px 140px rgba(0,0,0,.72), inset 0 1px 0 rgba(255,255,255,.10) !important; }
#searchOverlay .search-overlay__stage h2 { margin: 0 0 4px !important; font-size: clamp(38px, 4.2vw, 58px) !important; line-height: .94 !important; letter-spacing: -.075em !important; }
#searchOverlay .search-overlay__field { min-height: 58px !important; width: 100% !important; display: grid !important; grid-template-columns: 24px minmax(0, 1fr) 42px !important; gap: 12px !important; align-items: center !important; padding: 0 10px 0 17px !important; border-radius: 18px !important; background: #f5f5f7 !important; color: #06070a !important; border: 0 !important; overflow: hidden !important; }
#searchOverlay .search-overlay__field > svg, #searchOverlay .search-overlay__field > i { width: 24px !important; height: 24px !important; color: rgba(6,7,10,.34) !important; }
#searchOverlay .search-overlay__field input { height: 58px !important; min-width: 0 !important; width: 100% !important; border: 0 !important; outline: 0 !important; background: transparent !important; color: #06070a !important; font-size: clamp(18px, 1.65vw, 24px) !important; font-weight: 860 !important; letter-spacing: -.04em !important; }
#searchOverlay .search-overlay__field input::-webkit-search-cancel-button, #searchOverlay .search-overlay__field input::-webkit-search-decoration { display: none !important; -webkit-appearance: none !important; }
#searchOverlay .search-overlay__field button { width: 42px !important; height: 42px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border-radius: 999px !important; background: rgba(0,0,0,.08) !important; color: #06070a !important; }
#searchOverlay .search-overlay__field button svg { width: 20px !important; height: 20px !important; }
#searchOverlay .search-overlay__quick-actions { display: none !important; }
#searchOverlay .search-overlay__close { position: fixed !important; top: 22px !important; right: 24px !important; width: 44px !important; height: 44px !important; color: rgba(245,245,247,.70) !important; }
#searchOverlay .search-overlay__close svg { width: 28px !important; height: 28px !important; }
#searchOverlay .search-overlay__popular { margin-top: 4px !important; text-align: center !important; }
#searchOverlay .search-overlay__popular strong { margin-bottom: 12px !important; font-size: 15px !important; }
#searchOverlay .search-overlay__popular div { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 8px !important; }
#searchOverlay .search-overlay__popular button, #searchOverlay .search-overlay__chips button { min-height: 34px !important; padding: 0 13px !important; border-radius: 999px !important; font-size: 13px !important; font-weight: 850 !important; border: 1px solid rgba(255,255,255,.12) !important; background: rgba(245,245,247,.08) !important; color: rgba(245,245,247,.86) !important; }
#searchOverlay .search-overlay__results { width: 100% !important; max-width: 100% !important; margin-top: 4px !important; overflow: visible !important; }
#searchOverlay .search-overlay__loading { min-height: 88px !important; display: grid !important; place-items: center !important; gap: 10px !important; color: rgba(245,245,247,.68) !important; font-weight: 850 !important; }
#searchOverlay .search-overlay__loading span { width: 28px !important; height: 28px !important; border-radius: 50% !important; border: 3px solid rgba(255,255,255,.15) !important; border-top-color: rgba(255,255,255,.82) !important; animation: kinolotSpin .8s linear infinite !important; }
#searchOverlay .search-overlay-suggest { display: grid !important; gap: 10px !important; }
#searchOverlay .search-overlay-suggest__head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; color: rgba(245,245,247,.64) !important; font-size: 12px !important; font-weight: 900 !important; letter-spacing: .12em !important; text-transform: uppercase !important; }
#searchOverlay .search-overlay-suggest__head button { min-height: 30px !important; padding: 0 11px !important; border-radius: 999px !important; border: 1px solid rgba(255,255,255,.12) !important; background: rgba(255,255,255,.08) !important; color: rgba(245,245,247,.86) !important; font-size: 12px !important; font-weight: 850 !important; letter-spacing: 0 !important; text-transform: none !important; }
#searchOverlay .search-overlay-suggest-list { display: grid !important; gap: 8px !important; }
#searchOverlay .search-suggest-item { width: 100% !important; min-height: 66px !important; display: grid !important; grid-template-columns: 46px minmax(0,1fr) 20px !important; align-items: center !important; gap: 12px !important; padding: 9px 12px 9px 9px !important; border-radius: 17px !important; border: 1px solid rgba(255,255,255,.10) !important; background: rgba(255,255,255,.065) !important; color: #fff !important; text-align: left !important; transition: background .16s ease, transform .16s ease, border-color .16s ease !important; }
#searchOverlay .search-suggest-item:hover, #searchOverlay .search-suggest-item:focus-visible { transform: translateY(-1px) !important; background: rgba(255,255,255,.105) !important; border-color: rgba(255,255,255,.18) !important; }
#searchOverlay .search-suggest-item__thumb { width: 46px !important; height: 58px !important; border-radius: 11px !important; background: rgba(255,255,255,.10) center/cover no-repeat !important; display: grid !important; place-items: center !important; overflow: hidden !important; }
#searchOverlay .search-suggest-item__icon { width: 46px !important; height: 46px !important; border-radius: 14px !important; background: rgba(255,255,255,.10) !important; display: grid !important; place-items: center !important; }
#searchOverlay .search-suggest-item__text { min-width: 0 !important; display: grid !important; gap: 3px !important; }
#searchOverlay .search-suggest-item__text b { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: #fff !important; font-size: 15px !important; font-weight: 900 !important; letter-spacing: -.02em !important; }
#searchOverlay .search-suggest-item__text small { min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; color: rgba(245,245,247,.56) !important; font-size: 12px !important; font-weight: 720 !important; }
#searchOverlay .search-suggest-item > svg { width: 18px !important; height: 18px !important; color: rgba(245,245,247,.42) !important; }
#searchOverlay .search-overlay__empty { min-height: 94px !important; display: grid !important; place-items: center !important; text-align: center !important; color: rgba(245,245,247,.70) !important; }
.search-page { padding-top: clamp(92px, 10vh, 126px) !important; }
.search-page-head h2 { font-size: clamp(36px, 4vw, 62px) !important; }
.search-composer { border-radius: 24px !important; padding: 9px !important; }
.search-composer__field { min-height: 56px !important; border-radius: 17px !important; }
.search-composer__field .input { height: 56px !important; font-size: clamp(18px, 1.7vw, 24px) !important; }
#searchPageBtn { min-height: 56px !important; min-width: 126px !important; border-radius: 17px !important; }
.search-scopes { margin-top: 12px !important; margin-bottom: 26px !important; }
.search-scope { height: 38px !important; font-size: 13px !important; }
@media (max-width: 1460px) {
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid { grid-template-columns: repeat(4, minmax(0, var(--kl-card-max))) !important; max-width: calc((var(--kl-card-max) * 4) + (var(--kl-card-gap-x) * 3)) !important; }
  body[data-page="catalog"] .catalog-meta, body[data-page="catalog"] .toolbar, body[data-page="catalog"] .catalog-auto-load, body[data-page="search"] .search-page-head, body[data-page="search"] .search-composer, body[data-page="search"] .search-scopes, body[data-page="search"] #searchPageMeta { max-width: calc((var(--kl-card-max) * 4) + (var(--kl-card-gap-x) * 3)) !important; }
}
@media (max-width: 1150px) {
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid { grid-template-columns: repeat(3, minmax(0, 230px)) !important; max-width: calc((230px * 3) + (24px * 2)) !important; gap: 34px 24px !important; }
  body[data-page="catalog"] .catalog-meta, body[data-page="catalog"] .toolbar, body[data-page="catalog"] .catalog-auto-load, body[data-page="search"] .search-page-head, body[data-page="search"] .search-composer, body[data-page="search"] .search-scopes, body[data-page="search"] #searchPageMeta { max-width: calc((230px * 3) + (24px * 2)) !important; }
}
@media (max-width: 760px) {
  body[data-page="catalog"] #catalogPage, body[data-page="search"] #searchPage { padding-inline: 14px !important; }
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; max-width: none !important; gap: 24px 12px !important; }
  body[data-page="catalog"] #catalogGrid .media-card, body[data-page="search"] #searchGrid.grid .media-card, body[data-page="search"] .search-media-grid .media-card { max-width: none !important; }
  body[data-page="catalog"] #catalogGrid .poster-overlay em, body[data-page="catalog"] #catalogGrid .poster-actions, body[data-page="search"] #searchGrid.grid .poster-overlay em, body[data-page="search"] #searchGrid.grid .poster-actions, body[data-page="search"] .search-media-grid .poster-overlay em, body[data-page="search"] .search-media-grid .poster-actions { display: none !important; }
  #searchOverlay.search-overlay { padding: 66px 10px 24px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px) !important; border-radius: 24px !important; padding: 16px !important; }
  #searchOverlay .search-overlay__stage h2 { font-size: 38px !important; }
  #searchOverlay .search-overlay__field { min-height: 54px !important; grid-template-columns: 22px minmax(0,1fr) 38px !important; }
  #searchOverlay .search-overlay__field input { height: 54px !important; font-size: 17px !important; }
  #searchOverlay .search-suggest-item { grid-template-columns: 42px minmax(0,1fr) 18px !important; min-height: 60px !important; }
  #searchOverlay .search-suggest-item__thumb { width: 42px !important; height: 52px !important; }
}

/* KINOLOT v71: unified catalog cards + monochrome glass search */
:root {
  --kl-card-max: 238px;
  --kl-card-gap-x: 30px;
}

body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage {
  padding-inline: clamp(24px, 5vw, 110px) !important;
}
body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-media-grid {
  width: 100% !important;
  max-width: calc((var(--kl-card-max) * 5) + (var(--kl-card-gap-x) * 4)) !important;
  margin: 30px auto 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, var(--kl-card-max))) !important;
  gap: 34px var(--kl-card-gap-x) !important;
  justify-content: center !important;
  align-items: start !important;
}
body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid.grid .media-card,
body[data-page="search"] .search-media-grid .media-card {
  width: 100% !important;
  max-width: var(--kl-card-max) !important;
  min-width: 0 !important;
  border-radius: 23px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="search"] #searchGrid.grid .media-card__body,
body[data-page="search"] #searchGrid.grid .media-card__meta,
body[data-page="search"] .search-media-grid .media-card__body,
body[data-page="search"] .search-media-grid .media-card__meta {
  display: none !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card__poster,
body[data-page="search"] .search-media-grid .media-card__poster {
  position: relative !important;
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  height: auto !important;
  padding: 0 !important;
  border-radius: 23px !important;
  overflow: hidden !important;
  background: #101116 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: none !important;
  transform: none !important;
  transition: border-color .18s ease, transform .18s ease, filter .18s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover,
body[data-page="catalog"] #catalogGrid .media-card:focus-within,
body[data-page="search"] #searchGrid.grid .media-card:hover,
body[data-page="search"] #searchGrid.grid .media-card:focus-within,
body[data-page="search"] .search-media-grid .media-card:hover,
body[data-page="search"] .search-media-grid .media-card:focus-within {
  transform: translateY(-4px) !important;
  z-index: 20 !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:hover .media-card__poster,
body[data-page="search"] .search-media-grid .media-card:focus-within .media-card__poster {
  border-color: rgba(255,255,255,.26) !important;
  box-shadow: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-art,
body[data-page="catalog"] #catalogGrid .poster-art--img,
body[data-page="search"] #searchGrid.grid .poster-art,
body[data-page="search"] #searchGrid.grid .poster-art--img,
body[data-page="search"] .search-media-grid .poster-art,
body[data-page="search"] .search-media-grid .poster-art--img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  opacity: 1 !important;
  filter: none !important;
  transform: scale(1) !important;
  transition: filter .22s ease, transform .22s ease, opacity .22s ease !important;
  pointer-events: none !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-art,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-art,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-art,
body[data-page="search"] .search-media-grid .media-card:hover .poster-art,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-art {
  filter: blur(6px) brightness(.66) saturate(1.02) !important;
  transform: scale(1.035) !important;
}
body[data-page="catalog"] #catalogGrid .poster-shade,
body[data-page="search"] #searchGrid.grid .poster-shade,
body[data-page="search"] .search-media-grid .poster-shade {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, rgba(0,0,0,.02) 0%, rgba(0,0,0,.08) 46%, rgba(0,0,0,.84) 100%) !important;
  backdrop-filter: blur(0) saturate(1) !important;
  -webkit-backdrop-filter: blur(0) saturate(1) !important;
  transition: background .2s ease, backdrop-filter .2s ease, -webkit-backdrop-filter .2s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-shade,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-shade,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-shade,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-shade,
body[data-page="search"] .search-media-grid .media-card:hover .poster-shade,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-shade {
  background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.36) 42%, rgba(0,0,0,.82) 100%) !important;
  backdrop-filter: blur(8px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(8px) saturate(1.05) !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid.grid .poster-overlay,
body[data-page="search"] .search-media-grid .poster-overlay {
  position: absolute !important;
  left: 14px !important;
  right: 14px !important;
  bottom: 14px !important;
  z-index: 4 !important;
  display: grid !important;
  gap: 5px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  opacity: 1 !important;
  transform: none !important;
  pointer-events: none !important;
  text-shadow: 0 8px 24px rgba(0,0,0,.95) !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid.grid .poster-overlay strong,
body[data-page="search"] .search-media-grid .poster-overlay strong {
  color: #fff !important;
  font-size: clamp(18px, 1.22vw, 25px) !important;
  line-height: 1.02 !important;
  letter-spacing: -.055em !important;
  font-weight: 950 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid.grid .poster-overlay small,
body[data-page="search"] .search-media-grid .poster-overlay small {
  color: rgba(245,245,247,.78) !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 850 !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid.grid .poster-overlay em,
body[data-page="search"] #searchGrid.grid .poster-actions,
body[data-page="search"] .search-media-grid .poster-overlay em,
body[data-page="search"] .search-media-grid .poster-actions {
  display: none !important;
  opacity: 0 !important;
  transform: translateY(6px) !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:hover .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-overlay em {
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  opacity: 1 !important;
  transform: none !important;
  color: rgba(245,245,247,.88) !important;
  font-size: 13px !important;
  line-height: 1.28 !important;
  font-style: normal !important;
  font-weight: 520 !important;
  margin-top: 6px !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid.grid .media-card:focus-within .poster-actions,
body[data-page="search"] .search-media-grid .media-card:hover .poster-actions,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-actions {
  display: flex !important;
  opacity: 1 !important;
  transform: none !important;
  gap: 8px !important;
  margin-top: 8px !important;
  pointer-events: auto !important;
}
body[data-page="catalog"] #catalogGrid .poster-action,
body[data-page="search"] #searchGrid.grid .poster-action,
body[data-page="search"] .search-media-grid .poster-action {
  height: 36px !important;
  min-width: 38px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(245,245,247,.92) !important;
  color: #07080b !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-action:not(.poster-action--play),
body[data-page="search"] #searchGrid.grid .poster-action:not(.poster-action--play),
body[data-page="search"] .search-media-grid .poster-action:not(.poster-action--play) {
  width: 38px !important;
  padding: 0 !important;
  background: rgba(245,245,247,.16) !important;
  color: #fff !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}
body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid.grid .poster-badges,
body[data-page="search"] .search-media-grid .poster-badges {
  position: absolute !important;
  z-index: 5 !important;
  top: 10px !important;
  left: 10px !important;
  display: grid !important;
  grid-auto-flow: row !important;
  justify-items: start !important;
  gap: 6px !important;
  pointer-events: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="catalog"] #catalogGrid .poster-episode,
body[data-page="search"] #searchGrid.grid .poster-badges span,
body[data-page="search"] #searchGrid.grid .poster-episode,
body[data-page="search"] .search-media-grid .poster-badges span,
body[data-page="search"] .search-media-grid .poster-episode {
  min-height: 28px !important;
  padding: 0 10px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #07080b !important;
  font-size: 12px !important;
  font-weight: 950 !important;
  background: rgba(245,245,247,.88) !important;
  backdrop-filter: blur(14px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%) !important;
}
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-good,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-good,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-good { background: rgba(41,211,128,.88) !important; color:#041006 !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-mid,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-mid { background: rgba(225,229,236,.86) !important; color:#07080b !important; }
body[data-page="catalog"] #catalogGrid .poster-badges .is-tmdb.is-low,
body[data-page="search"] #searchGrid.grid .poster-badges .is-tmdb.is-low,
body[data-page="search"] .search-media-grid .poster-badges .is-tmdb.is-low { background: rgba(235,91,91,.88) !important; color:#160303 !important; }

.search-modal-open .app-shell,
.search-modal-open .bottom-nav,
.search-modal-open .drawer {
  filter: blur(28px) brightness(.36) saturate(.88) !important;
  transform: none !important;
}
#searchOverlay.search-overlay {
  background: rgba(0,0,0,.42) !important;
  backdrop-filter: blur(44px) brightness(.50) saturate(92%) !important;
  -webkit-backdrop-filter: blur(44px) brightness(.50) saturate(92%) !important;
  padding: clamp(62px, 8vh, 96px) 22px 42px !important;
}
#searchOverlay .search-overlay__stage {
  width: min(980px, calc(100vw - 44px)) !important;
  max-width: calc(100vw - 44px) !important;
  padding: clamp(24px, 3vw, 36px) !important;
  border-radius: 34px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: linear-gradient(180deg, rgba(31,32,36,.58), rgba(20,20,23,.42)) !important;
  box-shadow: 0 36px 120px rgba(0,0,0,.56), inset 0 1px 0 rgba(255,255,255,.10) !important;
  backdrop-filter: blur(34px) saturate(118%) !important;
  -webkit-backdrop-filter: blur(34px) saturate(118%) !important;
  gap: 20px !important;
}
#searchOverlay .search-overlay__stage h2 {
  font-size: clamp(44px, 4.7vw, 70px) !important;
  color: #fff !important;
}
#searchOverlay .search-overlay__field {
  position: relative !important;
  min-height: 62px !important;
  border-radius: 20px !important;
  grid-template-columns: 25px minmax(0,1fr) 42px !important;
  gap: 12px !important;
  background: rgba(245,245,247,.08) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#searchOverlay .search-overlay__field > svg,
#searchOverlay .search-overlay__field > i {
  color: rgba(245,245,247,.55) !important;
}
#searchOverlay .search-overlay__field input {
  height: 62px !important;
  color: #fff !important;
  font-size: clamp(19px, 1.65vw, 25px) !important;
  caret-color: #fff !important;
  position: relative !important;
  z-index: 2 !important;
}
#searchOverlay .search-overlay__field input::placeholder { color: rgba(245,245,247,.38) !important; }
#searchOverlay .search-overlay__field button {
  background: rgba(245,245,247,.12) !important;
  color: rgba(245,245,247,.84) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
}
#searchOverlay .search-overlay__field button:hover { background: rgba(245,245,247,.20) !important; color:#fff !important; }
#searchOverlay .search-overlay__ghost {
  position: absolute !important;
  right: 72px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  max-width: 42% !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: rgba(245,245,247,.28) !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  pointer-events: none !important;
  opacity: 0 !important;
  z-index: 1 !important;
}
#searchOverlay .search-overlay__ghost.is-visible { opacity: 1 !important; }
#searchOverlay .search-overlay__popular {
  margin: 4px 0 0 !important;
  display: grid !important;
  gap: 16px !important;
  text-align: center !important;
}
#searchOverlay .search-overlay__chips-block { display: grid !important; gap: 10px !important; }
#searchOverlay .search-overlay__chips-block strong,
#searchOverlay .search-overlay-suggest section h3 {
  display: block !important;
  margin: 0 !important;
  color: rgba(245,245,247,.72) !important;
  font-size: 12px !important;
  font-weight: 920 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
#searchOverlay .search-overlay__chips-block div {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  gap: 8px !important;
}
#searchOverlay .search-overlay__chips-block span {
  color: rgba(245,245,247,.42) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}
#searchOverlay .search-overlay__popular button,
#searchOverlay .search-overlay__chips button {
  min-height: 34px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  background: rgba(245,245,247,.075) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  color: rgba(245,245,247,.82) !important;
}
#searchOverlay .search-overlay__popular button:hover,
#searchOverlay .search-overlay__popular button:focus-visible {
  background: rgba(245,245,247,.15) !important;
  color: #fff !important;
}
#searchOverlay .search-overlay__results--suggest {
  max-height: 486px !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  padding: 14px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  background: rgba(8,9,11,.36) !important;
  backdrop-filter: blur(26px) saturate(110%) !important;
  -webkit-backdrop-filter: blur(26px) saturate(110%) !important;
}
#searchOverlay .search-overlay__results--suggest::-webkit-scrollbar { width: 8px !important; }
#searchOverlay .search-overlay__results--suggest::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18) !important; border-radius: 999px !important; }
#searchOverlay .search-overlay-suggest__head {
  position: sticky !important;
  top: -14px !important;
  z-index: 5 !important;
  margin: -14px -14px 12px !important;
  padding: 14px !important;
  background: rgba(12,13,16,.72) !important;
  backdrop-filter: blur(20px) !important;
  -webkit-backdrop-filter: blur(20px) !important;
}
#searchOverlay .search-overlay-suggest {
  display: grid !important;
  gap: 18px !important;
}
#searchOverlay .search-overlay-suggest section { display: grid !important; gap: 10px !important; }
#searchOverlay .search-overlay-suggest-list { display: grid !important; gap: 8px !important; }
#searchOverlay .search-suggest-item {
  min-height: 70px !important;
  grid-template-columns: 48px minmax(0,1fr) 20px !important;
  border-radius: 18px !important;
  background: rgba(245,245,247,.065) !important;
  border-color: rgba(255,255,255,.10) !important;
}
#searchOverlay .search-suggest-item__thumb { width: 48px !important; height: 58px !important; border-radius: 12px !important; }
#searchOverlay .search-suggest-item__text b { font-size: 15px !important; }
#searchOverlay .search-suggest-item__text small { color: rgba(245,245,247,.50) !important; }

@media (max-width: 1460px) {
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid {
    grid-template-columns: repeat(4, minmax(0, var(--kl-card-max))) !important;
    max-width: calc((var(--kl-card-max) * 4) + (var(--kl-card-gap-x) * 3)) !important;
  }
}
@media (max-width: 1150px) {
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid {
    grid-template-columns: repeat(3, minmax(0, 220px)) !important;
    max-width: calc((220px * 3) + (24px * 2)) !important;
    gap: 30px 24px !important;
  }
}
@media (max-width: 760px) {
  body[data-page="catalog"] #catalogPage,
  body[data-page="search"] #searchPage { padding-inline: 14px !important; }
  body[data-page="catalog"] #catalogGrid.grid,
  body[data-page="search"] #searchGrid.grid,
  body[data-page="search"] .search-media-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    max-width: none !important;
    gap: 22px 12px !important;
  }
  body[data-page="catalog"] #catalogGrid .media-card,
  body[data-page="search"] #searchGrid.grid .media-card,
  body[data-page="search"] .search-media-grid .media-card { max-width: none !important; }
  #searchOverlay.search-overlay { padding: 64px 10px 24px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 20px) !important; max-width: calc(100vw - 20px) !important; padding: 16px !important; border-radius: 26px !important; }
  #searchOverlay .search-overlay__stage h2 { font-size: 38px !important; }
  #searchOverlay .search-overlay__field { min-height: 54px !important; grid-template-columns: 22px minmax(0,1fr) 38px !important; }
  #searchOverlay .search-overlay__field input { height: 54px !important; font-size: 17px !important; }
  #searchOverlay .search-overlay__ghost { display: none !important; }
  #searchOverlay .search-overlay__results--suggest { max-height: 430px !important; padding: 10px !important; border-radius: 20px !important; }
  #searchOverlay .search-overlay-suggest__head { top: -10px !important; margin: -10px -10px 10px !important; padding: 10px !important; }
}

/* v72: catalog cards, compact glass search, Wink-like detail page */
body[data-page="catalog"] #catalogPage,
body[data-page="search"] #searchPage {
  --catalog-card-gap: clamp(22px, 2.2vw, 38px);
}
body[data-page="catalog"] #catalogGrid.grid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-result-grid {
  width: min(1720px, calc(100vw - 190px)) !important;
  margin: 36px auto 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 44px var(--catalog-card-gap) !important;
  align-items: start !important;
  justify-content: center !important;
}
body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid .media-card,
body[data-page="search"] .search-result-grid .media-card {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: none !important;
  display: block !important;
  transform: none !important;
}
body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid .media-card__poster,
body[data-page="search"] .search-result-grid .media-card__poster {
  width: 100% !important;
  aspect-ratio: 16/9 !important;
  padding-bottom: 0 !important;
  min-height: 0 !important;
  border-radius: 22px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.12), 0 22px 58px rgba(0,0,0,.58) !important;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .media-card__poster,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .media-card__poster,
body[data-page="search"] #searchGrid .media-card:hover .media-card__poster,
body[data-page="search"] #searchGrid .media-card:focus-within .media-card__poster {
  transform: translateY(-4px) scale(1.018) !important;
  box-shadow: inset 0 0 0 2px rgba(255,255,255,.86), 0 34px 92px rgba(0,0,0,.75) !important;
}
body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="search"] #searchGrid .media-card__body,
body[data-page="search"] .search-result-grid .media-card__body { display: none !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid .poster-overlay,
body[data-page="search"] .search-result-grid .poster-overlay {
  position: absolute !important;
  inset: auto 0 0 0 !important;
  min-height: 48% !important;
  padding: 0 22px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  gap: 4px !important;
  transform: none !important;
  opacity: 1 !important;
  pointer-events: none !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid .poster-overlay strong,
body[data-page="search"] .search-result-grid .poster-overlay strong {
  max-width: 94% !important;
  font-size: clamp(18px, 1.35vw, 28px) !important;
  line-height: .96 !important;
  letter-spacing: -.045em !important;
  text-shadow: 0 4px 20px rgba(0,0,0,.8) !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay small,
body[data-page="search"] #searchGrid .poster-overlay small,
body[data-page="search"] .search-result-grid .poster-overlay small {
  font-size: clamp(11px, .82vw, 15px) !important;
  color: rgba(255,255,255,.76) !important;
  font-weight: 800 !important;
}
body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="search"] #searchGrid .poster-overlay em,
body[data-page="search"] .search-result-grid .poster-overlay em {
  display: block !important;
  max-height: 0 !important;
  overflow: hidden !important;
  opacity: 0 !important;
  margin: 0 !important;
  transition: max-height .22s ease, opacity .22s ease, margin .22s ease !important;
}
body[data-page="catalog"] #catalogGrid .poster-actions,
body[data-page="search"] #searchGrid .poster-actions,
body[data-page="search"] .search-result-grid .poster-actions {
  opacity: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  margin-top: 0 !important;
  pointer-events: auto !important;
  transition: opacity .22s ease, max-height .22s ease, margin .22s ease !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid .media-card:focus-within .poster-overlay em {
  max-height: 5.6em !important;
  opacity: .88 !important;
  margin-top: 8px !important;
}
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-actions,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-actions,
body[data-page="search"] #searchGrid .media-card:hover .poster-actions,
body[data-page="search"] #searchGrid .media-card:focus-within .poster-actions {
  opacity: 1 !important;
  max-height: 64px !important;
  margin-top: 14px !important;
}
body[data-page="catalog"] #catalogGrid .poster-badges,
body[data-page="search"] #searchGrid .poster-badges { top: 16px !important; left: 16px !important; gap: 8px !important; }
body[data-page="catalog"] #catalogGrid .poster-badges span,
body[data-page="search"] #searchGrid .poster-badges span { border-radius: 9px !important; padding: 8px 13px !important; font-size: 13px !important; }
body[data-page="catalog"] .catalog-meta { width: min(1720px, calc(100vw - 190px)) !important; margin: 18px auto 0 !important; font-size: 18px !important; font-weight: 800 !important; }
@media (max-width: 1500px) {
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-result-grid { grid-template-columns: repeat(4, minmax(0,1fr)) !important; width: min(1280px, calc(100vw - 84px)) !important; }
  body[data-page="catalog"] .catalog-meta { width: min(1280px, calc(100vw - 84px)) !important; }
}
@media (max-width: 1100px) {
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-result-grid { grid-template-columns: repeat(3, minmax(0,1fr)) !important; width: calc(100vw - 44px) !important; }
  body[data-page="catalog"] .catalog-meta { width: calc(100vw - 44px) !important; }
}
@media (max-width: 720px) {
  body[data-page="catalog"] #catalogGrid.grid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-result-grid { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 24px 14px !important; width: calc(100vw - 28px) !important; }
  body[data-page="catalog"] #catalogGrid .poster-overlay strong, body[data-page="search"] #searchGrid .poster-overlay strong { font-size: 15px !important; }
  body[data-page="catalog"] #catalogGrid .poster-actions, body[data-page="catalog"] #catalogGrid .poster-overlay em { display:none !important; }
}

html.search-modal-open, body.search-modal-open { overflow: hidden !important; }
#searchOverlay.search-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: center !important;
  padding: clamp(42px, 7vh, 74px) 24px 40px !important;
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.08), transparent 32%),
    radial-gradient(circle at 82% 20%, rgba(255,255,255,.045), transparent 36%),
    rgba(0,0,0,.78) !important;
  backdrop-filter: blur(26px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(26px) saturate(1.15) !important;
  overflow: hidden !important;
}
#searchOverlay.search-overlay.is-hidden { display: none !important; }
#searchOverlay .search-overlay__stage {
  width: min(1040px, calc(100vw - 64px)) !important;
  max-height: calc(100vh - 92px) !important;
  margin: 0 auto !important;
  padding: clamp(26px, 3.2vw, 42px) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 34px !important;
  background: linear-gradient(180deg, rgba(42,42,42,.72), rgba(20,20,20,.72)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 30px 100px rgba(0,0,0,.68) !important;
  backdrop-filter: blur(34px) saturate(1.18) !important;
  -webkit-backdrop-filter: blur(34px) saturate(1.18) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 20px !important;
  overflow: hidden !important;
}
#searchOverlay .search-overlay__stage h2 {
  margin: 0 !important;
  font-size: clamp(44px, 4.6vw, 72px) !important;
  line-height: .9 !important;
  letter-spacing: -.065em !important;
  color: #fff !important;
}
#searchOverlay .search-overlay__field {
  position: relative !important;
  width: 100% !important;
  height: 68px !important;
  min-height: 68px !important;
  display: grid !important;
  grid-template-columns: 30px minmax(0, 1fr) 48px !important;
  gap: 14px !important;
  align-items: center !important;
  border-radius: 20px !important;
  padding: 0 12px 0 20px !important;
  color: #fff !important;
  background: rgba(255,255,255,.105) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 14px 40px rgba(0,0,0,.26) !important;
}
#searchOverlay .search-overlay__field > svg,
#searchOverlay .search-overlay__field > i { color: rgba(255,255,255,.62) !important; width: 30px !important; height: 30px !important; }
#searchOverlay .search-overlay__field input {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 68px !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: clamp(24px, 2.2vw, 34px) !important;
  font-weight: 900 !important;
  letter-spacing: -.04em !important;
}
#searchOverlay .search-overlay__field input::placeholder { color: rgba(255,255,255,.38) !important; }
#searchOverlay .search-overlay__ghost {
  position: absolute !important;
  z-index: 1 !important;
  left: 67px !important;
  right: 72px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  color: rgba(255,255,255,.28) !important;
  font-size: clamp(18px, 1.5vw, 24px) !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  pointer-events: none !important;
}
#searchOverlay .search-overlay__field input:not(:placeholder-shown) + .search-overlay__ghost,
#searchOverlay .search-overlay__ghost:not(.is-visible) { display: none !important; }
#searchOverlay .search-overlay__field button {
  width: 48px !important;
  height: 48px !important;
  border-radius: 50% !important;
  border: 0 !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255,255,255,.15) !important;
  color: #fff !important;
}
#searchOverlay .search-overlay__close {
  position: fixed !important;
  top: 26px !important;
  right: 30px !important;
  width: 46px !important;
  height: 46px !important;
  color: rgba(255,255,255,.7) !important;
  background: transparent !important;
  border: 0 !important;
}
#searchOverlay .search-overlay__popular { display: grid !important; gap: 18px !important; padding: 2px 0 0 !important; }
#searchOverlay .search-overlay__popular.is-hidden { display: none !important; }
#searchOverlay .search-overlay__chips-block { display: grid !important; gap: 10px !important; text-align: center !important; }
#searchOverlay .search-overlay__chips-block strong { font-size: 14px !important; text-transform: uppercase !important; letter-spacing: .18em !important; color: rgba(255,255,255,.78) !important; }
#searchOverlay .search-overlay__chips-block div { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; }
#searchOverlay .search-overlay__chips-block button { border: 1px solid rgba(255,255,255,.13) !important; border-radius: 999px !important; padding: 10px 18px !important; background: rgba(255,255,255,.08) !important; color: rgba(255,255,255,.84) !important; font-weight: 800 !important; }
#searchOverlay .search-overlay__results {
  width: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}
#searchOverlay .search-overlay__results.is-empty { min-height: 0 !important; }
#searchOverlay .search-overlay__results--suggest {
  border: 1px solid rgba(255,255,255,.1) !important;
  border-radius: 24px !important;
  background: rgba(10,10,11,.45) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}
#searchOverlay .search-overlay-suggest__head {
  height: 56px !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
}
#searchOverlay .search-overlay-suggest__head span { text-transform: uppercase !important; letter-spacing: .16em !important; color: rgba(255,255,255,.62) !important; font-size: 13px !important; font-weight: 900 !important; }
#searchOverlay .search-overlay-suggest__head button { border: 1px solid rgba(255,255,255,.12) !important; border-radius: 999px !important; padding: 8px 14px !important; background: rgba(255,255,255,.08) !important; color: #fff !important; font-weight: 800 !important; }
#searchOverlay .search-overlay-suggest {
  max-height: min(560px, calc(100vh - 330px)) !important;
  overflow-y: auto !important;
  padding: 16px 18px 18px !important;
  display: grid !important;
  gap: 18px !important;
  scrollbar-width: thin !important;
}
#searchOverlay .search-overlay-suggest section h3 { margin: 0 0 10px !important; font-size: 13px !important; text-transform: uppercase !important; letter-spacing: .17em !important; color: rgba(255,255,255,.56) !important; }
#searchOverlay .search-overlay-suggest-list { display: grid !important; gap: 8px !important; }
#searchOverlay .search-overlay-suggest-list--media { max-height: 432px !important; overflow-y: auto !important; padding-right: 5px !important; }
#searchOverlay .search-suggest-item {
  min-height: 76px !important;
  padding: 8px 12px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 18px !important;
  background: rgba(255,255,255,.055) !important;
  color: #fff !important;
  display: grid !important;
  grid-template-columns: 78px minmax(0,1fr) 22px !important;
  align-items: center !important;
  gap: 14px !important;
  text-align: left !important;
}
#searchOverlay .search-suggest-item:hover { background: rgba(255,255,255,.1) !important; border-color: rgba(255,255,255,.18) !important; }
#searchOverlay .search-suggest-item__thumb { width: 78px !important; height: 50px !important; border-radius: 12px !important; background-size: cover !important; background-position: center !important; background-color: rgba(255,255,255,.08) !important; display: grid !important; place-items: center !important; }
#searchOverlay .search-suggest-item__icon { width: 54px !important; height: 54px !important; border-radius: 16px !important; background: rgba(255,255,255,.08) !important; display: grid !important; place-items: center !important; }
#searchOverlay .search-suggest-item__text b { display: block !important; font-size: 18px !important; line-height: 1.05 !important; letter-spacing: -.03em !important; color: #fff !important; }
#searchOverlay .search-suggest-item__text small { display: block !important; margin-top: 4px !important; color: rgba(255,255,255,.58) !important; font-size: 13px !important; }
#searchOverlay .search-overlay__loading, #searchOverlay .search-overlay__empty { border-radius: 22px !important; padding: 34px !important; background: rgba(255,255,255,.055) !important; color: rgba(255,255,255,.8) !important; }
@media (max-width: 760px) {
  #searchOverlay.search-overlay { padding: 18px 10px !important; }
  #searchOverlay .search-overlay__stage { width: calc(100vw - 20px) !important; max-height: calc(100vh - 36px) !important; border-radius: 24px !important; padding: 20px !important; }
  #searchOverlay .search-overlay__field { height: 58px !important; min-height: 58px !important; }
  #searchOverlay .search-overlay__field input { height: 58px !important; font-size: 21px !important; }
}

/* New detail layout */
.media-page .media-content { width: 100% !important; margin: 0 !important; padding: 0 !important; }
.wink-detail { --wink-bg:none; color:#fff; position: relative; margin: -118px calc(-1 * var(--content-x, 0px)) 0; min-height: 100vh; }
.wink-detail-hero { position: relative; min-height: clamp(560px, 76vh, 780px); overflow: hidden; display: flex; align-items: flex-end; padding: 160px clamp(34px,5vw,86px) 70px; }
.wink-detail-hero__bg { position:absolute; inset:0; background-image: var(--wink-bg); background-size: cover; background-position: center top; filter: saturate(1.06); transform: scale(1.02); }
.wink-detail-hero__shade { position:absolute; inset:0; background: linear-gradient(90deg, rgba(0,0,0,.96) 0%, rgba(0,0,0,.78) 34%, rgba(0,0,0,.32) 72%, rgba(0,0,0,.7) 100%), linear-gradient(180deg, rgba(0,0,0,.72) 0%, rgba(0,0,0,.14) 34%, #000 100%); }
.wink-detail-hero__inner { position:relative; z-index:2; width:min(1720px,100%); margin:0 auto; display:grid; grid-template-columns:minmax(0, 1fr) minmax(210px, 330px); align-items:end; gap: clamp(28px,4vw,70px); }
.wink-detail-maincopy { max-width: 850px; display:grid; gap:16px; }
.wink-detail-crumbs { display:flex; align-items:center; gap:10px; color:rgba(255,255,255,.7); font-size:13px; letter-spacing:.18em; text-transform:uppercase; font-weight:900; }
.wink-detail-crumbs i { width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,.4); }
.wink-detail h1 { margin:0; font-size:clamp(46px,6.2vw,112px); line-height:.86; letter-spacing:-.075em; max-width: 960px; }
.wink-detail-meta { display:flex; flex-wrap:wrap; gap:8px; }
.wink-detail-meta span, .wink-detail-meta b { display:inline-flex; align-items:center; min-height:28px; padding:0 11px; border-radius:999px; background:rgba(255,255,255,.14); color:#fff; font-size:13px; font-weight:900; }
.wink-detail-tagline { margin:0; max-width:720px; color:rgba(255,255,255,.82); font-size:18px; font-weight:800; }
.wink-detail-overview { margin:0; max-width:820px; color:rgba(255,255,255,.78); font-size:clamp(16px,1.1vw,20px); line-height:1.55; }
.wink-detail-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top: 10px; }
.wink-action { height:52px; display:inline-flex; align-items:center; gap:10px; padding:0 20px; border-radius:16px; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.11); color:#fff; font-size:15px; font-weight:900; text-decoration:none; }
.wink-action--primary { background:#fff; color:#000; border-color:#fff; }
.wink-action.is-active[data-user-action="favorite"] svg { fill:#ff395d !important; stroke:#ff395d !important; }
.wink-action.is-active[data-user-action="watchlist"] svg { fill:#ff9d1a !important; stroke:#ff9d1a !important; }
.wink-detail-poster { width:min(24vw,330px); aspect-ratio:2/3; border-radius:26px; background:rgba(255,255,255,.08) center/cover no-repeat; box-shadow:0 30px 90px rgba(0,0,0,.72), inset 0 0 0 1px rgba(255,255,255,.14); display:grid; place-items:center; color:rgba(255,255,255,.5); font-weight:900; letter-spacing:.3em; }
.wink-detail-body { background:#000; padding:0 clamp(34px,5vw,86px) 90px; }
.wink-detail-content { width:min(1720px,100%); margin:0 auto; display:grid; gap:34px; }
.wink-block, .wink-detail .apple-detail-panel { border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; padding:0 !important; }
.wink-about { padding-top: 16px !important; }
.wink-block h2, .wink-detail .apple-detail-section-head h2 { margin:0 0 24px !important; font-size:clamp(30px,3.2vw,58px) !important; line-height:.95 !important; letter-spacing:-.055em !important; }
.wink-block h3 { margin:0 0 24px; font-size:clamp(24px,2.2vw,42px); letter-spacing:-.055em; }
.wink-about__grid { display:grid; grid-template-columns:minmax(0,760px) minmax(260px,420px); gap: clamp(28px, 6vw, 110px); align-items:start; }
.wink-about__grid p { margin:0; color:rgba(255,255,255,.78); font-size:17px; line-height:1.72; }
.wink-facts { margin:0; display:grid; gap:14px; }
.wink-facts div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:18px; align-items:start; }
.wink-facts dt { color:rgba(255,255,255,.45); font-size:13px; font-weight:900; }
.wink-facts dd { margin:0; color:#fff; font-size:14px; font-weight:900; }
.wink-detail .apple-season-layout { border-radius: 28px !important; background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.09) !important; padding:18px !important; }
.wink-detail .apple-episode-card { background:rgba(255,255,255,.055) !important; border-color:rgba(255,255,255,.08) !important; }
.wink-detail .apple-person-grid { display:flex !important; overflow-x:auto !important; gap:18px !important; padding-bottom:10px !important; }
.wink-detail .apple-person-card { flex:0 0 150px !important; background:transparent !important; border:0 !important; }
.wink-detail .apple-person-card span { width:82px !important; height:82px !important; margin:0 auto 10px !important; border-radius:50% !important; background-color:rgba(255,255,255,.08) !important; background-size:cover !important; background-position:center !important; }
.wink-detail .apple-social-grid { grid-template-columns: minmax(260px,360px) minmax(0,1fr) !important; }
.wink-recommendations { display:grid; gap:18px; }
.wink-block-head { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.wink-block-head h2 { margin:0 !important; }
.wink-block-head button { width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.08); color:#fff; }
.wink-rec-row { display:flex; gap:16px; overflow-x:auto; padding:4px 0 18px; scroll-snap-type:x proximity; }
.wink-rec-card { flex:0 0 clamp(168px, 12vw, 230px); aspect-ratio:2/3; border:1px solid rgba(255,255,255,.1); border-radius:20px; overflow:hidden; position:relative; color:#fff; text-align:left; padding:14px; display:flex; flex-direction:column; justify-content:flex-end; background:rgba(255,255,255,.07) var(--rec-bg) center/cover no-repeat; box-shadow:0 24px 56px rgba(0,0,0,.48); }
.wink-rec-card::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(0,0,0,0) 38%, rgba(0,0,0,.86) 100%); }
.wink-rec-card > * { position:relative; z-index:1; }
.wink-rec-card span { position:absolute; top:12px; left:12px; border-radius:9px; padding:6px 9px; background:#fff; color:#111; font-size:12px; font-weight:900; }
.wink-rec-card b { font-size:18px; line-height:1; letter-spacing:-.045em; }
.wink-rec-card small { color:rgba(255,255,255,.68); font-weight:800; margin-top:4px; }
@media (max-width: 980px) {
  .wink-detail { margin-top:-90px; }
  .wink-detail-hero__inner, .wink-about__grid { grid-template-columns:1fr; }
  .wink-detail-poster { display:none; }
  .wink-detail-hero { padding: 130px 22px 52px; min-height: 620px; }
  .wink-detail-body { padding:0 22px 70px; }
  .wink-detail .apple-social-grid { grid-template-columns: 1fr !important; }
}
#searchOverlay .search-overlay__ghost { left: 42% !important; text-align: right !important; }
@media (max-width: 760px) { #searchOverlay .search-overlay__ghost { display:none !important; } }


/* v73 detail polish, serial episodes, final comments */
.wink-detail { background:#000 !important; }
.wink-detail-hero { min-height: clamp(520px, 70vh, 720px) !important; padding-bottom: 58px !important; }
.wink-detail h1 { font-size: clamp(42px, 5.1vw, 92px) !important; line-height:.9 !important; letter-spacing:-.065em !important; }
.wink-detail-overview { max-width: 760px !important; color:rgba(255,255,255,.82) !important; }
.wink-detail-poster { border-radius: 22px !important; box-shadow: 0 32px 120px rgba(0,0,0,.78), inset 0 0 0 1px rgba(255,255,255,.18) !important; }
.wink-detail-body { padding-bottom: 120px !important; }
.wink-detail-content { gap: 56px !important; }
.wink-block h2, .wink-detail .apple-detail-section-head h2 { font-size: clamp(34px,3.4vw,62px) !important; letter-spacing:-.06em !important; }
.wink-about__grid { align-items:start !important; }
.wink-facts { padding: 10px 0 0 !important; display:grid !important; grid-template-columns: minmax(0,1fr) !important; gap:10px !important; }
.wink-facts div { display:grid !important; grid-template-columns: 120px minmax(0,1fr) !important; gap:18px !important; color:rgba(255,255,255,.78) !important; }
.wink-facts dt { color:rgba(255,255,255,.42) !important; text-transform:none !important; letter-spacing:0 !important; }
.wink-facts dd { color:#fff !important; font-weight:850 !important; }

.wink-series-panel { margin-top: 8px !important; }
.wink-series-layout { display:grid !important; grid-template-columns: 136px minmax(0,1fr) !important; gap:18px !important; align-items:start !important; border-radius:32px !important; padding:18px !important; background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035)) !important; border:1px solid rgba(255,255,255,.095) !important; box-shadow:0 24px 90px rgba(0,0,0,.36) !important; }
.wink-season-tabs { position:sticky !important; top:118px !important; display:grid !important; gap:10px !important; }
.wink-season-tab { min-height:104px !important; border:1px solid rgba(255,255,255,.10) !important; border-radius:22px !important; background:rgba(255,255,255,.06) !important; color:#fff !important; display:grid !important; align-content:center !important; justify-items:center !important; gap:2px !important; cursor:pointer !important; transition:.2s ease !important; }
.wink-season-tab strong { font-size:34px !important; line-height:1 !important; font-weight:950 !important; }
.wink-season-tab span { font-size:12px !important; font-weight:950 !important; text-transform:uppercase !important; letter-spacing:.04em !important; }
.wink-season-tab em { font-style:normal !important; font-size:11px !important; color:rgba(255,255,255,.56) !important; }
.wink-season-tab.is-active { background:#f5f5f7 !important; color:#050505 !important; border-color:#f5f5f7 !important; }
.wink-season-tab.is-active em { color:rgba(0,0,0,.55) !important; }
.wink-season-content { min-width:0 !important; }
.wink-season-pane { display:none !important; }
.wink-season-pane.is-active { display:block !important; }
.wink-season-pane__top { display:flex !important; justify-content:space-between !important; gap:14px !important; align-items:center !important; margin:2px 0 16px !important; padding:4px 4px 14px !important; border-bottom:1px solid rgba(255,255,255,.08) !important; }
.wink-season-pane__top span { color:rgba(255,255,255,.52) !important; font-size:12px !important; font-weight:900 !important; text-transform:uppercase !important; letter-spacing:.14em !important; }
.wink-season-pane__top b { display:block !important; color:#fff !important; font-size:24px !important; line-height:1.1 !important; margin-top:2px !important; }
.wink-season-translations { display:flex !important; flex-wrap:wrap !important; gap:8px !important; justify-content:flex-end !important; align-items:center !important; max-width:60% !important; }
.wink-season-translations small { color:rgba(255,255,255,.48) !important; font-weight:900 !important; margin-right:2px !important; }
.wink-season-translations button, .wink-episode-actions button { border:0 !important; min-height:28px !important; border-radius:999px !important; padding:0 11px !important; background:rgba(255,255,255,.10) !important; color:#fff !important; font-size:12px !important; font-weight:900 !important; cursor:pointer !important; }
.wink-season-translations button:hover, .wink-episode-actions button:hover { background:rgba(255,255,255,.18) !important; }
.wink-episode-list { display:grid !important; gap:12px !important; max-height:none !important; overflow:visible !important; }
.wink-episode-card { display:grid !important; grid-template-columns: 220px minmax(0,1fr) !important; gap:18px !important; align-items:stretch !important; padding:12px !important; border-radius:24px !important; background:rgba(255,255,255,.055) !important; border:1px solid rgba(255,255,255,.075) !important; transition:.2s ease !important; }
.wink-episode-card:hover { background:rgba(255,255,255,.085) !important; transform:translateY(-1px) !important; }
.wink-episode-thumb { position:relative !important; border:0 !important; border-radius:18px !important; background:rgba(255,255,255,.08) center/cover no-repeat !important; min-height:124px !important; overflow:hidden !important; color:#fff !important; cursor:pointer !important; }
.wink-episode-thumb::before { content:'' !important; position:absolute !important; inset:0 !important; background:linear-gradient(180deg,rgba(0,0,0,.04),rgba(0,0,0,.56)) !important; }
.wink-episode-thumb i { position:absolute !important; left:50% !important; top:50% !important; transform:translate(-50%,-50%) !important; width:58px !important; height:58px !important; border-radius:50% !important; display:grid !important; place-items:center !important; background:rgba(245,245,247,.94) !important; color:#050505 !important; padding:17px !important; }
.wink-episode-thumb span { position:absolute !important; inset:0 !important; display:grid !important; place-items:center !important; color:rgba(255,255,255,.42) !important; font-size:38px !important; font-weight:950 !important; }
.wink-episode-copy { min-width:0 !important; display:grid !important; align-content:center !important; gap:8px !important; padding:4px 4px 4px 0 !important; }
.wink-episode-kicker { color:rgba(255,255,255,.48) !important; font-size:12px !important; font-weight:900 !important; text-transform:uppercase !important; letter-spacing:.08em !important; }
.wink-episode-copy h3 { margin:0 !important; color:#fff !important; font-size:20px !important; line-height:1.15 !important; letter-spacing:-.035em !important; }
.wink-episode-meta { display:flex !important; flex-wrap:wrap !important; gap:6px !important; }
.wink-episode-meta span { min-height:22px !important; border-radius:999px !important; padding:0 8px !important; display:inline-flex !important; align-items:center !important; background:rgba(255,255,255,.10) !important; color:rgba(255,255,255,.74) !important; font-size:11px !important; font-weight:850 !important; }
.wink-episode-copy p { margin:0 !important; color:rgba(255,255,255,.62) !important; line-height:1.45 !important; display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; }
.wink-episode-actions { display:flex !important; flex-wrap:wrap !important; gap:7px !important; margin-top:2px !important; }

.wink-discussion-panel { margin-top:12px !important; padding-bottom:0 !important; }
.wink-social-topline { display:grid !important; grid-template-columns: minmax(270px,380px) minmax(0,1fr) !important; gap:18px !important; align-items:stretch !important; margin-bottom:18px !important; }
.wink-rating-box, .wink-mood-box, .wink-comments-block { border-radius:26px !important; background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.085) !important; box-shadow:0 20px 70px rgba(0,0,0,.26) !important; }
.wink-mood-box { padding:20px !important; }
.wink-mood-row { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:10px !important; margin:12px 0 !important; }
.wink-mood-row button { border:1px solid rgba(255,255,255,.09) !important; border-radius:20px !important; min-height:86px !important; background:rgba(255,255,255,.055) !important; color:#fff !important; display:grid !important; place-items:center !important; gap:2px !important; cursor:pointer !important; }
.wink-mood-row button span { font-size:28px !important; }
.wink-mood-row button b { font-size:13px !important; font-weight:950 !important; }
.wink-mood-row button em { font-style:normal !important; font-size:12px !important; color:rgba(255,255,255,.54) !important; }
.wink-mood-row button.is-active { background:rgba(255,255,255,.18) !important; border-color:rgba(255,255,255,.34) !important; box-shadow:0 0 0 1px rgba(255,255,255,.08) inset !important; }
.wink-extra-reactions { grid-template-columns:repeat(6,minmax(0,1fr)) !important; gap:8px !important; }
.wink-extra-reactions button { min-height:54px !important; }
.wink-comments-block { padding:20px !important; }
.wink-comment-form { display:grid !important; gap:12px !important; padding:14px !important; }
.wink-comment-tools { display:flex !important; flex-wrap:wrap !important; justify-content:space-between !important; align-items:center !important; gap:12px !important; }
.wink-comment-toggle { display:inline-flex !important; align-items:center !important; gap:8px !important; border-radius:999px !important; min-height:34px !important; padding:0 12px !important; background:rgba(255,255,255,.08) !important; color:#fff !important; font-weight:900 !important; cursor:pointer !important; }
.wink-comment-toggle input { accent-color:#fff !important; }
.wink-comment-sentiment { display:flex !important; flex-wrap:wrap !important; gap:7px !important; }
.wink-comment-sentiment button { border:1px solid rgba(255,255,255,.09) !important; border-radius:999px !important; min-height:34px !important; padding:0 12px !important; background:rgba(255,255,255,.06) !important; color:rgba(255,255,255,.76) !important; font-weight:900 !important; cursor:pointer !important; }
.wink-comment-sentiment button.is-active { background:#f5f5f7 !important; color:#050505 !important; border-color:#f5f5f7 !important; }
.wink-comment-form__bottom { display:flex !important; justify-content:space-between !important; align-items:center !important; gap:12px !important; }
.wink-comment-form__bottom small { color:rgba(255,255,255,.46) !important; font-weight:750 !important; }
.apple-comment-badges { display:flex !important; flex-wrap:wrap !important; gap:6px !important; margin:0 0 8px !important; }
.comment-sentiment, .comment-spoiler-badge { display:inline-flex !important; align-items:center !important; gap:5px !important; min-height:22px !important; border-radius:999px !important; padding:0 8px !important; background:rgba(255,255,255,.08) !important; color:rgba(255,255,255,.78) !important; font-size:11px !important; font-weight:900 !important; }
.comment-sentiment.is-positive { background:rgba(52,199,89,.18) !important; color:#9ff0b4 !important; }
.comment-sentiment.is-neutral { background:rgba(255,204,0,.15) !important; color:#ffe082 !important; }
.comment-sentiment.is-negative { background:rgba(255,69,58,.16) !important; color:#ff9b95 !important; }
.comment-spoiler { border-radius:7px !important; padding:0 4px !important; background:rgba(255,255,255,.12) !important; color:transparent !important; text-shadow:0 0 12px rgba(255,255,255,.72) !important; filter:blur(4px) !important; cursor:pointer !important; transition:.18s ease !important; }
.comment-spoiler:hover, .comment-spoiler:focus { color:inherit !important; text-shadow:none !important; filter:none !important; background:rgba(255,255,255,.08) !important; }
.comment-spoiler--block { display:block !important; padding:10px !important; white-space:pre-wrap !important; }

/* v73 catalog/search cards closer to home carousel */
body[data-page="catalog"] #catalogGrid,
body[data-page="search"] #searchGrid.grid,
body[data-page="search"] .search-media-grid,
body[data-page="search"] .search-result-grid { display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:34px 32px !important; align-items:start !important; justify-content:center !important; width:min(1740px, calc(100vw - 120px)) !important; margin-left:auto !important; margin-right:auto !important; }
body[data-page="catalog"] #catalogGrid .media-card,
body[data-page="search"] #searchGrid .media-card,
body[data-page="search"] .search-media-grid .media-card,
body[data-page="search"] .search-result-grid .media-card { max-width:none !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
body[data-page="catalog"] #catalogGrid .media-card__poster,
body[data-page="search"] #searchGrid .media-card__poster,
body[data-page="search"] .search-media-grid .media-card__poster,
body[data-page="search"] .search-result-grid .media-card__poster { aspect-ratio:16/9 !important; border-radius:24px !important; background:#111 !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.11), 0 12px 38px rgba(0,0,0,.32) !important; }
body[data-page="catalog"] #catalogGrid .media-card__body,
body[data-page="catalog"] #catalogGrid .media-card__meta,
body[data-page="search"] #searchGrid .media-card__body,
body[data-page="search"] #searchGrid .media-card__meta,
body[data-page="search"] .search-media-grid .media-card__body,
body[data-page="search"] .search-media-grid .media-card__meta,
body[data-page="search"] .search-result-grid .media-card__body,
body[data-page="search"] .search-result-grid .media-card__meta { display:none !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay,
body[data-page="search"] #searchGrid .poster-overlay,
body[data-page="search"] .search-media-grid .poster-overlay,
body[data-page="search"] .search-result-grid .poster-overlay { inset:auto 18px 18px 18px !important; align-items:flex-start !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay strong,
body[data-page="search"] #searchGrid .poster-overlay strong,
body[data-page="search"] .search-media-grid .poster-overlay strong,
body[data-page="search"] .search-result-grid .poster-overlay strong { font-size:clamp(19px,1.35vw,28px) !important; line-height:.98 !important; letter-spacing:-.045em !important; }
body[data-page="catalog"] #catalogGrid .poster-overlay em,
body[data-page="search"] #searchGrid .poster-overlay em,
body[data-page="search"] .search-media-grid .poster-overlay em,
body[data-page="search"] .search-result-grid .poster-overlay em { display:none !important; }
body[data-page="catalog"] #catalogGrid .media-card:hover .poster-overlay em,
body[data-page="catalog"] #catalogGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] #searchGrid .media-card:hover .poster-overlay em,
body[data-page="search"] #searchGrid .media-card:focus-within .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:hover .poster-overlay em,
body[data-page="search"] .search-media-grid .media-card:focus-within .poster-overlay em,
body[data-page="search"] .search-result-grid .media-card:hover .poster-overlay em,
body[data-page="search"] .search-result-grid .media-card:focus-within .poster-overlay em { display:-webkit-box !important; -webkit-line-clamp:3 !important; -webkit-box-orient:vertical !important; margin-top:10px !important; color:rgba(255,255,255,.72) !important; }
@media (max-width:1500px){ body[data-page="catalog"] #catalogGrid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid, body[data-page="search"] .search-result-grid { grid-template-columns:repeat(4,minmax(0,1fr)) !important; width:min(1320px, calc(100vw - 70px)) !important; } }
@media (max-width:1050px){ body[data-page="catalog"] #catalogGrid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid, body[data-page="search"] .search-result-grid { grid-template-columns:repeat(3,minmax(0,1fr)) !important; width:calc(100vw - 40px) !important; gap:22px !important; } .wink-series-layout{grid-template-columns:1fr !important;} .wink-season-tabs{position:static !important; display:flex !important; overflow-x:auto !important;} .wink-season-tab{min-width:118px !important;} .wink-social-topline{grid-template-columns:1fr !important;} }
@media (max-width:700px){ body[data-page="catalog"] #catalogGrid, body[data-page="search"] #searchGrid.grid, body[data-page="search"] .search-media-grid, body[data-page="search"] .search-result-grid { grid-template-columns:repeat(2,minmax(0,1fr)) !important; width:calc(100vw - 28px) !important; gap:16px !important; } .wink-episode-card{grid-template-columns:1fr !important;} .wink-episode-thumb{min-height:170px !important;} .wink-mood-row{grid-template-columns:1fr !important;} .wink-extra-reactions{grid-template-columns:repeat(3,1fr) !important;} }


/* v74 detail page: Wink-like serial slider, home-style recommendation sliders, cleaner comments */
.wink-detail-hero { padding-top: 190px !important; min-height: clamp(620px, 82vh, 860px) !important; align-items: flex-end !important; }
.wink-detail-hero__shade { background: linear-gradient(90deg, rgba(0,0,0,.98) 0%, rgba(0,0,0,.82) 38%, rgba(0,0,0,.24) 75%, rgba(0,0,0,.55) 100%), linear-gradient(180deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.20) 42%, #000 100%) !important; }
.wink-detail-hero__inner { align-items:center !important; }
.wink-detail-maincopy { padding-top: 28px !important; }
.wink-detail-meta span:empty { display:none !important; }
.wink-detail-crumbs { color: rgba(255,255,255,.58) !important; }
.wink-detail-actions { margin-top: 22px !important; }
.wink-action { background: rgba(255,255,255,.085) !important; border-color: rgba(255,255,255,.16) !important; backdrop-filter: blur(16px) !important; }
.wink-action--primary { background:#fff !important; color:#000 !important; }
.wink-about__grid { grid-template-columns:minmax(0,760px) minmax(260px,400px) !important; gap:clamp(30px,7vw,130px) !important; }
.wink-facts div { grid-template-columns:110px minmax(0,1fr) !important; }
.detail-section-head { display:flex !important; align-items:flex-end !important; justify-content:space-between !important; gap:18px !important; margin-bottom:22px !important; }
.detail-section-head > div { display:grid !important; gap:7px !important; }
.detail-section-head span { color:rgba(255,255,255,.46) !important; text-transform:uppercase !important; letter-spacing:.24em !important; font-size:12px !important; font-weight:950 !important; }
.detail-section-head h2 { margin:0 !important; font-size:clamp(34px,3.3vw,62px) !important; line-height:.94 !important; letter-spacing:-.06em !important; }
.detail-section-head--left { justify-content:flex-start !important; }
.detail-slider-controls { display:inline-flex !important; gap:8px !important; flex:0 0 auto !important; }
.detail-slider-controls button { width:42px !important; height:42px !important; border-radius:50% !important; border:1px solid rgba(255,255,255,.12) !important; background:rgba(255,255,255,.075) !important; color:#fff !important; display:grid !important; place-items:center !important; cursor:pointer !important; backdrop-filter: blur(14px) !important; }
.detail-slider-controls button:hover { background:rgba(255,255,255,.16) !important; transform:translateY(-1px) !important; }
.detail-slider-shell { position:relative !important; overflow:hidden !important; }
.detail-slider-track { display:flex !important; gap:18px !important; overflow-x:auto !important; overflow-y:hidden !important; scroll-behavior:smooth !important; scroll-snap-type:x mandatory !important; padding:2px 0 18px !important; scrollbar-width:none !important; }
.detail-slider-track::-webkit-scrollbar { display:none !important; }
.wink-series-panel { margin-top: 10px !important; }
.wink-series-panel .detail-section-head { margin-bottom: 18px !important; }
.wink-season-tabs { position:static !important; display:flex !important; gap:28px !important; overflow-x:auto !important; padding:0 0 20px !important; border:0 !important; scrollbar-width:none !important; }
.wink-season-tabs::-webkit-scrollbar { display:none !important; }
.wink-season-tab { min-height:auto !important; min-width:auto !important; border:0 !important; border-radius:0 !important; background:transparent !important; color:rgba(255,255,255,.66) !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; padding:0 0 14px !important; position:relative !important; font-size:22px !important; font-weight:950 !important; letter-spacing:-.035em !important; cursor:pointer !important; }
.wink-season-tab::after { content:'' !important; position:absolute !important; left:0 !important; right:0 !important; bottom:0 !important; height:3px !important; border-radius:999px !important; background:transparent !important; }
.wink-season-tab.is-active { color:#fff !important; background:transparent !important; }
.wink-season-tab.is-active::after { background:#ff7a1a !important; }
.wink-season-content { min-width:0 !important; }
.wink-season-pane { display:none !important; }
.wink-season-pane.is-active { display:block !important; }
.wink-season-pane__top { display:flex !important; align-items:center !important; justify-content:space-between !important; margin:0 0 16px !important; gap:12px !important; }
.wink-season-pane__top > div:first-child { display:none !important; }
.wink-season-translations { display:flex !important; flex-wrap:wrap !important; gap:8px !important; justify-content:flex-start !important; }
.wink-season-translations small { color:rgba(255,255,255,.42) !important; font-weight:900 !important; }
.wink-season-translations button, .wink-episode-actions button { border:0 !important; border-radius:999px !important; min-height:26px !important; padding:0 10px !important; background:rgba(255,255,255,.10) !important; color:#fff !important; font-size:11px !important; font-weight:900 !important; }
.wink-episode-track { gap:26px !important; padding-bottom:24px !important; }
.wink-episode-slide { flex:0 0 clamp(330px, 27vw, 520px) !important; scroll-snap-align:start !important; color:#fff !important; }
.wink-episode-slide__poster { width:100% !important; aspect-ratio:16/9 !important; border:1px solid rgba(255,255,255,.12) !important; border-radius:26px !important; overflow:hidden !important; background:rgba(255,255,255,.06) var(--episode-bg) center/cover no-repeat !important; position:relative !important; display:block !important; cursor:pointer !important; box-shadow:0 24px 80px rgba(0,0,0,.40) !important; }
.wink-episode-slide__poster::before { content:'' !important; position:absolute !important; inset:0 !important; background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.42)) !important; }
.wink-episode-slide__poster i { position:absolute !important; left:50% !important; top:50% !important; transform:translate(-50%,-50%) !important; width:64px !important; height:64px !important; border-radius:50% !important; background:rgba(255,255,255,.92) !important; color:#050505 !important; padding:19px !important; box-shadow:0 18px 46px rgba(0,0,0,.35) !important; }
.wink-episode-slide__age { position:absolute !important; left:18px !important; top:16px !important; min-height:36px !important; padding:0 13px !important; border-radius:14px !important; background:rgba(0,0,0,.55) !important; color:#fff !important; display:inline-flex !important; align-items:center !important; font-weight:950 !important; font-size:16px !important; }
.wink-episode-slide__time { position:absolute !important; right:18px !important; bottom:16px !important; min-height:32px !important; padding:0 13px !important; border-radius:999px !important; background:rgba(0,0,0,.60) !important; color:#fff !important; display:inline-flex !important; align-items:center !important; font-weight:950 !important; }
.wink-episode-slide__time:empty { display:none !important; }
.wink-episode-slide__copy { padding:16px 0 0 !important; display:grid !important; gap:6px !important; }
.wink-episode-slide__copy h3 { margin:0 !important; color:#fff !important; font-size:clamp(20px,1.45vw,28px) !important; line-height:1.04 !important; letter-spacing:-.045em !important; }
.wink-episode-slide__copy small { color:rgba(255,255,255,.82) !important; font-size:16px !important; font-weight:850 !important; }
.wink-episode-slide__copy p { margin:4px 0 0 !important; color:rgba(255,255,255,.58) !important; line-height:1.45 !important; display:-webkit-box !important; -webkit-line-clamp:2 !important; -webkit-box-orient:vertical !important; overflow:hidden !important; }
.wink-episode-meta { display:flex !important; gap:6px !important; flex-wrap:wrap !important; }
.wink-episode-meta span { min-height:23px !important; border-radius:999px !important; padding:0 8px !important; display:inline-flex !important; align-items:center !important; background:rgba(255,255,255,.11) !important; color:rgba(255,255,255,.72) !important; font-size:11px !important; font-weight:900 !important; }
.detail-media-track { gap:22px !important; }
.detail-media-card { flex:0 0 clamp(230px, 17vw, 340px) !important; aspect-ratio:16/9 !important; border:1px solid rgba(255,255,255,.11) !important; border-radius:24px !important; overflow:hidden !important; position:relative !important; color:#fff !important; text-align:left !important; padding:18px !important; display:flex !important; flex-direction:column !important; justify-content:flex-end !important; background:rgba(255,255,255,.055) var(--detail-card-bg) center/cover no-repeat !important; box-shadow:0 20px 54px rgba(0,0,0,.36) !important; scroll-snap-align:start !important; cursor:pointer !important; }
.detail-media-card::before { content:'' !important; position:absolute !important; inset:0 !important; background:linear-gradient(180deg,rgba(0,0,0,0) 32%,rgba(0,0,0,.78) 100%) !important; }
.detail-media-card > * { position:relative !important; z-index:1 !important; }
.detail-media-card__badges { position:absolute !important; left:14px !important; top:14px !important; display:flex !important; flex-direction:column !important; gap:8px !important; }
.detail-media-card__badges b, .detail-media-card__episode { min-height:30px !important; padding:0 11px !important; border-radius:11px !important; background:#fff !important; color:#050505 !important; display:inline-flex !important; align-items:center !important; font-size:13px !important; font-weight:950 !important; }
.detail-media-card__badges .is-tmdb.is-good { background:#1ec466 !important; color:#05120a !important; }
.detail-media-card__badges .is-tmdb.is-low { background:#ff5252 !important; color:#050505 !important; }
.detail-media-card__episode { position:absolute !important; right:14px !important; top:14px !important; }
.detail-media-card__copy { display:grid !important; gap:5px !important; }
.detail-media-card__copy strong { font-size:clamp(19px,1.35vw,27px) !important; line-height:1 !important; letter-spacing:-.045em !important; }
.detail-media-card__copy small { color:rgba(255,255,255,.78) !important; font-weight:850 !important; }
.detail-person-track { gap:28px !important; }
.detail-person-card { flex:0 0 132px !important; border:0 !important; background:transparent !important; color:#fff !important; text-align:center !important; cursor:pointer !important; scroll-snap-align:start !important; }
.detail-person-card span { width:92px !important; height:92px !important; border-radius:50% !important; display:block !important; margin:0 auto 12px !important; background:linear-gradient(145deg,rgba(255,255,255,.13),rgba(255,255,255,.045)) center/cover no-repeat !important; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08), 0 20px 48px rgba(0,0,0,.25) !important; }
.detail-person-card b { display:block !important; color:#fff !important; font-size:14px !important; line-height:1.16 !important; }
.detail-person-card small { display:block !important; margin-top:4px !important; color:rgba(255,255,255,.58) !important; font-size:12px !important; font-weight:800 !important; }
.wink-discussion-panel { margin-top: 26px !important; }
.wink-social-topline, .wink-mood-box, .wink-extra-reactions, .wink-mood-row { display:none !important; }
.wink-main-rating { display:grid !important; grid-template-columns:minmax(170px,220px) minmax(0,1fr) !important; gap:22px !important; align-items:center !important; border-radius:30px !important; padding:22px !important; background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035)) !important; border:1px solid rgba(255,255,255,.10) !important; box-shadow:0 24px 80px rgba(0,0,0,.30) !important; margin-bottom:18px !important; }
.wink-main-rating__score { display:grid !important; gap:3px !important; align-content:center !important; }
.wink-main-rating__score strong { font-size:58px !important; line-height:.9 !important; letter-spacing:-.07em !important; }
.wink-main-rating__score span { color:rgba(255,255,255,.58) !important; font-weight:900 !important; }
.wink-main-rating__score small, .wink-main-rating p { color:rgba(255,255,255,.52) !important; font-weight:800 !important; margin:0 !important; }
.wink-main-rating__stars { display:grid !important; grid-template-columns:repeat(10,minmax(0,1fr)) !important; gap:8px !important; }
.wink-main-rating__stars button { min-height:54px !important; border-radius:16px !important; border:1px solid rgba(255,255,255,.09) !important; background:rgba(255,255,255,.055) !important; color:rgba(255,255,255,.58) !important; display:grid !important; place-items:center !important; gap:1px !important; cursor:pointer !important; }
.wink-main-rating__stars button span { font-size:20px !important; }
.wink-main-rating__stars button em { font-size:10px !important; font-style:normal !important; font-weight:900 !important; }
.wink-main-rating__stars button.is-active { background:rgba(255,204,0,.18) !important; border-color:rgba(255,204,0,.45) !important; color:#ffd76b !important; }
.wink-comments-block { padding:24px !important; border-radius:30px !important; }
.wink-comment-form--premium { border-radius:26px !important; padding:18px !important; background:rgba(0,0,0,.22) !important; border:1px solid rgba(255,255,255,.08) !important; }
.wink-comment-toolbar { display:flex !important; justify-content:space-between !important; align-items:center !important; gap:14px !important; flex-wrap:wrap !important; }
.wink-comment-textarea { display:block !important; border-radius:22px !important; background:rgba(255,255,255,.055) !important; border:1px solid rgba(255,255,255,.10) !important; overflow:hidden !important; }
.wink-comment-textarea textarea, .wink-comment-form textarea { width:100% !important; border:0 !important; outline:0 !important; background:transparent !important; color:#fff !important; padding:18px !important; resize:vertical !important; min-height:128px !important; font-size:15px !important; line-height:1.55 !important; }
.wink-comment-textarea:focus-within { border-color:rgba(255,255,255,.28) !important; box-shadow:0 0 0 4px rgba(255,255,255,.06) !important; }
.wink-comment-form__bottom button { border:0 !important; min-height:42px !important; border-radius:999px !important; padding:0 18px !important; background:#fff !important; color:#050505 !important; font-weight:950 !important; display:inline-flex !important; align-items:center !important; gap:8px !important; }
.wink-comment-sentiment button.is-active[data-comment-sentiment="positive"] { background:rgba(52,199,89,.22) !important; color:#b7ffc7 !important; border-color:rgba(52,199,89,.40) !important; }
.wink-comment-sentiment button.is-active[data-comment-sentiment="neutral"] { background:rgba(255,204,0,.18) !important; color:#ffe28a !important; border-color:rgba(255,204,0,.36) !important; }
.wink-comment-sentiment button.is-active[data-comment-sentiment="negative"] { background:rgba(255,69,58,.18) !important; color:#ffb2ad !important; border-color:rgba(255,69,58,.36) !important; }
@media (max-width:1050px){ .wink-detail-hero{padding-top:150px !important;min-height:620px !important}.wink-main-rating{grid-template-columns:1fr !important}.wink-main-rating__stars{grid-template-columns:repeat(5,minmax(0,1fr)) !important}.detail-slider-controls{display:none !important}.wink-episode-slide{flex-basis:min(82vw,430px) !important}.detail-media-card{flex-basis:min(72vw,340px) !important} }
@media (max-width:700px){ .wink-detail-hero{padding-top:125px !important}.wink-season-tab{font-size:18px !important}.wink-main-rating__score strong{font-size:44px !important}.wink-comment-toolbar{align-items:flex-start !important} }

/* v75: detail page mouse-drag sliders, cleaner serial rail, premium comment composer */
.wink-detail .detail-slider-controls { display:none !important; }
.wink-detail .site-header,
body.page-media .site-header { color:#fff !important; }
.wink-detail-hero { padding-top:clamp(118px, 8vw, 154px) !important; min-height:clamp(620px, 78vh, 820px) !important; }
.wink-detail-hero__inner { padding-top:12px !important; }
.wink-detail-hero__bg { filter:saturate(.92) brightness(.74) !important; }
.wink-detail-hero__shade { background:linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.72) 38%,rgba(0,0,0,.23) 73%,rgba(0,0,0,.62) 100%),linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,.08) 45%,#000 100%) !important; }
.wink-detail-maincopy { padding-top:10px !important; }
.wink-detail h1 { max-width:min(980px, 58vw) !important; margin-top:18px !important; font-size:clamp(58px,6.25vw,128px) !important; line-height:.86 !important; }
.wink-detail-meta { margin-top:22px !important; }
.wink-detail-overview { margin-top:22px !important; max-width:840px !important; font-size:clamp(17px,1.04vw,21px) !important; line-height:1.62 !important; }
.wink-detail-poster { margin-top:18px !important; transform:translateY(26px) !important; }
.wink-detail-content { width:min(1760px,calc(100vw - 128px)) !important; margin-inline:auto !important; }
.detail-section-head,
.detail-section-head--left,
.wink-detail .apple-detail-section-head { justify-content:flex-start !important; text-align:left !important; }
.detail-section-head h2,
.detail-section-head--left h2 { text-align:left !important; }
.detail-slider-shell { overflow:hidden !important; margin-inline:-4px !important; padding-inline:4px !important; }
.detail-slider-track { overflow-x:auto !important; overflow-y:hidden !important; scroll-snap-type:x mandatory !important; scroll-behavior:smooth !important; cursor:grab !important; user-select:none !important; -webkit-overflow-scrolling:touch !important; scrollbar-width:none !important; }
.detail-slider-track::-webkit-scrollbar { display:none !important; }
.detail-slider-track.is-mouse-dragging { cursor:grabbing !important; scroll-behavior:auto !important; }
.detail-slider-track.is-mouse-dragging * { pointer-events:none !important; }

.wink-series-panel { padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
.wink-series-panel > .detail-section-head { margin-bottom:28px !important; }
.wink-series-panel > .detail-section-head span { color:rgba(255,255,255,.52) !important; font-size:15px !important; letter-spacing:.42em !important; }
.wink-series-panel > .detail-section-head h2 { font-size:clamp(54px,5.8vw,114px) !important; line-height:.84 !important; letter-spacing:-.075em !important; }
.wink-season-tabs { position:relative !important; top:auto !important; display:flex !important; gap:30px !important; align-items:flex-end !important; margin:0 0 36px !important; padding:0 0 16px !important; border-bottom:1px solid rgba(255,255,255,.10) !important; overflow-x:auto !important; scrollbar-width:none !important; }
.wink-season-tabs::-webkit-scrollbar { display:none !important; }
.wink-season-tab { min-height:auto !important; padding:0 0 18px !important; border:0 !important; border-radius:0 !important; background:transparent !important; color:rgba(255,255,255,.55) !important; display:block !important; font-size:clamp(22px,1.55vw,34px) !important; line-height:1 !important; font-weight:950 !important; letter-spacing:-.04em !important; white-space:nowrap !important; position:relative !important; }
.wink-season-tab::after { content:'' !important; position:absolute !important; left:0 !important; right:100% !important; bottom:0 !important; height:3px !important; border-radius:999px !important; background:#ff8a00 !important; transition:.22s ease !important; }
.wink-season-tab.is-active { background:transparent !important; color:#fff !important; border-color:transparent !important; }
.wink-season-tab.is-active::after { right:0 !important; }
.wink-season-pane__top { display:flex !important; margin:0 0 20px !important; padding:0 !important; border:0 !important; }
.wink-season-pane__top > div span { display:none !important; }
.wink-season-pane__top > div b { color:rgba(255,255,255,.64) !important; font-size:15px !important; text-transform:uppercase !important; letter-spacing:.14em !important; }
.wink-season-translations { max-width:72% !important; }
.wink-season-translations small { display:none !important; }
.wink-season-translations button { min-height:34px !important; padding:0 14px !important; border-radius:999px !important; background:rgba(255,255,255,.075) !important; border:1px solid rgba(255,255,255,.075) !important; color:rgba(255,255,255,.78) !important; }
.wink-episode-track { display:flex !important; gap:28px !important; padding:0 0 16px !important; }
.wink-episode-slide { flex:0 0 clamp(360px, 30vw, 560px) !important; scroll-snap-align:start !important; }
.wink-episode-slide__poster { aspect-ratio:16/9 !important; min-height:0 !important; border-radius:28px !important; background-color:rgba(255,255,255,.075) !important; box-shadow:0 24px 78px rgba(0,0,0,.32) !important; }
.wink-episode-slide__poster::before { background:linear-gradient(180deg,rgba(0,0,0,.06),rgba(0,0,0,.32)) !important; }
.wink-episode-slide__poster i { width:66px !important; height:66px !important; background:rgba(255,255,255,.92) !important; color:#090909 !important; }
.wink-episode-slide__age { top:18px !important; left:18px !important; background:rgba(0,0,0,.58) !important; backdrop-filter:blur(16px) !important; }
.wink-episode-slide__time { right:18px !important; bottom:18px !important; background:rgba(0,0,0,.62) !important; backdrop-filter:blur(16px) !important; }
.wink-episode-slide__copy { padding:18px 0 0 !important; }
.wink-episode-slide__copy h3 { font-size:clamp(21px,1.35vw,30px) !important; line-height:1.1 !important; }
.wink-episode-slide__copy small { color:rgba(255,255,255,.72) !important; }
.wink-episode-slide__copy p { color:rgba(255,255,255,.56) !important; font-size:14px !important; max-width:95% !important; }

.detail-media-track { display:flex !important; gap:28px !important; padding-bottom:16px !important; }
.detail-media-card { flex:0 0 clamp(275px, 18.3vw, 370px) !important; border-radius:26px !important; aspect-ratio:16/9 !important; padding:20px !important; box-shadow:none !important; }
.detail-media-card:hover { transform:translateY(-3px) scale(1.015) !important; border-color:rgba(255,255,255,.22) !important; }
.detail-media-card::before { background:linear-gradient(180deg,rgba(0,0,0,.03) 20%,rgba(0,0,0,.86) 100%) !important; }
.detail-media-card__copy strong { font-size:clamp(21px,1.4vw,30px) !important; }
.detail-person-shelf { padding:0 !important; background:transparent !important; border:0 !important; }
.detail-person-track { display:flex !important; gap:34px !important; padding:0 0 12px !important; }
.detail-person-card { flex:0 0 150px !important; }
.detail-person-card span { width:104px !important; height:104px !important; }

.wink-discussion-panel { padding:0 !important; background:transparent !important; border:0 !important; box-shadow:none !important; }
.wink-discussion-panel .detail-section-head { margin-bottom:22px !important; }
.wink-main-rating { grid-template-columns:minmax(180px,250px) minmax(0,1fr) !important; align-items:center !important; border-radius:36px !important; padding:28px !important; background:linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.035)) !important; border:1px solid rgba(255,255,255,.11) !important; backdrop-filter:blur(24px) saturate(140%) !important; box-shadow:0 32px 96px rgba(0,0,0,.34) !important; }
.wink-main-rating__score strong { font-size:74px !important; line-height:.85 !important; }
.wink-main-rating__score span { font-size:17px !important; }
.wink-main-rating__body { display:grid !important; gap:12px !important; min-width:0 !important; }
.wink-main-rating__stars { gap:10px !important; }
.wink-main-rating__stars button { min-height:64px !important; border-radius:20px !important; background:rgba(255,255,255,.06) !important; border-color:rgba(255,255,255,.10) !important; }
.wink-main-rating__stars button:hover { background:rgba(255,255,255,.11) !important; color:#fff !important; }
.wink-main-rating__stars button.is-active { color:#ffd35a !important; background:linear-gradient(180deg,rgba(255,204,0,.22),rgba(255,204,0,.10)) !important; border-color:rgba(255,211,90,.42) !important; }
.wink-comments-block { margin-top:20px !important; padding:28px !important; border-radius:36px !important; background:linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.028)) !important; border:1px solid rgba(255,255,255,.10) !important; backdrop-filter:blur(24px) saturate(145%) !important; }
.apple-comments-head { margin-bottom:16px !important; }
.apple-comments-head b { font-size:24px !important; color:#fff !important; }
.wink-comment-form--premium { position:relative !important; overflow:hidden !important; border-radius:34px !important; padding:22px !important; background:radial-gradient(circle at 10% 0%,rgba(255,255,255,.14),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035)) !important; border:1px solid rgba(255,255,255,.13) !important; box-shadow:0 28px 84px rgba(0,0,0,.28) !important; }
.wink-comment-composer-head { display:flex !important; align-items:center !important; gap:14px !important; margin-bottom:16px !important; }
.wink-comment-avatar-mini { width:52px !important; height:52px !important; border-radius:18px !important; display:grid !important; place-items:center !important; background:#fff !important; color:#050505 !important; font-weight:950 !important; box-shadow:0 18px 44px rgba(0,0,0,.32) !important; }
.wink-comment-composer-head strong { display:block !important; color:#fff !important; font-size:20px !important; letter-spacing:-.03em !important; }
.wink-comment-composer-head small { display:block !important; color:rgba(255,255,255,.52) !important; margin-top:2px !important; font-weight:800 !important; }
.wink-comment-textarea { border-radius:26px !important; background:rgba(0,0,0,.28) !important; border:1px solid rgba(255,255,255,.10) !important; box-shadow:inset 0 0 0 1px rgba(0,0,0,.10) !important; }
.wink-comment-textarea textarea, .wink-comment-form textarea { min-height:154px !important; padding:22px !important; font-size:16px !important; }
.wink-comment-options { display:flex !important; justify-content:space-between !important; align-items:center !important; gap:14px !important; flex-wrap:wrap !important; margin-top:14px !important; }
.wink-comment-toggle--spoiler { background:rgba(255,255,255,.08) !important; border:1px solid rgba(255,255,255,.10) !important; min-height:42px !important; padding:0 16px !important; }
.wink-comment-sentiment { display:flex !important; gap:8px !important; flex-wrap:wrap !important; }
.wink-comment-sentiment button { min-height:42px !important; padding:0 14px !important; display:inline-flex !important; align-items:center !important; gap:8px !important; border-radius:999px !important; background:rgba(255,255,255,.07) !important; border:1px solid rgba(255,255,255,.10) !important; color:#fff !important; font-weight:950 !important; }
.wink-comment-sentiment button span { font-size:17px !important; }
.wink-comment-sentiment button b { font-size:13px !important; }
.wink-comment-form__bottom { margin-top:16px !important; display:flex !important; justify-content:space-between !important; gap:14px !important; align-items:center !important; }
.wink-comment-form__bottom button { min-height:48px !important; padding:0 22px !important; border-radius:999px !important; background:#fff !important; color:#050505 !important; box-shadow:0 16px 40px rgba(0,0,0,.25) !important; }
.apple-comment { border-radius:28px !important; padding:18px !important; background:rgba(255,255,255,.045) !important; border:1px solid rgba(255,255,255,.075) !important; }
.apple-comment + .apple-comment { margin-top:12px !important; }

@media (max-width:1200px){
  .wink-detail-content { width:min(100% - 40px, 1120px) !important; }
  .wink-detail h1 { max-width:78vw !important; }
  .wink-episode-slide { flex-basis:min(78vw, 520px) !important; }
  .detail-media-card { flex-basis:min(76vw, 370px) !important; }
}
@media (max-width:760px){
  .wink-detail-hero { padding-top:112px !important; min-height:650px !important; }
  .wink-detail h1 { font-size:clamp(46px,13vw,78px) !important; max-width:94vw !important; }
  .wink-detail-poster { display:none !important; }
  .wink-series-panel > .detail-section-head h2 { font-size:48px !important; }
  .wink-main-rating { grid-template-columns:1fr !important; }
  .wink-main-rating__stars { grid-template-columns:repeat(5,minmax(0,1fr)) !important; }
  .wink-comment-form__bottom { align-items:flex-start !important; flex-direction:column !important; }
}

/* KINOLOT DETAIL PAGE REDESIGN FIX V78 */
:root {
  --detail-max: 1480px;
  --detail-pad: clamp(22px, 4.2vw, 72px);
}

body[data-page="media"] .content {
  background: #000 !important;
  padding-top: 0 !important;
}

body[data-page="media"] .topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 90 !important;
  margin-bottom: 0 !important;
  background: linear-gradient(180deg, rgba(0,0,0,.78), rgba(0,0,0,.22) 72%, rgba(0,0,0,0)) !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
}

body.detail-nav-solid[data-page="media"] .topbar {
  background: rgba(0,0,0,.72) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.42) !important;
}

.media-page .media-content,
#mediaContent {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.wink-detail {
  --poster-w: clamp(230px, 22vw, 350px);
  width: 100% !important;
  min-height: 100vh !important;
  margin: -88px 0 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 84% 20%, rgba(255,255,255,.07), transparent 24rem),
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.05), transparent 28rem),
    #000 !important;
  color: #fff !important;
}

.wink-detail-hero {
  min-height: clamp(560px, 72vh, 760px) !important;
  padding: clamp(118px, 9vw, 168px) var(--detail-pad) clamp(54px, 7vw, 96px) !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
}

.wink-detail-hero__bg {
  inset: -28px !important;
  opacity: .58 !important;
  filter: blur(1.5px) saturate(.94) brightness(.66) !important;
  transform: scale(1.05) !important;
  background-position: center 18% !important;
}

.wink-detail-hero__shade {
  background:
    linear-gradient(90deg, #000 0%, rgba(0,0,0,.92) 22%, rgba(0,0,0,.70) 50%, rgba(0,0,0,.58) 72%, rgba(0,0,0,.94) 100%),
    linear-gradient(180deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.08) 42%, #000 100%) !important;
}

.wink-detail-hero__inner {
  width: min(100%, var(--detail-max)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) var(--poster-w) !important;
  align-items: center !important;
  gap: clamp(36px, 6vw, 96px) !important;
  position: relative !important;
  z-index: 2 !important;
}

.wink-detail-maincopy {
  max-width: 810px !important;
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 0 !important;
  padding-top: 20px !important;
}

.wink-detail-crumbs {
  margin-bottom: 20px !important;
  color: rgba(255,255,255,.56) !important;
  font-size: 11px !important;
  letter-spacing: .34em !important;
  line-height: 1.2 !important;
}

.wink-detail h1 {
  width: 100% !important;
  max-width: 840px !important;
  margin: 0 !important;
  font-size: clamp(52px, 6.3vw, 104px) !important;
  line-height: .90 !important;
  letter-spacing: -.075em !important;
  text-wrap: balance !important;
}

.wink-detail-meta {
  margin-top: 26px !important;
  gap: 9px !important;
}

.wink-detail-meta span,
.wink-detail-meta b {
  min-height: 30px !important;
  padding: 0 13px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.13) !important;
  color: rgba(255,255,255,.94) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}

.wink-detail-tagline,
.wink-detail-overview {
  max-width: 720px !important;
}

.wink-detail-tagline {
  margin: 22px 0 0 !important;
  color: rgba(255,255,255,.88) !important;
  font-size: clamp(16px, 1.15vw, 20px) !important;
  line-height: 1.55 !important;
}

.wink-detail-overview {
  margin: 22px 0 0 !important;
  color: rgba(255,255,255,.73) !important;
  font-size: clamp(15px, 1.03vw, 18px) !important;
  line-height: 1.68 !important;
}

.wink-detail-actions {
  margin-top: 32px !important;
  gap: 12px !important;
}

.wink-action {
  min-width: 0 !important;
  height: 48px !important;
  padding: 0 20px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  background: rgba(255,255,255,.095) !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: -.015em !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease !important;
}

.wink-action:hover,
.wink-action:focus-visible {
  transform: translateY(-1px) !important;
  background: rgba(255,255,255,.15) !important;
  border-color: rgba(255,255,255,.22) !important;
}

.wink-action--primary {
  background: #fff !important;
  color: #030303 !important;
  border-color: #fff !important;
  box-shadow: 0 18px 48px rgba(255,255,255,.12), 0 20px 70px rgba(0,0,0,.42) !important;
}

.wink-action--primary:hover,
.wink-action--primary:focus-visible {
  background: rgba(255,255,255,.92) !important;
  color: #000 !important;
}

.wink-detail-poster {
  width: var(--poster-w) !important;
  max-width: 100% !important;
  justify-self: end !important;
  margin: 8px 0 0 !important;
  transform: none !important;
  aspect-ratio: 2 / 3 !important;
  border-radius: 28px !important;
  background-color: rgba(255,255,255,.07) !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: 0 38px 120px rgba(0,0,0,.72), inset 0 0 0 1px rgba(255,255,255,.16) !important;
}

.wink-detail-body {
  padding: 0 var(--detail-pad) clamp(72px, 8vw, 130px) !important;
  background: linear-gradient(180deg, #000 0%, #030303 100%) !important;
}

.wink-detail-content {
  width: min(100%, var(--detail-max)) !important;
  max-width: var(--detail-max) !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: clamp(42px, 5vw, 78px) !important;
}

.wink-block,
.wink-detail .apple-detail-panel {
  min-width: 0 !important;
}

.wink-about {
  padding-top: clamp(16px, 2.5vw, 34px) !important;
}

.wink-block h2,
.wink-detail .apple-detail-section-head h2,
.wink-detail .detail-section-head h2 {
  margin: 0 !important;
  font-size: clamp(34px, 3.15vw, 56px) !important;
  line-height: .96 !important;
  letter-spacing: -.058em !important;
  text-wrap: balance !important;
}

.wink-about h2 {
  max-width: 980px !important;
  margin-bottom: 24px !important;
}

.wink-about h3 {
  margin: 0 0 24px !important;
  color: rgba(255,255,255,.92) !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  line-height: 1 !important;
  letter-spacing: -.045em !important;
}

.wink-about__grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 370px) !important;
  gap: clamp(36px, 6vw, 92px) !important;
  align-items: start !important;
}

.wink-about__grid > p {
  max-width: 760px !important;
  margin: 0 !important;
  color: rgba(255,255,255,.70) !important;
  font-size: clamp(15px, 1.02vw, 18px) !important;
  line-height: 1.78 !important;
}

.wink-facts {
  width: 100% !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  display: grid !important;
  gap: 0 !important;
  border-radius: 24px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

.wink-facts div {
  display: grid !important;
  grid-template-columns: 112px minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: baseline !important;
  padding: 11px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.055) !important;
}

.wink-facts div:last-child {
  border-bottom: 0 !important;
}

.wink-facts dt,
.wink-facts dd {
  margin: 0 !important;
}

.wink-facts dt {
  color: rgba(255,255,255,.39) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}

.wink-facts dd {
  min-width: 0 !important;
  color: rgba(255,255,255,.94) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  line-height: 1.35 !important;
}

.wink-detail .detail-section-head {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  gap: 18px !important;
  margin: 0 0 24px !important;
  text-align: left !important;
}

.wink-detail .detail-section-head span,
.wink-detail .apple-detail-section-head span {
  display: block !important;
  margin: 0 0 8px !important;
  color: rgba(255,255,255,.44) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .26em !important;
  text-transform: uppercase !important;
}

.wink-series-panel,
.detail-person-shelf,
.wink-recommendations,
.wink-discussion-panel,
.wink-detail .apple-detail-panel {
  width: 100% !important;
}

.wink-season-tabs {
  margin-bottom: 28px !important;
  gap: 24px !important;
}

.wink-episode-track,
.detail-media-track,
.detail-person-track {
  overflow-x: auto !important;
  overscroll-behavior-x: contain !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}

.wink-episode-track::-webkit-scrollbar,
.detail-media-track::-webkit-scrollbar,
.detail-person-track::-webkit-scrollbar {
  display: none !important;
}

.wink-episode-slide {
  flex: 0 0 clamp(330px, 30vw, 500px) !important;
}

.wink-episode-slide__poster {
  border-radius: 24px !important;
}

.detail-media-card {
  flex: 0 0 clamp(260px, 19vw, 340px) !important;
  border-radius: 22px !important;
  padding: 17px !important;
}

.detail-media-card__badges b,
.detail-media-card__episode {
  min-height: 26px !important;
  padding: 0 9px !important;
  border-radius: 9px !important;
  font-size: 11px !important;
}

.detail-media-card__copy strong {
  font-size: clamp(17px, 1.15vw, 24px) !important;
  line-height: 1.04 !important;
}

.detail-media-card__copy small {
  font-size: 12px !important;
}

.detail-person-track {
  gap: 26px !important;
}

.detail-person-card {
  flex: 0 0 126px !important;
}

.detail-person-card span {
  width: 88px !important;
  height: 88px !important;
}

.detail-person-card b {
  font-size: 13px !important;
}

.detail-person-card small {
  font-size: 11px !important;
}

.wink-discussion-panel {
  max-width: var(--detail-max) !important;
}

.wink-main-rating {
  display: grid !important;
  grid-template-columns: minmax(132px, 190px) minmax(0, 1fr) !important;
  gap: 22px !important;
  padding: 22px !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 22px 70px rgba(0,0,0,.30) !important;
}

.wink-main-rating__score strong {
  font-size: clamp(42px, 4.8vw, 64px) !important;
}

.wink-main-rating__stars {
  display: grid !important;
  grid-template-columns: repeat(10, minmax(42px, 1fr)) !important;
  gap: 8px !important;
}

.wink-main-rating__stars button {
  min-height: 48px !important;
  border-radius: 15px !important;
}

.wink-comments-block {
  margin-top: 18px !important;
  padding: clamp(18px, 2.2vw, 28px) !important;
  border-radius: 28px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.026)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
}

.wink-comment-form--premium,
.wink-comment-textarea,
.apple-comment {
  border-radius: 24px !important;
}

.apple-comment-login {
  border-radius: 22px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
}

@media (min-width: 1600px) {
  :root { --detail-max: 1540px; }
  .wink-detail { --poster-w: 360px; }
}

@media (max-width: 1180px) {
  :root { --detail-pad: clamp(18px, 3.8vw, 44px); }
  .wink-detail { margin-top: -78px !important; }
  .wink-detail-hero__inner,
  .wink-about__grid { grid-template-columns: 1fr !important; }
  .wink-detail-maincopy { max-width: 860px !important; }
  .wink-detail h1 { max-width: 92vw !important; }
  .wink-detail-poster { display: none !important; }
  .wink-facts { max-width: 640px !important; }
  .wink-main-rating { grid-template-columns: 1fr !important; }
  .wink-main-rating__stars { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
}

@media (max-width: 760px) {
  :root { --detail-pad: 16px; }
  body[data-page="media"] .content { padding-bottom: 88px !important; }
  .wink-detail { margin-top: -72px !important; }
  .wink-detail-hero { min-height: auto !important; padding-top: 112px !important; padding-bottom: 42px !important; }
  .wink-detail-crumbs { margin-bottom: 16px !important; font-size: 10px !important; letter-spacing: .24em !important; }
  .wink-detail h1 { max-width: 100% !important; font-size: clamp(40px, 13.4vw, 68px) !important; line-height: .93 !important; }
  .wink-detail-meta { margin-top: 20px !important; }
  .wink-detail-overview { margin-top: 18px !important; font-size: 15px !important; line-height: 1.62 !important; }
  .wink-detail-actions { width: 100% !important; margin-top: 24px !important; display: grid !important; grid-template-columns: 1fr !important; }
  .wink-action { width: 100% !important; justify-content: center !important; }
  .wink-detail-content { gap: 44px !important; }
  .wink-block h2,
  .wink-detail .apple-detail-section-head h2,
  .wink-detail .detail-section-head h2 { font-size: clamp(30px, 10vw, 44px) !important; }
  .wink-about h3 { font-size: 24px !important; }
  .wink-facts { padding: 14px 16px !important; }
  .wink-facts div { grid-template-columns: 1fr !important; gap: 4px !important; }
  .wink-season-tabs { gap: 18px !important; }
  .wink-season-tab { font-size: 22px !important; }
  .wink-episode-slide,
  .detail-media-card { flex-basis: min(82vw, 360px) !important; }
  .wink-main-rating__stars { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
  .wink-comment-options,
  .wink-comment-form__bottom { align-items: stretch !important; flex-direction: column !important; }
  .wink-comment-sentiment button,
  .wink-comment-form__bottom button { width: 100% !important; justify-content: center !important; }
}

/* KINOLOT DETAIL PAGE REDESIGN FIX V79 */
:root {
  --detail-max: 1500px;
}

/* Факты в блоке «О фильме/сериале» больше не выглядят отдельной чужой карточкой */
.wink-about__grid {
  grid-template-columns: minmax(0, 1fr) minmax(280px, 430px) !important;
  gap: clamp(34px, 5vw, 82px) !important;
}

.wink-facts {
  width: 100% !important;
  max-width: 430px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  align-self: start !important;
}

.wink-facts div {
  grid-template-columns: 128px minmax(0, 1fr) !important;
  gap: 18px !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}

.wink-facts dt {
  color: rgba(255,255,255,.36) !important;
  font-size: 12px !important;
  letter-spacing: .01em !important;
}

.wink-facts dd {
  color: rgba(255,255,255,.92) !important;
  font-size: 14px !important;
}

/* Убираем лишние серые подписи «АКТЁРСКИЙ СОСТАВ / КОМАНДА», чтобы не висели отдельными строками */
.detail-person-shelf .detail-section-head span {
  display: none !important;
}

/* Возвращаем нормальные стрелки слайдерам и оставляем drag-scroll мышкой */
.wink-detail .detail-slider-controls {
  display: flex !important;
  gap: 8px !important;
  flex: 0 0 auto !important;
}

.wink-detail .detail-slider-controls button {
  width: 42px !important;
  height: 42px !important;
  display: inline-grid !important;
  place-items: center !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.88) !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  cursor: pointer !important;
}

.wink-detail .detail-slider-controls button:hover {
  background: rgba(255,255,255,.16) !important;
  color: #fff !important;
}

.wink-detail .detail-slider-controls svg,
.wink-detail .detail-slider-controls i {
  width: 19px !important;
  height: 19px !important;
}

.wink-detail .detail-slider-track,
.wink-detail .row-scroll {
  cursor: grab !important;
  touch-action: pan-y !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

.wink-detail .detail-slider-track.is-mouse-dragging,
.wink-detail .row-scroll.is-mouse-dragging {
  cursor: grabbing !important;
  scroll-behavior: auto !important;
}

.wink-detail .detail-slider-track.is-mouse-dragging *,
.wink-detail .row-scroll.is-mouse-dragging * {
  pointer-events: none !important;
}

/* Общая заглушка/скелетон для изображений не только на главной */
.media-card__poster {
  isolation: isolate !important;
  background-color: #101116 !important;
}

.poster-placeholder,
.detail-img-placeholder,
.wink-detail-poster > span,
.detail-person-card span > em {
  pointer-events: none !important;
  user-select: none !important;
}

.poster-placeholder {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: grid !important;
  place-items: center !important;
  padding: 18px !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.12), transparent 26%),
    linear-gradient(145deg, #1b1d23 0%, #0d0e12 48%, #050507 100%) !important;
  color: rgba(245,245,247,.28) !important;
  font-size: clamp(16px, 1.2vw, 26px) !important;
  font-weight: 950 !important;
  letter-spacing: .20em !important;
  text-align: center !important;
  opacity: 1 !important;
}

.poster-placeholder::after,
.detail-img-placeholder::after,
.wink-detail-poster > span::after,
.detail-person-card span > em::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  background: linear-gradient(110deg, transparent 18%, rgba(255,255,255,.10) 46%, transparent 74%) !important;
  transform: translateX(-115%) !important;
  animation: kinolotImageSweep 1.25s ease-in-out infinite !important;
  opacity: .78 !important;
}

@keyframes kinolotImageSweep {
  to { transform: translateX(115%); }
}

.media-card__poster.is-image-loaded .poster-placeholder,
.media-card__poster:not(.is-loading-image):not(.is-missing-image) .poster-placeholder {
  opacity: 0 !important;
}

.media-card__poster.is-missing-image .poster-art,
.media-card__poster.is-loading-image .poster-art {
  opacity: 0 !important;
}

.media-card__poster.is-image-loaded .poster-art {
  opacity: 1 !important;
}

.detail-img-placeholder {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,.11), transparent 30%),
    linear-gradient(145deg, #1b1d23 0%, #0d0e12 52%, #050507 100%) !important;
  color: rgba(245,245,247,.28) !important;
  font-size: clamp(18px, 1.35vw, 28px) !important;
  font-weight: 950 !important;
  letter-spacing: .22em !important;
  opacity: 1 !important;
  overflow: hidden !important;
}

.is-image-loaded > .detail-img-placeholder,
.detail-media-card.is-image-loaded .detail-img-placeholder,
.wink-episode-slide__poster.is-image-loaded .detail-img-placeholder {
  opacity: 0 !important;
}

.is-missing-image > .detail-img-placeholder,
.detail-media-card.is-missing-image .detail-img-placeholder,
.wink-episode-slide__poster.is-missing-image .detail-img-placeholder {
  opacity: 1 !important;
}

.detail-media-card.is-loading-image,
.wink-episode-slide__poster.is-loading-image,
.wink-detail-poster.is-loading-image,
.detail-person-card span.is-loading-image {
  background-color: #111216 !important;
}

.wink-detail-poster {
  position: relative !important;
  overflow: hidden !important;
}

.wink-detail-poster > span {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 34% 22%, rgba(255,255,255,.12), transparent 30%),
    linear-gradient(145deg, #1b1d23 0%, #0d0e12 52%, #050507 100%) !important;
  color: rgba(245,245,247,.28) !important;
  font-weight: 950 !important;
  letter-spacing: .24em !important;
  opacity: 1 !important;
  overflow: hidden !important;
}

.wink-detail-poster.is-image-loaded > span {
  opacity: 0 !important;
}

.wink-detail-poster.is-missing-image > span,
.wink-detail-poster.is-loading-image > span {
  opacity: 1 !important;
}

.detail-person-card span {
  position: relative !important;
  overflow: hidden !important;
}

.detail-person-card span > em {
  position: absolute !important;
  inset: 0 !important;
  display: grid !important;
  place-items: center !important;
  border-radius: inherit !important;
  background:
    radial-gradient(circle at 36% 24%, rgba(255,255,255,.12), transparent 32%),
    linear-gradient(145deg, #1b1d23 0%, #0d0e12 52%, #050507 100%) !important;
  color: rgba(245,245,247,.32) !important;
  font-style: normal !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  opacity: 1 !important;
}

.detail-person-card span.is-image-loaded > em {
  opacity: 0 !important;
}

/* Карточки «Похожие» и «Советуем» теперь как основные карточки сайта — постерный ряд, а не широкие баннеры */
.wink-recommendations .detail-slider-shell {
  overflow: visible !important;
}

.wink-recommendations .detail-media-track {
  display: flex !important;
  gap: clamp(14px, 1.25vw, 22px) !important;
  padding: 0 clamp(22px, 5vw, 84px) 22px 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scroll-snap-type: x proximity !important;
  scrollbar-width: none !important;
}

.wink-recommendations .detail-media-card,
.wink-recommendations .detail-media-card--poster {
  flex: 0 0 clamp(154px, 10.6vw, 205px) !important;
  width: clamp(154px, 10.6vw, 205px) !important;
  aspect-ratio: 2 / 3 !important;
  min-height: 0 !important;
  padding: 0 !important;
  border-radius: clamp(16px, 1.2vw, 22px) !important;
  background: #111216 var(--detail-card-bg) center/cover no-repeat !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  box-shadow: none !important;
  scroll-snap-align: start !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
  transition: transform .18s ease, filter .18s ease, border-color .18s ease !important;
}

.wink-recommendations .detail-media-card:hover {
  transform: translateY(-3px) !important;
  filter: brightness(1.06) saturate(1.04) !important;
  border-color: rgba(255,255,255,.20) !important;
}

.wink-recommendations .detail-media-card::before {
  z-index: 1 !important;
  background: linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.66) 78%, rgba(0,0,0,.90) 100%) !important;
}

.wink-recommendations .detail-media-card__badges {
  z-index: 3 !important;
  left: 12px !important;
  top: 12px !important;
  flex-direction: row !important;
  gap: 7px !important;
}

.wink-recommendations .detail-media-card__badges b,
.wink-recommendations .detail-media-card__episode {
  min-height: 28px !important;
  padding: 0 9px !important;
  border-radius: 10px !important;
  font-size: 12px !important;
  line-height: 1 !important;
}

.wink-recommendations .detail-media-card__episode {
  right: 12px !important;
  top: 12px !important;
}

.wink-recommendations .detail-media-card__copy {
  z-index: 3 !important;
  padding: 0 14px 14px !important;
  gap: 4px !important;
}

.wink-recommendations .detail-media-card__copy strong {
  font-size: clamp(15px, .95vw, 18px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.wink-recommendations .detail-media-card__copy small {
  color: rgba(255,255,255,.70) !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
}

@media (max-width: 1180px) {
  .wink-about__grid {
    grid-template-columns: 1fr !important;
  }
  .wink-facts {
    max-width: 620px !important;
  }
}

@media (max-width: 760px) {
  .wink-detail .detail-slider-controls {
    display: none !important;
  }
  .wink-facts div {
    grid-template-columns: 1fr !important;
    gap: 4px !important;
  }
  .wink-recommendations .detail-media-card,
  .wink-recommendations .detail-media-card--poster {
    flex-basis: min(42vw, 172px) !important;
    width: min(42vw, 172px) !important;
  }
}

/* KINOLOT DETAIL + PLAYER FIX V80 */
:root {
  --player-panel-bg: rgba(10,10,12,.66);
  --player-line: rgba(255,255,255,.12);
}

/* Детальная страница: характеристики больше не живут отдельной чужой правой карточкой */
.wink-about__grid {
  display: block !important;
  max-width: 980px !important;
}

.wink-about__grid > p {
  max-width: 920px !important;
}

.wink-facts.wink-facts-strip,
.wink-facts {
  width: 100% !important;
  max-width: 980px !important;
  margin: 26px 0 0 !important;
  padding: 20px 0 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px 22px !important;
  border-top: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wink-facts.wink-facts-strip div,
.wink-facts div {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  grid-template-columns: none !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.wink-facts.wink-facts-strip dt,
.wink-facts dt {
  color: rgba(255,255,255,.36) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.wink-facts.wink-facts-strip dd,
.wink-facts dd {
  color: rgba(255,255,255,.92) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1.25 !important;
  white-space: nowrap !important;
}

/* Убираем лишние микролейблы KINOLOT над полками рекомендаций */
.wink-recommendations .detail-section-head span,
.detail-person-shelf .detail-section-head span {
  display: none !important;
}

/* Рабочий hover/focus для карточек и серий */
.detail-slider-track,
.wink-season-tabs,
.player-episode-strip,
.player-chip-row,
.player-season-tabs {
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  touch-action: pan-y !important;
}

.detail-slider-track.is-dragging,
.detail-slider-track.is-mouse-dragging,
.wink-season-tabs.is-dragging,
.player-episode-strip.is-dragging,
.player-chip-row.is-dragging,
.player-season-tabs.is-dragging {
  cursor: grabbing !important;
  scroll-behavior: auto !important;
}

.detail-slider-track.is-dragging *,
.detail-slider-track.is-mouse-dragging *,
.player-episode-strip.is-dragging *,
.player-chip-row.is-dragging *,
.player-season-tabs.is-dragging * {
  pointer-events: none !important;
}

.detail-media-card,
.wink-episode-slide__poster,
.wink-episode-slide,
.detail-person-card,
.player-episode-card {
  transition: transform .18s ease, filter .18s ease, border-color .18s ease, box-shadow .18s ease, background .18s ease !important;
  will-change: transform !important;
}

@media (hover: hover) and (pointer: fine) {
  .wink-detail .detail-slider-track:not(.is-dragging):not(.is-mouse-dragging) .detail-media-card:hover,
  .wink-detail .detail-slider-track:not(.is-dragging):not(.is-mouse-dragging) .detail-media-card:focus-visible {
    transform: translateY(-8px) scale(1.035) !important;
    filter: brightness(1.1) saturate(1.06) !important;
    border-color: rgba(255,255,255,.32) !important;
    box-shadow: 0 26px 70px rgba(0,0,0,.48) !important;
    z-index: 5 !important;
  }

  .wink-detail .wink-episode-slide:hover .wink-episode-slide__poster,
  .wink-detail .wink-episode-slide__poster:focus-visible {
    transform: translateY(-8px) scale(1.025) !important;
    filter: brightness(1.1) saturate(1.06) !important;
    border-color: rgba(255,255,255,.28) !important;
    box-shadow: 0 28px 80px rgba(0,0,0,.50) !important;
  }

  .detail-person-card:hover,
  .detail-person-card:focus-visible {
    transform: translateY(-6px) !important;
  }
}

/* Player page: полный экран без верхнего меню и с нормальной нижней панелью */
body[data-page="player"],
body[data-page="player"] .app-shell,
body[data-page="player"] .content,
body[data-page="player"] #playerPage {
  background: #000 !important;
  overflow: hidden !important;
}

body[data-page="player"] .sidebar,
body[data-page="player"] .topbar,
body[data-page="player"] .notice,
body[data-page="player"] .toast-root {
  display: none !important;
}

body[data-page="player"] .content {
  margin: 0 !important;
  padding: 0 !important;
  width: 100vw !important;
  max-width: none !important;
  min-height: 100vh !important;
}

body[data-page="player"] .page.player-page {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #000 !important;
}

.cinema-player {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.40), #000 74%),
    var(--player-bg, none) center/cover no-repeat,
    #000 !important;
}

.cinema-player::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  background:
    radial-gradient(circle at 22% 0%, rgba(255,255,255,.10), transparent 32rem),
    radial-gradient(circle at 88% 12%, rgba(255,255,255,.08), transparent 30rem),
    rgba(0,0,0,.18) !important;
  pointer-events: none !important;
}

.player-stage {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: transparent !important;
}

.player-frame {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  background: #000 !important;
}

.player-empty {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
}

.player-empty.is-hidden {
  display: none !important;
}

.player-empty__card {
  width: min(520px, calc(100vw - 40px)) !important;
  min-height: 220px !important;
  display: grid !important;
  place-items: center !important;
  gap: 10px !important;
  padding: 34px !important;
  border-radius: 34px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.55) !important;
  text-align: center !important;
  backdrop-filter: blur(22px) saturate(140%) !important;
}

.player-empty__card b {
  font-size: 34px !important;
  letter-spacing: .24em !important;
}

.player-empty__card span {
  color: rgba(255,255,255,.66) !important;
  font-weight: 800 !important;
}

.player-topline {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 5 !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  padding: clamp(18px, 2.2vw, 34px) clamp(18px, 2.8vw, 44px) 86px !important;
  background: linear-gradient(180deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.56) 44%, rgba(0,0,0,0) 100%) !important;
  pointer-events: none !important;
}

.player-topline > * {
  pointer-events: auto !important;
}

#playerBackBtn.round-btn {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(20,20,22,.74) !important;
  color: #fff !important;
  display: grid !important;
  place-items: center !important;
  backdrop-filter: blur(18px) !important;
}

#playerBackBtn.round-btn:hover {
  background: rgba(255,255,255,.16) !important;
}

.player-titlebox {
  min-width: 0 !important;
  max-width: min(760px, 64vw) !important;
  padding: 11px 16px !important;
  border-radius: 20px !important;
  background: rgba(8,8,10,.58) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  backdrop-filter: blur(22px) saturate(140%) !important;
}

.player-titlebox b {
  display: block !important;
  color: #fff !important;
  font-size: clamp(18px, 1.25vw, 24px) !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-titlebox span {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(255,255,255,.58) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
}

.btn--player-next {
  margin-left: auto !important;
  min-height: 46px !important;
  border-radius: 999px !important;
  padding: 0 18px !important;
  background: #fff !important;
  color: #000 !important;
  border: 0 !important;
  font-weight: 950 !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.36) !important;
}

.btn--player-next.is-hidden {
  display: none !important;
}

.player-bottom-dock {
  position: absolute !important;
  left: clamp(14px, 2.4vw, 42px) !important;
  right: clamp(14px, 2.4vw, 42px) !important;
  bottom: clamp(14px, 2vw, 30px) !important;
  z-index: 6 !important;
  max-height: min(48vh, 390px) !important;
  overflow: hidden !important;
  padding: clamp(16px, 2vw, 24px) !important;
  border-radius: clamp(24px, 2.5vw, 38px) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.12), transparent 26rem),
    linear-gradient(180deg, rgba(26,26,29,.78), rgba(8,8,10,.72)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 30px 110px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(28px) saturate(155%) !important;
}

.player-selectors {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  margin: 0 0 14px !important;
}

.player-chip-group {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 10px !important;
  border-radius: 18px !important;
  background: rgba(0,0,0,.22) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}

.player-chip-group > span {
  color: rgba(255,255,255,.48) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.player-chip-row,
.player-season-tabs,
.player-episode-strip {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  scroll-behavior: smooth !important;
  -webkit-overflow-scrolling: touch !important;
}

.player-chip-row::-webkit-scrollbar,
.player-season-tabs::-webkit-scrollbar,
.player-episode-strip::-webkit-scrollbar {
  display: none !important;
}

.player-chip,
.player-season-tab {
  flex: 0 0 auto !important;
  min-height: 36px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.075) !important;
  color: rgba(255,255,255,.80) !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.player-chip:hover,
.player-season-tab:hover {
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
}

.player-chip.is-active,
.player-season-tab.is-active {
  background: #fff !important;
  color: #050505 !important;
  border-color: #fff !important;
}

.player-series-block {
  display: grid !important;
  gap: 12px !important;
  min-width: 0 !important;
}

.player-episode-strip {
  gap: 12px !important;
  padding: 2px 2px 4px !important;
}

.player-episode-card {
  flex: 0 0 clamp(230px, 18vw, 330px) !important;
  min-height: 82px !important;
  display: grid !important;
  grid-template-columns: 112px minmax(0,1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 9px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.075) !important;
  color: #fff !important;
  text-align: left !important;
}

.player-episode-card:hover {
  transform: translateY(-3px) !important;
  background: rgba(255,255,255,.13) !important;
  border-color: rgba(255,255,255,.20) !important;
}

.player-episode-card.is-active {
  background: rgba(255,255,255,.92) !important;
  color: #050505 !important;
  border-color: #fff !important;
}

.player-episode-thumb {
  width: 112px !important;
  border-radius: 15px !important;
  aspect-ratio: 16 / 9 !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.15), transparent 30%),
    linear-gradient(145deg, #202228, #090a0d) !important;
  background-size: cover !important;
  background-position: center !important;
  color: rgba(255,255,255,.55) !important;
  font-weight: 950 !important;
}

.player-episode-text {
  min-width: 0 !important;
}

.player-episode-text b {
  display: block !important;
  font-size: 15px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-text small {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(255,255,255,.54) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-card.is-active .player-episode-text small {
  color: rgba(0,0,0,.55) !important;
}

@media (max-width: 760px) {
  .player-topline {
    padding: 14px 12px 72px !important;
  }
  #playerBackBtn.round-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
  }
  .player-titlebox {
    max-width: calc(100vw - 84px) !important;
  }
  .btn--player-next {
    display: none !important;
  }
  .player-bottom-dock {
    left: 8px !important;
    right: 8px !important;
    bottom: 8px !important;
    max-height: 56vh !important;
    padding: 12px !important;
    border-radius: 24px !important;
    overflow: auto !important;
  }
  .player-selectors {
    display: grid !important;
  }
  .player-chip-group {
    display: grid !important;
  }
  .player-episode-card {
    flex-basis: 265px !important;
  }
}

/* KINOLOT PLAYER + DETAIL FIX V81 */
:root {
  --player-dock-bg-v81: rgba(14,14,17,.72);
  --player-dock-border-v81: rgba(255,255,255,.13);
}

/* Detail facts: больше не отдельная правая карточка — теперь аккуратная строка под описанием */
.wink-block.wink-about .wink-about__grid,
.wink-detail .wink-about__grid {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 18px !important;
  width: min(100%, 1080px) !important;
  max-width: 1080px !important;
}

.wink-block.wink-about .wink-about__grid > p,
.wink-detail .wink-about__grid > p {
  width: 100% !important;
  max-width: 980px !important;
}

.wink-block.wink-about .wink-facts.wink-facts-strip,
.wink-detail .wink-facts.wink-facts-strip,
.wink-block.wink-about .wink-facts,
.wink-detail .wink-facts {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 980px !important;
  margin: 4px 0 0 !important;
  padding: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wink-block.wink-about .wink-facts.wink-facts-strip div,
.wink-detail .wink-facts.wink-facts-strip div,
.wink-block.wink-about .wink-facts div,
.wink-detail .wink-facts div {
  display: inline-flex !important;
  align-items: center !important;
  gap: 7px !important;
  width: auto !important;
  min-width: 0 !important;
  padding: 9px 12px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

.wink-block.wink-about .wink-facts dt,
.wink-detail .wink-facts dt {
  color: rgba(255,255,255,.42) !important;
  font-size: 10px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.wink-block.wink-about .wink-facts dd,
.wink-detail .wink-facts dd {
  color: rgba(255,255,255,.94) !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

/* Drag-scroll и hover: работает по зажатию мышкой/тачпаду, без выбора текста и без нативного drag картинок */
.kinolot-drag-scroll {
  cursor: grab !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  overscroll-behavior-inline: contain !important;
  scroll-behavior: smooth !important;
}

.kinolot-drag-scroll.is-dragging,
.kinolot-drag-scroll.is-mouse-dragging,
body.is-rail-dragging .kinolot-drag-scroll.is-dragging {
  cursor: grabbing !important;
  scroll-behavior: auto !important;
}

body.is-rail-dragging,
body.is-rail-dragging * {
  user-select: none !important;
  -webkit-user-select: none !important;
}

.detail-media-card,
.media-card,
.showcase-card,
.wink-episode-slide__poster,
.player-episode-card {
  transform-origin: center center !important;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), filter .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease !important;
}

@media (hover:hover) and (pointer:fine) {
  .detail-slider-track:not(.is-dragging):not(.is-mouse-dragging) .detail-media-card:hover,
  .row-scroll:not(.is-dragging):not(.is-mouse-dragging) .media-card:hover,
  .showcase-rail:not(.is-dragging):not(.is-mouse-dragging) .showcase-card:hover,
  .showcase-deck:not(.is-dragging):not(.is-mouse-dragging) .showcase-card:hover {
    transform: translateY(-9px) scale(1.04) !important;
    filter: brightness(1.13) saturate(1.08) !important;
    border-color: rgba(255,255,255,.34) !important;
    box-shadow: 0 26px 80px rgba(0,0,0,.55) !important;
    z-index: 20 !important;
  }

  .wink-episode-track:not(.is-dragging):not(.is-mouse-dragging) .wink-episode-slide:hover .wink-episode-slide__poster,
  .player-episode-strip:not(.is-dragging):not(.is-mouse-dragging) .player-episode-card:hover {
    transform: translateY(-5px) scale(1.018) !important;
    filter: brightness(1.12) saturate(1.06) !important;
    border-color: rgba(255,255,255,.25) !important;
    box-shadow: 0 18px 60px rgba(0,0,0,.42) !important;
  }
}

/* Player v81: компактный кино-оверлей. Качество скрыто, оно есть внутри iframe-плеера. */
#playerQualityChips,
.player-chip-group:has(#playerQualityChips) {
  display: none !important;
}

body[data-page="player"] .topbar,
body[data-page="player"] .sidebar,
body[data-page="player"] .notice,
body[data-page="player"] .toast-root {
  display: none !important;
}

body[data-page="player"],
body[data-page="player"] .app-shell,
body[data-page="player"] .content,
body[data-page="player"] #playerPage,
body[data-page="player"] .page.player-page {
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #000 !important;
}

.cinema-player {
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 34%, rgba(255,255,255,.05), transparent 28rem),
    linear-gradient(180deg, rgba(0,0,0,.20), #000 88%),
    #000 !important;
}

.player-stage,
.player-frame {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}

.player-frame {
  z-index: 1 !important;
  border: 0 !important;
  background: #000 !important;
}

.player-topline {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 8 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 18px 24px 78px !important;
  background: linear-gradient(180deg, rgba(0,0,0,.76), rgba(0,0,0,.34) 46%, transparent) !important;
  pointer-events: none !important;
}

.player-topline > * { pointer-events: auto !important; }

#playerBackBtn.round-btn {
  width: 52px !important;
  height: 52px !important;
  min-width: 52px !important;
  border-radius: 999px !important;
  background: rgba(20,20,22,.70) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  box-shadow: 0 14px 50px rgba(0,0,0,.38) !important;
}

.player-titlebox {
  max-width: min(620px, 58vw) !important;
  padding: 10px 15px !important;
  border-radius: 18px !important;
  background: rgba(12,12,14,.46) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  backdrop-filter: blur(18px) saturate(145%) !important;
}

.player-titlebox b {
  font-size: clamp(17px, 1.15vw, 23px) !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-titlebox span {
  margin-top: 3px !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.56) !important;
}

.btn--player-next {
  margin-left: auto !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.92) !important;
  color: #050505 !important;
  border: 0 !important;
  font-weight: 950 !important;
}

.player-bottom-dock {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  bottom: 62px !important;
  z-index: 9 !important;
  width: min(1280px, calc(100vw - 72px)) !important;
  max-height: min(32vh, 278px) !important;
  transform: translateX(-50%) !important;
  overflow: hidden !important;
  display: grid !important;
  gap: 11px !important;
  padding: 13px !important;
  border-radius: 26px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.13), transparent 22rem),
    linear-gradient(180deg, rgba(24,24,27,.74), rgba(8,8,10,.66)) !important;
  border: 1px solid var(--player-dock-border-v81) !important;
  box-shadow: 0 22px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.075) !important;
  backdrop-filter: blur(26px) saturate(150%) !important;
}

.player-selectors {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
}

.player-chip-group,
.player-chip-group--voice {
  min-width: 0 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.player-chip-group > span {
  color: rgba(255,255,255,.48) !important;
  font-size: 10px !important;
  font-weight: 950 !important;
  letter-spacing: .15em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.player-chip-row,
.player-season-tabs,
.player-episode-strip {
  min-width: 0 !important;
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
}

.player-chip-row::-webkit-scrollbar,
.player-season-tabs::-webkit-scrollbar,
.player-episode-strip::-webkit-scrollbar { display: none !important; }

.player-chip,
.player-season-tab {
  flex: 0 0 auto !important;
  min-height: 34px !important;
  padding: 0 14px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.82) !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}

.player-chip.is-active,
.player-season-tab.is-active {
  background: #fff !important;
  color: #050505 !important;
  border-color: #fff !important;
}

.player-series-block {
  min-width: 0 !important;
  display: grid !important;
  gap: 10px !important;
}

.player-episode-strip {
  gap: 10px !important;
  padding: 1px 1px 3px !important;
}

.player-episode-card {
  flex: 0 0 clamp(235px, 20vw, 318px) !important;
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 94px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 7px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.075) !important;
  color: #fff !important;
  text-align: left !important;
}

.player-episode-card.is-active {
  background: rgba(255,255,255,.94) !important;
  color: #050505 !important;
  border-color: #fff !important;
}

.player-episode-thumb {
  width: 94px !important;
  aspect-ratio: 16/9 !important;
  border-radius: 13px !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.17), transparent 30%),
    linear-gradient(145deg, #202228, #090a0d) !important;
  background-size: cover !important;
  background-position: center !important;
}

.player-episode-text b {
  display: block !important;
  font-size: 14px !important;
  line-height: 1.06 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-text small {
  display: block !important;
  margin-top: 4px !important;
  font-size: 11px !important;
  line-height: 1.15 !important;
  color: rgba(255,255,255,.55) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-card.is-active .player-episode-text small { color: rgba(0,0,0,.56) !important; }

@media (max-width: 860px) {
  .player-topline {
    padding: 12px 12px 62px !important;
  }
  .player-titlebox {
    max-width: calc(100vw - 86px) !important;
  }
  .btn--player-next { display: none !important; }
  .player-bottom-dock {
    width: calc(100vw - 16px) !important;
    bottom: 50px !important;
    max-height: 42vh !important;
    padding: 10px !important;
    border-radius: 22px !important;
  }
  .player-chip-group,
  .player-chip-group--voice {
    grid-template-columns: 1fr !important;
    gap: 7px !important;
  }
  .player-episode-card {
    flex-basis: 246px !important;
    grid-template-columns: 86px minmax(0,1fr) !important;
  }
  .player-episode-thumb { width: 86px !important; }
}


/* Player v82: экран разделён на шапку, iframe и нижний полноширинный выбор серий/озвучек. */
body[data-page="player"] .topbar,
body[data-page="player"] .sidebar,
body[data-page="player"] .notice,
body[data-page="player"] .toast-root {
  display: none !important;
}

body[data-page="player"],
body[data-page="player"] .app-shell,
body[data-page="player"] .content,
body[data-page="player"] #playerPage,
body[data-page="player"] .page.player-page {
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #000 !important;
}

.cinema-player {
  --player-header-h-v82: 88px;
  --player-dock-h-v82: clamp(198px, 24vh, 282px);
  position: fixed !important;
  inset: 0 !important;
  z-index: 10000 !important;
  overflow: hidden !important;
  background: #000 !important;
}

.player-stage {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background: #000 !important;
}

.player-frame,
.player-empty {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  top: var(--player-header-h-v82) !important;
  bottom: var(--player-dock-h-v82) !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  border: 0 !important;
  background: #000 !important;
}

.player-frame {
  z-index: 1 !important;
}

.player-empty {
  z-index: 2 !important;
  display: grid !important;
  place-items: center !important;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,255,255,.08), transparent 26rem),
    #000 !important;
}

.player-frame.is-hidden,
.player-empty.is-hidden,
.is-hidden {
  display: none !important;
}

.player-topline {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  height: var(--player-header-h-v82) !important;
  z-index: 12 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  padding: 0 28px !important;
  background:
    linear-gradient(180deg, rgba(14,14,16,.96), rgba(5,5,6,.92)) !important;
  border-bottom: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.38) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
  pointer-events: auto !important;
}

.player-topline::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.08), transparent 21rem),
    radial-gradient(circle at 92% 0%, rgba(255,255,255,.05), transparent 18rem) !important;
}

.player-topline > * {
  position: relative !important;
  pointer-events: auto !important;
}

#playerBackBtn.round-btn {
  width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: #fff !important;
  box-shadow: none !important;
  backdrop-filter: blur(14px) !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease !important;
}

#playerBackBtn.round-btn:hover,
#playerBackBtn.round-btn:focus-visible {
  transform: scale(1.06) !important;
  background: rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.28) !important;
}

.player-titlebox {
  min-width: 0 !important;
  max-width: none !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

.player-titlebox b {
  display: block !important;
  max-width: 100% !important;
  font-size: clamp(19px, 1.55vw, 30px) !important;
  line-height: 1.05 !important;
  letter-spacing: -.035em !important;
  color: #fff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-titlebox span {
  display: block !important;
  margin-top: 5px !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  letter-spacing: .02em !important;
  color: rgba(255,255,255,.58) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.btn--player-next {
  justify-self: end !important;
  min-height: 42px !important;
  padding: 0 18px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: none !important;
  font-weight: 950 !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease !important;
}

.btn--player-next:hover,
.btn--player-next:focus-visible {
  transform: translateY(-1px) !important;
  background: #fff !important;
  border-color: #fff !important;
  color: #000 !important;
}

.player-bottom-dock {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 12 !important;
  width: 100vw !important;
  height: var(--player-dock-h-v82) !important;
  max-height: none !important;
  transform: none !important;
  overflow: hidden !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 12px !important;
  padding: 16px max(28px, env(safe-area-inset-right)) max(18px, env(safe-area-inset-bottom)) max(28px, env(safe-area-inset-left)) !important;
  border-radius: 30px 30px 0 0 !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(255,255,255,.14), transparent 24rem),
    linear-gradient(180deg, rgba(28,28,31,.94), rgba(8,8,10,.98)) !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: 0 -24px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07) !important;
  backdrop-filter: blur(26px) saturate(150%) !important;
}

.player-selectors {
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  margin: 0 !important;
}

.player-chip-group,
.player-chip-group--voice {
  min-width: 0 !important;
  width: 100% !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

.player-chip-group > span {
  color: rgba(255,255,255,.45) !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  letter-spacing: .19em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.player-chip-row,
.player-season-tabs,
.player-episode-strip {
  min-width: 0 !important;
  display: flex !important;
  gap: 10px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  -webkit-overflow-scrolling: touch !important;
  cursor: grab !important;
  touch-action: pan-x !important;
  user-select: none !important;
  scroll-behavior: smooth !important;
}

.player-chip-row.is-dragging,
.player-season-tabs.is-dragging,
.player-episode-strip.is-dragging {
  cursor: grabbing !important;
  scroll-behavior: auto !important;
}

.player-chip-row::-webkit-scrollbar,
.player-season-tabs::-webkit-scrollbar,
.player-episode-strip::-webkit-scrollbar {
  display: none !important;
}

.player-chip,
.player-season-tab {
  flex: 0 0 auto !important;
  min-height: 38px !important;
  padding: 0 17px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.08) !important;
  color: rgba(255,255,255,.82) !important;
  font-size: 14px !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease !important;
}

.player-chip:hover,
.player-season-tab:hover,
.player-chip:focus-visible,
.player-season-tab:focus-visible {
  transform: translateY(-1px) scale(1.025) !important;
  background: rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.28) !important;
}

.player-chip.is-active,
.player-season-tab.is-active {
  background: #fff !important;
  color: #060606 !important;
  border-color: #fff !important;
}

.player-series-block {
  min-width: 0 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 11px !important;
}

.player-season-tabs {
  padding: 0 !important;
}

.player-episode-strip {
  gap: 12px !important;
  padding: 0 1px 3px !important;
  align-items: stretch !important;
}

.player-episode-card {
  flex: 0 0 clamp(280px, 21.5vw, 390px) !important;
  min-height: 92px !important;
  display: grid !important;
  grid-template-columns: 128px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 9px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.075) !important;
  color: #fff !important;
  text-align: left !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  transition: transform .18s ease, background .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

.player-episode-card:hover,
.player-episode-card:focus-visible {
  transform: translateY(-3px) scale(1.015) !important;
  background: rgba(255,255,255,.13) !important;
  border-color: rgba(255,255,255,.24) !important;
  box-shadow: 0 18px 42px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.player-episode-card.is-active {
  background: #fff !important;
  color: #050505 !important;
  border-color: #fff !important;
  box-shadow: 0 20px 52px rgba(255,255,255,.10) !important;
}

.player-episode-thumb {
  width: 128px !important;
  aspect-ratio: 16/9 !important;
  border-radius: 16px !important;
  background:
    radial-gradient(circle at 28% 18%, rgba(255,255,255,.18), transparent 30%),
    linear-gradient(145deg, #22242a, #090a0d) !important;
  background-size: cover !important;
  background-position: center !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06) !important;
}

.player-episode-text b {
  display: block !important;
  font-size: 16px !important;
  line-height: 1.07 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-text small {
  display: block !important;
  margin-top: 7px !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  color: rgba(255,255,255,.52) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.player-episode-card.is-active .player-episode-text small {
  color: rgba(0,0,0,.58) !important;
}

@media (max-width: 980px) {
  .cinema-player {
    --player-header-h-v82: 78px;
    --player-dock-h-v82: clamp(210px, 32vh, 330px);
  }

  .player-topline {
    padding: 0 14px !important;
    grid-template-columns: auto minmax(0,1fr) !important;
  }

  .btn--player-next {
    display: none !important;
  }

  #playerBackBtn.round-btn {
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
  }

  .player-bottom-dock {
    padding: 13px 14px max(14px, env(safe-area-inset-bottom)) !important;
    border-radius: 24px 24px 0 0 !important;
  }

  .player-chip-group,
  .player-chip-group--voice {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .player-chip,
  .player-season-tab {
    min-height: 36px !important;
    padding: 0 14px !important;
    font-size: 13px !important;
  }

  .player-episode-card {
    flex-basis: 272px !important;
    grid-template-columns: 102px minmax(0,1fr) !important;
    min-height: 82px !important;
  }

  .player-episode-thumb {
    width: 102px !important;
  }
}

@media (max-width: 560px) {
  .cinema-player {
    --player-header-h-v82: 74px;
    --player-dock-h-v82: 260px;
  }

  .player-titlebox b {
    font-size: 17px !important;
  }

  .player-titlebox span {
    font-size: 12px !important;
  }

  .player-episode-card {
    flex-basis: 238px !important;
    grid-template-columns: 88px minmax(0,1fr) !important;
    gap: 10px !important;
  }

  .player-episode-thumb {
    width: 88px !important;
  }
}