:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:#ffffffde;font-synthesis:none;text-rendering:optimizeLegibility;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}body{background-color:#5cb3be}.header-container{color:#fff;text-align:center;background-color:#5cb3be;grid-template-columns:1fr auto;padding:30px 40px;display:grid}.header-title{justify-content:center;align-items:center;margin:0;padding:0 0 0 10px;font-size:2.5rem;font-style:italic;display:flex}.nav-links{justify-content:right;gap:35px;margin-top:10px;display:flex}.nav-links button{color:#fff;cursor:pointer;background:0 0;border:none;padding:10px 0 0;font-size:16px}.nav-links button.active{font-weight:600;text-decoration:underline}.nav-links input[type=text]{background-color:#227681;border:none;border-radius:4px;height:20px;margin-top:10px;padding:5px;font-size:14px}.nav-links input[type=text]::placeholder{color:#eee}.nav-links input[type=text]:focus{outline:none}.sort-by{width:100px;margin-bottom:20px}.sort-by-options{flex-direction:column;height:100px;display:flex}.assort-by{width:100px;margin-bottom:20px}.watch-movies{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;padding:1rem 0;display:grid}.movie-card{background:#fff;border-radius:6px;flex-direction:column;display:flex;overflow:hidden;box-shadow:0 1px 4px #00000014}.movie-poster{object-fit:cover;width:100%;height:auto}.movie-info{padding:.5rem .75rem 1rem}.movie-title{color:#333;margin:0 0 .25rem;font-size:1rem}.movie-date{color:#666;margin:0 0 .5rem;font-size:.85rem}.movie-desc{color:#333;opacity:.98;max-height:4.5rem;margin:0;font-size:.9rem;transition:max-height .8s,opacity .2s;overflow:hidden}.movie-desc.expanded{opacity:1;max-height:1000px;overflow:hidden}.movie-card .read-more{color:#333;cursor:pointer;background:0 0;border:1px solid #333;border-radius:5px;margin-top:.5rem;padding:8px;font-size:.95rem}.movie-card .read-more:focus{outline-offset:2px;outline:2px solid #cfe9ff}