/* TV browsing: two complete rows; no layout or paint animations on focus. */
.tv[data-screen=section] main,.tv[data-screen=search] main{padding-top:18px}
.tv[data-screen=section] main>h1{font-size:26px;line-height:1.2;margin:0 0 14px}
.tv .catalog-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:8px;margin:0 0 22px;padding:0}
.tv .catalog-filters .select-trigger,.tv .catalog-filters .secondary{min-height:40px;height:40px;padding:8px 12px;font-size:13px;gap:7px}
.tv .catalog-filters .select-trigger>svg{width:16px;height:16px;flex-basis:16px}
.grid,.rail,.tv .grid,.tv .rail,.tv .rail[data-rows="2"]{gap:8px}
.tv .grid{overflow-anchor:none}
.card,.tv .card{border-radius:10px}
.card::before,.card::after{border-radius:inherit}
.card .poster{border-radius:8px 8px 0 0}
.rail[data-more=true]{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent calc(100% - 28px));mask-image:linear-gradient(90deg,#000 calc(100% - 56px),transparent calc(100% - 28px))}
.tv .section-heading{margin-bottom:12px}
.tv .section-heading h2{font-size:25px;line-height:1.2}
.tv :is(.grid,.rail) .card:not(.collection-card) .card-title{font-size:12px;line-height:1.25;min-height:32.5px;max-height:32.5px;margin:5px 0 2px;padding:0 7px}
.tv :is(.grid,.rail) .card:not(.collection-card) .card-meta{font-size:10px;line-height:1.3;min-height:19px;padding:0 7px 6px;white-space:nowrap}
.tv :is(.grid,.rail) .card:not(.collection-card) .poster{aspect-ratio:2/3;height:var(--tv-poster-height,auto)}
.tv :is(.grid,.rail) .score{top:5px;left:5px;font-size:10px;padding:3px 5px;gap:2px}
.tv :is(.grid,.rail) .score .icon{width:10px;height:10px;filter:none}
.tv :is(.grid,.rail) .score.quality{left:auto;right:5px;max-width:calc(100% - 45px);font-size:9px;padding:4px}
.tv :is(.grid,.rail) .card .badge{left:5px;bottom:5px;max-width:calc(100% - 10px);font-size:9px;padding:3px 5px}
/* The large surfaces never blur. Only a single translucent layer fades in. */
.tv main,.tv.nav-open main{filter:none;transition:none;isolation:isolate}
.tv main::before{content:"";position:fixed;inset:0 0 0 72px;background:#000;opacity:0;pointer-events:none;z-index:30;transition:opacity 160ms ease-out}
.tv.nav-open main::before{opacity:.34}
.tv #sidebar:not([hidden]){z-index:40;width:200px;transform:translateX(-128px);transition:transform 180ms ease-out}
.tv.nav-open #sidebar:not([hidden]){transform:translateX(0)}
/* Counter-translation keeps the icons and planet anchored while the edge opens. */
.tv #sidebar::before,.tv .nav-destinations,.tv .sidebar-brand,.tv:not(.nav-open) .sidebar-brand{transform:translateX(128px);transition:transform 180ms ease-out}
.tv.nav-open #sidebar::before,.tv.nav-open .nav-destinations,.tv.nav-open .sidebar-brand{transform:translateX(0)}
.tv .nav-item,.tv:not(.nav-open) .nav-item,.tv .nav-bottom{transition:none}
.tv .nav-item>span,.tv .sidebar-brand .brand-name{transition:opacity 160ms ease-out;transform:none}
.tv:not(.nav-open) .nav-item>span,.tv:not(.nav-open) .sidebar-brand .brand-name{transform:none}
:is(.nav-bottom,.watch-summary,.settings-group,.account-panel){backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.tv .nav-bottom{background:rgba(8,16,43,.92)}
/* Static halo textures fade on the compositor; no rotating gradient/shadow loop. */
.card::before,.card::after,:root[data-theme=dark] :is(.primary,.secondary)::after{animation:none!important;transition:opacity 160ms ease-out}
.card,.tv .card,:root[data-theme=dark] :is(.primary,.secondary,.icon-button,.search-form>button){transition:transform 160ms ease-out}
.card:is(:hover,:focus,:focus-visible,.is-focused),.tv .card:is(:hover,:focus,:focus-visible,.is-focused){transform:translateY(-3px)}
:root[data-theme=dark] :is(.primary,.secondary,.icon-button,.search-form>button):not(:disabled):is(:focus,:focus-visible,:hover){transform:translateY(-2px)}
.skeleton{animation:loading-opacity 1.1s ease-in-out infinite;background:var(--surface)}
@keyframes loading-opacity{50%{opacity:.5}}
@media(max-width:700px){.tv .catalog-filters{gap:6px}.tv .catalog-filters .select-trigger,.tv .catalog-filters .secondary{padding:7px 8px;font-size:12px}.tv .catalog-filters .select-trigger{gap:3px}.tv .catalog-filters .select-trigger>svg{width:13px;flex-basis:13px}}
@media(prefers-reduced-motion:reduce){.tv #sidebar,.tv #sidebar::before,.tv .nav-destinations,.tv .sidebar-brand,.tv main::before,.tv .nav-item>span,.tv .brand-name,.card,.tv .card,:root[data-theme=dark] :is(.primary,.secondary,.icon-button,.search-form>button){transition:none!important}.card:is(:hover,:focus,:focus-visible,.is-focused),.tv .card:is(:hover,:focus,:focus-visible,.is-focused){transform:none}}
