:root{--red:#e50914;--red-hover:#b20710}*{box-sizing:border-box;margin:0;padding:0}body{background-color:#141414;margin:0;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px}.header{z-index:1000;background:linear-gradient(#000000b3 0%,#0000 100%);width:100%;height:70px;transition:background-color .4s;position:fixed;top:0}.header.scrolled{background-color:#141414}.header-container{justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:10px 20px;display:flex}.header-left{align-items:center;gap:30px;display:flex}.logo{color:var(--red);cursor:pointer;font-size:1.8rem;font-weight:700}.logo span{color:#fff}.nav-menu ul{gap:20px;padding:0;list-style:none;display:flex}.nav-menu a{color:#e5e5e5;font-size:.9rem;text-decoration:none;transition:all .3s}.nav-menu a:hover{color:#b3b3b3}.header-right{align-items:center;gap:20px;display:flex}.search-box{background:#0006;border:1px solid #fff;border-radius:4px;padding:5px 10px;display:flex}.search-box input{color:#fff;background:0 0;border:none;outline:none;width:150px}.search-box button{cursor:pointer;background:0 0;border:none}.user-profile img{cursor:pointer;border-radius:4px;width:35px;height:35px}.login-btn{background-color:var(--red);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:7px 15px;font-size:.9rem;font-weight:700;transition:background-color .3s}.login-btn:hover{background-color:var(--red-hover)}.user-profile img{cursor:pointer;border:2px solid #0000;border-radius:4px;width:35px;height:35px;transition:border-color .3s}.user-profile img:hover{border-color:#fff}.footer{color:gray;background-color:#111;margin-top:50px;padding:50px 0 20px;font-size:.9rem}.footer-container{max-width:1200px;margin:0 auto;padding:0 20px}.footer-top{flex-wrap:wrap;justify-content:space-between;gap:40px;margin-bottom:30px;display:flex}.footer-brand{flex:1;min-width:250px}.footer-brand p{margin-top:15px;line-height:1.6}.footer-links{flex:1;justify-content:flex-end;gap:60px;min-width:250px;display:flex}.footer-column h4{color:#fff;margin-bottom:20px;font-size:1.1rem}.footer-column ul{padding:0;list-style:none}.footer-column ul li{margin-bottom:10px}.footer-column ul li a{color:gray;text-decoration:none;transition:all .3s}.footer-column ul li a:hover{color:#e50914}.footer-divider{border:0;border-top:1px solid #333;margin-bottom:20px}.footer-bottom{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;display:flex}.social-icons{gap:20px;display:flex}.social-icons a{color:#fff;background:#333;border-radius:50%;justify-content:center;align-items:center;width:35px;height:35px;font-size:.8rem;font-weight:700;text-decoration:none;transition:all .3s;display:flex}.social-icons a:hover{background:#e50914;transform:translateY(-3px)}@media (width<=768px){.footer-links{justify-content:flex-start;gap:30px}}.login-wrapper{background-color:#0000;background-image:linear-gradient(#00000080,#00000080),url(https://assets.nflxext.com/ffe/siteui/vlv3/f841d4c7-10e1-40af-bca1-07e3f8eb14b4/83151835-1823-42e7-8178-8311681a9807/VN-vi-20220502-popsignuptwoweeks-perspective_alpha_website_medium.jpg);background-position:50%;background-repeat:repeat,repeat;background-size:cover;background-attachment:scroll,scroll;background-origin:padding-box,padding-box;background-clip:border-box,border-box;justify-content:center;align-items:center;width:100%;height:100vh;display:flex}.login-card{background-color:#000000bf;border-radius:8px;width:100%;max-width:450px;min-height:550px;padding:60px 68px 40px}.login-card h1{color:#fff;margin-bottom:28px;font-size:2rem;font-weight:700}.input-container{margin-bottom:16px;position:relative}.input-container input{color:#fff;background:#333;border:none;border-radius:4px;outline:none;width:100%;height:50px;padding:16px 20px 0;font-size:1rem}.input-container label{color:#8c8c8c;pointer-events:none;transition:all .2s;position:absolute;top:50%;left:20px;transform:translateY(-50%)}.input-container input:focus+label,.input-container input:not(:placeholder-shown)+label{font-size:.7rem;font-weight:700;top:10px}.btn-login{color:#fff;cursor:pointer;background-color:#e50914;border:none;border-radius:4px;width:100%;margin-top:24px;padding:16px;font-size:1rem;font-weight:700;transition:all .2s}.btn-login:hover{background-color:#c11119}.error-message{color:#fff;background:#e87c03;border-radius:4px;margin-bottom:16px;padding:10px 20px;font-size:.85rem}.login-options{color:#b3b3b3;justify-content:space-between;margin-top:10px;font-size:.8rem;display:flex}.login-options a{color:#b3b3b3;text-decoration:none}.login-options a:hover{text-decoration:underline}.login-signup{color:#737373;margin-top:40px;font-size:1rem}.login-signup a{color:#fff;text-decoration:none}.login-signup a:hover{text-decoration:underline}.movie-detail{color:#fff;min-height:100vh;padding-top:80px;position:relative}.backdrop{filter:brightness(30%)blur(5px);z-index:-1;background-position:50%;background-size:cover;width:100%;height:100%;position:fixed;top:0;left:0}.detail-container{gap:40px;max-width:1200px;margin:0 auto;padding:40px 20px;display:flex}.detail-poster img{border-radius:10px;width:300px;box-shadow:0 0 20px #00000080}.detail-info{flex:1}.detail-info h1{margin-bottom:10px;font-size:3rem}.tagline{color:#aaa;margin-bottom:20px;font-style:italic}.meta{gap:20px;margin-bottom:20px;font-weight:700;display:flex}.rating{color:#ffad19}.genres{gap:10px;margin-bottom:30px;display:flex}.genres span{background:#fff3;border-radius:20px;padding:5px 15px;font-size:.9rem}.overview{color:#ddd;font-size:1.1rem;line-height:1.8}.btn-play{color:#fff;cursor:pointer;background:#e50914;border:none;border-radius:5px;margin-top:30px;padding:12px 30px;font-weight:700}@media (width<=768px){.detail-container{flex-direction:column;align-items:center}.detail-info h1{font-size:2rem}}.movie-container{color:#fff;max-width:1200px;min-height:100vh;margin:0 auto;padding:20px}.movie-list{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:20px;margin:20px 0;display:grid}.movie-card{text-align:left;background-color:#141414;font-size:12px}.movie-card a{color:#fff;-webkit-text-decoration:unset;text-decoration:unset}.movie-card a:hover{color:var(--red-hover)}.movie-poster{border-radius:10px;width:100%;min-height:265px}.movie-poster:hover{cursor:pointer;border-radius:10px;outline:1px solid #fff}.movie-title,.movie-rating,.movie-release-year{min-height:15px;margin:5px 0}.movie-skeleton>*{border-radius:unset!important;background-color:#232323!important}.movie-trending h1{align-items:center;gap:20px;line-height:1;display:flex}.trending-tag{cursor:pointer;border:1px solid;border-radius:5px;justify-content:center;align-items:center;padding:5px 15px;font-size:.6em;display:flex}.trending-tag:hover{background-color:var(--red-hover);color:#fff;border-color:var(--red-hover)}.trending-tag.active{background-color:var(--red);color:#fff;border-color:var(--red);pointer-events:none}.movie-trending{scroll-margin-top:70px}.pagination{flex-direction:row;gap:5px;display:flex}.pagination button,.pagination .page-number{color:#fff;cursor:pointer;box-sizing:border-box;background-color:#141414;border:1px solid;justify-content:center;align-items:center;min-width:32px;min-height:32px;font-size:12px;display:inline-flex}.pagination .page-number.active{pointer-events:none;background-color:var(--red);border-color:var(--red)}.pagination .page-number:hover,.pagination button:hover{color:var(--red-hover)}.pagination button[disabled]{pointer-events:none;color:gray}.genres-page{align-content:stretch;gap:30px;max-width:1400px;margin:80px auto 0;display:flex;overflow:hidden}.genres-sidebar{background:#1a1a1a;border-radius:8px;flex:2;height:auto;padding:15px;position:sticky;top:100px}.genres-sidebar h3{color:#fff;border-bottom:1px solid #333;margin-bottom:20px;padding-bottom:10px}.genres-sidebar ul{padding:0;list-style:none}.genres-sidebar li{color:#bbb;cursor:pointer;white-space:nowrap;border-radius:4px;margin-bottom:5px;padding:12px;transition:all .3s}.genres-sidebar li:hover{color:#fff;background:#333}.genres-sidebar li.active{color:#fff;background:#e50914;font-weight:700}.genres-content{flex:8;scroll-margin-top:90px}.content-header h2{color:#fff;margin-bottom:25px}.content-header h2 span{color:#e50914}@media (width<=768px){.genres-page{flex-direction:column}.genres-sidebar{margin-bottom:20px;position:relative;top:0}.genres-sidebar ul{gap:10px;padding-bottom:10px;display:flex;overflow-x:auto}.genres-sidebar li{white-space:nowrap}}