/* Zeelm TV: 10-foot layout for a remote control.
   Designed for the 960×540 CSS viewport of a 1080p Android TV WebView; sizes that
   matter use vw/vh so 4K or 720p boxes scale the same way. No hover-only UI,
   no blur, transform/opacity animations only (weak TV chips). */
.tv-clock{display:none}
body.tv{--tv-x:4.5vw;--tv-y:3.6vh;--tv-ring:#fff;cursor:none;scrollbar-width:none}
body.tv::-webkit-scrollbar,body.tv *::-webkit-scrollbar{display:none}
body.tv .hub-atmosphere,body.tv #mobile-nav,body.tv .skip,body.tv .ondemand-rail-btn,body.tv .ondemand-card-play,
body.tv .ondemand-favorite,body.tv .language,body.tv [data-shell="notifications"],body.tv .zf-home-tools{display:none!important}
body.tv *,body.tv *::before,body.tv *::after{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}

/* Safe area and header: only what makes sense on a TV. */
body.tv #header{padding-left:var(--tv-x)!important;padding-right:calc(var(--tv-x) + 9vw)!important;padding-top:calc(var(--tv-y) * .5)!important;padding-bottom:1vh!important;min-height:0!important;height:auto!important;background:linear-gradient(#05070c 78%,#05070c00)!important;box-shadow:none!important;border:0!important}
body.tv #header .brand img{width:max(22px,3vw)!important;height:auto!important}
body.tv #header .brand span{font-size:max(17px,2.3vw)!important}
body.tv .top-nav a[href="#home"],body.tv .top-nav a[href="#files"],body.tv .top-nav a[href="#pc"],body.tv .top-nav a[href="#admin"],
body.tv .top-nav a[href="#assistant"],body.tv .top-nav a[href="#minecraft"],body.tv .top-nav a[href="#personal"]{display:none!important}
body.tv .top-nav .nav-link{font-size:max(15px,1.7vw)!important;padding:.6vh 1.2vw!important;border-radius:999px}
body.tv #view{padding-bottom:var(--tv-y)}
body.tv.watching .tv-clock{display:none!important}
body.tv .tv-clock{display:block;position:fixed;z-index:60;top:calc(var(--tv-y) * .5 + 1.2vh);right:var(--tv-x);color:#e6e9ef;font-size:max(15px,1.8vw);font-weight:650;letter-spacing:.02em;font-variant-numeric:tabular-nums;pointer-events:none}

/* Zeelmflix on TV: tabs on top (no side column), content from edge to edge. */
body.tv.flix-browsing:not(.watching) #view .flix-layout{display:block!important;grid-template-columns:none!important;width:auto!important;max-width:none!important;margin:0!important;padding:1vh var(--tv-x) var(--tv-y)!important}
body.tv.flix-browsing:not(.watching) #view .flix-main{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;min-width:0}
body.tv.flix-browsing:not(.watching) #view .ondemand-sidebar{position:static!important;inset:auto!important;display:block!important;width:auto!important;height:auto!important;min-height:0!important;margin:0 0 2.4vh!important;padding:0!important;border:0!important;background:none!important;transform:none!important;box-shadow:none!important}
body.tv #view .zf-nav{position:static!important;inset:auto!important;display:flex!important;flex-direction:row!important;align-items:center;justify-content:space-between;gap:2vw;width:auto!important;height:auto!important;min-height:0!important;padding:0 0 .6vh!important;margin:0!important;background:none!important;border:0!important;border-bottom:1px solid #ffffff1f!important;box-shadow:none!important;transform:none!important}
body.tv #view .zf-nav .flix-nav-label{display:none!important}
body.tv #view .zf-tabs,body.tv #view .zf-side{display:flex!important;flex-direction:row!important;align-items:center;gap:.7vw;overflow:visible!important}
body.tv #view .zf-nav button{position:relative;display:inline-flex!important;flex-direction:row!important;align-items:center;gap:.6vw;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:1.1vh 1.7vw!important;border:0!important;border-radius:999px!important;background:none!important;color:#a9b2c1!important;font:inherit;font-size:max(14px,1.8vw)!important;font-weight:650;white-space:nowrap;box-shadow:none!important}
body.tv #view .zf-tabs button svg{display:none!important}
body.tv #view .zf-side button{font-size:max(12px,1.45vw)!important;border:1px solid #ffffff2a!important}
body.tv #view .zf-side button svg{display:block!important;width:max(12px,1.5vw);height:max(12px,1.5vw)}
body.tv #view .zf-nav button span{display:inline!important;opacity:1!important;font-size:inherit!important}
body.tv #view .zf-nav button.active{color:#fff!important}
body.tv #view .zf-tabs button i{display:block!important;position:absolute;left:1.7vw;right:1.7vw;bottom:-.7vh;height:3px;border-radius:3px;background:#fff;opacity:0;width:auto!important}
body.tv #view .zf-tabs button.active i{opacity:1}
body.tv #view .zf-side button.active{background:#ffffff26!important;color:#fff!important}
body.tv .flix-sort-button,body.tv .flix-sort-menu{display:none!important}
body.tv #view .flix-category-heading h1{font-size:max(26px,3.6vw)!important}

/* Focus: always obvious from the sofa. Native outlines are replaced by one style. */
body.tv :focus{outline:none!important}
body.tv .tv-focused{outline:3px solid var(--tv-ring)!important;outline-offset:3px!important;border-radius:10px}
body.tv .button.tv-focused,body.tv .nav-link.tv-focused,body.tv .zf-nav button.tv-focused,body.tv .season-tabs button.tv-focused,
body.tv .zf-see-all.tv-focused,body.tv .flix-feature-details.tv-focused,body.tv .ondemand-back.tv-focused,body.tv summary.tv-focused{
  background:#fff!important;color:#05070c!important;outline:none!important;box-shadow:0 8px 24px #0009!important}
body.tv .zf-nav button.tv-focused i{display:none!important}
body.tv .zf-tabs button{border-radius:999px!important}
body.tv .ondemand-card,body.tv .ondemand-card-poster,body.tv .zf-track-end,body.tv .ondemand-episode,body.tv .watch-history-open,body.tv .resume-card{transition:transform .16s ease-out,box-shadow .16s ease-out!important}
body.tv .ondemand-card:hover .ondemand-card-poster{transform:none;box-shadow:none}
body.tv .ondemand-card-poster.tv-focused,body.tv .zf-track-end.tv-focused,body.tv .ondemand-episode.tv-focused,
body.tv .watch-history-open.tv-focused,body.tv .resume-card.tv-focused,body.tv .home-resume-card.tv-focused{
  transform:scale(1.08)!important;outline:none!important;box-shadow:0 0 0 3px var(--tv-ring),0 14px 30px #000d!important;z-index:3;position:relative}
body.tv .zf-track-end.tv-focused{background:#fff!important;color:#05070c!important}
body.tv .ondemand-card:has(.tv-focused) .ondemand-card-caption button,body.tv .ondemand-card:has(.tv-focused)>p{color:#fff!important}
body.tv .zf-track{padding-top:18px!important;padding-bottom:24px!important;scroll-snap-type:none!important;cursor:default}
body.tv .zf-grid,body.tv .ondemand-section:not(.zf-row) .ondemand-grid{padding:12px 6px}

/* Bigger, readable text at three metres. */
body.tv .zf-row-head h2{font-size:max(17px,2.1vw)!important}
body.tv .ondemand-card-caption>button:first-child{font-size:max(12px,1.35vw)!important}
body.tv .ondemand-card>p{font-size:max(10px,1.1vw)!important}
body.tv .flix-feature-copy h1,body.tv .ondemand-suggestion h1{font-size:max(30px,4.2vw)!important}
body.tv .flix-feature-description{font-size:max(12px,1.4vw)!important;max-width:46vw}
body.tv .button,body.tv .flix-feature-details{min-height:max(36px,5.2vh);padding-inline:1.8vw!important;font-size:max(13px,1.5vw)!important}

/* On-screen keyboard: docked left, results stay visible on the right. */
body.tvk-open #view{margin-left:37vw!important}
body.tvk-open #header,body.tvk-open .tv-clock,body.tvk-open #view .ondemand-sidebar,body.tvk-open #view .ondemand-catalog-picker{display:none!important}
body.tvk-open #view .flix-layout{padding-top:var(--tv-y)!important}
.tvk{position:fixed;z-index:300;inset:0 auto 0 0;width:36vw;display:flex;flex-direction:column;gap:1.4vh;padding:var(--tv-y,3.6vh) 2vw var(--tv-y,3.6vh) var(--tv-x,4.5vw);
  background:#0b0d13;border-right:1px solid #ffffff1c;box-shadow:24px 0 60px #000c;color:#e8ecf3;font-family:inherit}
.tvk-head{display:grid;gap:.8vh}
.tvk-title{color:#97a2b6;font-size:max(12px,1.45vw);font-weight:600}
.tvk-value{display:block;min-height:6.4vh;padding:1vh 1vw;border-radius:10px;background:#ffffff12;border:1px solid #ffffff1f;font-size:max(18px,2.4vw);font-weight:650;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tvk-value::after{content:'';display:inline-block;width:2px;height:1em;margin-left:2px;vertical-align:-.15em;background:#7fb2ff;animation:tvk-caret 1s steps(1) infinite}
@keyframes tvk-caret{50%{opacity:0}}
.tvk-keys{display:grid;gap:.9vh}
.tvk-row{display:grid;grid-template-columns:repeat(7,1fr);gap:.55vw}
.tvk button{height:6.2vh;min-height:30px;padding:0;border:0;border-radius:9px;background:#ffffff14;color:#e8ecf3;font:inherit;font-size:max(15px,1.9vw);font-weight:650;transition:transform .12s ease-out,background .12s}
.tvk button.tv-focused{background:#fff!important;color:#05070c!important;transform:scale(1.1);outline:none!important;box-shadow:0 8px 20px #000c}
.tvk-actions{grid-template-columns:1fr 2fr 1fr}
.tvk-actions:last-child{grid-template-columns:1fr 1.6fr}
.tvk .tvk-space,.tvk .tvk-wide{font-size:max(12px,1.45vw)}
.tvk .tvk-done{background:#2f6bff;color:#fff;font-size:max(13px,1.6vw)}
.tvk .is-on{background:#ffffff40}
@media (prefers-reduced-motion:reduce){.tvk button,body.tv .ondemand-card-poster{transition:none!important}.tvk-value::after{animation:none}}