.tv-navigation :focus {
  outline: 4px solid #8edcff !important;
  outline-offset: 4px !important;
  scroll-margin: 100px 32px;
}
.tv-navigation:not(.tv-app) .fs-hls-player:focus-within .fs-hls-controls,
.tv-navigation:not(.tv-app) .fs-hls-player:focus-within .fs-hls-central-controls {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.tv-navigation .fs-hls-controls button { min-width: 48px; min-height: 48px; }
.tv-navigation .fs-hls-controls select { min-height: 44px; }
.tv-navigation .cinema-card:focus-within { z-index: 2; }
#player-switch .player-btn:disabled { opacity: .45; cursor: not-allowed; }
#player-switch { display: flex; flex-wrap: wrap; gap: 12px; }

/* The Android host fixes the viewport to 1280 CSS pixels on 720p/1080p/4K TVs. */
.tv-app { color-scheme: dark; scroll-behavior: auto !important; }
.tv-app body { font-size: 19px; }
.tv-app .cinema-skip-link { display: none !important; }
.tv-app :focus { outline: none !important; }
.tv-app :is(button,a,select,input,[role="button"]):focus {
  background-color: #f4f6f8 !important; color: #10151c !important;
  box-shadow: none !important; border-radius: 6px;
}
.tv-app :is(.video-card,.cinema-card,.watching-card,.saga-card):focus-within {
  transform: scale(1.025) !important; box-shadow: 0 8px 18px #0008 !important;
}
.tv-app :is(.video-card,.cinema-card,.watching-card,.saga-card):focus { background-color: #263442 !important; color: #fff !important; }
.tv-app *, .tv-app *::before, .tv-app *::after {
  scroll-behavior: auto !important; backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important; animation: none !important;
  transition: none !important;
}
.tv-app .cinema-home .site-header { min-height: 90px; padding-inline: 4%; gap: 24px; }
.tv-app .cinema-home .logo { width: 160px; }
.tv-app .cinema-home .filter-chip,
.tv-app .cinema-home .cinema-nav-link,
.tv-app .cinema-home .auth-open-btn { font-size: 18px; min-height: 48px; }
.tv-app .cinema-home .hero-slider { min-height: 550px; padding: 42px 6% 72px; }
.tv-app .cinema-home .hero-info { width: 57%; }
.tv-app .cinema-home .hero-info h2 { font-size: 52px; }
.tv-app .cinema-home .hero-info .meta { font-size: 17px; }
.tv-app .cinema-home .hero-info p.synopsis { font-size: 20px; line-height: 1.55; max-width: 560px; }
.tv-app .cinema-home .cinema-eyebrow { font-size: 14px; }
.tv-app .cinema-home .hero-info-btn,
.tv-app .cinema-home .cinema-catalogue-link { min-height: 54px; font-size: 19px; }
.tv-app .row-track { padding-block: 12px; }
.tv-app .cinema-home .section-title { font-size: 28px; }
.tv-app .cinema-home .row-header h3 { font-size: 24px; }
.tv-app button, .tv-app select { min-height: 44px; }
.tv-app ::-webkit-scrollbar { width: 0; height: 0; }

/* Android TV playback is a player-only screen, with no catalogue page chrome. */
.tv-app:has(.watch-page) { background: #000; overflow: hidden; }
.tv-app body.watch-page { margin: 0 !important; padding: 0 !important; overflow: hidden; background: #000 !important; }
.tv-app .watch-page > :not(.watch-main):not(.ad-gate-overlay):not([role="dialog"]),
.tv-app .watch-main > :not(.watch-stage),
.tv-app .watch-stage > :not(.watch-layout),
.tv-app .watch-layout > :not(.player-shell),
.tv-app .player-shell > :not(#player-container) { display: none !important; }
.tv-app .watch-page :is(.watch-main,.watch-stage,.watch-layout,.player-shell,#player-container) {
  position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important;
  max-width: none !important; max-height: none !important; min-height: 0 !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important;
  transform: none !important; box-shadow: none !important; background: #000 !important; display: block !important;
}
.tv-app #player-container :is(.fs-hls-player,iframe) { width: 100% !important; height: 100% !important; aspect-ratio: auto !important; border: 0 !important; border-radius: 0 !important; }
.tv-app #player-container video { object-fit: contain !important; }
/* Keep the loading indicator animated despite the TV motion simplifications. */
.tv-app .fs-hls-spinner { animation: fs-hls-spin .85s linear infinite !important; width: 38px; height: 38px; border: 3px solid #ffffff25; border-top-color: #36d6eb; border-radius: 50%; }
.tv-app .fs-hls-player.controls-hidden :is(.fs-hls-controls,.fs-hls-central-controls,.fs-hls-heading) { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
.tv-app .fs-hls-player:is(.is-loading,.has-brand-intro) :is(.fs-hls-controls,.fs-hls-central-controls,.fs-hls-heading,.fs-hls-center-play) { opacity: 0 !important; visibility: hidden !important; pointer-events: none !important; }
.tv-app .watch-page::before,.tv-app .watch-page::after,
.tv-app .player-shell::before,.tv-app .player-shell::after { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  .tv-app * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
