/* Cinento hero compositor-lite patch v20260910.2
 * The hero deliberately avoids backdrop-filter, blur layers, continuous glow
 * animations and transform promotion. Lower-page visuals remain untouched.
 */
html:not(.tv-mode) .universe-bg{
  position:absolute!important;
  top:0!important;right:0!important;bottom:auto!important;left:0!important;
  height:min(920px,100vh)!important;
  min-height:620px;
  background:
    radial-gradient(ellipse at 18% 8%,rgba(8,145,178,.10),transparent 45%),
    linear-gradient(180deg,#050508 0%,#06070b 66%,#050508 100%)!important;
  contain:layout paint style!important;
  transform:none!important;
  will-change:auto!important;
}
html:not(.tv-mode) #hero-section{
  isolation:isolate;
  contain:layout style;
}
html:not(.tv-mode) #hero-section .cinento-choice-summary,
html:not(.tv-mode) #hero-section .cinento-choice-panel,
html:not(.tv-mode) #hero-section .puzzle-piece,
html:not(.tv-mode) #hero-section .hero-mini-btn,
html:not(.tv-mode) #hero-section .cinento-hero-mode-switch{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
}
html:not(.tv-mode) #hero-section .cinento-choice-summary{
  background:rgba(13,18,25,.94)!important;
  box-shadow:none!important;
  border-color:rgba(255,255,255,.075)!important;
}
html:not(.tv-mode) #hero-section .cinento-choice-panel{
  background:rgba(8,12,18,.94)!important;
  box-shadow:none!important;
  border-color:rgba(255,255,255,.065)!important;
}
html:not(.tv-mode) #hero-section .safe-scroll-container{
  scroll-behavior:auto!important;
  overscroll-behavior-inline:contain;
}
html:not(.tv-mode) #hero-section .puzzle-piece{
  background:#0d1219!important;
  border-color:rgba(255,255,255,.085)!important;
  box-shadow:none!important;
  text-shadow:none!important;
  transform:none!important;
  will-change:auto!important;
  transition:background-color .12s ease,border-color .12s ease,color .12s ease!important;
  contain:layout paint style;
  content-visibility:auto;
  contain-intrinsic-size:110px 68px;
}
html:not(.tv-mode) #hero-section .puzzle-piece:hover{
  background:#101a22!important;
  border-color:rgba(34,211,238,.34)!important;
  box-shadow:none!important;
  transform:none!important;
  z-index:auto!important;
}
html:not(.tv-mode) #hero-section .puzzle-piece.selected{
  background:#0e7490!important;
  border-color:#22d3ee!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px rgba(207,250,254,.18)!important;
  transform:none!important;
  z-index:auto!important;
}
html:not(.tv-mode) #hero-section .puzzle-piece i{
  filter:none!important;
  text-shadow:none!important;
}
html:not(.tv-mode) #hero-section .puzzle-slot,
html:not(.tv-mode) #hero-section #btn-ignite{
  box-shadow:none!important;
  filter:none!important;
  transform:none!important;
  transition:background-color .12s ease,border-color .12s ease,color .12s ease!important;
}
html:not(.tv-mode) #hero-section #btn-ignite:not(:disabled){
  background:#22d3ee!important;
  color:#041116!important;
}
html:not(.tv-mode) #hero-section #btn-icon{
  animation:none!important;
}
html:not(.tv-mode) #hero-section .hero-mini-btn{
  background:#0d1219!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background-color .12s ease,border-color .12s ease,color .12s ease!important;
}
html:not(.tv-mode) #hero-section .hero-mini-btn:hover{
  transform:none!important;
  box-shadow:none!important;
}
html:not(.tv-mode) #hero-section .cinento-hero-mode-switch{
  display:flex;
  justify-content:center;
  margin:10px auto 0;
}
html:not(.tv-mode) #hero-section .cinento-hero-mode-switch .cinento-mode-switch{
  position:static!important;
  left:auto!important;bottom:auto!important;
  transform:none!important;
  z-index:auto!important;
  background:#0b1118!important;
  border-color:rgba(255,255,255,.10)!important;
  box-shadow:none!important;
}
html:not(.tv-mode) #hero-section .cinento-hero-mode-switch .cinento-mode-switch a{
  transition:background-color .12s ease,color .12s ease!important;
  transform:none!important;
}
@media(max-width:760px){
  html:not(.tv-mode) .universe-bg{height:760px!important;min-height:0!important}
  html:not(.tv-mode) #hero-section .puzzle-piece{contain-intrinsic-size:132px 64px}
  html:not(.tv-mode) #hero-section .cinento-hero-mode-switch{margin-top:8px}
  html:not(.tv-mode) #hero-section .cinento-hero-mode-switch .cinento-mode-switch{max-width:calc(100vw - 28px)!important}
  html:not(.tv-mode) #hero-section .cinento-hero-mode-switch .cinento-mode-switch a{padding:7px 9px!important;font-size:9px!important}
}
@media(prefers-reduced-motion:reduce){
  html:not(.tv-mode) #hero-section *,html:not(.tv-mode) #hero-section *::before,html:not(.tv-mode) #hero-section *::after{animation:none!important;transition-duration:0s!important}
}
/* Fixed translucent UI can force Chrome to re-composite the whole hero while
 * horizontally scrolling/tapping tokens. Keep the dock/header visually dark
 * but opaque enough to avoid a live backdrop blur surface. */
html:not(.tv-mode) .mobile-bottom-nav{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  background:linear-gradient(to top,#05070b,#080c12)!important;
  box-shadow:none!important;
}
html:not(.tv-mode) .scroll-fab{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}

/* v20260910.3: keep the complete top interaction path compositor-light in
 * both Movies & Series and Live TV editorial modes. */
html:not(.tv-mode) #topHeader{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  background:#070a0f!important;
}
html:not(.tv-mode) #topHeader #main-logo{
  filter:none!important;
  transition:opacity .12s ease!important;
}
html:not(.tv-mode) #hero-section button,
html:not(.tv-mode) #hero-section a{
  will-change:auto!important;
}
html:not(.tv-mode) #hero-section .cinento-format-controls,
html:not(.tv-mode) #hero-section .cinento-format-controls > div,
html:not(.tv-mode) #hero-section .cinento-format-controls button,
html:not(.tv-mode) #hero-section .cinento-format-controls select{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  filter:none!important;
  box-shadow:none!important;
}
html:not(.tv-mode) #hero-section .cinento-format-controls > div,
html:not(.tv-mode) #hero-section .cinento-format-controls select{
  background:#0b1118!important;
}
html:not(.tv-mode) #hero-section .cinento-choice-panel .relative.group > div:first-child button{
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
  transform:none!important;
}
html:not(.tv-mode) #hero-section .cinento-choice-panel .relative.group > div:first-child button:hover{
  transform:none!important;
  box-shadow:none!important;
}
html.cinento-live-mode:not(.tv-mode) #hero-section{
  min-height:auto!important;
  padding-bottom:18px!important;
}
html.cinento-live-mode:not(.tv-mode) #hero-section .cinento-choice-panel{
  contain:layout paint style!important;
}
@media(max-width:760px){
  html:not(.tv-mode) #topHeader{background:#070a0f!important}
  html.cinento-live-mode:not(.tv-mode) #hero-section{padding-bottom:12px!important}
}

/* v20260911.4 — Android TV receives the same compositor-light hero treatment.
 * Ads are handled separately by the lazy runtime and are intentionally not
 * hidden here. */
html.tv-mode .universe-bg{
  position:absolute!important;inset:0 0 auto 0!important;height:min(900px,100vh)!important;
  min-height:600px!important;background:linear-gradient(180deg,#07101b 0%,#07111c 58%,#05080d 100%)!important;
  transform:none!important;filter:none!important;will-change:auto!important;contain:layout paint style!important;
}
html.tv-mode #hero-section{isolation:isolate!important;contain:layout style!important;}
html.tv-mode #hero-section .cinento-choice-summary,
html.tv-mode #hero-section .cinento-choice-panel,
html.tv-mode #hero-section .puzzle-piece,
html.tv-mode #hero-section .puzzle-slot,
html.tv-mode #hero-section #btn-ignite,
html.tv-mode #hero-section .hero-mini-btn,
html.tv-mode #hero-section .cinento-mode-switch,
html.tv-mode #topHeader,
html.tv-mode .mobile-bottom-nav{
  -webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;box-shadow:none!important;
}
html.tv-mode #topHeader{background:#07101a!important;}
html.tv-mode #hero-section .cinento-choice-summary{background:#0d1722!important;border-color:rgba(255,255,255,.08)!important;}
html.tv-mode #hero-section .cinento-choice-panel{background:#09131e!important;border-color:rgba(255,255,255,.07)!important;}
html.tv-mode #hero-section .puzzle-piece{
  background:#0d1824!important;border-color:rgba(255,255,255,.09)!important;transform:none!important;will-change:auto!important;
  transition:background-color .1s ease,border-color .1s ease,color .1s ease!important;contain:layout paint style!important;
}
html.tv-mode #hero-section .puzzle-piece:hover,html.tv-mode #hero-section .puzzle-piece:focus{background:#102330!important;border-color:rgba(34,211,238,.38)!important;transform:none!important;}
html.tv-mode #hero-section .puzzle-piece.selected{background:#0e7490!important;border-color:#22d3ee!important;color:#fff!important;}
html.tv-mode #hero-section .safe-scroll-container{scroll-behavior:auto!important;overscroll-behavior-inline:contain!important;}
html.tv-mode .mobile-bottom-nav{background:linear-gradient(to top,#050a10,#09131d)!important;}

/* Four-choice Live hero: compact enough to keep Mood + Location + Company +
 * Subject visible without returning to GPU-heavy scaling effects. */
html.cinento-live-mode #hero-section .cinento-choice-panel{padding:9px 11px!important;}
html.cinento-live-mode #hero-section .cinento-choice-panel>.relative.group{margin-top:4px!important;}
html.cinento-live-mode #hero-section .cinento-choice-panel>.relative.group:first-child{margin-top:0!important;}
html.cinento-live-mode #hero-section .puzzle-piece{
  min-width:92px!important;max-width:108px!important;min-height:55px!important;padding:7px 8px!important;gap:3px!important;border-radius:11px!important;
}
html.cinento-live-mode #hero-section .puzzle-piece i{font-size:16px!important;margin-bottom:0!important;}
html.cinento-live-mode #hero-section .puzzle-piece span{font-size:9px!important;line-height:1.12!important;}
html.cinento-live-mode #hero-section .cinento-choice-summary{gap:7px!important;padding:7px!important;margin-bottom:7px!important;}
html.cinento-live-mode #hero-section #slot-location,
html.cinento-live-mode #hero-section #slot-mood,
html.cinento-live-mode #hero-section #slot-company,
html.cinento-live-mode #hero-section #slot-subject,
html.cinento-live-mode #hero-section #btn-ignite{width:58px!important;height:58px!important;min-width:58px!important;min-height:58px!important;}
html.cinento-live-mode #hero-section .text-center.mb-3{margin-bottom:7px!important;}
html.cinento-live-mode #hero-section .cinento-hero-mode-switch{margin-top:6px!important;}
html.cinento-live-mode #hero-section .hero-mini-actions{margin-top:5px!important;}
@media(max-width:760px){
  html.cinento-live-mode #hero-section .puzzle-piece{min-width:84px!important;max-width:94px!important;min-height:52px!important;padding:6px 7px!important;}
  html.cinento-live-mode #hero-section #slot-location,html.cinento-live-mode #hero-section #slot-mood,html.cinento-live-mode #hero-section #slot-company,html.cinento-live-mode #hero-section #slot-subject,html.cinento-live-mode #hero-section #btn-ignite{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;}
  html.cinento-live-mode #hero-section .cinento-choice-panel{padding:8px!important;}
}
@media(min-width:900px) and (max-width:1500px){
  html.tv-mode.cinento-live-mode #hero-section .puzzle-piece{min-width:82px!important;max-width:94px!important;min-height:50px!important;padding:5px 6px!important;}
  html.tv-mode.cinento-live-mode #hero-section .puzzle-piece i{font-size:14px!important;}
  html.tv-mode.cinento-live-mode #hero-section .puzzle-piece span{font-size:8px!important;}
  html.tv-mode.cinento-live-mode #hero-section #slot-location,html.tv-mode.cinento-live-mode #hero-section #slot-mood,html.tv-mode.cinento-live-mode #hero-section #slot-company,html.tv-mode.cinento-live-mode #hero-section #slot-subject,html.tv-mode.cinento-live-mode #hero-section #btn-ignite{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;}
}


/* v20260911.5 — Live finder parity: all four token families use the exact same footprint. */
html.cinento-live-mode #hero-section #list-mood .puzzle-piece,
html.cinento-live-mode #hero-section #list-location .puzzle-piece,
html.cinento-live-mode #hero-section #list-company .puzzle-piece,
html.cinento-live-mode #hero-section #list-subject .puzzle-piece{
  box-sizing:border-box!important;flex:0 0 96px!important;width:96px!important;min-width:96px!important;max-width:96px!important;
  min-height:55px!important;height:55px!important;padding:7px 7px!important;
}
@media(max-width:760px){
  html.cinento-live-mode #hero-section #list-mood .puzzle-piece,
  html.cinento-live-mode #hero-section #list-location .puzzle-piece,
  html.cinento-live-mode #hero-section #list-company .puzzle-piece,
  html.cinento-live-mode #hero-section #list-subject .puzzle-piece{flex-basis:84px!important;width:84px!important;min-width:84px!important;max-width:84px!important;height:52px!important;min-height:52px!important;}
}
@media(min-width:900px) and (max-width:1500px){
  html.tv-mode.cinento-live-mode #hero-section #list-mood .puzzle-piece,
  html.tv-mode.cinento-live-mode #hero-section #list-location .puzzle-piece,
  html.tv-mode.cinento-live-mode #hero-section #list-company .puzzle-piece,
  html.tv-mode.cinento-live-mode #hero-section #list-subject .puzzle-piece{flex-basis:86px!important;width:86px!important;min-width:86px!important;max-width:86px!important;height:50px!important;min-height:50px!important;}
}

/* v20260911.6 — complete bright-theme parity for the compositor-lite landing.
 * The performance patch above owns the final dark surfaces with !important;
 * these equally lightweight overrides deliberately come after it so Light mode
 * changes the whole interactive top path without restoring blur/glow layers. */
html.light-mode:not(.tv-mode) .universe-bg{
  background:
    radial-gradient(ellipse at 18% 8%,rgba(14,165,233,.10),transparent 46%),
    linear-gradient(180deg,#f8fcff 0%,#f3f8fb 66%,#eef4f7 100%)!important;
}
html.light-mode:not(.tv-mode) #topHeader{
  background:#ffffff!important;
  border-bottom-color:rgba(15,23,42,.10)!important;
  color:#0f172a!important;
}
html.light-mode:not(.tv-mode) #topHeader button,
html.light-mode:not(.tv-mode) #topHeader a,
html.light-mode:not(.tv-mode) #topHeader .header-guide-btn{
  color:#334155!important;
}
html.light-mode:not(.tv-mode) #topHeader button:not(.bg-cyan-600):not(.bg-cyan-500),
html.light-mode:not(.tv-mode) #topHeader .mobile-compact-btn,
html.light-mode:not(.tv-mode) #themeToggleBtn{
  background:rgba(15,23,42,.045)!important;
  border-color:rgba(15,23,42,.11)!important;
}
html.light-mode:not(.tv-mode) #topHeader button:hover,
html.light-mode:not(.tv-mode) #topHeader a:hover,
html.light-mode:not(.tv-mode) #themeToggleBtn:hover{
  background:rgba(8,145,178,.09)!important;
  border-color:rgba(8,145,178,.24)!important;
  color:#0e7490!important;
}
html.light-mode:not(.tv-mode) #hero-section{
  color:#0f172a!important;
}
html.light-mode:not(.tv-mode) #hero-section .cinento-choice-summary{
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(15,23,42,.10)!important;
  color:#0f172a!important;
}
html.light-mode:not(.tv-mode) #hero-section .cinento-choice-panel{
  background:rgba(248,251,253,.96)!important;
  border-color:rgba(15,23,42,.09)!important;
  color:#0f172a!important;
}
html.light-mode:not(.tv-mode) #hero-section .puzzle-piece{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#334155!important;
}
html.light-mode:not(.tv-mode) #hero-section .puzzle-piece:hover,
html.light-mode:not(.tv-mode) #hero-section .puzzle-piece:focus{
  background:#eaf8fb!important;
  border-color:rgba(8,145,178,.42)!important;
  color:#0e7490!important;
}
html.light-mode:not(.tv-mode) #hero-section .puzzle-piece.selected{
  background:#0891b2!important;
  border-color:#0e7490!important;
  color:#ffffff!important;
}
html.light-mode:not(.tv-mode) #hero-section .puzzle-slot{
  background:#ffffff!important;
  border-color:#cbd5e1!important;
  color:#64748b!important;
}
html.light-mode:not(.tv-mode) #hero-section .puzzle-slot.bg-cyan-900\/30,
html.light-mode:not(.tv-mode) #hero-section .puzzle-slot[class*="bg-cyan"]{
  background:#dff7fb!important;
  border-color:#0891b2!important;
  color:#0e7490!important;
}
html.light-mode:not(.tv-mode) #hero-section #btn-ignite:disabled{
  background:#e2e8f0!important;
  border-color:#cbd5e1!important;
  color:#64748b!important;
}
html.light-mode:not(.tv-mode) #hero-section #btn-ignite:not(:disabled){
  background:#0891b2!important;
  border-color:#0e7490!important;
  color:#ffffff!important;
}
html.light-mode:not(.tv-mode) #hero-section .hero-mini-btn,
html.light-mode:not(.tv-mode) #hero-section .cinento-format-controls > div,
html.light-mode:not(.tv-mode) #hero-section .cinento-format-controls select{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#334155!important;
}
html.light-mode:not(.tv-mode) #hero-section .cinento-hero-mode-switch .cinento-mode-switch{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#334155!important;
}
html.light-mode:not(.tv-mode) #hero-section .cinento-mode-switch a:not(.active){color:#475569!important;}
html.light-mode:not(.tv-mode) #hero-section .cinento-mode-switch a.active{
  background:#0e7490!important;
  color:#ffffff!important;
}
html.light-mode:not(.tv-mode) .mobile-bottom-nav{
  background:linear-gradient(to top,#ffffff,#f8fafc)!important;
  border-top-color:rgba(15,23,42,.10)!important;
  color:#334155!important;
}
html.light-mode:not(.tv-mode) .mobile-bottom-nav button{color:#475569!important;}
html.light-mode:not(.tv-mode) .mobile-bottom-nav button.active{
  background:rgba(8,145,178,.10)!important;
  border-color:rgba(8,145,178,.22)!important;
  color:#0e7490!important;
}
html.light-mode:not(.tv-mode) .scroll-fab{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#0e7490!important;
}

/* Android / Smart TV bright palette: keep the TV fast-mode geometry and zero
 * backdrop-filter policy, change only paint colors. */
html.tv-mode.light-mode .universe-bg{
  background:linear-gradient(180deg,#edf9fc 0%,#f7fbfd 58%,#eef4f7 100%)!important;
}
html.tv-mode.light-mode #topHeader{
  background:linear-gradient(180deg,#ffffff,#f1f5f9)!important;
  border-right-color:rgba(15,23,42,.12)!important;
  color:#0f172a!important;
}
html.tv-mode.light-mode #hero-section{color:#0f172a!important;}
html.tv-mode.light-mode #hero-section .cinento-choice-summary{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.11)!important;
  color:#0f172a!important;
}
html.tv-mode.light-mode #hero-section .cinento-choice-panel{
  background:#f8fbfd!important;
  border-color:rgba(15,23,42,.10)!important;
  color:#0f172a!important;
}
html.tv-mode.light-mode #hero-section .puzzle-piece{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#334155!important;
}
html.tv-mode.light-mode #hero-section .puzzle-piece:hover,
html.tv-mode.light-mode #hero-section .puzzle-piece:focus{
  background:#eaf8fb!important;
  border-color:rgba(8,145,178,.42)!important;
  color:#0e7490!important;
}
html.tv-mode.light-mode #hero-section .puzzle-piece.selected{
  background:#0891b2!important;
  border-color:#0e7490!important;
  color:#ffffff!important;
}
html.tv-mode.light-mode #hero-section .puzzle-slot{
  background:#ffffff!important;
  border-color:#cbd5e1!important;
  color:#64748b!important;
}
html.tv-mode.light-mode #hero-section #btn-ignite:disabled{
  background:#e2e8f0!important;
  border-color:#cbd5e1!important;
  color:#64748b!important;
}
html.tv-mode.light-mode #hero-section #btn-ignite:not(:disabled){
  background:#0891b2!important;
  color:#ffffff!important;
}
html.tv-mode.light-mode #hero-section .cinento-mode-switch,
html.tv-mode.light-mode #hero-section .hero-mini-btn,
html.tv-mode.light-mode #hero-section .cinento-format-controls > div,
html.tv-mode.light-mode #hero-section .cinento-format-controls select{
  background:#ffffff!important;
  border-color:rgba(15,23,42,.12)!important;
  color:#334155!important;
}
html.tv-mode.light-mode .mobile-bottom-nav{
  background:linear-gradient(to top,#ffffff,#f5f8fb)!important;
  border-top-color:rgba(15,23,42,.10)!important;
  color:#334155!important;
}

/* Live-specific top path: cinento-live.css already handles the lower landing;
 * these selectors cover the hero surfaces that the performance stylesheet owns. */
html.light-mode.cinento-live-mode #hero-section .text-gray-400,
html.light-mode.cinento-live-mode #hero-section .text-gray-500,
html.light-mode.cinento-live-mode #hero-section .text-gray-600{color:#526575!important;}
html.light-mode.cinento-live-mode #hero-section .hidden.md\:flex.text-gray-600{color:#94a3b8!important;}