*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{display:flex;justify-content:center;background:#000c36;font-family:Roboto Slab,serif;color:#fff;overflow-y:auto}.app{height:100%;max-width:430px;padding:2em;background:#000c36;display:flex;flex-direction:column}header{text-align:center}.app-logo{width:60px;height:65px}.app-title{margin-top:0;margin-bottom:.1em}.sub-title{margin-top:0;margin-bottom:2em;font-size:.85rem}.landing-page{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center}form{width:100%}.questionnaire{display:flex;flex-direction:column;gap:.5em}label,legend{font-size:1.1rem}textarea{margin-top:.25em;width:100%;resize:none;background:#3b4877;border:none;border-radius:.25em;padding:.75em;font-family:Roboto Slab,serif;font-size:.95rem;line-height:1.25;letter-spacing:.025rem;color:#fff}.chip-select{border:none;padding:0;display:flex;flex-direction:column;gap:.5em}.chip-select legend{margin-bottom:.25em}.chip-select-options{display:flex;flex-wrap:wrap;gap:.75em}.chip-select-option input[type=radio]{display:none}.chip-select-option{display:inline-flex;align-items:center;justify-content:center;border:2px solid transparent;border-radius:.75em;background:#3b4877;padding:.25em .5em;cursor:pointer;font-size:1rem;transition:background .3s ease,border .3s ease}.chip-select-option:hover{background:#4d5988}.chip-select-option:has(input[type=radio]:checked){background:#51e08a;color:#000c36;border-color:#37e075;font-weight:700}button[type=submit]{margin-top:1.25em}.validation-error{color:#ff5f5f;background:#ff5f5f1a;padding:.5em .75em;border-left:3px solid #ff5f5f;border-radius:.25em;margin-bottom:1em;font-size:1rem}.loading-screen,.error-screen{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;font-size:1.5rem;line-height:1.5}.loading-screen{color:#b6c1ff}.error-screen{color:#ff6b6b}.error-message{margin-top:0}.recommendations{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1.25em}.movie-title{margin-top:.25em;margin-bottom:.75em;font-size:1.25rem}.movie-poster{width:100%;height:auto;max-height:600px;object-fit:contain;border-radius:.5em}.movie-description{margin-top:.75em;font-size:1rem;line-height:1.5}button{padding:.75em 1em;width:100%;background:#51e08a;border:none;border-radius:.25em;font-size:1.3rem;font-weight:700;cursor:pointer;transition:background .3s ease,color .3s ease}button:hover{background:#37e075;color:#fff}