/* Website design draft, 26 Oct. APK assets remain unchanged until the user approves transfer. */
.tv{--sidebar-width:72px;--poster-columns:5}
.tv.nav-open{--sidebar-width:200px}
.tv #sidebar:not([hidden]){width:var(--sidebar-width);padding:16px 8px;overflow:hidden}
.tv main,.tv.nav-open main{margin-left:72px;padding:24px 28px 65vh;min-width:0}
.tv .sidebar-brand{min-height:40px;gap:8px;margin:0 8px 14px;white-space:nowrap;font-size:23px}
.tv .sidebar-brand .brand-mark{width:36px;height:36px;flex-shrink:0}
.tv:not(.nav-open) .sidebar-brand{justify-content:center;margin-left:0;margin-right:0}
.tv:not(.nav-open) .sidebar-brand .brand-name,.tv:not(.nav-open) .nav-item>span{display:none}
.tv .nav-destinations{gap:3px;padding:3px;overflow-x:hidden;overflow-y:auto}
.tv .nav-item{min-height:40px;height:40px;gap:10px;padding:8px 10px;font-size:15px;flex-shrink:0}
.tv .nav-item .icon{width:22px;height:22px;flex-shrink:0}
.tv:not(.nav-open) .nav-item{justify-content:center;padding:8px 0}
.nav-separator{height:1px;min-height:1px;flex-shrink:0;background:rgba(203,208,231,.24);margin:9px 8px}
.tv .nav-item:focus,.tv .nav-item:focus-visible{outline-width:2px;outline-offset:0}
.tv .page-navigation,.section-count{display:none}
.tv .rail:not(.collection-rail) .card,.tv.nav-open .rail:not(.collection-rail) .card{width:calc((100% - (var(--poster-columns) - 1)*14px)/var(--poster-columns));flex-basis:calc((100% - (var(--poster-columns) - 1)*14px)/var(--poster-columns))}
.tv .grid:not(.collection-grid),.tv.nav-open .grid:not(.collection-grid){grid-template-columns:repeat(var(--poster-columns),minmax(0,1fr))}
.tv .collection-rail .card,.tv.nav-open .collection-rail .card{width:calc((100% - 42px)/4);flex-basis:calc((100% - 42px)/4)}
.tv .collection-grid,.tv.nav-open .collection-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.card,.tv .card{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:0;border:0;border-radius:14px;background:var(--surface);overflow:hidden}
.card .poster{border-radius:14px 14px 0 0;width:100%;flex-shrink:0}
.rail,.tv .rail{padding:7px 7px 9px;margin-left:-7px;margin-right:-7px}
.tv .card:focus,.tv .card:focus-visible,.card:focus-visible{border:0;outline:3px solid var(--blue);outline-offset:3px;background:var(--octo-brand-soft);transform:none}
.card .card-title,.tv .card .card-title{font-size:14px;font-weight:700;line-height:1.35;margin:9px 0 4px;padding:0 10px;min-height:37.8px;max-height:37.8px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis}
.card .card-meta,.tv .card .card-meta{font-size:11px;line-height:1.4;min-height:calc(1.4em + 10px);padding:0 10px 10px;color:var(--muted);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.card .history-card-meta,.tv .card .history-card-meta{white-space:normal;min-height:2.8em;line-height:1.4}
.score.quality{left:auto;right:8px;max-width:calc(100% - 56px);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.badge{font-size:11px;line-height:1.4;padding:24px 8px 8px}
.collection-card--text,.tv .collection-card--text{padding:14px;border:1px solid var(--line)}
.collection-card--text .card-title,.tv .collection-card--text .card-title{padding:0}
.card:focus .quality{background:var(--octo-nav)}
@media(min-width:1200px){.tv{--poster-columns:6}}
@media(max-width:800px){.tv{--poster-columns:4}.tv main,.tv.nav-open main{padding-left:20px;padding-right:20px}.tv .collection-rail .card,.tv.nav-open .collection-rail .card{width:calc((100% - 28px)/3);flex-basis:calc((100% - 28px)/3)}.tv .collection-grid,.tv.nav-open .collection-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.tv{--poster-columns:3}.tv main,.tv.nav-open main{padding-left:16px;padding-right:16px}}
@media(max-height:600px){.tv #sidebar:not([hidden]){padding-top:12px;padding-bottom:12px}.tv .sidebar-brand{min-height:36px;margin-bottom:8px}.tv .nav-item{min-height:36px;height:36px;padding-top:6px;padding-bottom:6px}.tv .nav-destinations{gap:2px}.nav-separator{margin-top:7px;margin-bottom:7px}}
/* Compact navigation: the profile controls stay at the bottom. */
.tv .nav-destinations{display:flex;flex-direction:column;flex:1;min-height:0;overflow:hidden;gap:12px}
.tv .nav-primary{display:flex;flex-direction:column;gap:3px;min-height:0;overflow-y:auto;overflow-x:hidden;padding:2px;scrollbar-width:none}
.tv .nav-bottom{display:flex;flex-direction:column;gap:3px;margin-top:auto;flex-shrink:0;padding:2px}
.tv .nav-item{width:100%}
.tv[data-screen=home] main{padding-bottom:36px}
/* A shared grid scrolls both rows. Its final half-card fades at the edge. */
.rail,.tv .rail{display:grid;grid-auto-flow:column;grid-template-rows:auto;grid-auto-columns:var(--rail-card-width,180px);gap:14px;padding:2px 0 5px;margin:0;background:transparent;box-shadow:none;overflow-x:auto;overflow-y:hidden;align-items:stretch;scrollbar-width:none}
.rail[data-rows="2"]{grid-template-rows:repeat(2,auto);row-gap:20px}
.rail[data-more="true"]{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 64px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 64px),transparent)}
.tv .rail .card,.tv.nav-open .rail .card,.rail .card{width:100%;min-width:0;flex-basis:auto}
.card,.tv .card{position:relative;background:transparent;box-shadow:none;border:0}
.card .poster{border-radius:12px;background:transparent}
.tv .card:focus,.tv .card:focus-visible,.card:focus-visible,.card:hover{outline:none;background:transparent;box-shadow:none;transform:none;border:0}
.card:focus::after{content:"";position:absolute;inset:0;border:3px solid var(--blue);border-radius:inherit;pointer-events:none;z-index:5}
.card .card-title,.tv .card .card-title{padding:0 6px}
.card .card-meta,.tv .card .card-meta{padding-left:6px;padding-right:6px}
.card .badge{left:5px;right:auto;bottom:6px;max-width:calc(100% - 10px);padding:3px 5px;border-radius:4px;background:rgba(15,20,38,.78);white-space:nowrap;font-size:10px}
.collection-card .poster{aspect-ratio:16/9}
.collection-card .card-title,.tv .collection-card .card-title{min-height:19px;max-height:38px}
.home-refresh{display:flex;flex-direction:column;align-items:center;gap:8px;width:max-content;max-width:100%;margin:36px auto 8px;padding:14px 28px;color:var(--muted);cursor:pointer;border-radius:14px;text-align:center}
.home-refresh .icon{width:25px;height:25px;color:var(--blue)}
.home-refresh small{font-size:12px}
.home-refresh:focus-visible{outline:2px solid var(--blue);outline-offset:0}
.home-refresh[aria-busy=true] .icon{opacity:.4}
@media(max-height:600px){.tv .nav-destinations{gap:7px}.tv .sidebar-brand{margin-bottom:5px}.tv .nav-primary,.tv .nav-bottom{gap:1px}}
.tv .rail:not(.collection-rail) .card,.tv.nav-open .rail:not(.collection-rail) .card,.tv .collection-rail .card,.tv.nav-open .collection-rail .card{width:100%;flex-basis:auto}
.rail,.tv .rail{scroll-snap-type:none}
/* Third annotation pass: quiet card surfaces, softer continuation, menu priority. */
.tv .sidebar-brand,.tv:not(.nav-open) .sidebar-brand{margin:12px 0 0;min-height:36px;flex-shrink:0;justify-content:center;font-size:20px}
.tv .sidebar-brand .brand-mark{width:30px;height:30px}
.card,.tv .card,.tv .card:focus,.tv .card:focus-visible,.card:focus-visible,.card:hover{background:#fff;box-shadow:inset 0 0 0 1px rgba(52,60,96,.10)}
.card .poster{border-radius:12px 12px 0 0}
.rail[data-more="true"]{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 160px),rgba(0,0,0,.85) calc(100% - 110px),rgba(0,0,0,.4) calc(100% - 45px),transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 160px),rgba(0,0,0,.85) calc(100% - 110px),rgba(0,0,0,.4) calc(100% - 45px),transparent 100%)}
.score.quality--excellent,.card:focus .quality--excellent{background:#167347;color:#fff}
.score.quality--medium,.card:focus .quality--medium{background:#a94f08;color:#fff}
.score.quality--poor,.card:focus .quality--poor{background:#b52e36;color:#fff}
.tv main{transition:filter .16s ease}
.tv.nav-open main{filter:blur(1px)}
@media(prefers-reduced-motion:reduce){.tv main{transition:none}}

.tv.nav-open .sidebar-brand{justify-content:flex-start;padding-left:10px}
/* Strong, consistent pointer and remote feedback on action controls. */
:is(.primary,.secondary,.icon-button,.text-button,.chip):not(:disabled):hover,
:is(.primary,.secondary,.icon-button,.text-button,.chip):not(:disabled):focus,
.tv :is(.primary,.secondary,.icon-button,.text-button,.chip):not(:disabled):focus{outline:3px solid #202647;outline-offset:3px;box-shadow:0 0 0 3px #fff;transform:none}
.primary:not(:disabled):hover,.primary:not(:disabled):focus,.tv .primary:not(:disabled):focus{background:#303eb5;color:#fff}
:is(.secondary,.icon-button,.text-button,.chip):not(:disabled):hover,
:is(.secondary,.icon-button,.text-button,.chip):not(:disabled):focus,
.tv :is(.secondary,.icon-button,.text-button,.chip):not(:disabled):focus{background:#e5e8ff;color:#202647}
.description,.tv .description{color:#252b43;opacity:1}
.description.collapsed{-webkit-line-clamp:3}
.description:not(.collapsed){max-height:min(40vh,360px);overflow-y:auto;overscroll-behavior:contain;padding:10px 12px;background:#fff;border-radius:10px}
.description:focus{outline:2px solid var(--blue);outline-offset:3px}
.description-toggle{display:inline-flex;align-items:center;gap:8px;border-radius:8px;margin-top:4px}
.description-toggle .icon{width:19px;height:19px}
.description-toggle[aria-expanded=true] .icon{transform:rotate(180deg)}

/* Logo restored above navigation by user request. */
.tv .sidebar-brand,.tv:not(.nav-open) .sidebar-brand{margin:0 0 12px;min-height:36px}

/* Description unfolds directly on pointer/focus entry, without extra controls. */
.description:not(.collapsed){max-height:none;overflow:visible;scroll-margin-top:27px}
/* User-provided space artwork for both drawer widths. */
.tv #sidebar:not([hidden]){background:#050b23 url('sidebar-background.webp') center bottom/cover no-repeat}
/* A fixed artwork layer is revealed by the drawer, never resized with it. */
.tv #sidebar:not([hidden]){background:#050b23;isolation:isolate;transition:width .24s cubic-bezier(.2,.75,.3,1)}
.tv #sidebar::before{content:"";position:absolute;inset:0 auto 0 0;width:200px;background:url('sidebar-background.webp') center bottom/cover no-repeat;z-index:-1;pointer-events:none}
.tv .nav-destinations{width:184px;flex-shrink:0}
.tv .sidebar-brand,.tv:not(.nav-open) .sidebar-brand{width:184px;justify-content:flex-start;padding-left:10px}
.tv .nav-item,.tv:not(.nav-open) .nav-item{justify-content:flex-start;padding-left:10px;padding-right:10px;overflow:hidden;width:calc(var(--sidebar-width) - 30px);transition:width .24s cubic-bezier(.2,.75,.3,1)}
.tv .nav-item>span,.tv .sidebar-brand .brand-name{display:block;flex-shrink:0;white-space:nowrap;opacity:1;transform:translateX(0);transition:opacity .16s ease,transform .24s ease}
.tv:not(.nav-open) .nav-item>span,.tv:not(.nav-open) .sidebar-brand .brand-name{display:block;opacity:0;transform:translateX(-6px);pointer-events:none}
@media(prefers-reduced-motion:reduce){.tv #sidebar:not([hidden]),.tv .nav-item,.tv .nav-item>span,.tv .sidebar-brand .brand-name{transition:none}}