/* CineREEL 44.17.1 — unified TV / 10-foot / device regression layer */

/* ---------- 10-foot foundations ---------- */
body.tv{
  --cr-tv-control:64px;
  --cr-tv-icon:31px;
  --cr-tv-icon-lg:36px;
  --cr-tv-card-w:minmax(360px,23vw);
  --cr-tv-gap:22px;
  --cr-tv-focus-ring:4px;
  --cr-tv-rail-w:92px;
  --cr-tv-page-x:max(78px,5.2vw);
  --cr-page-x:var(--cr-tv-page-x)!important;
  cursor:none;
  font-size:18px;
  overscroll-behavior:none;
}
body.tv.cr-tv-pointer-mode{cursor:auto}
body.tv *{scroll-behavior:auto!important}
body.tv .header{height:92px!important;padding:0 var(--cr-tv-page-x) 0 calc(var(--cr-tv-rail-w) + 30px)!important;gap:18px!important}
body.tv .brand{min-height:60px!important;gap:14px!important}
body.tv .brandmark-img{width:58px!important;height:58px!important}
body.tv .brand span{font-size:30px!important;letter-spacing:-.035em!important}
body.tv .header-right{gap:12px!important}
body.tv .header .navitem{height:var(--cr-tv-control)!important;min-height:var(--cr-tv-control)!important;padding:0 22px!important;border-radius:16px!important;gap:11px!important;font-size:17px!important}
body.tv .header .navitem svg{width:var(--cr-tv-icon)!important;height:var(--cr-tv-icon)!important;min-width:var(--cr-tv-icon)!important;min-height:var(--cr-tv-icon)!important}
body.tv .header .iconbtn{width:var(--cr-tv-control)!important;height:var(--cr-tv-control)!important;min-width:var(--cr-tv-control)!important;min-height:var(--cr-tv-control)!important;border-radius:16px!important}
body.tv .header .iconbtn svg{width:var(--cr-tv-icon)!important;height:var(--cr-tv-icon)!important}

/* TV rail */
body.tv .cr-tv-rail{width:var(--cr-tv-rail-w)!important;padding:108px 11px 24px!important;gap:12px!important;background:linear-gradient(90deg,rgba(5,6,7,.98),rgba(5,6,7,.86) 74%,transparent)!important}
body.tv .cr-tv-rail button{width:68px!important;height:68px!important;min-width:68px!important;min-height:68px!important;border-radius:17px!important}
body.tv .cr-tv-rail button svg{width:31px!important;height:31px!important;min-width:31px!important;min-height:31px!important}
body.tv .page,body.tv .cr-page,body.tv .feature-page{padding-left:calc(var(--cr-tv-rail-w) + 34px)!important;padding-right:var(--cr-tv-page-x)!important}

/* Hero / home rows */
body.tv .hero{height:min(82vh,900px)!important;min-height:650px!important}
body.tv .hero-copy{left:calc(var(--cr-tv-rail-w) + 38px)!important;bottom:13%!important;width:min(800px,48vw)!important;max-width:48vw!important}
body.tv .hero-title{font-size:clamp(58px,4.4vw,86px)!important;line-height:.96!important;letter-spacing:-.055em!important}
body.tv .hero-title-image{max-width:min(600px,38vw)!important;max-height:180px!important}
body.tv .hero-desc{max-width:720px!important;font-size:19px!important;line-height:1.52!important;-webkit-line-clamp:3!important}
body.tv .hero-copy .actions{gap:14px!important;margin-top:24px!important;flex-wrap:wrap!important}
body.tv .hero-copy .btn,body.tv .detail-copy .btn{min-height:62px!important;padding:0 22px!important;border-radius:15px!important;font-size:17px!important;gap:11px!important}
body.tv .hero-copy .btn.icon,body.tv .detail-copy .btn.icon{width:62px!important;min-width:62px!important;padding:0!important}
body.tv .hero-copy .btn svg,body.tv .detail-copy .btn svg{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important}
body.tv .section{margin-bottom:42px!important}
body.tv .section-title{font-size:31px!important;line-height:1.15!important;margin-bottom:18px!important}
body.tv .row-scroll{grid-auto-columns:var(--cr-tv-card-w)!important;gap:var(--cr-tv-gap)!important;padding-top:8px!important;padding-bottom:18px!important;scroll-padding-inline:18px!important}
body.tv .media-card{border-radius:16px!important;min-width:0!important}
body.tv .media-card .landscape{border-radius:15px!important;aspect-ratio:16/9!important}
body.tv .media-title{font-size:19px!important;margin-top:11px!important;line-height:1.25!important}
body.tv .media-sub{font-size:14px!important;margin-top:6px!important;gap:7px!important}
body.tv .media-sub svg{width:17px!important;height:17px!important}
body.tv .top10 .row-scroll{grid-auto-columns:minmax(220px,14vw)!important;gap:28px!important}
body.tv .top10 .media-title{font-size:17px!important}
body.tv .arrow{width:58px!important;height:86px!important;border-radius:17px!important}
body.tv .arrow svg{width:31px!important;height:31px!important}
/* A remote focus should not reveal desktop hover-action buttons inside cards. */
body.tv .cr412-card-hover,body.tv .media-card:focus .cr412-card-hover,body.tv .media-card:focus-visible .cr412-card-hover{display:none!important}

/* ---------- Focus / remote ---------- */
body.tv .media-card:focus,body.tv .media-card:focus-visible{outline:none!important;transform:scale(1.045)!important;z-index:25!important}
body.tv .media-card:focus .landscape,body.tv .media-card:focus-visible .landscape{border-color:#fff!important;box-shadow:0 0 0 4px #fff,0 0 0 8px var(--red),0 18px 48px #000b!important}
body.tv button:focus-visible,body.tv a:focus-visible,body.tv input:focus-visible,body.tv select:focus-visible,body.tv textarea:focus-visible,body.tv [role="button"]:focus-visible,body.tv [tabindex]:focus-visible{outline:none!important;box-shadow:0 0 0 3px #050607,0 0 0 7px #fff,0 0 0 11px var(--red)!important;z-index:40!important}
body.tv.cr-tv-pointer-mode button:focus:not(:focus-visible),body.tv.cr-tv-pointer-mode a:focus:not(:focus-visible),body.tv.cr-tv-pointer-mode [tabindex]:focus:not(:focus-visible){box-shadow:none!important}

/* ---------- Browse / Search ---------- */
body.tv .browse-menu{position:fixed!important;top:96px!important;right:var(--cr-tv-page-x)!important;width:min(720px,58vw)!important;max-height:calc(100vh - 128px)!important;border-radius:22px!important;padding:24px!important;overflow:auto!important;background:#0b0d10!important;border:1px solid #ffffff20!important;box-shadow:0 32px 90px #000c!important}
body.tv .browse-title{font-size:30px!important;margin-bottom:20px!important}
body.tv .browse-label{font-size:13px!important;letter-spacing:.14em!important;margin:20px 0 12px!important}
body.tv .browse-icons{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:14px!important}
body.tv .browse-icon{min-height:112px!important;border-radius:16px!important;padding:14px!important;font-size:15px!important;gap:10px!important}
body.tv .browse-icon .square{width:50px!important;height:50px!important;min-width:50px!important;min-height:50px!important;border-radius:13px!important}
body.tv .browse-icon .square svg{width:30px!important;height:30px!important}
body.tv .browse-personal{display:grid!important;grid-template-columns:1fr 1fr!important;gap:14px!important}
body.tv .personal,body.tv .adsrow{min-height:66px!important;font-size:16px!important;border-radius:14px!important}
body.tv .personal>svg,body.tv .adsrow>svg{width:29px!important;height:29px!important}
body.tv .search-shell{width:min(1320px,84vw)!important;padding-top:120px!important}
body.tv .search-heading{font-size:44px!important}
body.tv .search-input-wrap{height:72px!important;border-radius:18px!important}
body.tv #searchInput{font-size:23px!important}
body.tv .search-icon svg,body.tv .search-input-clear svg,body.tv .search-clear svg{width:30px!important;height:30px!important}

/* ---------- Preview / title / person ---------- */
body.tv .detail-hero{height:min(84vh,930px)!important;min-height:670px!important}
body.tv .detail-copy{left:calc(var(--cr-tv-rail-w) + 38px)!important;bottom:13%!important;width:min(830px,50vw)!important;max-width:50vw!important}
body.tv .detail-logo-title{font-size:clamp(58px,4.5vw,88px)!important;line-height:.96!important}
body.tv .detail-title-image{max-width:min(600px,39vw)!important;max-height:180px!important}
body.tv .detail-desc{font-size:19px!important;line-height:1.55!important;max-width:760px!important;-webkit-line-clamp:4!important}
body.tv .meta{font-size:16px!important;gap:10px!important}
body.tv .detail-back,body.tv .detail-home,body.tv .detail-mute,body.tv .to-top{width:64px!important;height:64px!important;min-width:64px!important;min-height:64px!important;max-width:64px!important;max-height:64px!important;border-radius:17px!important}
body.tv .detail-back svg,body.tv .detail-home svg,body.tv .detail-mute svg,body.tv .to-top svg{width:31px!important;height:31px!important}
body.tv .detail-back{left:calc(var(--cr-tv-rail-w) + 24px)!important;top:112px!important}
body.tv .detail-home{left:calc(var(--cr-tv-rail-w) + 100px)!important;top:112px!important}
body.tv .detail-mute{right:var(--cr-tv-page-x)!important;top:112px!important}
body.tv .detail-lower{padding:32px var(--cr-tv-page-x) 120px calc(var(--cr-tv-rail-w) + 38px)!important}
body.tv .detail-heading{font-size:32px!important;margin-bottom:20px!important}
body.tv .actor-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:16px!important}
body.tv .actor-card{min-height:102px!important;border-radius:16px!important;padding:14px!important;gap:13px!important}
body.tv .actor-avatar{width:72px!important;height:72px!important;min-width:72px!important;font-size:21px!important}
body.tv .actor-name{font-size:17px!important}body.tv .actor-role{font-size:13px!important}
body.tv .episode-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important}
body.tv .episode-card{min-height:152px!important;border-radius:16px!important}
body.tv .episode-title{font-size:18px!important}body.tv .episode-overview{font-size:14px!important;line-height:1.45!important}
body.tv .season-trigger,body.tv .season-option{min-height:58px!important;font-size:16px!important}

/* ---------- Native player, remote-first ---------- */
body.tv #cr37Player{--cr37-tv-control:64px}
body.tv #cr37Player .cr37-top{height:112px!important;padding:24px 42px!important;grid-template-columns:76px minmax(0,1fr) auto!important;gap:20px!important}
body.tv #cr37Player .cr37-back{width:64px!important;height:64px!important;min-width:64px!important;min-height:64px!important}
body.tv #cr37Player .cr37-back svg{width:32px!important;height:32px!important}
body.tv #cr37Player .cr37-title{font-size:22px!important}.tv #cr37Player .cr37-subtitle{font-size:15px!important}
body.tv #cr37Player .cr37-source-badge{height:58px!important;min-width:150px!important;padding:0 20px!important;font-size:15px!important}
body.tv #cr37Player .cr37-bottom{padding:0 42px 34px!important}
body.tv #cr37Player .cr37-meta{max-width:min(900px,62vw)!important;margin-bottom:18px!important}
body.tv #cr37Player .cr37-meta-title{font-size:27px!important}.tv #cr37Player .cr37-meta-line{font-size:15px!important}.tv #cr37Player .cr37-ep-title{font-size:19px!important}.tv #cr37Player .cr37-description{font-size:14px!important;max-width:800px!important}
body.tv #cr37Player .cr37-timeline-row{gap:18px!important;margin-bottom:14px!important}
body.tv #cr37Player .cr37-timeline{height:34px!important}.tv #cr37Player .cr37-track{height:7px!important}.tv #cr37Player .cr37-knob{width:19px!important;height:19px!important;opacity:1!important}
body.tv #cr37Player .cr37-time{font-size:14px!important;min-width:142px!important}
body.tv #cr37Player .cr37-controls{gap:9px!important;flex-wrap:wrap!important}
body.tv #cr37Player .cr37-btn{height:60px!important;min-width:60px!important;padding:0 15px!important;border-radius:14px!important;font-size:14px!important;gap:9px!important;background:#11151bcc!important;border-color:#ffffff18!important}
body.tv #cr37Player .cr37-btn svg{width:29px!important;height:29px!important}
body.tv #cr37Player .cr37-btn.small-label span{display:inline!important}
body.tv #cr37Player .cr37-volume input{width:118px!important}
body.tv #cr37Player .cr37-pop{right:42px!important;bottom:112px!important;width:min(440px,38vw)!important;max-height:66vh!important;padding:12px!important;border-radius:20px!important;background:#0c0f13!important;backdrop-filter:none!important}
body.tv #cr37Player .cr37-pop-title{font-size:12px!important;padding:11px!important}.tv #cr37Player .cr37-pop-option{min-height:62px!important;font-size:16px!important;border-radius:12px!important;padding:0 14px!important}
body.tv #cr37Player .cr37-drawer{width:min(820px,48vw)!important;background:#0b0e12!important;backdrop-filter:none!important}
body.tv #cr37Player .cr37-drawer-head{height:92px!important;padding:0 24px 0 30px!important}.tv #cr37Player .cr37-drawer-head h2{font-size:25px!important}.tv #cr37Player .cr37-drawer-close{width:58px!important;height:58px!important}
body.tv #cr37Player .cr37-drawer-body{padding:20px 20px 38px!important}.tv #cr37Player .cr37-episode-tools{grid-template-columns:210px minmax(0,1fr) 60px!important;gap:12px!important}.tv #cr37Player .cr37-episode-tools input,.tv #cr37Player .cr37-season-btn{height:58px!important;font-size:15px!important}
body.tv #cr37Player .cr37-episode-row{min-height:150px!important;grid-template-columns:220px minmax(0,1fr)!important;gap:16px!important;padding:12px!important;border-radius:15px!important}.tv #cr37Player .cr37-episode-thumb{width:220px!important}.tv #cr37Player .cr37-episode-title{font-size:18px!important}.tv #cr37Player .cr37-episode-overview{font-size:13px!important;line-height:1.45!important}.tv #cr37Player .cr37-episode-sub{font-size:12px!important}
body.tv #cr37Player .cr37-buffer{font-size:16px!important;padding:14px 20px!important;border-radius:14px!important;background:#090c11ee!important;backdrop-filter:none!important}
body.tv #cr37Player .cr37-toast{top:14%!important;font-size:15px!important;padding:13px 18px!important;border-radius:14px!important;backdrop-filter:none!important;background:#090c11ee!important}
body.tv #cr37Player .cr37-next{right:42px!important;bottom:118px!important;width:min(520px,38vw)!important;padding:20px!important;border-radius:18px!important;backdrop-filter:none!important}.tv #cr37Player .cr37-next-title{font-size:22px!important}.tv #cr37Player .cr37-next-sub{font-size:14px!important}.tv #cr37Player .cr37-next-actions button{height:56px!important;font-size:15px!important}

/* Embed player leaves room for CineREEL's own remote controls. */
body.tv #cr37Player.embed-mode .cr37-player-stage{top:104px!important;bottom:94px!important}
body.tv #cr37Player.embed-mode .cr37-top{height:104px!important;padding:0 40px!important}
body.tv #cr37Player.embed-mode .cr37-bottom{height:94px!important;padding:0 40px!important}
body.tv #cr37Player.embed-mode .cr37-pop{bottom:106px!important}
body.tv #cr37Player.embed-mode .cr37-drawer{top:104px!important;bottom:94px!important}

/* ---------- weak TV engines: less paint/compositing ---------- */
body.tv[data-cr-platform="tizen"] *,body.tv[data-cr-platform="webos"] *,body.tv[data-cr-platform="fire-tv"] *{animation-duration:.12s!important;transition-duration:.12s!important}
body.tv[data-cr-platform="tizen"] .header,body.tv[data-cr-platform="webos"] .header,body.tv[data-cr-platform="fire-tv"] .header,
body.tv[data-cr-platform="tizen"] .browse-menu,body.tv[data-cr-platform="webos"] .browse-menu,body.tv[data-cr-platform="fire-tv"] .browse-menu,
body.tv[data-cr-platform="tizen"] .cr37-pop,body.tv[data-cr-platform="webos"] .cr37-pop,body.tv[data-cr-platform="fire-tv"] .cr37-pop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.tv[data-cr-platform="tizen"] .media-card,body.tv[data-cr-platform="webos"] .media-card{will-change:auto!important}

/* ---------- compact TV CSS viewports (960×540 / 1280×720) ---------- */
@media (min-width:761px) and (max-width:1366px){
  body.tv{--cr-tv-control:54px;--cr-tv-icon:25px;--cr-tv-icon-lg:29px;--cr-tv-rail-w:74px;--cr-tv-page-x:max(42px,4vw);--cr-tv-card-w:minmax(270px,29vw);--cr-tv-gap:16px;font-size:15px}
  body.tv .header{height:76px!important;padding-left:calc(var(--cr-tv-rail-w) + 20px)!important}
  body.tv .brandmark-img{width:46px!important;height:46px!important}.tv .brand span{font-size:23px!important}
  body.tv .header .navitem{font-size:14px!important;padding-inline:15px!important;border-radius:13px!important}
  body.tv .cr-tv-rail{padding-top:86px!important}.tv .cr-tv-rail button{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important}.tv .cr-tv-rail button svg{width:25px!important;height:25px!important}
  body.tv .hero{height:88vh!important;min-height:500px!important}.tv .hero-copy{left:calc(var(--cr-tv-rail-w) + 26px)!important;width:min(650px,57vw)!important;max-width:57vw!important;bottom:12%!important}.tv .hero-title{font-size:clamp(42px,5vw,64px)!important}.tv .hero-desc{font-size:15px!important}.tv .hero-copy .btn,.tv .detail-copy .btn{min-height:52px!important;font-size:14px!important;padding-inline:16px!important}.tv .hero-copy .btn.icon,.tv .detail-copy .btn.icon{width:52px!important;min-width:52px!important}
  body.tv .section-title{font-size:25px!important}.tv .media-title{font-size:16px!important}.tv .media-sub{font-size:12px!important}.tv .top10 .row-scroll{grid-auto-columns:minmax(170px,17vw)!important}
  body.tv .browse-menu{top:82px!important;right:34px!important;width:min(570px,62vw)!important;max-height:calc(100vh - 100px)!important;padding:18px!important}.tv .browse-icon{min-height:88px!important;font-size:13px!important}.tv .browse-icon .square{width:42px!important;height:42px!important}.tv .browse-icon .square svg{width:24px!important;height:24px!important}
  body.tv .detail-hero{height:88vh!important;min-height:500px!important}.tv .detail-copy{left:calc(var(--cr-tv-rail-w) + 26px)!important;width:min(670px,58vw)!important;max-width:58vw!important;bottom:11%!important}.tv .detail-logo-title{font-size:clamp(44px,5vw,66px)!important}.tv .detail-desc{font-size:15px!important}.tv .detail-back,.tv .detail-home,.tv .detail-mute{width:54px!important;height:54px!important;min-width:54px!important;min-height:54px!important;max-width:54px!important;max-height:54px!important;top:90px!important}.tv .detail-back{left:calc(var(--cr-tv-rail-w) + 18px)!important}.tv .detail-home{left:calc(var(--cr-tv-rail-w) + 82px)!important}.tv .detail-back svg,.tv .detail-home svg,.tv .detail-mute svg{width:25px!important;height:25px!important}.tv .detail-heading{font-size:25px!important}.tv .actor-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.tv .actor-avatar{width:58px!important;height:58px!important;min-width:58px!important}.tv .actor-name{font-size:14px!important}
  body.tv #cr37Player .cr37-top{height:86px!important;padding:16px 28px!important;grid-template-columns:62px minmax(0,1fr) auto!important}.tv #cr37Player .cr37-back{width:54px!important;height:54px!important}.tv #cr37Player .cr37-source-badge{height:48px!important;min-width:120px!important;font-size:13px!important}.tv #cr37Player .cr37-bottom{padding:0 28px 22px!important}.tv #cr37Player .cr37-btn{height:50px!important;min-width:50px!important;font-size:12px!important;padding-inline:11px!important}.tv #cr37Player .cr37-btn svg{width:24px!important;height:24px!important}.tv #cr37Player .cr37-pop{right:28px!important;bottom:90px!important;width:min(380px,42vw)!important}.tv #cr37Player .cr37-pop-option{min-height:52px!important;font-size:14px!important}.tv #cr37Player .cr37-drawer{width:min(650px,55vw)!important}.tv #cr37Player .cr37-episode-row{min-height:118px!important;grid-template-columns:170px minmax(0,1fr)!important}.tv #cr37Player .cr37-episode-thumb{width:170px!important}
}

/* ---------- 4K 10-foot ---------- */
@media (min-width:2500px){
  body.tv{--cr-tv-control:84px;--cr-tv-icon:41px;--cr-tv-rail-w:122px;--cr-tv-card-w:minmax(540px,22vw);--cr-tv-gap:30px;--cr-tv-page-x:6vw;font-size:24px}
  body.tv .header{height:126px!important}.tv .brandmark-img{width:78px!important;height:78px!important}.tv .brand span{font-size:42px!important}.tv .header .navitem{font-size:23px!important;padding-inline:30px!important;border-radius:21px!important}.tv .cr-tv-rail{padding-top:146px!important}.tv .cr-tv-rail button{width:92px!important;height:92px!important}.tv .cr-tv-rail button svg{width:41px!important;height:41px!important}
  body.tv .hero{min-height:1120px!important}.tv .hero-title{font-size:112px!important}.tv .hero-desc{font-size:28px!important;max-width:1050px!important}.tv .hero-copy .btn,.tv .detail-copy .btn{min-height:84px!important;font-size:24px!important;border-radius:20px!important}.tv .section-title{font-size:44px!important}.tv .media-title{font-size:27px!important}.tv .media-sub{font-size:20px!important}
  body.tv .detail-hero{min-height:1120px!important}.tv .detail-logo-title{font-size:118px!important}.tv .detail-desc{font-size:28px!important;max-width:1100px!important}.tv .detail-heading{font-size:44px!important}.tv .actor-avatar{width:100px!important;height:100px!important;min-width:100px!important}.tv .actor-name{font-size:24px!important}
}

/* ---------- final phone/tablet collision guards ---------- */
html[data-cr-device-kind="mobile"] body:not(.tv) .header{max-width:100vw!important;overflow:visible!important}
html[data-cr-device-kind="mobile"] body:not(.tv) .header-right{display:flex!important;flex-wrap:nowrap!important;min-width:0!important}
html[data-cr-device-kind="mobile"] body:not(.tv) .browse-menu{max-width:calc(100vw - 20px)!important;left:10px!important;right:10px!important}
html[data-cr-device-kind="mobile"] body:not(.tv) .detail-copy>.actions{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:8px!important;max-width:100%!important}
html[data-cr-device-kind="mobile"] body:not(.tv) .detail-copy>.actions .btn{min-width:0!important;overflow:hidden!important}
html[data-cr-device-kind="tablet"] body:not(.tv) .header-right{min-width:0!important;flex-wrap:nowrap!important}
html[data-cr-device-kind="tablet"] body:not(.tv) .browse-menu{max-width:min(620px,72vw)!important}

/* ---------- final 10-foot density / icon fallback ---------- */
body.tv .page-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:24px 20px!important}
body.tv .page-grid .media-card svg{min-width:18px;min-height:18px}
body.tv .header button svg,body.tv .header a svg,body.tv .browse-menu button svg,body.tv .browse-menu a svg,body.tv .detail button svg,body.tv .detail a svg,body.tv #cr37Player button svg{flex:0 0 auto!important}
@media (min-width:761px) and (max-width:1100px){body.tv .page-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media (min-width:2500px){body.tv .page-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:34px 28px!important}}
.cr-tv-preview-loading{display:none}
body.tv .cr412-skeleton-detail{position:relative;min-height:100vh;background:#060708!important}
body.tv .cr-tv-preview-loading{display:block;position:fixed;left:50%;top:50%;z-index:25;transform:translate(-50%,-50%);padding:14px 20px;border:1px solid #ffffff20;border-radius:14px;background:#0b0e12;color:#e8ebf0;font-size:17px;font-weight:800;letter-spacing:.01em}


/* ============================================================
   CineREEL 44.17.1 — authoritative cross-device mode lock
   Device Lab phone/tablet profiles must never inherit TV surfaces, even if a
   legacy runtime temporarily toggles body.tv. This block is intentionally last.
   ============================================================ */
html[data-cr-device-kind="mobile"] body .cr-tv-rail,
html[data-cr-device-kind="tablet"] body .cr-tv-rail,
html[data-cr-device-kind="desktop"] body .cr-tv-rail{display:none!important}
html[data-cr-device-kind="tv"] body .cr-mobile-nav{display:none!important}

html[data-cr-device-kind="mobile"] body{
  --cr-header-h:64px!important;
  --cr-page-x:14px!important;
  padding-left:0!important;
  overflow-x:hidden!important;
}
html[data-cr-device-kind="mobile"] body .header{
  height:64px!important;
  min-height:64px!important;
  padding:8px max(12px,var(--cr-safe-right)) 8px max(12px,var(--cr-safe-left))!important;
  gap:6px!important;
}
html[data-cr-device-kind="mobile"] body .brand{
  min-width:0!important;
  flex:0 0 auto!important;
  margin-right:auto!important;
  gap:0!important;
}
html[data-cr-device-kind="mobile"] body .brandmark-img{width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}
html[data-cr-device-kind="mobile"] body .brand span{display:none!important}
html[data-cr-device-kind="mobile"] body .header-right{gap:2px!important;min-width:0!important;max-width:calc(100vw - 66px)!important;overflow:visible!important}
html[data-cr-device-kind="mobile"] body .header #homeBtn,
html[data-cr-device-kind="mobile"] body .header .browse-wrap,
html[data-cr-device-kind="mobile"] body .header #browseBtn,
html[data-cr-device-kind="mobile"] body .header .iconbtn{
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;max-width:40px!important;max-height:40px!important;flex:0 0 40px!important;padding:0!important;border-radius:12px!important;
}
html[data-cr-device-kind="mobile"] body .header #homeBtn>span,
html[data-cr-device-kind="mobile"] body .header #browseBtn>span,
html[data-cr-device-kind="mobile"] body .header #browseChevron{display:none!important}
html[data-cr-device-kind="mobile"] body .header svg{width:21px!important;height:21px!important;max-width:21px!important;max-height:21px!important}
html[data-cr-device-kind="mobile"] body .page,
html[data-cr-device-kind="mobile"] body .cr-page,
html[data-cr-device-kind="mobile"] body .feature-page{padding-left:14px!important;padding-right:14px!important;max-width:100vw!important}
html[data-cr-device-kind="mobile"] body .hero{min-height:640px!important;height:min(82svh,780px)!important}
html[data-cr-device-kind="mobile"] body .hero-copy{
  left:14px!important;right:14px!important;width:auto!important;max-width:calc(100vw - 28px)!important;bottom:11%!important;
}
html[data-cr-device-kind="mobile"] body .hero-title{font-size:clamp(32px,11vw,48px)!important;line-height:.96!important;max-width:88vw!important}
html[data-cr-device-kind="mobile"] body .hero-copy .actions{
  display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px!important;gap:8px!important;width:100%!important;max-width:100%!important;align-items:stretch!important;
}
html[data-cr-device-kind="mobile"] body .hero-copy .actions>.btn{
  position:relative!important;inset:auto!important;transform:none!important;min-width:0!important;max-width:100%!important;width:100%!important;height:48px!important;min-height:48px!important;margin:0!important;padding:0 9px!important;font-size:12px!important;line-height:1!important;white-space:nowrap!important;overflow:hidden!important;
}
html[data-cr-device-kind="mobile"] body .hero-copy .actions>.btn span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;min-width:0!important}
html[data-cr-device-kind="mobile"] body .hero-copy .actions>.cr412-hero-watch{width:48px!important;min-width:48px!important;max-width:48px!important;padding:0!important}
html[data-cr-device-kind="mobile"] body .hero-copy .actions>.cr412-hero-watch span{display:none!important}
html[data-cr-device-kind="mobile"] body .hero-pips{right:14px!important;left:auto!important;max-width:calc(100vw - 28px)!important}
html[data-cr-device-kind="mobile"] body .cr-mobile-nav{display:flex!important}

@media(max-width:380px){
  html[data-cr-device-kind="mobile"] body .header #homeBtn{display:none!important}
  html[data-cr-device-kind="mobile"] body .header-right{max-width:calc(100vw - 60px)!important}
  html[data-cr-device-kind="mobile"] body .hero-copy .actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px!important;gap:6px!important}
  html[data-cr-device-kind="mobile"] body .hero-copy .actions>.cr412-hero-watch{width:44px!important;min-width:44px!important;max-width:44px!important}
}

html[data-cr-device-kind="tablet"] body{
  padding-left:0!important;overflow-x:hidden!important;
}
html[data-cr-device-kind="tablet"] body .header,
html[data-cr-device-kind="tablet"] body .page,
html[data-cr-device-kind="tablet"] body .cr-page,
html[data-cr-device-kind="tablet"] body .feature-page{padding-left:max(24px,3vw)!important;padding-right:max(24px,3vw)!important}


/* CineREEL 44.20.2 — include Android TV in the low-paint engine tier. */
body.tv[data-cr-platform="android-tv"] *{animation-duration:.1s!important;transition-duration:.1s!important}
body.tv[data-cr-platform="android-tv"] .header,body.tv[data-cr-platform="android-tv"] .browse-menu,body.tv[data-cr-platform="android-tv"] .cr37-pop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
body.tv[data-cr-platform="android-tv"] .media-card{will-change:auto!important}

body.tv .cr412-skeleton-detail{background:transparent!important}


/* CineREEL 44.32.13 — TV Search compositor/IME recovery.
   Keep the search surface independently composited and visibly painted before
   Android/Google TV hands focus to its native on-screen keyboard. */
body.tv #searchOverlay.search-overlay:not(.hidden){
  display:block!important;
  position:fixed!important;
  inset:0!important;
  z-index:10000!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  overflow:auto!important;
  box-sizing:border-box!important;
  background:#050607!important;
  padding:48px var(--cr-tv-page-x,5.2vw)!important;
  contain:none!important;
}
body.tv #searchOverlay:not(.hidden) .search-shell{
  display:flex!important;
  position:relative!important;
  z-index:1!important;
  width:min(1320px,88vw)!important;
  height:auto!important;
  min-height:calc(100vh - 96px)!important;
  margin:0 auto!important;
  padding:28px 0 64px!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
  contain:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
body.tv #searchOverlay:not(.hidden) .search-head,
body.tv #searchOverlay:not(.hidden) .search-input-wrap{
  display:flex!important;
  opacity:1!important;
  visibility:visible!important;
  transform:none!important;
}
body.tv #searchOverlay:not(.hidden) .search-input-wrap{
  position:relative!important;
  z-index:2!important;
  background:#111419!important;
  border:2px solid rgba(255,255,255,.24)!important;
}
body.tv #searchOverlay:not(.hidden) #searchInput{
  display:block!important;
  opacity:1!important;
  visibility:visible!important;
  color:#fff!important;
  background:transparent!important;
}


/* ============================================================
   CineREEL 44.32.13 — TV Browse single-scroll-owner recovery
   The outer menu and .browse-body were both scroll containers.
   ============================================================ */
body.tv .browse-menu{
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  overscroll-behavior:none!important;
}
body.tv .browse-menu>.browse-title{
  flex:0 0 auto!important;
}
body.tv .browse-menu>.browse-body{
  flex:1 1 auto!important;
  min-height:0!important;
  max-height:none!important;
  overflow-x:hidden!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  -webkit-overflow-scrolling:touch!important;
}

/* CineREEL 44.32.13 — physical Android/Google TV IME viewport recovery.
   Do not bind Search to 100dvh: real TV keyboards can shrink/pan the visual
   viewport while the keyboard is open. The runtime captures the pre-IME CSS
   viewport in pixels so Search remains painted at a stable size. */
body.tv #searchOverlay.cr-tv-ime-stable.search-overlay:not(.hidden){
  width:var(--cr-tv-search-layout-width,100vw)!important;
  height:var(--cr-tv-search-layout-height,100vh)!important;
  min-height:var(--cr-tv-search-layout-height,100vh)!important;
  max-height:none!important;
  overflow:hidden!important;
}
body.tv #searchOverlay.cr-tv-ime-stable:not(.hidden) .search-shell{
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  overflow:hidden!important;
}
body.tv #searchOverlay.cr-tv-ime-stable:not(.hidden) #searchResults{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
}
/* Android/Google TV gets a normal document-layer Search surface instead of a
   full-screen fixed compositor layer. This avoids the real-device fixed-layer
   + native IME black-frame failure while keeping the same 10-foot UI. */
body.tv[data-cr-platform="android-tv"] #searchOverlay.cr-tv-ime-stable.search-overlay:not(.hidden),
body.tv[data-cr-platform="google-tv"] #searchOverlay.cr-tv-ime-stable.search-overlay:not(.hidden){
  position:absolute!important;
  inset:auto 0 auto 0!important;
  top:0!important;
  left:0!important;
  right:0!important;
  bottom:auto!important;
  transform:none!important;
  will-change:auto!important;
  isolation:auto!important;
}


/* CineREEL 44.32.13 player nav parity with Preview on 10-foot layouts. */
body.tv #cr37Player .cr37-top{grid-template-columns:auto minmax(0,1fr) auto!important}
body.tv #cr37Player .cr37-nav{gap:14px!important}
body.tv #cr37Player .cr37-nav>.cr37-nav-btn{width:auto!important;min-width:max-content!important;max-width:none!important;height:62px!important;min-height:62px!important;padding:0 22px!important;border-radius:15px!important;font-size:17px!important;gap:11px!important}
body.tv #cr37Player .cr37-nav>.cr37-nav-btn svg{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;flex-basis:28px!important}
