*{margin:0;padding:0;box-sizing:border-box}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0a0a0a}body{background-color:#0a0a0a}button{cursor:pointer}.header{width:100%;height:70px;background-color:transparent;display:flex;justify-content:flex-end;padding:0 15px 0 3%;position:absolute;top:0;right:0;z-index:10}.search{width:35%;height:70px;display:flex;align-items:center;justify-content:flex-end;gap:15px}.searchBox{width:fit-content;height:38px;background-color:#252728b3;border-radius:25px;display:flex;gap:20px;justify-content:space-around;align-items:center;padding-left:20px;padding-right:20px;font-weight:620}.searchBox>input{color:#fff;font-size:16px;background-color:transparent;border:none;outline:none;align-items:center;margin-top:2px;width:200px;margin-left:none}.header-icon{width:25px;height:35px;border-radius:50px}.header-icon:hover{background-color:#4b4747}.user{width:45px;height:45px;background-color:#252728b3;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;border:none;outline:none}.searchResults{width:100%;height:100vh;background-color:#000000e6;position:fixed;z-index:20;top:0;left:0;padding-top:100px}.featuresShows{height:280px;display:flex;justify-content:center;align-items:center;position:relative;border-radius:8px;overflow:hidden;transition:transform .3s ease}.featuresShows>img{height:100%;width:100%;object-fit:cover;border-radius:8px;transition:.5s}.featuresShows>img:hover{transform:scale(1.05)}.movieTitle{width:100%;height:50px;background-color:#000000b3;position:absolute;align-self:flex-end;font-weight:700;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:.3s;bottom:0;padding:0 10px;text-align:center}.movieTitle:hover{height:70px;background-color:#000c}.fav{width:100%;background-color:transparent;padding:5px 0;margin-bottom:20px}.title{font-size:1.5rem;font-weight:600;margin-bottom:15px;color:#fff}.shows{width:100%;padding:15px 0;display:flex;gap:30px;overflow-x:auto;scrollbar-width:thin}.shows::-webkit-scrollbar{height:5px}.shows::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}.shows::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:10px}.shows>a{text-decoration:none;color:inherit;min-width:200px;transition:transform .3s ease}.shows>a:hover{transform:scale(1.05);border:4px solid gold;border-radius:10px}.sidebar{width:60px;height:100vh;background-color:#000000e6;display:flex;flex-direction:column;align-items:center;padding:20px 0;position:fixed;z-index:10;left:0;top:0}.logo>img{width:40px;height:40px;margin-top:10px}.home-container{background-color:#0a0a0a;min-height:100vh;color:#fff}.hero-banner{position:relative;height:80vh;width:100%;background-size:cover;background-position:center;margin-bottom:30px}.hero-banner:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to right,#000000e6,#000000b3,#0006 60%,#0000001a)}.hero-content{position:relative;height:100%;width:100%;display:flex;align-items:center;padding:0 5%}.movie-title-container{max-width:600px}.movie-title{font-size:3.5rem;font-weight:700;margin-bottom:10px;background:linear-gradient(to right,#f5c518,#e2b616);-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 4px rgba(0,0,0,.5)}.newly-added{display:inline-block;color:#3a9bdc;font-weight:600;margin-bottom:15px}.movie-meta{display:flex;align-items:center;gap:8px;margin-bottom:20px;color:#fffc;font-size:.95rem}.dot{opacity:.6}.rating{background-color:#fff3;padding:2px 6px;border-radius:4px}.movie-description{margin-bottom:20px;line-height:1.6;color:#ffffffe6}.genre-tags{display:flex;gap:8px;margin-bottom:25px;color:#ffffffb3}.action-buttons{display:flex;gap:15px}.watch-now-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 30px;border-radius:4px;font-weight:600;font-size:1rem;cursor:pointer;border:none;background:linear-gradient(to right,#0072ff,#ff00c8);color:#fff;transition:all .3s ease}.watch-now-btn:hover{transform:scale(1.05)}.add-btn{display:flex;align-items:center;justify-content:center;width:45px;height:45px;border-radius:50%;background-color:#ffffff1a;border:2px solid rgba(255,255,255,.3);color:#fff;cursor:pointer;transition:all .3s ease}.add-btn:hover{background-color:#fff3}.content-section{padding:0 5%;margin-bottom:40px}.content-section>img{margin-left:100px}.section-title{font-size:1.5rem;font-weight:600;margin-bottom:15px}.continue-watching{display:flex;gap:15px;overflow-x:auto;padding-bottom:15px}.continue-watching::-webkit-scrollbar{height:5px}.continue-watching::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}.continue-watching::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:10px}.continue-item{position:relative;min-width:250px;border-radius:8px;overflow:hidden;background:#1a1a1a;padding:10px;text-align:center;transition:transform .3s ease-in-out}.continue-item img{width:100%;height:140px;object-fit:cover}.continue-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;flex-direction:column;align-items:center;justify-content:center;opacity:0;transition:opacity .3s ease-in-out}.continue-item:hover .continue-overlay{opacity:1}.overlay-btn{background-color:linear-gradient(to right,#0072ff,#ff00c8);border:none;color:#fff;font-size:14px;font-weight:600;padding:10px 15px;margin:5px;border-radius:5px;cursor:pointer;transition:background .3s ease}.overlay-btn:hover{background:#fff6}.progress-bar{position:absolute;bottom:0;left:0;right:0;height:4px;background-color:#fff3}.progress{height:100%;background-color:#e50914}.fav-section{padding:20px 0;display:flex;flex-direction:column;margin-left:80px}.fav-movies{display:flex;flex-wrap:wrap;gap:15px;max-width:100%;overflow-x:auto;padding-bottom:10px}.fav-item{width:180px;text-align:center;flex-shrink:0}.fav-img{width:100%;height:auto;border-radius:10px;transition:transform .3s ease}.fav-img:hover{transform:scale(1.05)}.fav-title{margin-top:5px;font-size:14px;color:#fff}@media (max-width: 768px){.hero-banner{height:60vh}.movie-title{font-size:2.5rem}.movie-description{font-size:.9rem}}@media (max-width: 480px){.hero-banner{height:50vh}.movie-title{font-size:2rem}.movie-meta{flex-wrap:wrap}.watch-now-btn{padding:10px 20px}}.logo>img{width:40px;height:40px;margin-bottom:110px;margin-top:10px}.nav-menu{position:relative}.nav-menu ul{list-style:none;display:flex;flex-direction:column;gap:30px;align-items:center;position:relative}.nav-menu li{position:relative}.nav-menu a{color:#fff9;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;transition:all .2s ease;position:relative}.nav-menu a:hover{color:#fff;font-weight:700;background-color:#ffffff1a}.nav-menu a:after{content:attr(data-tooltip);position:absolute;left:50px;top:50%;transform:translateY(-50%);background-color:#000c;color:#fff;padding:5px 10px;font-size:.8rem;white-space:nowrap;border-radius:4px;opacity:0;visibility:hidden;transition:opacity .2s ease,transform .2s ease;pointer-events:none}.nav-menu a:hover:after{opacity:1;visibility:visible;transform:translateY(-50%) translate(5px)}.movie-rating,.movie-duration{font-size:.8rem;color:#ffffffe6}.movie-title{font-size:20px;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;font-weight:bolder}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;color:#fff}.loading-spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.2);border-top:4px solid white;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:10px}@keyframes spin{to{transform:rotate(360deg)}}.error-message{color:red;padding:20px;text-align:center}.movies-page{display:flex;min-height:100vh}.sidebar{width:60px;height:100vh;background-color:#000000e6;display:flex;flex-direction:column;align-items:center;padding:20px 0;position:fixed;z-index:10}.logo{margin-bottom:40px}.star-icon{color:#fff;width:24px;height:24px}.nav-menu ul{list-style:none;display:flex;flex-direction:column;gap:30px;align-items:center}.nav-menu a{color:#fff9;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;transition:all .2s ease}.nav-menu a:hover{color:#fff;background-color:#ffffff1a}.nav-menu a.active{color:#fff;background-color:#ffffff26}.nav-menu svg{width:20px;height:20px}.nav-menu img{width:25px;height:25px}.main-content{flex:1;margin-left:60px;padding:40px;background-color:#0f0f0f}.page-title{font-size:2rem;margin-bottom:30px;font-weight:700}.movies-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:25px}.movie-card{text-decoration:none;color:#fff;transition:transform .2s ease}.movie-card:hover{transform:translateY(-5px)}.movie-poster{position:relative;border-radius:8px;overflow:hidden;aspect-ratio:2 / 3;margin-bottom:10px}.movie-poster img{width:100%;height:100%;object-fit:cover}.movie-overlay{position:absolute;bottom:0;left:0;width:100%;padding:10px;background:linear-gradient(to top,rgba(0,0,0,.8),transparent);display:flex;justify-content:space-between}.movie-title{font-size:18px;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#fff;font-weight:bolder}.movie-year{font-size:.9rem;color:#ffffffb3}@media (max-width: 768px){.movies-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:15px}.main-content{padding:20px}}@media (max-width: 480px){.sidebar{width:50px}.main-content{margin-left:50px;padding:15px}.movies-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}.page-title{font-size:1.5rem;margin-bottom:20px}}