:root{--header-bg: #282c34;--text-light: white;--text-muted: #757575;--hover-bg: #777;--border-color: #cdcbcb;--modal-bg: #29121266;--modal-box-shadow: 0 2px 20px #0000004d, 0 4px 6px #0000004d}.App{text-align:center}main{display:flex;flex-direction:column;align-items:center}.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}header{background-color:var(--header-bg);color:var(--text-light);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:20px;height:150px}.header-bottom{display:flex;width:100%;justify-content:space-around}footer{padding:1rem}button{background-color:var(--header-bg);color:var(--text-light);cursor:pointer;font-size:16px;font-weight:700;transition:background-color .3s ease}button:hover{background-color:var(--hover-bg);color:var(--text-light)}.search-box,.search-bar,.search-bar form{display:flex}.movie-card{display:flex;flex-direction:column;align-items:center;width:185px;margin:.5rem;border:1px solid var(--border-color);border-radius:6px;overflow:hidden;transition:all .3s ease}.movie-card:hover{transform:scale(1.04);box-shadow:0 1px 3px #0000000d,0 4px 6px #0000001a}.movie-card .info{padding:.5rem;width:100%}.movie-card .info p{font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.movie-card .info p:first-of-type{font-weight:700}.movie-card .info p:last-of-type{color:var(--text-muted)}.movie-list{display:flex;flex-wrap:wrap;justify-content:center}h3{font-size:1.8rem}.modal{position:fixed;z-index:1;top:0;right:0;bottom:0;left:0;overflow:auto;background-color:var(--modal-bg)}.modal .content{background-color:#fefefe;margin:8% auto;padding:8px 20px 0;border:1px solid #888;border-radius:10px;box-shadow:var(--modal-box-shadow);width:80%}.modal .content .info{display:flex;flex-direction:column;align-items:center;padding:40px 10px}.modal .content .info p{margin-top:1rem}.modal .content .info p span{font-weight:700}.modal .content .close{align-self:flex-start;float:right;color:#aaa;font-size:28px;font-weight:700;cursor:pointer}.modal .content .close:hover,.modal .content .close:focus{color:#000;text-decoration:none}#movieTitleId,.close-btn{margin-bottom:1rem}@media (max-width: 600px){header{height:180px}.header-bottom{flex-direction:column;align-items:center}.header-bottom select{margin-top:1rem;width:297px;height:28px}.search-bar{flex-direction:column;gap:10px}.search-bar form{flex-direction:column}}*,*:before,*:after{box-sizing:border-box}*{margin:0}@media (prefers-reduced-motion: no-preference){html{interpolate-size:allow-keywords}}body{line-height:1.5;-webkit-font-smoothing:antialiased;font-family:Arial,Helvetica,sans-serif}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}