.sidebar{position:fixed;top:0;left:-240px;width:240px;height:100%;background:#f8f8f8;padding:1rem;box-shadow:2px 0 8px #0000001a;transition:left .3s ease;z-index:1000}.sidebar.open{left:0}.sidebar-close{background:none;border:none;font-size:1.5rem;float:right;cursor:pointer}.sidebar__nav{display:flex;flex-direction:column;margin-top:2rem}.sidebar__nav button{background:none;border:none;padding:.5rem 0;text-align:left;font-size:1rem;cursor:pointer}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0003;opacity:0;visibility:hidden;transition:opacity .3s ease;z-index:999}.sidebar-overlay.visible{opacity:1;visibility:visible}.sidebar__nav button{color:#000}.App-header{position:relative;display:flex;align-items:center;justify-content:center}.menu-btn{position:absolute;left:1rem;background:none;border:none;font-size:1.5rem;cursor:pointer}.movie-card__poster{display:block;width:100%;height:250px;object-fit:cover}.movie-card__info{padding:1rem;text-align:center}.movie-card__title{font-size:1rem;font-weight:600;margin-bottom:.5rem}.movie-card__rating{font-size:.875rem;color:#555}.movie-list{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));padding:1rem}.movie-card{display:flex;flex-direction:column;background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 4px 12px #0000000d;transition:transform .2s ease}.movie-card__poster{display:block;width:100%;height:300px;object-fit:cover}.movie-card__title{font-size:1rem;font-weight:600;line-height:1.2;margin:0 0 .5rem}.movie-card__rating{font-size:.875rem;color:#555;margin-top:auto;/}.favorite-btn{position:absolute;top:.5rem;right:.5rem;background:none;border:none;font-size:1.5rem;cursor:pointer;z-index:1}.movie-card{position:relative;display:flex;flex-direction:column;background:#fff;border-radius:1rem;overflow:hidden;box-shadow:0 4px 12px #0000000d;transition:transform .2s ease}.movie-card:hover{transform:translateY(-4px)}.watched-btn{position:absolute;top:.5rem;left:.5rem;background:none;border:none;font-size:1.4rem;cursor:pointer;opacity:.6}.watched-btn.watched{color:#3498db;opacity:1}.favorite-btn{position:absolute;top:.5rem;right:.5rem;background:none;border:none;font-size:1.5rem;cursor:pointer;opacity:.6}.favorite-btn:hover{opacity:1}.movie-card__poster{width:100%;height:300px;object-fit:cover}.movie-card__info{padding:1rem;display:flex;flex-direction:column}.movie-card__title{font-size:1rem;font-weight:600;margin-bottom:.5rem;line-height:1.2}.movie-card__rating{font-size:.875rem;color:#555;margin-top:auto}.search-bar{display:flex;gap:.5rem;margin:1rem auto;max-width:600px}.search-bar input{flex:1;padding:.5rem;font-size:1rem}.search-bar button{padding:.5rem 1rem;font-size:1rem;cursor:pointer}.sort-dropdown{margin:1rem;display:flex;align-items:center;gap:.5rem}.sort-dropdown select{padding:.5rem;font-size:1rem}.modal-overview{margin-bottom:1.5rem;line-height:1.4}.modal-close-btn{display:block;margin:0 auto;background:#000;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.25rem;cursor:pointer}.modal-backdrop{position:fixed;top:0;left:0;width:100%;height:100%;background:#0009;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#f9f9f9;border-radius:1rem;max-width:90%;width:600px;padding:2rem;box-shadow:0 8px 24px #0003;overflow-y:auto;max-height:90vh}.modal-title{margin-top:0;text-align:center}.modal-backdrop-img{width:100%;border-radius:.5rem;margin:1rem 0}.modal-meta p{margin:.25rem 0}.modal-overview{margin:1rem 0;line-height:1.4}.modal-trailer{margin:1.5rem 0}.modal-trailer h3{margin-bottom:.5rem}.modal-trailer iframe{width:100%;height:315px;border:none;border-radius:.5rem}.modal-close-btn{display:block;margin:1.5rem auto 0;background:#000;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:.25rem;cursor:pointer}.movie-list__container{max-width:1200px;margin:0 auto}.movie-list__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;padding:2rem 1rem}.movie-list{display:grid;gap:1.5rem;padding:2rem 0;grid-template-columns:repeat(1,1fr)}@media (min-width: 600px){.movie-list{grid-template-columns:repeat(2,1fr)}}@media (min-width: 900px){.movie-list{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1200px){.movie-list{grid-template-columns:repeat(4,1fr)}}@media (min-width: 1600px){.movie-list{grid-template-columns:repeat(5,1fr)}}.movie-list__container{max-width:1200px;margin:0 auto;padding:1rem 0}.movie-list__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;padding:0 1rem}.movie-list__load-more{text-align:center;margin:2rem 0}.movie-list__load-more button{background-color:#000;color:#fff;border:none;padding:.75rem 1.5rem;font-size:1rem;border-radius:4px;cursor:pointer}.movie-list__load-more button:disabled{opacity:.5;cursor:default}.movie-list{display:grid;gap:1.5rem;padding:2rem 1rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.movie-list__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.5rem;padding:2rem 1rem}.App{text-align:center}.App-header{background-color:#282c34;display:flex;flex-direction:row;align-items:center;justify-content:space-evenly;color:#fff;padding:20px}@media (max-width: 600px){.movie-card{width:100%}.search-bar{flex-direction:column;gap:10px}.search-bar form{flex-direction:column}}.App{display:flex;flex-direction:column;min-height:100vh}.App-header{padding:1rem}.banner{background-color:#ececec;padding:1rem;display:flex;align-items:center;justify-content:center;gap:1rem}.App-footer{margin-top:auto;padding:1rem;text-align:center;background:#f5f5f5}.App-header .App-logo{color:#fff;text-decoration:none;cursor:pointer}.App-header .App-logo:hover{text-decoration:underline}.app-layout{display:flex;height:100vh}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}.App-header{background:#222;color:#fff;padding:1rem}a .App-footer{margin-top:auto;text-align:center;padding:1rem;background:#f1f1f1}.app-layout{display:flex;height:100vh;overflow:hidden}.main-content{flex:1;display:flex;flex-direction:column;overflow-y:auto}.menu-btn{background:none;border:none;color:#fff;cursor:pointer;margin-right:1rem}body{margin:0;font-family:Arial,sans-serif;background-color:#f4f4f4}button{background-color:#282c34;color:#fff;cursor:pointer;font-size:16px;font-weight:700;transition:background-color .3s ease}button:hover{background-color:#777;color:#fff}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:#f9f9f9;color:#222}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.main-content{flex:1;overflow-y:auto;display:flex;flex-direction:column;background-image:linear-gradient(135deg,#fafafa,#e8e8e8)}