@font-face{font-family:Inter Cinema;src:url('/assets/cinema/inter-latin.woff2') format('woff2');font-style:normal;font-weight:400 700;font-display:swap}
body[data-interface=cinema]{--bg:#08090d;--panel:#15161d;--text:#f6f6f8;--muted:#c5c6ce;--accent:#415bd2;--tv-focus:#fff;background:#08090d;color:#f6f6f8;font-family:Inter Cinema,Arial,sans-serif;font-size:16px}
body[data-interface=cinema]::selection{background:#415bd2;color:#fff}
body[data-interface=cinema] input{caret-color:#fff}
body[data-interface=cinema] :focus{outline:3px solid #fff!important;outline-offset:5px!important}
body[data-interface=cinema] #shell main#content{margin-left:64px;padding:0 3vw;transition:none;min-height:100vh}
body[data-interface=cinema] .sidebar,body[data-interface=cinema] .sidebar:hover,body[data-interface=cinema] .sidebar:focus-within{width:64px;background:linear-gradient(90deg,rgba(8,9,13,.55),transparent);align-items:center;overflow:visible;z-index:15}
body[data-interface=cinema] .sidebar .brand,body[data-interface=cinema] .sidebar .local-mark{display:none}
body[data-interface=cinema] #nav{position:absolute;top:38vh;left:10px;right:10px;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
body[data-interface=cinema] #nav .nav-link{width:44px;height:44px;min-height:44px;padding:11px;justify-content:center;border:0;border-radius:5px;background:transparent;color:#c5c6ce;margin:0;font-size:16px}
body[data-interface=cinema] #nav .nav-link:hover,body[data-interface=cinema] #nav .nav-link[aria-current=page]{background:#ffffff16;color:#fff}
body[data-interface=cinema] #nav .nav-link span{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
body[data-interface=cinema] #nav .nav-link svg{width:23px;height:23px;stroke-width:1.6}
body[data-interface=cinema] #nav a[href="#home"],body[data-interface=cinema] #nav a[href="#movies"],body[data-interface=cinema] #nav a[href="#series"],body[data-interface=cinema] #nav a[href="#live"],body[data-interface=cinema] #nav a[href="#profile"]{display:none}
#cinema-header{position:fixed;inset:0 0 auto;z-index:18;height:80px;display:flex;align-items:center;justify-content:center;padding:0 3vw 0 16px;background:linear-gradient(#08090db8,transparent);pointer-events:none}
#cinema-header a{pointer-events:auto}
#cinema-header nav{display:flex;align-items:center;gap:38px}
#cinema-header nav a{position:relative;font-size:17px;font-weight:600;letter-spacing:.02em;color:#c9cad3;padding:20px 0;min-height:48px}
#cinema-header nav a:hover,#cinema-header nav a[aria-current=page]{color:#fff}
#cinema-header nav a[aria-current=page]:after{position:absolute;content:'';bottom:10px;left:0;right:0;height:2px;background:#fff}
.cinema-account{position:absolute;left:18px;top:18px;width:34px;height:34px;padding:7px;border:1px solid #ffffff60;border-radius:50%;color:#e3e4ec;background:#272a35}
.cinema-account svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.6}
.cinema-brand{position:absolute;right:3vw;top:20px;display:flex;align-items:center;height:38px;max-width:190px;overflow:hidden;font-size:26px;font-weight:700;letter-spacing:-.04em;white-space:nowrap;text-overflow:ellipsis}
.cinema-brand img{display:block;max-width:160px;max-height:38px;object-fit:contain}
body[data-interface=cinema] .topbar{height:108px;visibility:hidden}
body[data-interface=cinema][data-view=home] .topbar,body[data-interface=cinema][data-view=movies] .topbar,body[data-interface=cinema][data-view=series] .topbar{height:0}
body[data-interface=cinema] #global-backdrop{inset:0 0 auto;height:91vh;min-height:600px;background-size:cover;background-position:calc(50% + 12vw) 25%;background-repeat:no-repeat;opacity:1;z-index:-2}
body[data-interface=cinema] #global-backdrop:after{background:linear-gradient(90deg,rgba(8,9,13,.9),rgba(8,9,13,.35) 43%,rgba(8,9,13,.06) 80%),linear-gradient(0deg,#08090d 0%,rgba(8,9,13,.97) 5%,rgba(8,9,13,.18) 48%,rgba(8,9,13,.08) 80%,rgba(8,9,13,.15))}
body[data-interface=cinema] .cinema-hero{height:73vh;min-height:480px;max-height:810px;align-items:center;margin:0;padding:100px 0 20px}
body[data-interface=cinema] .cinema-hero .hero-content{width:54%;max-width:640px;animation:cinema-reveal 180ms ease-out}
body[data-interface=cinema] .cinema-hero h1{font-size:clamp(38px,4.4vw,70px);font-weight:600;line-height:1.05;letter-spacing:-.025em;margin:0 0 20px;overflow-wrap:anywhere}
body[data-interface=cinema] .cinema-hero h1.cinema-title-spaced{font-weight:400;font-size:clamp(40px,4.8vw,76px);letter-spacing:.13em;text-transform:uppercase}
body[data-interface=cinema] .cinema-hero .metadata{display:flex;flex-wrap:wrap;gap:0;align-items:center;margin:0 0 17px;color:#e3e3eb;font-size:13px;font-weight:500;line-height:1.5}
body[data-interface=cinema] .cinema-hero .metadata span+span:before{content:'·';margin:0 10px;color:#b8bac8}
body[data-interface=cinema] .cinema-hero .hero-description{font-size:17px;line-height:1.55;color:#e0e1e8;max-width:44ch;margin:0;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
body[data-interface=cinema] .cinema-hero .actions{gap:12px;align-items:center;margin-top:26px}
body[data-interface=cinema] .cinema-hero .actions button{height:52px;min-height:52px;border-radius:4px;padding:0 23px;font-size:16px;font-weight:600;letter-spacing:.01em;transition:background 120ms ease-out,transform 120ms ease-out}
body[data-interface=cinema] .cinema-play{background:#525c7bd4;border:0;color:#fff;box-shadow:0 6px 20px #00000020}
body[data-interface=cinema] .cinema-play:hover{background:#6c7796}
body[data-interface=cinema] .cinema-hero button svg{width:23px;height:23px;stroke:currentColor;stroke-width:1.7;fill:none;flex:none}
body[data-interface=cinema] .cinema-hero button.cinema-favorite{padding:0;width:52px;min-width:52px;border:1px solid #d4d5de85;background:#1e22316b}
body[data-interface=cinema] .cinema-hero button.cinema-more{border:0;background:transparent;color:#e4e5ed;padding:0 8px;font-weight:500}
body[data-interface=cinema] .cinema-dots{height:42px;gap:6px;align-items:center;padding:0;margin:-40px 0 24px;position:relative}
body[data-interface=cinema] .cinema-dots button{width:28px;height:28px;min-height:28px!important;padding:10px;background:transparent;border-radius:50%;border:0;display:flex;align-items:center;justify-content:center}
body[data-interface=cinema] .cinema-dots button span{display:block;width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:#8f94a0}
body[data-interface=cinema] .cinema-dots button.selected span{background:#fff}
body[data-interface=cinema] .section{margin:0 0 46px}
body[data-interface=cinema] .section-head{margin:0 0 18px}
body[data-interface=cinema] .section-head h2{font-size:21px;line-height:1.3;font-weight:600;letter-spacing:.005em;text-transform:none}
body[data-interface=cinema] .cards.rail{gap:20px;padding:6px 6px 15px;margin:0 -6px;overflow-x:auto;scrollbar-width:none}
body[data-interface=cinema] .rail .media-card{width:18%;min-width:170px;max-width:260px;flex:0 0 18%;padding:0;margin:0}
body[data-interface=cinema] .artwork{border:0;border-radius:4px;background:#181a23;transition:transform 150ms ease-out,box-shadow 150ms ease-out}
body[data-interface=cinema] .artwork:hover{transform:scale(1.025);box-shadow:0 8px 22px #0005}
body[data-interface=cinema] .media-card h3{font-size:14px;font-weight:500;margin:10px 0 4px;color:#f6f6f8}
body[data-interface=cinema] .media-card p{font-size:12px;color:#b7b9c6;line-height:1.4}
body[data-interface=cinema] .rating{border-radius:2px;background:#111724df;font-weight:500}
body[data-interface=cinema] .grid{gap:24px}
body[data-interface=cinema] .grid .media-card{min-width:0;max-width:none}
body[data-interface=cinema] .page-title,body[data-interface=cinema] .category-header h1{font-size:32px;font-weight:600;letter-spacing:-.025em}
body[data-interface=cinema] .category-header{padding-top:14px}
body[data-interface=cinema] .epg-layout{background:#101117;border:1px solid #2b2e39;border-radius:5px}
body[data-interface=cinema] .epg-groups button.selected,body[data-interface=cinema] .channel-row.selected{background:#242b42;border-color:#7581a4}
body[data-interface=cinema] footer{font-size:12px;color:#b0b3c1;padding:32px 0}
body[data-interface=cinema][data-view=detail] #cinema-header{display:none}
body[data-interface=cinema][data-view=detail] #shell main#content{margin:0;padding:0}
body[data-interface=cinema][data-view=detail] #global-backdrop{height:400px;min-height:0}
body[data-interface=cinema][data-view=detail] .detail-header~.hero h1{font-size:36px}
body[data-interface=cinema] .tools button,body[data-interface=cinema] .tools select{border-radius:4px}
body[data-interface=cinema] .tools #toggle-play{background:#455dcc;border-color:#778ee9}
body[data-interface=cinema] #playback-progress{accent-color:#7184d4}
body[data-interface=cinema] ::-webkit-scrollbar{width:8px;height:8px}
body[data-interface=cinema] ::-webkit-scrollbar-thumb{background:#555b70;border-radius:4px}
body[data-interface=cinema] ::-webkit-scrollbar-track{background:#11131c}
.cinema-demo-note{position:fixed;bottom:10px;right:16px;z-index:19;background:#08090de8;color:#d0d2de;border:1px solid #454a5d;border-radius:4px;padding:7px 12px;font-size:11px;max-width:80vw;pointer-events:none}
@keyframes cinema-reveal{from{opacity:.6}to{opacity:1}}
@media(min-width:1700px){body[data-interface=cinema] .cinema-hero .hero-description{font-size:20px}#cinema-header{height:94px}#cinema-header nav a{font-size:20px}.cinema-brand{font-size:32px}.cinema-account{top:25px}body[data-interface=cinema] .section-head h2{font-size:25px}}
@media(max-width:900px){#cinema-header nav{gap:24px}#cinema-header nav a{font-size:15px}.cinema-brand{max-width:130px;font-size:20px}body[data-interface=cinema] .cinema-hero .hero-content{width:66%}body[data-interface=cinema] .rail .media-card{flex-basis:24%;min-width:150px}body[data-interface=cinema] .cinema-hero h1.cinema-title-spaced{font-size:48px}}
@media(max-width:600px){body[data-interface=cinema] #shell main#content{margin-left:48px;padding:0 18px}body[data-interface=cinema] .sidebar,body[data-interface=cinema] .sidebar:hover,body[data-interface=cinema] .sidebar:focus-within{width:48px}body[data-interface=cinema] #nav{left:2px;right:2px;gap:12px}#cinema-header{height:110px;padding:0 12px;align-items:flex-end;background:linear-gradient(#08090dd9,#08090d80,transparent)}#cinema-header nav{gap:22px;padding-left:38px}#cinema-header nav a{font-size:13px;padding:16px 0}.cinema-brand{top:14px;right:18px;height:30px;font-size:20px;max-width:160px}.cinema-account{left:12px;top:14px;width:30px;height:30px}body[data-interface=cinema] .cinema-hero{height:73vh;min-height:520px;padding-top:135px}body[data-interface=cinema] .cinema-hero .hero-content{width:100%}body[data-interface=cinema] .cinema-hero h1,body[data-interface=cinema] .cinema-hero h1.cinema-title-spaced{font-size:36px}body[data-interface=cinema] .cinema-hero .hero-description{font-size:14px;max-width:30ch}body[data-interface=cinema] .cinema-hero .actions{gap:10px}body[data-interface=cinema] .cinema-hero .actions button{height:46px;min-height:46px;font-size:14px;padding:0 15px}body[data-interface=cinema] .cinema-hero button.cinema-favorite{width:46px;min-width:46px;padding:0}body[data-interface=cinema] .cinema-more{display:none}body[data-interface=cinema] .section-head h2{font-size:19px}body[data-interface=cinema] .rail .media-card{flex-basis:48%;min-width:130px}body[data-interface=cinema] .cards.rail{gap:14px}body[data-interface=cinema] #global-backdrop{background-position:60% top}body[data-interface=cinema] .topbar{height:130px}.cinema-demo-note{font-size:9px;right:10px;max-width:75vw}}
@media(prefers-reduced-motion:reduce){body[data-interface=cinema] *,body[data-interface=cinema] *:before,body[data-interface=cinema] *:after{animation:none!important;transition:none!important}}
body[data-interface=cinema] #shell{position:relative;z-index:0;min-height:100vh}
#cinema-header nav{position:static;inset:auto;width:auto;flex-direction:row;margin:0;transform:none;align-self:center}
body[data-interface=cinema] .cinema-hero .metadata span{color:#d9dbe6}