/* Pereiramovies: cinematic surfaces and touch-friendly layouts. */
:root{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#08090b;color:#f5f5f7;font-synthesis:none;-webkit-font-smoothing:antialiased}
body{background:#08090b;overflow-x:hidden}button,a,input{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid #c1dcff;outline-offset:5px}
header{padding:24px 4%;display:grid;grid-template-columns:1fr auto 1fr;gap:24px;background:linear-gradient(#0008,transparent)}.brand{font-size:21px;letter-spacing:-.7px}.brand .mark{font-size:36px}.tools{justify-self:end;gap:10px}.tools button{width:44px;height:44px;background:#202329b8;border:1px solid #ffffff12}
nav{background:#191b20e8;padding:5px;box-shadow:0 10px 32px #0003;border:1px solid #ffffff12}nav a{font-weight:600;padding:11px 20px;color:#c3c4c9;transition:background .2s,color .2s}nav a.active{background:#f5f5f7;color:#17181b;box-shadow:0 2px 8px #0002}
.hero{height:clamp(620px,80svh,860px);align-items:flex-end;background-position:center 30%}.hero-shade{background:linear-gradient(90deg,#08090bba,transparent 80%),linear-gradient(0deg,#08090b 1%,#08090b65 35%,transparent 75%)}.hero-copy{margin:150px 4% 120px;max-width:670px}.hero h1{font-size:clamp(42px,5.3vw,78px);line-height:1.02;font-weight:750;letter-spacing:-2.8px;margin:16px 0 20px}.lettered{font-size:11px;font-weight:650;letter-spacing:2.4px;color:#dbdce0}.hero-copy>p:not(.lettered){font-size:17px;line-height:1.5;color:#e0e1e5;max-width:530px}.actions{gap:10px}.primary,.secondary{min-height:48px;border-radius:12px;padding:13px 25px;font-size:15px;box-shadow:none}.primary{background:#f5f5f7;color:#141518}.secondary{background:#ffffff20;border:1px solid #ffffff18}
.content{margin-top:-64px;padding:0 4% 80px}.rail{margin-bottom:34px}.rail h2{font-size:23px;letter-spacing:-.65px;font-weight:700;margin-bottom:14px}.rail h2 span{font-size:23px;color:#82848b;padding-left:6px}.cards{gap:18px;padding:8px 4px 20px;scroll-snap-type:x proximity;scrollbar-width:none}.cards::-webkit-scrollbar{display:none}.card{flex-basis:clamp(225px,21vw,350px);background:transparent;border:0;border-radius:14px;overflow:visible;scroll-snap-align:start;transition:transform .2s}.card img{aspect-ratio:16/9;border-radius:14px;box-shadow:0 6px 18px #0005}.card strong{padding:12px 2px 3px;font-size:15px;letter-spacing:-.2px;font-weight:600;color:#e4e4e8}.card:hover{transform:none;box-shadow:none}.card .progress{margin-top:8px;border-radius:3px;overflow:hidden;background:#ffffff20}.card .progress i{background:#f5f5f7}.empty{background:#121317;border:1px solid #ffffff09;padding:30px;color:#a4a5ad}.content #status:empty{display:none}
@media(hover:hover) and (pointer:fine){.card:hover{transform:scale(1.025)}.card:hover img{outline:2px solid #ffffffbc;outline-offset:3px}.primary:hover{background:white}.secondary:hover{background:#ffffff30}}
.login-screen{background-color:#08090b;padding:48px 24px}.login-wrap{width:min(440px,100%)}.login-brand{font-size:38px;letter-spacing:-1.5px}.login-brand .mark{font-size:68px}.glass{background:#13151bed;border:1px solid #ffffff16;border-radius:24px;padding:32px;box-shadow:0 20px 80px #0006}.glass h1{font-size:29px}.glass input,dialog form input,.content input{min-height:48px;font-size:16px;background:#22242b;border:1px solid #ffffff16;border-radius:12px}.gradient{background:#f5f5f7;color:#15161a;box-shadow:none;border-radius:12px;min-height:48px}.login-options button{min-height:44px}.login-categories{font-size:13px;color:#a1a2a9}
dialog{background:#17181d;border:1px solid #ffffff18;border-radius:24px;max-height:90svh;padding:32px;box-shadow:0 30px 100px #0009;overscroll-behavior:contain}dialog::backdrop{background:#000b;backdrop-filter:blur(10px)}dialog h2{font-size:28px;letter-spacing:-.7px}dialog p{color:#b5b6bf}.close{position:sticky;top:0;z-index:2;width:44px;height:44px;display:grid;place-items:center;margin:0 0 12px 12px;background:#303139;color:#f5f5f7}.detail-art{max-height:360px;border-radius:16px}#details:has(.player){width:min(1120px,96vw);padding:18px;overflow:auto}.player{clear:both}.player video{max-height:70svh;border-radius:12px}.player-copy{padding:20px 10px 8px}.player-copy h2{font-size:23px}.player-copy p{font-size:13px}.player-controls,.player-timeline{display:none!important}#profileMenu{right:4%;top:80px;min-width:230px;background:#202127f5;border:1px solid #ffffff18;padding:22px;border-radius:18px}#profileMenu button{min-height:44px;border-radius:10px;background:#35363f;margin:4px}
@media(max-width:1050px){header{grid-template-columns:1fr auto;gap:14px}nav{grid-column:1/-1;grid-row:2;justify-self:center;order:unset;width:auto;max-width:100%}.tools{grid-column:2;grid-row:1}.hero-copy{margin-top:180px}}
@media(max-width:600px){header{padding:calc(12px + env(safe-area-inset-top)) 20px 12px;gap:10px}.brand{font-size:19px}.brand .mark{font-size:30px}.tools{gap:6px}.tools button{width:44px;height:44px}nav{position:fixed;bottom:calc(12px + env(safe-area-inset-bottom));left:12px;right:12px;width:auto;max-width:none;display:flex;justify-content:space-around;padding:6px 3px;border-radius:22px;box-shadow:0 5px 30px #0009;background:#202127f5;backdrop-filter:blur(20px)}nav a{padding:14px 8px;font-size:12px;border-radius:16px;min-height:44px;text-align:center;letter-spacing:-.2px}.hero{height:76svh;min-height:540px;max-height:760px;background-position:62% top}.hero-shade{background:linear-gradient(0deg,#08090b 0%,#08090bb0 35%,transparent 78%)}.hero-copy{margin:110px 22px 88px;max-width:100%;align-self:flex-end}.hero h1{font-size:clamp(36px,10vw,52px);letter-spacing:-1.6px;line-height:1.06;margin:12px 0 14px}.hero-copy>p:not(.lettered){font-size:15px;-webkit-line-clamp:2;line-height:1.5}.actions{margin-top:20px;flex-wrap:wrap}.actions button{max-width:100%;font-size:14px}.content{margin-top:-42px;padding:0 20px calc(110px + env(safe-area-inset-bottom))}.rail{margin-bottom:25px}.rail h2{font-size:21px}.cards{gap:12px;margin-right:-20px;padding-right:20px;scroll-padding-left:4px}.card{flex-basis:76vw;max-width:320px}.card strong{font-size:14px}.empty{padding:24px;font-size:14px}.content form{flex-wrap:wrap}.content form input{flex:1 1 200px;min-width:0}.content form button{flex:1}.login-screen{padding:30px 20px}.login-brand{font-size:32px}.glass{padding:26px 22px}.login-options{gap:10px;flex-wrap:wrap}#profileMenu{right:16px;top:calc(70px + env(safe-area-inset-top));max-width:calc(100vw - 32px)}dialog,#settingsDialog,#firstLoginDialog{width:calc(100vw - 20px);max-height:88svh;padding:22px;border-radius:20px}dialog h2{font-size:25px}#details:has(.player){width:calc(100vw - 16px);padding:10px}.player video{max-height:60svh;border-radius:10px}.player-copy{padding:16px 8px}.player-copy h2{font-size:20px}}
@media(max-height:520px) and (orientation:landscape){.hero{min-height:520px}#details:has(.player){max-height:96svh}.player video{max-height:76svh}.player-copy{display:none}dialog .close{width:36px;height:36px;margin-bottom:6px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
.catalog-without-hero #hero[hidden]{display:none!important}
.catalog-without-hero .content{margin-top:0;padding-top:180px;min-height:70svh}
@media(max-width:600px){.catalog-without-hero .content{padding-top:calc(100px + env(safe-area-inset-top))}}
.rail-scroll-shell{position:relative;min-width:0}
.rail-scroll-shell>.cards,.rail-scroll-shell>.catalog-cards{scrollbar-width:none;cursor:grab}
.rail-scroll-shell>.cards::-webkit-scrollbar,.rail-scroll-shell>.catalog-cards::-webkit-scrollbar{display:none}
.rail-scroll-shell .rail-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.rail-scroll-shell .rail-edge{position:absolute;top:40%;z-index:3;width:40px;height:48px;padding:0;border:1px solid #ffffff25;border-radius:14px;background:#17191de8;color:#fff;font-size:32px;box-shadow:0 3px 14px #0006;cursor:pointer}
.rail-scroll-shell .rail-edge[hidden]{display:none}
.rail-prev{left:0}.rail-next{right:0}
@media(pointer:coarse){.rail-scroll-shell .rail-edge{display:none}}
.dynamic-hero-controls{display:flex;align-items:center;gap:12px;margin-top:20px;color:#d0d0d8;font-size:12px}
.dynamic-hero-controls button{width:36px;height:36px;border-radius:50%;background:#ffffff18;color:white;font-size:24px}
.hero{transition:background-image .6s ease;overflow:hidden}
.hero-copy{min-width:0}.hero-copy h1{overflow-wrap:anywhere}
@media(prefers-reduced-motion:reduce){.hero{transition:none}}
/* Keep tab hit targets above streaming-in rows, including Safari's fixed layer. */
#app>header{z-index:20}
#app nav{z-index:21;touch-action:manipulation}
#app nav a{touch-action:manipulation}