:root{color-scheme:dark;font-family:Inter,"Helvetica Neue",Arial,sans-serif;color:#f5f5f1;background:#141414;--red:#e50914;--muted:#a4a4a4;--pad:4.5vw}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:#2c2c2c;border-radius:4px;padding:11px 18px;font-weight:600;transition:background .18s,transform .18s}button:hover{background:#414141}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #fff;outline-offset:4px}button:disabled{opacity:.4;cursor:default}[hidden]{display:none!important}.topbar{height:80px;position:fixed;inset:0 0 auto;z-index:20;display:flex;align-items:center;gap:32px;padding:0 var(--pad);background:linear-gradient(#090909f5,#101010ed)}.brand{padding:0;background:none;color:var(--red);font-weight:900;font-size:29px;letter-spacing:-1.6px;transform:scaleY(1.15)}.brand:hover{background:none;color:#ff2630}nav{display:flex;align-items:center;gap:21px;white-space:nowrap}nav button{padding:8px 0;background:none;color:#c0c0c0;font-weight:400;font-size:13px}nav button:hover{background:none;color:white}nav button.selected{color:white;font-weight:700}.header-tools{display:flex;align-items:center;gap:14px;margin-left:auto}#search{display:flex;align-items:center;height:34px;border:1px solid #ffffff45;background:#10101090}#query{width:175px;padding:7px 0 7px 12px;outline:none;border:0;color:#fff;background:none;font-size:12px}#search button{font-size:25px;line-height:1;background:none;padding:0 9px;font-weight:400}.icon-button{background:none;padding:3px;font-size:21px;font-weight:400}.icon-button:hover{background:none;color:#ddd}main{position:fixed;inset:0;overflow:auto;scroll-behavior:smooth;scrollbar-color:#464646 #141414;scrollbar-width:thin}footer{position:fixed;inset:auto 0 0;height:27px;background:#101010;border-top:1px solid #242424;display:flex;justify-content:space-between;gap:20px;padding:7px var(--pad);font-size:9px;color:#777;letter-spacing:.3px}#status{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}footer>span:last-child{white-space:nowrap;letter-spacing:1px}.hero{position:relative;height:72vh;min-height:490px;max-height:790px;background:#1b1b1b;overflow:hidden}.hero>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.85}.hero>img:not([src]),.hero>img[src=""]{display:none}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#090909e8 0%,#10101098 35%,#10101010 80%),linear-gradient(0deg,#141414 0%,transparent 33%,#0004 100%)}.hero-copy{position:absolute;left:var(--pad);top:26%;max-width:51%;z-index:2}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2px;color:#b3b3b3}.hero-copy>.eyebrow{display:flex;align-items:center;gap:10px;color:#e4e4e4;font-size:11px;letter-spacing:3px}.mini-brand{font-weight:900;font-size:27px;letter-spacing:-2px;color:var(--red)}h1{margin:17px 0;font-size:48px;line-height:1.05;letter-spacing:-1.2px;font-weight:800}.hero h1{font-size:clamp(44px,5.7vw,88px);text-transform:uppercase;max-width:660px;line-height:.99;letter-spacing:-2px;text-shadow:0 4px 30px #0007}.hero-meta{font-size:12px;color:#d9d9d9;margin:20px 0 12px;font-weight:600}.hero-copy p{max-width:580px;font-size:15px;line-height:1.6;color:#e0e0e0;text-shadow:0 1px 8px #000;margin:14px 0 24px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.hero-actions{display:flex;gap:11px}.hero-actions button{display:flex;gap:12px;align-items:center;font-size:17px;padding:12px 27px}.primary-light{background:#f3f3f3;color:#141414}.primary-light:hover{background:#d8d8d8}.secondary-light{background:#6d6d6eb3;color:white}.secondary-light:hover{background:#6d6d6e80}.hero-corner{position:absolute;right:0;bottom:25%;padding:10px 45px 10px 15px;border-left:3px solid #ddd;background:#2228;color:#ddd;font-size:10px;letter-spacing:1.3px}.home-rows{position:relative;margin-top:-25px;padding-bottom:40px;z-index:3}.shelf{margin-bottom:32px}.shelf-heading{display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);margin-bottom:14px}.shelf-heading h2{font-size:20px;font-weight:650;margin:0;letter-spacing:-.3px}.shelf-tools{display:flex;align-items:center;gap:5px}.shelf-tools button{padding:5px 10px;background:transparent;color:#b5b5b5;font-size:12px}.shelf-tools button:hover{color:white;background:#ffffff0e}.rail{display:flex;gap:13px;padding:4px var(--pad) 12px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;scroll-snap-type:x proximity}.rail::-webkit-scrollbar{display:none}.rail .poster-wrap{flex:0 0 clamp(145px,13.6vw,216px);scroll-snap-align:start}.poster-wrap{min-width:0;position:relative}.poster-card{background:none;padding:0;text-align:left;width:100%;font-weight:400;display:block;transform-origin:center center}.poster-card:hover{background:none;transform:translateY(-5px)}.poster-card img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:5px;background:#252525;display:block;box-shadow:0 5px 18px #0004}.poster-card h3{font-size:12px;font-weight:550;line-height:1.45;margin:9px 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.poster-card p{font-size:10px;line-height:1.4;color:#929292;margin:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.page-section{padding:105px var(--pad) 40px}.section-heading{display:flex;gap:15px;align-items:center;justify-content:space-between;margin-bottom:18px}.section-heading h1{font-size:36px;margin:10px 0}.section-heading h2{font-size:20px;font-weight:600;line-height:1.4;margin:7px 0}.section-heading>span{font-size:12px;color:var(--muted)}#grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:25px 17px;margin-top:25px}#library-message,.loading-copy{color:#aaa;font-size:13px;line-height:1.6}.loading-copy{padding:10px var(--pad)}#more{display:block;margin:35px auto 0;min-width:170px;border:1px solid #626262;background:transparent}#more:hover{border-color:white}#library-source{color:#e3a4a7}.remove-save{position:absolute;right:7px;top:7px;background:#141414df;border:1px solid #ffffff66;border-radius:50%;width:29px;height:29px;display:grid;place-items:center;padding:0;font-size:18px}.back-button{position:absolute;top:99px;left:var(--pad);z-index:4;background:#161616bb;font-size:12px;border:1px solid #ffffff25;padding:8px 13px}.detail-heading{position:relative;min-height:440px;height:52vh;max-height:620px;background:#202020}.detail-heading{overflow:hidden}
.detail-heading>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;opacity:.65;transition:filter .4s,opacity .4s}
.detail-heading>img.portrait{filter:blur(18px) saturate(1.2);transform:scale(1.15);opacity:.5}
.trailer{position:absolute;inset:0;opacity:0;transition:opacity .9s ease;pointer-events:none;background:#000}
.trailer.playing{opacity:1}
.trailer iframe{position:absolute;top:50%;left:50%;width:max(100%,calc(62vh*16/9));aspect-ratio:16/9;height:auto;border:0;transform:translate(-50%,-50%) scale(1.18)}
.facts{font-size:13px;color:#d6d6d6;font-weight:600;margin:-6px 0 4px;white-space:pre}
.round{border-radius:50%;width:42px;height:42px;padding:0;display:grid;place-items:center;font-size:16px;border:1px solid #ffffff90;background:#14141480}
#trailer-sound{position:absolute;right:var(--pad);bottom:34px;z-index:3}
.info-grid{display:grid;grid-template-columns:max-content 1fr;gap:7px 22px;margin:22px var(--pad) 0;padding:18px 22px;background:#1b1b1b;border:1px solid #262626;border-radius:6px;font-size:12.5px;line-height:1.55}
.info-grid:empty{display:none}
.info-grid dt{color:#8f8f8f}
.info-grid dd{margin:0;color:#e2e2e2}
.segmented{display:flex;border:1px solid #666;border-radius:3px;overflow:hidden}
.segmented button{border-radius:0;background:#202020;padding:8px 14px;font-size:12px;font-weight:600}
.segmented button.selected{background:#f3f3f3;color:#141414}
.skip-button{position:absolute;right:28px;bottom:78px;z-index:3;background:#141414cc;border:1px solid #ffffffb0;color:#fff;font-size:14px;padding:11px 22px;backdrop-filter:blur(4px)}
.skip-button:hover{background:#f3f3f3;color:#141414}
.skip-button.subtle{opacity:.75;font-size:12px;padding:8px 15px;border-color:#ffffff55}
video::cue{background:#000000b8;color:#fff;font-size:1.05em;line-height:1.35}
.detail-shade{position:absolute;inset:0;background:linear-gradient(90deg,#141414ed 10%,#14141475 65%,#14141420),linear-gradient(0deg,#141414,transparent 55%)}.detail-copy{position:absolute;left:var(--pad);right:var(--pad);bottom:30px;max-width:65%;z-index:2}.detail-copy h1{font-size:clamp(28px,3.4vw,50px);line-height:1.1}.detail-copy p{font-size:13px;line-height:1.7;color:#ccc;max-width:750px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.detail-actions{display:flex;align-items:center;gap:10px;margin-top:18px}
.detail-actions #detail-play{border:0;background:#f3f3f3;color:#141414;font-size:14px;padding:11px 26px}
.detail-actions #detail-play:hover{background:#d8d8d8}.detail-actions button{font-size:12px;border:1px solid #777;background:#292929a0}#playback{padding-top:12px}.player-options{display:flex;gap:10px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}select{background:#202020;color:#eee;border:1px solid #666;border-radius:3px;padding:9px 12px;font-size:12px}#video-box{position:relative;background:#000;border:1px solid #303030;border-radius:5px;overflow:hidden;aspect-ratio:16/9;max-height:70vh;display:flex;align-items:center;justify-content:center}video{width:100%;height:100%;background:#000}#player-message{position:absolute;left:12%;right:12%;text-align:center;font-size:15px;line-height:1.8;color:#bbb;pointer-events:none}.player-actions{display:flex;gap:10px;margin:16px 0 36px}.player-actions button{font-size:12px}#play{min-width:100px}.error{color:#ff999e!important}#save.saved{border-color:#ddd}@media(min-width:1600px){#grid{grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}}@media(max-width:1100px){.topbar{gap:23px}nav{gap:14px}#query{width:120px}.header-tools{gap:10px}.hero-copy{max-width:62%;top:28%}.hero-copy p{font-size:13px}.hero-corner{display:none}.hero{min-height:480px}.detail-copy{max-width:80%}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
main{scroll-padding-top:94px}.rail{scroll-padding-inline:var(--pad)}#playback{scroll-margin-top:94px}

.episodes-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px}
.episodes-heading h2{font-size:24px;font-weight:700;margin:0}
.episode-pickers{display:flex;gap:10px}
.episode-pickers select{font-size:16px;font-weight:600;padding:9px 14px;background:#242424;border-color:#4d4d4d}
.episode-subhead{color:#bcbcbc;font-size:13px;margin:10px 0 14px}
.episode-subhead:empty{display:none}
.episode-list{display:flex;flex-direction:column;border-top:1px solid #404040}
.episode-row{display:grid;grid-template-columns:clamp(42px,5vw,72px) clamp(140px,17vw,250px) 1fr;align-items:center;min-height:120px;padding:16px 18px 16px 0;background:none;border-radius:0;border-bottom:1px solid #404040;text-align:left;font-weight:400}
.episode-row:hover{background:#ffffff08}
.episode-row.current{background:#333;border-radius:4px;border-bottom-color:transparent}
.ep-index{font-size:24px;color:#d2d2d2;text-align:center}
.ep-thumb{position:relative;aspect-ratio:16/9;border-radius:4px;overflow:hidden;background:#222}
.ep-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.ep-thumb.fallback img{filter:brightness(.55) saturate(.8)}
.ep-play{position:absolute;inset:0;margin:auto;width:42px;height:42px;border-radius:50%;border:1px solid #fff;background:#1e1e1eb3;display:grid;place-items:center;font-size:14px;padding-left:3px;opacity:0;transition:opacity .18s}
.episode-row:hover .ep-play,.episode-row:focus-visible .ep-play{opacity:1}
.ep-progress{position:absolute;left:8px;right:8px;bottom:8px;height:4px;background:#ffffff59;border-radius:1px;overflow:hidden}
.ep-progress i{display:block;height:100%;background:var(--red)}
.ep-body{display:flex;flex-direction:column;gap:8px;padding-left:20px;min-width:0}
.ep-head{display:flex;justify-content:space-between;gap:16px;font-size:16px}
.ep-head strong{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ep-head span{flex-shrink:0;color:#d2d2d2}
.ep-synopsis{font-size:14px;line-height:1.45;color:#bcbcbc;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.ep-synopsis:empty{display:none}
.hero .trailer iframe{width:max(100%,calc(79vh*16/9))}
.hero-sound{position:absolute;right:var(--pad);bottom:calc(25% + 56px);z-index:3}
.poster-card{position:relative}
.rating-badge{position:absolute;top:7px;left:7px;background:#141414d9;border:1px solid #ffffff38;border-radius:4px;padding:3px 7px;font-size:11px;font-weight:700;color:#f5c518;letter-spacing:.2px}
.big-play{position:absolute;z-index:2;width:88px;height:88px;border-radius:50%;border:2px solid #fff;background:#141414b3;font-size:32px;padding:0 0 0 6px;display:grid;place-items:center;transition:transform .15s,background .15s}
.big-play:hover{background:#f3f3f3;color:#141414;transform:scale(1.06)}
#video-box.idle video{cursor:pointer}
#video-box.idle #player-message{transform:translateY(84px)}
#video-box video{cursor:pointer}
#video-box:fullscreen{max-height:none;border:0;border-radius:0}
.card-art{position:relative;display:block}
.card-progress{position:absolute;left:0;right:0;bottom:0;height:4px;background:#ffffff4d;border-radius:0 0 5px 5px;overflow:hidden}
.card-progress i{display:block;height:100%;background:var(--red)}
.watched-badge{position:absolute;left:7px;bottom:7px;background:#141414d9;border:1px solid #ffffff38;border-radius:4px;padding:3px 7px;font-size:11px;font-weight:700}
.detail-progress{display:flex;align-items:center;gap:12px;margin:12px 0 2px;font-size:13px;color:#d6d6d6}
.detail-progress .bar{width:min(260px,40%);height:4px;background:#ffffff4d;border-radius:2px;overflow:hidden}
.detail-progress i{display:block;height:100%;background:var(--red)}
.poster-wrap .remove-save{opacity:0;transition:opacity .15s}
.poster-wrap:hover .remove-save,.poster-wrap .remove-save:focus-visible{opacity:1}

.title-logo{display:block;max-width:min(460px,42vw);max-height:150px;object-fit:contain;object-position:left bottom;margin:18px 0 14px;filter:drop-shadow(0 3px 18px #000a)}
.hero .title-logo{max-height:190px;max-width:min(560px,46vw)}
h1.logo-shown{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
.hover-card{position:fixed;z-index:40;background:#181818;border-radius:6px;overflow:hidden;box-shadow:0 14px 40px #000c;opacity:.4;transform-origin:center;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .2s ease;will-change:transform}
.hover-card.open{transform:none!important;opacity:1}
.hover-media{position:relative;aspect-ratio:16/9;background:#000;cursor:pointer;overflow:hidden}
.hover-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hover-media .trailer iframe{width:100%;transform:translate(-50%,-50%) scale(1.22)}
.hover-logo{position:absolute;left:50%;bottom:16%;transform:translateX(-50%);max-width:72%;max-height:42%;object-fit:contain;filter:drop-shadow(0 2px 12px #000c);transition:all .5s ease;pointer-events:none}
.hover-card.trailer-on .hover-logo{left:14px;bottom:12px;transform:none;max-width:38%;max-height:26%}
.hover-name{position:absolute;left:14px;right:14px;bottom:12px;font-size:20px;font-weight:800;text-shadow:0 2px 10px #000;pointer-events:none}
.hover-name[hidden]{display:none}
.hover-media .round{position:absolute;right:12px;bottom:12px;width:34px;height:34px;font-size:13px;z-index:2}
.hover-body{padding:14px 16px 16px}
.hover-actions{display:flex;gap:8px;align-items:center;margin-bottom:12px}
.circle{width:38px;height:38px;border-radius:50%;padding:0;display:grid;place-items:center;border:2px solid #ffffff99;background:#2a2a2ae6;font-size:15px;line-height:1}
.circle:hover{border-color:#fff;background:#3a3a3a}
.circle.primary{background:#fff;color:#141414;border-color:#fff}
.circle.primary:hover{background:#d8d8d8}
.circle.more{margin-left:auto}
.circle.active{border-color:#fff;background:#fff3}
.hover-line{font-size:14px;font-weight:600;margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hover-facts{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:#d2d2d2}
.hover-facts .star{color:#f5c518;font-weight:700}
.hover-facts .badge{border:1px solid #ffffff73;padding:0 5px;border-radius:3px;font-size:11px}
.hover-extra{font-size:13px;color:#d2d2d2}
.hover-progress{display:flex;align-items:center;gap:12px}
.hover-progress>span:first-child{flex:1;height:3px;background:#ffffff4d;overflow:hidden}
.hover-progress>span:first-child i{display:block;height:100%;background:var(--red)}
@media(prefers-reduced-motion:reduce){.hover-card{transition:opacity .1s}}
.detail-copy .title-logo{max-height:105px;max-width:min(400px,40vw);margin:10px 0 12px}
.detail-copy p{-webkit-line-clamp:3}
.back-button{z-index:5}

.launch{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;background:radial-gradient(ellipse at center,#1a0a0b 0%,#0b0b0b 62%);transition:opacity .6s ease,visibility .6s}
.launch.done{opacity:0;visibility:hidden}
.launch-brand{position:relative;color:var(--red);font-weight:900;font-size:clamp(52px,7vw,96px);letter-spacing:-4px;transform:scaleY(1.15);text-shadow:0 0 50px #e5091440;overflow:hidden;animation:launch-in .9s cubic-bezier(.2,.8,.2,1) both}
.launch-brand::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,#ffffff55 50%,transparent 70%);transform:translateX(-120%);animation:launch-shine 2.2s ease-in-out .6s infinite;mix-blend-mode:overlay}
.launch.done .launch-brand{transform:scaleY(1.15) scale(1.12);transition:transform .6s ease}
.launch-bar{width:min(260px,50vw);height:3px;background:#ffffff1f;border-radius:2px;overflow:hidden}
.launch-bar i{display:block;width:4%;height:100%;background:var(--red);box-shadow:0 0 12px var(--red);transition:width .5s ease}
#launch-step{margin:0;font-size:12px;letter-spacing:1.2px;color:#8d8d8d;text-transform:uppercase;min-height:16px}
@keyframes launch-in{from{opacity:0;letter-spacing:6px}to{opacity:1;letter-spacing:-4px}}
@keyframes launch-shine{to{transform:translateX(120%)}}
@media(prefers-reduced-motion:reduce){.launch-brand,.launch-brand::after{animation:none}}

.icon{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.icon.fill{fill:currentColor;stroke:none}
.circle .icon{width:18px;height:18px}
.circle.primary .icon{width:17px;height:17px;margin-left:2px}
.round .icon{width:18px;height:18px}
.hover-media .round .icon{width:15px;height:15px}
.trailer-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
.circle{border-width:1.5px;transition:border-color .15s,background .15s,transform .15s}
.circle:hover{transform:scale(1.06)}

.up-next{position:absolute;right:28px;bottom:78px;z-index:4;display:flex;gap:12px}
.up-next button{border-radius:6px;font-size:15px;font-weight:700;padding:11px 22px;height:46px}
.credits-button{background:#6d6d6eb3;color:#fff;backdrop-filter:blur(4px)}
.credits-button:hover{background:#6d6d6ee6}
.next-button{position:relative;overflow:hidden;background:#fff;color:#141414;min-width:170px}
.next-button:hover{background:#fff}
.next-button.counting{background:#9a9a9a}
.next-fill{position:absolute;inset:0;width:0;background:#fff;border-radius:inherit}
.next-button.counting .next-fill{animation:next-fill 5s linear forwards}
.next-label{position:relative;display:flex;align-items:center;justify-content:center;gap:10px}
.next-label .icon{width:18px;height:18px}
@keyframes next-fill{from{width:0}to{width:100%}}
@media(prefers-reduced-motion:reduce){.next-button.counting .next-fill{animation-duration:5s}}
.hero:not(.ready) .hero-copy,.hero:not(.ready) .hero-corner,.hero:not(.ready)>img{visibility:hidden}
.hero.empty{height:110px;min-height:0}

/* The title area grows with its content instead of overlapping the back button. */
.detail-heading{height:auto;min-height:max(440px,52vh);max-height:none;display:flex;align-items:flex-end;padding:168px 0 30px}
.detail-copy{position:relative;left:auto;right:auto;bottom:auto;margin:0 var(--pad)}
.detail-actions button{white-space:nowrap}
.detail-progress .text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:min(520px,50vw)}

.spinner{position:absolute;z-index:2;width:58px;height:58px;border-radius:50%;border:4px solid #ffffff33;border-top-color:var(--red);animation:spin .8s linear infinite;pointer-events:none}
@keyframes spin{to{transform:rotate(360deg)}}
/* Title page loading: the heading is covered until its artwork and logo are ready. */
.detail-heading.loading .detail-copy,.detail-heading.loading>img,.detail-heading.loading .trailer{visibility:hidden}
.detail-heading::after{content:'';position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;border:4px solid #ffffff26;border-top-color:var(--red);animation:spin .8s linear infinite;opacity:0;transition:opacity .2s;pointer-events:none;z-index:3}
.detail-heading.loading::after{opacity:1}
.detail-heading:not(.loading) .detail-copy{animation:fade-in .35s ease}
@keyframes fade-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.spinner,.detail-heading::after{animation-duration:2s}}

.settings-button{position:absolute;top:14px;right:14px;z-index:5;width:42px;height:42px;border-radius:50%;padding:0;display:grid;place-items:center;background:#141414b3;border:1px solid #ffffff40;opacity:0;transition:opacity .2s,background .15s}
.settings-button .icon{width:22px;height:22px}
#video-box.active .settings-button,#video-box.settings-open .settings-button,.settings-button:focus-visible{opacity:1}
#video-box:fullscreen:not(.active):not(.settings-open),#video-box:fullscreen:not(.active):not(.settings-open) video{cursor:none}
.settings-button:hover{background:#2a2a2ae6}
.settings-panel{position:absolute;top:64px;right:14px;z-index:6;display:flex;gap:6px;max-width:calc(100% - 28px);max-height:calc(100% - 140px);padding:14px 10px;background:#181818f2;border:1px solid #ffffff1f;border-radius:8px;box-shadow:0 14px 40px #000b;backdrop-filter:blur(6px)}
.settings-column{display:flex;flex-direction:column;min-width:150px;max-height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#555 transparent;padding:0 4px}
.settings-column+.settings-column{border-left:1px solid #ffffff14;padding-left:10px}
.settings-column h4{margin:0 0 8px 34px;font-size:15px;font-weight:700}
.settings-option{display:flex;align-items:center;gap:8px;background:none;border-radius:4px;padding:7px 10px 7px 4px;font-size:14px;font-weight:400;color:#bcbcbc;text-align:left;white-space:nowrap}
.settings-option:hover{background:#ffffff12;color:#fff}
.settings-option.selected{color:#fff;font-weight:600}
.settings-option .tick{width:22px;display:grid;place-items:center}
.settings-option .tick .icon{width:16px;height:16px}
.settings-option small{color:#8c8c8c;font-size:11px;margin-left:auto;padding-left:10px}

/* The player spans the page width; its height fits the window, with the video letterboxed inside. */
#video-box{width:100%;aspect-ratio:auto;height:min(51.2vw,calc(100vh - 150px));max-height:none}
#video-box video{object-fit:contain}
#video-box:fullscreen{height:100%;width:100%}
.player-corner{position:absolute;top:14px;right:14px;z-index:5;display:flex;gap:10px}
.player-corner .settings-button{position:static}
.settings-panel{top:66px}

.cast-panel{min-width:260px}
.casting{position:absolute;inset:0;z-index:4;display:grid;place-items:center;background:radial-gradient(ellipse at center,#1d1d1df2,#0b0b0bfa)}
#video-box.is-casting video{visibility:hidden}
.casting-copy{text-align:center;max-width:520px;padding:20px}
.casting-copy h3{font-size:26px;margin:6px 0 4px}
.casting-copy p{color:#bcbcbc;margin:0 0 18px;font-size:14px}
.casting-progress{display:flex;align-items:center;gap:12px;margin:0 auto 20px;width:min(420px,80%)}
.casting-progress span{flex:1;height:4px;background:#ffffff33;border-radius:2px;overflow:hidden}
.casting-progress i{display:block;height:100%;width:0;background:var(--red);transition:width .5s}
.casting-progress small{color:#d0d0d0;font-size:12px;white-space:nowrap}
.casting-actions{display:flex;align-items:center;justify-content:center;gap:12px}
.casting-actions .circle{width:46px;height:46px}
.cast-stop{margin-left:10px;border:1px solid #ffffff66;background:#ffffff14;border-radius:4px}
.casting-note{margin-top:16px!important;color:#ffb4b8!important;font-size:13px}
.casting-note:empty{display:none}
.play-anyway{position:absolute;z-index:3;top:calc(50% + 70px);border:1px solid #ffffff66;background:#141414cc;font-size:13px}
#video-box.idle .play-anyway{top:calc(50% + 120px)}

/* Page loading screen between pages: covers the content area (the top bar stays). */
.page-loader{position:fixed;inset:80px 0 27px;z-index:15;display:grid;place-items:center;background:#141414;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
.page-loader.on{opacity:1;visibility:visible}
main>section{transition:opacity .3s ease}
main.page-loading>section{opacity:0;transition:none}
/* Accounts and profiles */
.gate{position:fixed;inset:0;z-index:60;overflow:auto;display:flex;flex-direction:column;align-items:center;justify-content:safe center;padding:90px 20px 40px;background:#141414}
.gate-logo{position:fixed;top:24px;left:var(--pad);color:var(--red);font-weight:900;font-size:29px;letter-spacing:-1.6px;transform:scaleY(1.15)}
body.gated .topbar,body.gated main,body.gated footer{visibility:hidden}
.gate h1{font-size:32px;font-weight:600;letter-spacing:-.4px;margin:0 0 22px;line-height:1.2}
.gate-card{position:relative;width:min(440px,100%);background:#000000bf;border-radius:6px;padding:48px 52px 40px;display:flex;flex-direction:column;gap:14px}.gate-card.wide{width:min(620px,100%)}
.gate-card h1{margin-bottom:8px}
.gate input:not([type=checkbox]){width:100%;background:#16161690;border:1px solid #ffffff4d;border-radius:4px;padding:15px 16px;color:#fff;font-size:15px;outline:none}
.gate input:focus{border-color:#fff}
.gate-primary{background:var(--red);color:#fff;font-size:15px;padding:12px 18px}.gate-primary:hover{background:#c11119}.gate-primary.narrow{min-width:120px}
.gate-outline{background:transparent;border:1px solid #808080;color:#aaa;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;font-size:13px;padding:10px 24px}.gate-outline:hover{background:transparent;border-color:#fff;color:#fff}.gate-outline.small{text-transform:none;letter-spacing:0;padding:7px 14px}
.gate-outline.danger:hover,.danger-fill{border-color:var(--red);color:#fff}.danger-fill{background:var(--red)}
.gate-link{background:none;padding:0;color:#b3b3b3;font-weight:400;font-size:14px;align-self:center}.gate-link:hover{background:none;color:#fff;text-decoration:underline}.gate-link.strong{color:#fff;font-weight:600}
.gate-switch{color:#8c8c8c;margin:10px 0 0;font-size:15px}.gate-switch .gate-link{display:inline;font-size:15px}
.gate-note{color:#b3b3b3;font-size:14px;line-height:1.55;margin:0}.gate-note.small{font-size:12px}
.gate-server{color:#737373;font-size:12px;margin:18px 0 0}.gate-server .gate-link{font-size:12px;display:inline}
.gate-error{color:#ff8a8f;font-size:13px;margin:0;min-height:0}.gate-error:empty{display:none}.gate-ok{color:#5fd47c;font-size:13px}.gate-warn{color:#f5b81a;font-size:13px}
.gate-banner{background:#2fa84f26;border:1px solid #2fa84f80;color:#d7f5df;border-radius:4px;padding:10px 16px;font-size:14px;margin:0 0 30px;text-align:center}
.gate-close{position:absolute;top:14px;right:14px;background:none;font-size:20px;padding:4px 10px;color:#aaa}.gate-close:hover{background:none;color:#fff}
.profiles{display:flex;flex-direction:column;align-items:center;text-align:center}.profiles h1{font-size:clamp(34px,3.6vw,56px);font-weight:500;margin-bottom:34px}
.profile-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:2vw;margin-bottom:56px;max-width:1100px}
.profile-tile{position:relative;background:none;padding:0;display:flex;flex-direction:column;align-items:center;gap:14px;width:clamp(100px,10vw,170px);font-weight:400}.profile-tile:hover{background:none}
.profile-tile .avatar{width:100%;aspect-ratio:1;border:3px solid transparent;border-radius:6px;transition:border-color .15s}.profile-tile:hover .avatar,.profile-tile:focus-visible .avatar{border-color:#fff}
.profile-tile .profile-name{color:#808080;font-size:clamp(13px,1.15vw,18px);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-tile:hover .profile-name{color:#fff}
.profile-lock{position:absolute;bottom:-26px;color:#808080}.profile-lock .icon{width:18px;height:18px}
.avatar{position:relative;display:block;overflow:hidden;border-radius:4px}.avatar svg{display:block;width:100%;height:100%}
.avatar.kids b{position:absolute;left:0;right:0;bottom:6%;text-align:center;font-size:clamp(9px,.9vw,14px);font-weight:900;letter-spacing:1px;color:#fff;text-shadow:0 1px 4px #0008}
.avatar.add{display:grid;place-items:center;background:none;color:#808080}.avatar.add .icon{width:55%;height:55%;stroke-width:1.2}.profile-tile:hover .avatar.add{background:#e5e5e5;color:#141414}
.profile-tile.manage .avatar svg{opacity:.45}.profile-edit{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}.profile-edit .icon{width:34%;height:34%;color:#fff}
.profile-entering .avatar{width:150px;height:150px;animation:enter-pulse 1.2s ease-in-out infinite}@keyframes enter-pulse{50%{transform:scale(.92);opacity:.75}}
.pin-screen{position:relative;text-align:center;max-width:620px}.pin-screen .gate-close{position:fixed;top:24px;right:var(--pad);font-size:26px}.pin-title{color:#b3b3b3;font-size:17px;margin:0 0 10px}.pin-screen h1{font-size:30px;margin-bottom:32px}
.pin-row{display:flex;gap:16px;justify-content:center;margin-bottom:20px}.gate .pin-box{width:76px!important;height:76px;text-align:center;font-size:36px;padding:0!important;border:2px solid #fff!important;background:transparent!important}
.pin-row.shake{animation:shake .4s}@keyframes shake{20%,60%{transform:translateX(-10px)}40%,80%{transform:translateX(10px)}}.pin-screen .gate-link{margin-top:22px}
.editor{width:min(720px,100%)}.editor h1{font-size:clamp(34px,3.6vw,56px);font-weight:500;padding-bottom:16px;border-bottom:1px solid #333}
.editor-body{display:flex;gap:28px;padding:22px 0;border-bottom:1px solid #333;align-items:flex-start}.editor-body>.avatar{width:130px;flex:none}
.editor-avatar{position:relative;flex:none;width:130px;padding:0;background:none}.editor-avatar:hover{background:none}.editor-avatar .avatar{width:100%}.editor-avatar .profile-edit{inset:auto 6px 6px auto;width:30px;height:30px;background:#141414cc;border-radius:50%}.editor-avatar .profile-edit .icon{width:16px;height:16px}
.editor-fields{flex:1;display:flex;flex-direction:column;gap:20px}.editor-fields>input{background:#666!important;border:0!important;border-radius:0!important;font-size:17px!important;padding:10px 12px!important}
.editor-check{display:flex;gap:14px;align-items:flex-start;cursor:pointer}.editor-check input{width:24px;height:24px;accent-color:var(--red);margin:0}.editor-check span{display:flex;flex-direction:column;gap:4px}.editor-check small,.editor-pin small{color:#999;font-size:13px}
.editor-pin{display:flex;flex-direction:column;gap:6px;border-top:1px solid #333;padding-top:18px;color:#ccc}.editor-pin-row{display:flex;gap:12px;align-items:center;margin-top:8px}.editor-pin-row input{width:150px!important;padding:8px 12px!important;letter-spacing:6px}
.editor-actions{display:flex;gap:18px;padding-top:28px;flex-wrap:wrap}.editor .gate-note{max-width:440px}
.avatar-picker{position:fixed;inset:0;z-index:70;background:#000c;display:grid;place-items:center}.avatar-picker-card{background:#181818;border-radius:8px;padding:30px;display:flex;flex-direction:column;align-items:center;gap:22px}.avatar-picker-card h2{margin:0;font-weight:500}
.avatar-grid{display:grid;grid-template-columns:repeat(6,82px);gap:14px}.avatar-choice{padding:0;background:none;border:3px solid transparent;border-radius:6px}.avatar-choice:hover,.avatar-choice.selected{background:none;border-color:#fff}
.account-row{display:grid;grid-template-columns:90px 1fr;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #333;font-size:14px}.account-row b{color:#999;font-weight:500}.account-row>:nth-child(3){grid-column:2}.account-row .gate-link{font-size:13px;display:inline}
.account-password{display:flex;flex-direction:column;gap:12px;margin:12px 0 8px}.account-password h2{font-size:16px;margin:8px 0 0;color:#ddd}
.profile-button{display:flex;align-items:center;gap:6px;background:none;padding:0}.profile-button:hover{background:none}.profile-button .avatar{width:32px;height:32px}.profile-button .avatar.kids b{font-size:6px;letter-spacing:0}.profile-button .caret .icon{width:14px;height:14px;transition:transform .2s}.profile-button:hover .caret .icon{transform:rotate(180deg)}
.profile-menu{position:fixed;top:68px;right:var(--pad);z-index:45;min-width:220px;background:#000000eb;border:1px solid #ffffff26;padding:10px 0;display:flex;flex-direction:column}.profile-menu::before{content:'';position:absolute;top:-8px;right:16px;border:8px solid transparent;border-top:0;border-bottom-color:#ffffffaa}
.profile-menu .menu-item{display:flex;align-items:center;gap:12px;background:none;padding:8px 16px;font-weight:400;font-size:13px;text-align:left;border-radius:0}.profile-menu .menu-item:hover span,.profile-menu .menu-item.center:hover{text-decoration:underline}.profile-menu .menu-item .avatar{width:32px;height:32px}.profile-menu .menu-item .avatar.kids b{font-size:6px}.profile-menu .menu-item>.icon{width:22px;height:22px;margin:0 5px;color:#b3b3b3}
.profile-menu hr{border:0;border-top:1px solid #ffffff33;margin:8px 0}.profile-menu .menu-item.center{justify-content:center}
body.kids .brand::after{content:'KIDS';margin-left:8px;padding:2px 6px;border-radius:3px;background:linear-gradient(135deg,#2a6cdb,#13a6a6);color:#fff;font-size:12px;letter-spacing:1px;vertical-align:middle;display:inline-block;transform:scaleY(.87)}
body.kids-blocked #playback,body.kids-blocked .detail-actions,body.kids-blocked #detail-info{display:none}
.safari .player-corner{top:60px}
.ep-jellyfin{margin-left:auto;margin-right:10px;padding:2px 7px;border-radius:3px;background:linear-gradient(135deg,#aa5cc3,#00a4dc);color:#fff;font-size:10px;font-weight:700;letter-spacing:.4px;white-space:nowrap}
.away #cast-button{display:none!important}
.invite-list{display:flex;flex-direction:column;margin-top:6px}.invite-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #333;font-size:14px}.invite-actions{display:flex;gap:14px;align-items:center}.invite-actions .gate-link{font-size:13px}.invite-status{color:#999;font-size:13px}
/* TV mode (tv.js): a clear focus highlight for the remote, no mouse-only hints, a progress bar in the player */
.tv body{cursor:none}
.tv :focus{outline:none}
.tv :focus-visible,.tv button:focus,.tv input:focus,.tv select:focus,.tv [tabindex]:focus{outline:3px solid #fff!important;outline-offset:3px;box-shadow:0 0 0 6px #e5091466}
.tv .poster-card:focus{outline:none!important;box-shadow:none;transform:scale(1.08);transition:transform .15s}
.tv .poster-card:focus .card-art img{outline:4px solid #fff;outline-offset:2px}
.tv .profile-tile:focus{outline:none!important;box-shadow:none}.tv .profile-tile:focus .avatar{border-color:#fff}.tv .profile-tile:focus .profile-name{color:#fff}
.tv .episode-row:focus{outline:3px solid #fff!important;background:#2a2a2a}
.tv #video-box:focus{outline:none!important;box-shadow:none}
.tv footer>span:last-child,.tv #pip,.tv #cast-button{display:none!important}
.tv-progress{display:none}
.tv #video-box:fullscreen .tv-progress{display:flex;position:absolute;left:4%;right:4%;bottom:5%;z-index:6;align-items:center;gap:18px;font-size:22px;font-weight:600;color:#fff;text-shadow:0 1px 6px #000;opacity:0;transition:opacity .3s}
.tv #video-box.active:fullscreen .tv-progress,.tv #video-box.idle:fullscreen .tv-progress{opacity:1}
.tv-track{flex:1;height:6px;border-radius:3px;background:#ffffff40;overflow:hidden}.tv-track i{display:block;height:100%;background:var(--red);width:0}
/* TV sign-in with a phone: QR code beside the steps and the code */
.tv-signin{display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center}.tv-signin h1{font-size:44px;font-weight:600;margin:0}
.tv-signin-body{display:flex;align-items:center;gap:60px;background:#000000b0;border-radius:10px;padding:40px 56px}
.tv-qr{width:300px;height:300px;background:#fff;border-radius:8px;padding:6px}.tv-qr svg{width:100%;height:100%;display:block}
.tv-signin-steps{display:flex;flex-direction:column;align-items:flex-start;text-align:left;max-width:520px}.tv-signin-steps p{margin:4px 0;font-size:20px;color:#bbb}
.tv-signin-steps .tv-step{color:#fff;font-size:22px;margin:10px 0}.tv-url{font-size:30px!important;color:#fff!important;font-weight:700}
.tv-code{font-size:56px!important;font-weight:800;letter-spacing:8px;color:#fff!important;font-family:ui-monospace,Menlo,Consolas,monospace;margin:6px 0 10px!important}
/* TV sign-in backdrop: a tilted poster wall, dimmed towards the middle so the sign-in stays readable */
.gate-backdrop{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:#000}
.gate-wall{position:absolute;inset:-25% -15%;display:grid;grid-template-columns:repeat(10,1fr);gap:16px;transform:rotate(-12deg);opacity:.45;animation:wall-drift 90s linear infinite alternate}
.gate-wall img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;display:block}
.gate-shade{position:absolute;inset:0;background:radial-gradient(ellipse at center,#000000e6 0%,#000000b3 45%,#00000059 100%),linear-gradient(0deg,#000000cc 0%,transparent 30%,transparent 70%,#000000cc 100%)}
@keyframes wall-drift{from{transform:rotate(-12deg) translateY(0)}to{transform:rotate(-12deg) translateY(-6%)}}
.gate>.tv-signin,.gate>.gate-card,.gate>.gate-logo{position:relative;z-index:1}.gate>.gate-logo{position:fixed}
.tv-signin-body{background:#000000c0}
@media(max-width:700px){.gate-wall{grid-template-columns:repeat(5,1fr);gap:10px;inset:-20% -40%}}
/* Phones: a compact top bar (logo, search, avatar), a tab bar at the bottom, a full-width banner, smaller posters
   to swipe through, and episode rows that keep their titles. */
@media (max-width:760px){
 :root{--pad:16px}
 .topbar{height:56px;gap:10px;padding:0 var(--pad);padding-top:env(safe-area-inset-top);background:linear-gradient(#000000e6,#0000)}
 .brand{font-size:22px;letter-spacing:-1px}
 nav{position:fixed;left:0;right:0;bottom:0;z-index:30;justify-content:space-around;gap:0;height:calc(56px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#0c0c0cf2;border-top:1px solid #ffffff1a}
 nav button{flex:1;height:56px;font-size:11px;font-weight:600;color:#8c8c8c;padding:0}
 nav button.selected{color:#fff;font-weight:700;box-shadow:inset 0 2px 0 var(--red)}
 .header-tools{gap:8px;margin-left:auto}
 #reload,#fullscreen{display:none}
 #search{height:32px;border-color:#ffffff30;background:#00000080;border-radius:4px}
 #query{width:min(38vw,160px);font-size:13px;padding:6px 0 6px 10px}
 #search button{font-size:20px;padding:0 8px}
 .profile-button .caret{display:none}
 .profile-menu{top:56px;right:8px;left:8px;min-width:0}
 main{inset:0 0 calc(56px + env(safe-area-inset-bottom)) 0}
 footer{display:none}
 /* Home banner */
 .hero{height:72vh;min-height:430px;max-height:620px}
 .hero>img{object-position:center 20%}
 .hero-shade{background:linear-gradient(0deg,#141414 0%,#141414cc 25%,transparent 60%),linear-gradient(180deg,#00000099,transparent 25%)}
 .hero-copy{left:var(--pad);right:var(--pad);top:auto;bottom:44px;max-width:none;text-align:center;display:flex;flex-direction:column;align-items:center}
 .hero-copy>.eyebrow{font-size:9px;letter-spacing:2px;justify-content:center}.mini-brand{font-size:18px}
 .hero h1{font-size:30px;letter-spacing:-1px;margin:10px 0}
 .hero .title-logo{max-width:70vw;max-height:90px;object-position:center bottom;margin:10px auto}
 .hero-meta{font-size:11px;margin:8px 0 6px}
 .hero-copy p{font-size:13px;line-height:1.5;-webkit-line-clamp:2;margin:6px 0 14px}
 .hero-actions{gap:10px;justify-content:center;width:100%}
 .hero-actions button{flex:1;max-width:170px;justify-content:center;font-size:15px;padding:10px 14px}
 .hero-sound{bottom:auto;top:70px;right:var(--pad)}
 .hero-corner{display:none}
 /* Rows */
 .home-rows{margin-top:-10px}
 .shelf{margin-bottom:22px}
 .shelf-heading{margin-bottom:8px}
 .shelf-heading h2{font-size:16px}
 .shelf-tools button:not(:first-child){display:none}
 .shelf-tools button{font-size:11px;padding:4px 0}
 .rail{gap:8px;padding:2px var(--pad) 6px;scroll-snap-type:x mandatory}
 .rail .poster-wrap{flex:0 0 29vw}
 .poster-card:hover{transform:none}
 .poster-card h3{font-size:11px;margin:6px 0 2px}.poster-card p{font-size:9px}
 .rating-badge{transform:scale(.85);transform-origin:top left}
 /* Libraries and search */
 .page-section{padding:72px var(--pad) 28px}
 .section-heading h1{font-size:26px}
 #grid{grid-template-columns:repeat(3,1fr);gap:16px 8px;margin-top:14px}
 /* Title page */
 .back-button{top:66px;padding:6px 10px;font-size:11px}
 .detail-heading{min-height:0;padding:150px 0 18px}
 .detail-shade{background:linear-gradient(0deg,#141414 5%,#141414b3 45%,#14141433)}
 .detail-copy{max-width:none}
 .detail-copy .title-logo{max-width:72vw;max-height:80px}
 .detail-copy h1{font-size:26px}
 .detail-copy p{font-size:13px;-webkit-line-clamp:4}
 .facts{font-size:11px;white-space:normal}
 .detail-actions{flex-wrap:wrap}
 .detail-actions #detail-play{flex:1 1 100%;font-size:15px;padding:12px}
 .detail-actions button{flex:1}
 /* Player */
 #playback{scroll-margin-top:60px}
 #playback .section-heading{flex-direction:column;align-items:flex-start;gap:6px}
 #video-box{border-radius:0;margin:0 calc(var(--pad) * -1);border-left:0;border-right:0;max-height:none}
 .player-options{justify-content:flex-start}
 .player-actions{flex-wrap:wrap;gap:8px;margin:12px 0 26px}
 .player-actions button{flex:1 1 calc(50% - 8px);white-space:nowrap;padding:10px 8px}
 #pip{display:none}
 .player-corner{top:8px;right:8px;gap:6px}
 /* Episodes */
 .episodes-heading h2{font-size:19px}
 .episode-row{grid-template-columns:38% 1fr;grid-template-rows:auto auto;min-height:0;padding:12px 0;gap:0 12px}
 .ep-index{display:none}
 .ep-body{padding-left:0;gap:4px}
 .ep-head{flex-direction:column;gap:2px;font-size:14px}
 .ep-head strong{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
 .ep-head span{font-size:12px;color:#999}
 .ep-synopsis{font-size:12px;-webkit-line-clamp:2}
 .ep-jellyfin{margin:2px 0 0;align-self:flex-start}
 /* Sign-in and profiles */
 .gate{padding:80px 12px 30px}
 .gate-card{padding:32px 22px 28px}
 .profile-grid{gap:18px 22px}
 .profile-tile{width:30vw}
 .editor-body{flex-direction:column;align-items:center}
}
/* No footer bar: its status line is no longer shown. */
footer{display:none!important}
@media (max-width:760px){
 .topbar{background:#0b0b0b;box-shadow:0 1px 0 #ffffff12}
 #trailer-sound{bottom:auto;top:66px;right:var(--pad)}
 #video-box{width:calc(100% + var(--pad) * 2)}
}
/* ---------- TV interface (tv-ui.js), 1920×1080, Netflix-style ---------- */
.tv-ui-on .topbar,.tv-ui-on main{visibility:hidden}
.tv-ui{position:fixed;inset:0;z-index:50;background:#0b0b0b;overflow:hidden;color:#fff}
.tv-ui[hidden]{display:none}
.tv-content{position:absolute;inset:0}
.tv-loader{position:absolute;inset:0}
/* Menu rail: icons, opening to labels over a dark fade */
.tv-rail{position:absolute;left:0;top:0;bottom:0;width:120px;z-index:5;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:0 0 0 34px;background:linear-gradient(90deg,#000000d9,#00000000);transition:width .2s ease,background .2s ease}
.tv-rail.open{width:520px;background:linear-gradient(90deg,#000 0%,#000000f0 55%,#00000000 100%)}
.tv-rail-item{display:flex;align-items:center;gap:26px;height:62px;color:#9a9a9a;font-size:28px;font-weight:600;white-space:nowrap}
.tv-rail-item .icon{width:38px;height:38px;flex:none}.tv-rail-item .avatar{width:44px;height:44px;flex:none;border-radius:6px}
.tv-rail-item span:last-child{opacity:0;transition:opacity .15s}.tv-rail.open .tv-rail-item span:last-child{opacity:1}
.tv-rail-item.active{color:#fff}.tv-rail-item.active .icon{color:var(--red)}
.tv-rail-item.focus{color:#fff;transform:scale(1.06);transform-origin:left center}.tv-rail-item.focus span:last-child{text-decoration:underline;text-decoration-color:var(--red);text-underline-offset:8px;text-decoration-thickness:3px}
/* Billboard: the highlighted title */
.tv-browse{position:absolute;inset:0}
.tv-billboard{position:absolute;inset:0 0 auto 0;height:720px}
.tv-bb-art{position:absolute;right:0;top:0;width:1300px;height:731px}
.tv-bb-art img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}.tv-bb-art img.shown{opacity:1}
.tv-bb-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0b0b0b 0%,#0b0b0b 34%,#0b0b0bcc 50%,#0b0b0b00 78%),linear-gradient(0deg,#0b0b0b 0%,#0b0b0b00 38%)}
.tv-bb-copy{position:absolute;left:160px;top:96px;width:760px}
.tv-bb-logo{display:block;max-width:560px;max-height:170px;object-fit:contain;object-position:left bottom;margin-bottom:22px}
.tv-bb-copy h1{font-size:64px;line-height:1.05;margin:0 0 20px;letter-spacing:-1px}
.tv-bb-meta{font-size:24px;color:#d0d0d0;font-weight:600;margin-bottom:16px;white-space:pre}
.tv-bb-desc{font-size:24px;line-height:1.5;color:#cfcfcf;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* Rows: the current row sits in a fixed place; rows and posters glide with transforms */
.tv-rows{position:absolute;left:160px;right:0;top:560px;bottom:0;overflow:hidden}
.tv-rows-track{transition:transform .22s ease-out;will-change:transform}
.tv-row{height:360px;transition:opacity .2s}.tv-row.above{opacity:0}
.tv-row h2{font-size:30px;font-weight:700;margin:0 0 16px;color:#e5e5e5}
.tv-row-track{display:flex;gap:16px;transition:transform .22s ease-out;will-change:transform;padding:10px 0}
.tv-tile{position:relative;flex:0 0 196px;height:294px;border-radius:8px;overflow:hidden;background:#222;transition:transform .15s ease-out}
.tv-tile img{width:100%;height:100%;object-fit:cover;display:block}
.tv-tile.focus{transform:scale(1.1);outline:5px solid #fff;outline-offset:0;z-index:2;box-shadow:0 10px 30px #000c}
.tv-tile-bar{position:absolute;left:10px;right:10px;bottom:10px;height:6px;border-radius:3px;background:#ffffff4d;overflow:hidden}.tv-tile-bar i{display:block;height:100%;background:var(--red)}
.tv-empty{position:absolute;left:160px;top:600px;font-size:28px;color:#aaa}
/* Search: keyboard and results */
.tv-search{position:absolute;inset:0;display:flex;gap:70px;padding:90px 80px 0 160px}
.tv-search-left{width:560px;flex:none}
.tv-search-query{font-size:40px;font-weight:700;min-height:64px;border-bottom:3px solid #444;margin-bottom:30px;padding-bottom:10px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv-keys{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.tv-key{height:74px;display:grid;place-items:center;font-size:30px;font-weight:600;color:#ccc;background:#1d1d1d;border-radius:6px}
.tv-key.wide{grid-column:span 3;font-size:24px}
.tv-key.focus{background:#fff;color:#000}
.tv-search-results{flex:1;overflow:hidden;position:relative}
.tv-grid-row{display:flex;gap:22px;margin-bottom:26px}
.tv-search-results .tv-empty{position:static;margin-top:120px}
/* Title page */
.tv-detail{position:absolute;inset:0}
.tv-dt-art{position:absolute;right:0;top:0;width:1400px;height:788px}.tv-dt-art img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .35s}.tv-dt-art img.shown{opacity:1}
.tv-dt-shade{position:absolute;inset:0;background:linear-gradient(90deg,#0b0b0b 0%,#0b0b0b 30%,#0b0b0bd9 48%,#0b0b0b00 80%),linear-gradient(0deg,#0b0b0b 0%,#0b0b0b00 45%)}
.tv-dt-copy{position:absolute;left:160px;top:110px;width:820px}
.tv-dt-logo{display:block;max-width:600px;max-height:190px;object-fit:contain;object-position:left bottom;margin-bottom:24px}
.tv-dt-copy h1{font-size:64px;line-height:1.05;margin:0 0 20px}
.tv-dt-meta{font-size:24px;color:#d0d0d0;font-weight:600;white-space:pre;margin-bottom:14px}
.tv-dt-progress{font-size:22px;color:#e5e5e5;margin-bottom:10px}
.tv-dt-desc{font-size:24px;line-height:1.5;color:#cfcfcf;margin:0 0 34px;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.tv-dt-buttons{display:flex;gap:18px}
.tv-btn{display:flex;align-items:center;gap:14px;height:72px;padding:0 34px;border-radius:8px;background:#ffffff26;color:#fff;font-size:26px;font-weight:700}
.tv-btn .icon{width:30px;height:30px}.tv-btn.primary .icon{fill:currentColor}
.tv-btn.focus{background:#fff;color:#000;transform:scale(1.05)}
.tv-seasons{position:absolute;left:160px;top:640px;display:flex;gap:14px}
.tv-chip{padding:14px 26px;border-radius:30px;background:#ffffff1f;font-size:24px;font-weight:600;color:#ddd}.tv-chip.active{box-shadow:inset 0 0 0 2px #fff}.tv-chip.focus{background:#fff;color:#000}
.tv-episodes{position:absolute;left:160px;right:0;top:720px}
.tv-episodes h2{font-size:28px;margin:0 0 16px;color:#e5e5e5}
.tv-ep-track{display:flex;gap:24px;transition:transform .22s ease-out;will-change:transform}
.tv-ep{flex:0 0 408px;transition:transform .15s}
.tv-ep-still{position:relative;height:230px;border-radius:8px;overflow:hidden;background:#222}.tv-ep-still img{width:100%;height:100%;object-fit:cover}
.tv-ep.focus .tv-ep-still{outline:5px solid #fff}.tv-ep.focus{transform:scale(1.04)}
.tv-ep-title{font-size:22px;font-weight:600;margin-top:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tv-ep-time{font-size:18px;color:#999;margin-top:4px}
/* Player: full screen inside the app, the title and progress bar over the picture */
.tv-ui-on #video-box.tv-playing{visibility:visible}
.tv #video-box.tv-playing{position:fixed;inset:0;z-index:70;width:100vw;height:100vh;max-height:none;aspect-ratio:auto;margin:0;border:0;border-radius:0;background:#000}
.tv #video-box.tv-playing .tv-progress{display:flex;position:absolute;left:4%;right:4%;bottom:6%;z-index:6;align-items:center;gap:18px;font-size:24px;font-weight:600;color:#fff;text-shadow:0 1px 6px #000;opacity:0;transition:opacity .3s}
.tv #video-box.tv-playing.active .tv-progress,.tv #video-box.tv-playing.idle .tv-progress{opacity:1}
.tv-player-title{display:none}
.tv #video-box.tv-playing .tv-player-title{display:block;position:absolute;left:4%;top:5%;z-index:6;font-size:34px;font-weight:700;text-shadow:0 2px 10px #000;opacity:0;transition:opacity .3s}
.tv #video-box.tv-playing.active .tv-player-title{opacity:1}
.tv #video-box.tv-playing::before{content:'';position:absolute;inset:0;z-index:4;pointer-events:none;background:linear-gradient(0deg,#000000b3,#0000 30%,#0000 75%,#00000099);opacity:0;transition:opacity .3s}
.tv #video-box.tv-playing.active::before{opacity:1}
/* TV mode: no costly effects */
.tv .poster-card img,.tv .title-logo{box-shadow:none;filter:none}
.tv .gate-wall{animation:none}
.tv main{scroll-behavior:auto}
.tv-row{height:392px}.tv-tile.focus{transform:scale(1.07)}
.tv-ui .tv-bb-copy,.tv-ui .tv-dt-copy,.tv-ui .tv-rows,.tv-ui .tv-episodes{transition:opacity .2s}
.tv-ui.rail-open .tv-bb-copy,.tv-ui.rail-open .tv-dt-copy,.tv-ui.rail-open .tv-search-left{opacity:.12}.tv-ui.rail-open .tv-rows,.tv-ui.rail-open .tv-episodes{opacity:.35}
.tv-rail.open{background:linear-gradient(90deg,#000 0%,#000 40%,#000000d0 70%,#00000000 100%)}
/* TV trailers over the billboard and title artwork */
.tv-trailer{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;opacity:0;transition:opacity .6s;pointer-events:none}
.tv-trailer-on .tv-trailer{opacity:1}
.tv-trailer-on .tv-bb-desc{opacity:0;transition:opacity .4s}
.tv-bb-art,.tv-dt-art{overflow:hidden}
/* TV loading screen: new screens are built behind it */
.tv-loader{z-index:8;background:#0b0b0b;display:grid;place-items:center}.tv-loader[hidden]{display:none}
.tv-spinner{width:84px;height:84px;border-radius:50%;border:7px solid #ffffff1f;border-top-color:var(--red);animation:spin .9s linear infinite}
.tv-content.tv-veiled{visibility:hidden}
.tv-content.tv-reveal{animation:tv-reveal .4s ease}@keyframes tv-reveal{from{opacity:0}to{opacity:1}}
/* Episode cards are all the same size, whatever the title's length */
.tv-ep{width:408px;min-width:0;overflow:hidden}.tv-ep-title,.tv-ep-time{max-width:100%}
/* The full-screen player lives inside the (hidden) website layer, so that layer rises above the TV interface while it plays. */
.tv-player-open main{z-index:55}
/* TV fixes: the website layer never shows on the TV; a safe margin on the left (TVs crop their edges); the billboard
   artwork stays inside its fade; the highlighted poster is never clipped. */
.tv .topbar,.tv main{visibility:hidden}
.tv #video-box.tv-playing{visibility:visible}
.tv-rail{align-items:flex-start;padding-left:60px;width:150px;gap:14px}
.tv-rail.open{width:560px}
.tv-bb-art{height:720px;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
.tv-dt-art{height:788px;-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent 100%);mask-image:linear-gradient(180deg,#000 62%,transparent 100%)}
.tv-bb-copy,.tv-dt-copy,.tv-empty{left:190px}
.tv-rows{left:176px;top:548px}
.tv-row h2{padding-left:14px}
.tv-row-track{padding:16px 14px}
.tv-episodes,.tv-seasons{left:176px}
.tv-episodes h2{padding-left:14px}
.tv-ep-track{padding:12px 14px}
.tv-search{padding-left:190px}
.hover-card.preparing{opacity:0!important;pointer-events:none}
.hover-card:not(.open){pointer-events:none}
/* Trailers fit their box exactly (16:9), so nothing is cropped: TVs draw video on their own layer and may not crop as asked. */
.tv-bb-art{width:1280px;height:720px}
.tv-dt-art{width:1400px;height:787.5px}
.tv-trailer{object-fit:contain;background:#000}