/* Theme: Cinema Dark */
.kyi-theme-cinema-dark {
  background:
    radial-gradient(circle at 16% 0%, color-mix(in srgb, var(--ft-accent, #22c8ff) 22%, transparent), transparent 34%),
    radial-gradient(circle at 84% 10%, color-mix(in srgb, var(--ft-secondary, #7c3aed) 22%, transparent), transparent 36%),
    linear-gradient(180deg, #020617 0%, var(--ft-bg, #05060a) 48%, #020617 100%);
}
.kyi-theme-cinema-dark::before { content:""; position:fixed; inset:0; pointer-events:none; background: linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 64px 64px; mask-image: linear-gradient(to bottom, rgba(0,0,0,.8), transparent 78%); }
.kyi-theme-cinema-dark .topbar,
.kyi-theme-cinema-dark .watch-head.kyi-page-head { background: linear-gradient(135deg, color-mix(in srgb, var(--ft-surface, #111827) 82%, transparent), rgba(2,6,23,.72)); box-shadow: 0 24px 70px rgba(0,0,0,.28); }
.kyi-theme-cinema-dark .video-card img,
.kyi-theme-cinema-dark .series-card img,
.kyi-theme-cinema-dark .actor-card img { filter: saturate(1.05) contrast(1.04); }
.kyi-theme-cinema-dark .btn:first-child,
.kyi-theme-cinema-dark .theme-primary-action { background: linear-gradient(135deg, var(--ft-accent, #22c8ff), var(--ft-secondary, #7c3aed)); color:#fff; border-color: transparent; }

/* v4.3.1 Cinema Dark front-page foundation: full-width cinematic shell + header menu. */
.kyi-theme-cinema-dark .kyi-site-header {
  background:
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025)),
    color-mix(in srgb, var(--ft-surface, #111827) 82%, rgba(2,6,23,.84));
  border: 1px solid color-mix(in srgb, var(--ft-accent, #22c8ff) 22%, rgba(255,255,255,.12));
  box-shadow: 0 26px 80px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.08);
}
.kyi-theme-cinema-dark .kyi-site-header::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--ft-accent, #22c8ff) 70%, transparent), color-mix(in srgb, var(--ft-secondary, #7c3aed) 70%, transparent), transparent);
  opacity: .82;
}
.kyi-theme-cinema-dark .kyi-primary-nav a {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.kyi-theme-cinema-dark .kyi-primary-nav a:hover,
.kyi-theme-cinema-dark .kyi-primary-nav a:focus-visible {
  box-shadow: 0 16px 36px color-mix(in srgb, var(--ft-accent, #22c8ff) 18%, transparent), inset 0 1px 0 rgba(255,255,255,.10);
}
.kyi-theme-cinema-dark .kyi-page-intro {
  background:
    radial-gradient(circle at 12% 12%, color-mix(in srgb, var(--ft-accent, #22c8ff) 18%, transparent), transparent 32%),
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--ft-secondary, #7c3aed) 18%, transparent), transparent 36%),
    linear-gradient(135deg, color-mix(in srgb, var(--ft-surface, #111827) 84%, transparent), rgba(2,6,23,.78));
  box-shadow: 0 24px 72px rgba(0,0,0,.28);
}
.kyi-theme-cinema-dark .kyi-brand-logo,
.kyi-theme-cinema-dark .kyi-brand-mark {
  box-shadow: 0 18px 46px color-mix(in srgb, var(--ft-accent, #22c8ff) 18%, transparent), inset 0 1px 0 rgba(255,255,255,.14);
}

/* v5.0.0 Cinema Dark production hero skin: single clean layer for header + hero only. */
.kyi-theme-cinema-dark .kyi-has-cinema-hero.site-wrap { padding-top: 0; }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header {
  position: absolute;
  top: clamp(10px, 1.15vw, 18px);
  left: var(--ft-gutter);
  right: var(--ft-gutter);
  width: auto;
  max-width: none;
  min-height: 82px;
  margin: 0;
  padding: 12px 0;
  border: 0;
  border-radius: 0;
  grid-template-columns: minmax(150px, auto) minmax(0, 1fr) auto;
  background: transparent !important;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  z-index: 90;
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header::after { display: none; }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-copy em { display: none; }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-copy strong {
  font-size: clamp(22px, 2vw, 34px);
  letter-spacing: .08em;
  text-transform: uppercase;
  color: color-mix(in srgb, var(--ft-accent, #e3c66a) 76%, #fff);
  text-shadow: 0 10px 30px rgba(0,0,0,.55);
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-mark {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  color: #061018;
  background: radial-gradient(circle at 34% 30%, #fffbe0, var(--ft-accent, #e3c66a) 48%, #8a6d24 100%);
  box-shadow: 0 12px 34px rgba(0,0,0,.34), 0 0 0 3px rgba(255,255,255,.10);
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-mark span { transform: translateX(2px); }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-logo {
  width: auto;
  max-width: clamp(106px, 9.4vw, 176px);
  height: clamp(42px, 4.2vw, 64px);
  object-fit: contain;
  object-position: left center;
  padding: 0;
  border: 0;
  background: transparent !important;
  background-color: transparent !important;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(0 14px 24px rgba(0,0,0,.46));
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-link:has(.kyi-brand-logo) .kyi-brand-copy { display: none; }
@supports not selector(:has(*)) {
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-logo + .kyi-brand-copy { display: none; }
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav {
  justify-content: flex-start;
  padding-left: clamp(10px, 2vw, 32px);
  gap: clamp(6px, .75vw, 16px);
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a {
  min-height: 42px;
  padding: 0 8px;
  color: rgba(255,255,255,.92);
  background: transparent;
  border: 0;
  border-radius: 8px;
  box-shadow: none;
  font-size: clamp(13px, .9vw, 16px);
  font-weight: 900;
  text-shadow: 0 8px 22px rgba(0,0,0,.45);
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a.is-active,
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a:hover,
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a:focus-visible {
  color: var(--ft-accent, #e3c66a);
  background: transparent;
  box-shadow: none;
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-header-actions { gap: clamp(8px, 1vw, 16px); }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-header-icon,
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-account-chip {
  color: #fff;
  text-shadow: 0 8px 22px rgba(0,0,0,.45);
}
@media (max-width: 1180px) {
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header {
    grid-template-columns: minmax(150px, 1fr) auto;
    padding: 14px 0;
  }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav {
    grid-column: 1 / -1;
    order: 3;
    padding-left: 0;
    justify-content: flex-start;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav::-webkit-scrollbar { display: none; }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a { flex: 0 0 auto; }
}
@media (max-width: 720px) {
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header {
    top: 8px;
    left: 12px;
    right: 12px;
    min-height: 68px;
    grid-template-columns: 1fr auto;
    gap: 8px;
  }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-mark { width: 46px; height: 46px; }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-copy strong { font-size: 20px; max-width: 56vw; }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav { gap: 12px; padding-top: 0; }
  .kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a { min-height: 34px; padding: 0; font-size: 13px; }
}

/* Cinema Dark homepage builder tuning */
.kyi-theme-cinema-dark .kyi-home-section{background:#030b16}.kyi-theme-cinema-dark .kyi-home-section-head h2{color:#fff}.kyi-theme-cinema-dark .kyi-home-view-all:hover{color:var(--ft-accent,#f5c542)}.kyi-theme-cinema-dark .kyi-home-card{box-shadow:0 14px 34px rgba(0,0,0,.28)}.kyi-theme-cinema-dark .kyi-home-card:hover{filter:saturate(1.05) contrast(1.03)}


/* v6.8.0 final over-hero header polish: no separate dark header wash; text stays readable via shadows only. */
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 90 !important;
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header::before,
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-site-header::after {
  content: none !important;
  display: none !important;
}

/* Cinema Dark Typography Standard v1.0.0
   Theme-level normalization: keeps the cinematic identity but removes heavy oversized type. */
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-brand-copy strong {
  font-size: clamp(18px, 1.5vw, 26px);
  font-weight: 700;
  letter-spacing: .055em;
}
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a {
  font-size: clamp(12px, .82vw, 14px);
  font-weight: 600;
  letter-spacing: 0;
}
.kyi-theme-cinema-dark .kyi-home-section { background: #06101c; }
.kyi-theme-cinema-dark .kyi-home-section-head h2 { font-weight: 700; letter-spacing: -.018em; }
.kyi-theme-cinema-dark .kyi-has-cinema-hero .kyi-primary-nav a { font-weight: 600; }

/* v17.0.0 Unified Cinema Dark Header
   Requirement:
   The front page header must be the site-wide Cinema Dark header. Series pages
   were falling back to the boxed/sticky generic header because the transparent
   front-page header was tied to the homepage hero state only.

   This makes the front-page Cinema Dark header a site-level component for public
   pages using .kyi-unified-cinema-header. It keeps Modern Glass untouched.
*/
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-site-header {
  position: absolute !important;
  top: clamp(10px, 1.15vw, 18px) !important;
  left: var(--ft-gutter, clamp(18px, 4vw, 70px)) !important;
  right: var(--ft-gutter, clamp(18px, 4vw, 70px)) !important;
  width: auto !important;
  max-width: none !important;
  min-height: 82px !important;
  margin: 0 !important;
  padding: 12px 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  grid-template-columns: minmax(150px, auto) minmax(0, 1fr) auto !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  z-index: 90 !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-site-header::after {
  display: none !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-copy em {
  display: none !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-copy strong {
  font-size: clamp(22px, 2vw, 34px) !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  color: color-mix(in srgb, var(--ft-accent, #e3c66a) 76%, #fff) !important;
  text-shadow: 0 10px 30px rgba(0,0,0,.55) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-mark {
  width: 56px !important;
  height: 56px !important;
  border-radius: 50% !important;
  color: #061018 !important;
  background: radial-gradient(circle at 34% 30%, #fffbe0, var(--ft-accent, #e3c66a) 48%, #8a6d24 100%) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.34), 0 0 0 3px rgba(255,255,255,.10) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-mark span {
  transform: translateX(2px) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-logo {
  width: auto !important;
  max-width: clamp(106px, 9.4vw, 176px) !important;
  height: clamp(42px, 4.2vw, 64px) !important;
  object-fit: contain !important;
  object-position: left center !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: drop-shadow(0 14px 24px rgba(0,0,0,.46)) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-link:has(.kyi-brand-logo) .kyi-brand-copy,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-brand-logo + .kyi-brand-copy {
  display: none !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav {
  justify-content: flex-start !important;
  padding-left: clamp(10px, 2vw, 32px) !important;
  gap: clamp(6px, .75vw, 16px) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav a {
  min-height: 42px !important;
  padding: 0 8px !important;
  color: rgba(255,255,255,.92) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-size: clamp(13px, .9vw, 16px) !important;
  font-weight: 900 !important;
  text-shadow: 0 8px 22px rgba(0,0,0,.45) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav a.is-active,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav a:hover,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav a:focus-visible {
  color: var(--ft-accent, #e3c66a) !important;
  background: transparent !important;
  box-shadow: none !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-header-actions {
  gap: clamp(8px, 1vw, 16px) !important;
  justify-content: flex-end !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-header-icon,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-account-chip {
  color: #fff !important;
  background: transparent !important;
  text-shadow: 0 8px 22px rgba(0,0,0,.45) !important;
}
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-header-icon:hover,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-account-chip:hover,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-header-icon:focus-visible,
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-account-chip:focus-visible {
  color: var(--ft-accent, #e3c66a) !important;
  background: transparent !important;
  outline: none !important;
}
/* The front page header does not show a page-specific back arrow. Keep header identical across pages. */
.kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-back-icon {
  display: none !important;
}

@media (max-width: 920px) {
  .kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-site-header {
    grid-template-columns: minmax(120px, 1fr) auto !important;
    min-height: 68px !important;
    padding: 10px 0 !important;
  }
  .kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-primary-nav {
    padding-left: 0 !important;
  }
}
@media (max-width: 760px) {
  .kyi-theme-cinema-dark .kyi-unified-cinema-header .kyi-site-header {
    top: 10px !important;
    left: 18px !important;
    right: 18px !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
}
