@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#1c242c;--panel:#11171d;--panel2:#222c35;--text:#f5f7fa;--muted:#a3adb8;--green:#39d353;--line:rgba(255,255,255,.1);--max:1240px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif}a{color:inherit;text-decoration:none}button,input,select{font:inherit}.topbar{height:58px;background:#10151b;display:flex;align-items:center;gap:28px;padding:0 max(22px,calc((100vw - 1400px)/2));position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(255,255,255,.05)}.brand{display:flex;align-items:center;gap:9px;font:800 18px Manrope,sans-serif;white-space:nowrap}.brand-mark{width:27px;height:23px;border:2px solid var(--green);color:var(--green);display:grid;place-items:center;font-size:11px;border-radius:4px}.brand-accent{color:var(--green)}.main-nav{display:flex;align-items:center;gap:22px;font-size:12px;color:#b6bec7;white-space:nowrap}.main-nav a:hover{color:#fff}.chevron{color:#74808b}.search-form{margin-left:auto;display:flex;height:34px;min-width:150px;max-width:260px;flex:1;background:#1d252e}.search-form input{width:100%;min-width:0;background:transparent;border:0;outline:0;color:white;padding:0 12px;font-size:13px}.search-form input::placeholder{color:#81909d}.search-form button{width:38px;background:transparent;color:#fff;border:0;font-size:23px;cursor:pointer}.language-wrap{display:flex;align-items:center;gap:5px;color:#b8c0c9}.globe{font-size:15px}.language-wrap select{max-width:20px;width:20px;background:transparent;color:transparent;border:0;outline:0;cursor:pointer}.language-wrap option{color:#111}.account-actions{display:flex;gap:12px;align-items:center;font-size:12px;white-space:nowrap}.sign-in,.register{padding:9px 13px;border-radius:3px}.sign-in{border:1px solid var(--green)}.register{background:var(--green);color:#0b1b0e;font-weight:700}.mobile-menu{display:none;background:none;border:0;color:#fff;font-size:24px}.hero{min-height:224px;position:relative;display:flex;align-items:center;background:linear-gradient(90deg,rgba(15,22,29,.91),rgba(15,22,29,.7)),linear-gradient(0deg,var(--bg),transparent 60%),url('https://image.tmdb.org/t/p/w1280/8b8R8l88Qje9dn9OE8PY05Nxl1X.jpg') center 32%/cover no-repeat}.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,var(--bg) 0%,transparent 38%);pointer-events:none}.hero-inner{width:min(var(--max),calc(100% - 48px));margin:0 auto;padding:34px 0 43px;position:relative;z-index:1}.eyebrow,.section-kicker{font-size:9px;letter-spacing:2px;color:var(--green);font-weight:700;margin:0 0 9px}.hero h1{font:600 clamp(27px,3vw,36px) Manrope,sans-serif;letter-spacing:-1px;margin:0 0 7px}.hero-copy{font-size:17px;color:#e2e7eb;margin:0 0 17px}.hero-cta{display:inline-flex;align-items:center;gap:15px;border:1px solid var(--green);padding:10px 15px;border-radius:4px;font-size:13px;transition:.2s}.hero-cta:hover{background:var(--green);color:#101910}.catalog{width:min(var(--max),calc(100% - 48px));margin:28px auto 65px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 18px}.section-heading h2,.genre-strip h2{font:600 19px Manrope,sans-serif;margin:0;letter-spacing:-.3px}.section-kicker{margin-bottom:5px;font-size:8px}.row-controls{display:flex;gap:8px}.row-controls button{border:0;background:transparent;color:#aeb8c2;font-size:28px;line-height:1;cursor:pointer;padding:0 3px}.row-controls button:hover{color:var(--green)}.poster-track{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:1px 0 18px}.poster-track::-webkit-scrollbar{display:none}.movie-card{flex:0 0 144px;width:144px;scroll-snap-align:start;min-width:0}.poster-wrap{position:relative;aspect-ratio:2/3;overflow:hidden;border-radius:4px;background:#111820;box-shadow:0 5px 15px #0b101555}.poster{width:100%;height:100%;object-fit:cover;display:block;transition:transform .25s}.movie-card:hover .poster{transform:scale(1.045)}.poster-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent 65%);opacity:0;transition:opacity .2s}.movie-card:hover .poster-overlay{opacity:1}.play-icon{width:42px;height:42px;display:grid;place-items:center;border:1px solid #fff;border-radius:50%;font-size:16px;padding-left:3px}.rating{position:absolute;top:8px;left:8px;padding:4px 6px;border-radius:3px;background:#10151bd9;font-size:10px;font-weight:700}.rating span{color:#f4c95d}.movie-title{font-size:12px;line-height:1.45;margin:9px 0 3px;color:#d8dee4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.movie-year{font-size:11px;color:#87929e;margin:0}.catalog-section{padding-top:25px;margin-top:22px;border-top:1px solid var(--line)}.loading-card{color:var(--muted);font-size:13px;padding:25px 0}.genre-strip{padding:30px 0 6px;margin-top:15px;border-top:1px solid var(--line)}.genre-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:17px}.genre-chip{border:1px solid #3c4853;background:#202a33;color:#d7dfe5;padding:9px 14px;border-radius:3px;font-size:12px;cursor:pointer}.genre-chip:hover{border-color:var(--green);color:var(--green)}.results-section{padding-top:28px}.results-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:24px 18px}.hidden{display:none!important}.detail-layout{display:grid;grid-template-columns:minmax(180px,260px) minmax(0,1fr);gap:34px;padding:38px 0 65px}.detail-poster{width:100%;border-radius:6px}.detail-backdrop{position:absolute;inset:0 0 auto;height:460px;background-position:center 25%;background-size:cover;opacity:.18;mask-image:linear-gradient(#000,transparent)}.detail-content{position:relative}.back-link{font-size:12px;color:var(--muted);display:inline-block;margin-bottom:22px}.detail-title{font:800 clamp(27px,4vw,42px) Manrope;margin:0 0 10px}.detail-meta{display:flex;flex-wrap:wrap;gap:12px;color:#b8c2cb;font-size:12px;margin-bottom:18px}.detail-rating{color:#f4cc63}.detail-overview{font-size:15px;line-height:1.8;color:#c4cdd5;max-width:760px}.detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0}.watch-button,.secondary-button{border:0;border-radius:4px;padding:12px 18px;font-weight:700;font-size:13px;cursor:pointer}.watch-button{background:var(--green);color:#0c1b10}.secondary-button{background:#2b3741;color:#fff}.footer{border-top:1px solid var(--line);padding:28px 24px 36px;text-align:center;color:#8995a0;font-size:12px}.footer-brand{justify-content:center;color:#fff}.footer p{margin:12px 0 6px}.footer small{font-size:10px}.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,20px);background:#11171d;border:1px solid #3b4853;padding:12px 18px;border-radius:5px;color:white;font-size:13px;opacity:0;pointer-events:none;transition:.2s;z-index:50;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:1500px){.movie-card{flex-basis:160px;width:160px}.poster-track{gap:25px}}@media(max-width:980px){.topbar{gap:16px;padding:0 18px}.main-nav{gap:13px}.main-nav a:last-child{display:none}.account-actions{gap:6px}.hero-inner,.catalog{width:calc(100% - 40px)}}@media(max-width:720px){.topbar{height:58px;gap:12px}.brand{font-size:16px}.main-nav{display:none;position:absolute;left:0;right:0;top:58px;background:#10151b;padding:16px 20px;align-items:flex-start;flex-direction:column;border-top:1px solid var(--line)}.main-nav.open{display:flex}.main-nav a:last-child{display:block}.search-form{max-width:none;min-width:0;height:32px}.account-actions{display:none}.language-wrap{gap:0}.mobile-menu{display:block}.hero{min-height:215px}.hero-inner,.catalog{width:calc(100% - 32px)}.hero h1{font-size:27px}.hero-copy{font-size:14px;line-height:1.6;max-width:450px}.eyebrow{font-size:8px}.catalog{margin-top:20px}.section-heading h2{font-size:17px}.poster-track{gap:14px}.movie-card{flex-basis:124px;width:124px}.detail-layout{grid-template-columns:110px minmax(0,1fr);gap:18px;padding-top:25px}.detail-title{font-size:25px}.detail-overview{font-size:13px;line-height:1.7}.detail-meta{gap:8px}.results-grid{grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:18px 12px}}@media(max-width:420px){.topbar{padding:0 11px;gap:9px}.brand{gap:6px}.brand-mark{width:23px;height:21px}.language-wrap select{display:none}.search-form input{padding:0 7px}.hero h1{font-size:24px}.movie-card{flex-basis:112px;width:112px}.detail-layout{grid-template-columns:1fr}.detail-poster{width:145px}.detail-backdrop{height:350px}}
