*{padding:0;margin:0;box-sizing:border-box;font-family:Poppins,sans-serif}body{min-height:100vh;display:grid;place-items:center;padding:2rem 1rem;background:radial-gradient(circle at top,#ff3b5c,#0f0f14 55%,#0b0b10);color:#fff}.container{width:100%;max-width:850px;border-radius:1.2rem;padding:2rem;background:#1718218c;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.1);box-shadow:0 25px 60px #00000073;position:relative}.container:before{content:"Superhero Finder";display:block;font-size:1.35rem;font-weight:700;letter-spacing:.5px;margin-bottom:1rem;opacity:.95}.container{background:linear-gradient(145deg,#1b1c2b,#11121a);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 25px 50px #0009}.input-container{display:flex;align-items:center;gap:12px;margin-top:1.5rem}input{flex:1;padding:14px 18px;background:#ffffff14;color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:30px;outline:none;font-size:1rem;transition:all .3s ease}input:focus{border-color:#ff2e63;box-shadow:0 0 10px #ff2e6380}button{padding:14px 28px;background:linear-gradient(135deg,#ff2e63,#ff4e7a);color:#fff;border-radius:30px;font-weight:600;cursor:pointer;transition:.3s ease}button:hover{transform:translateY(-2px);box-shadow:0 8px 20px #ff2e6366}.display-container{display:grid;grid-template-columns:220px 1fr;gap:1.25rem;align-items:start;padding-top:.5rem}.container-character-image{width:220px;height:220px;border-radius:1.2rem;overflow:hidden;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);display:grid;place-items:center}.container-character-image img{width:100%;height:100%;object-fit:cover}.character-name{padding:0;margin-top:.2rem;text-align:left;font-size:1.6rem;font-weight:800;text-transform:none}.character-description{margin-top:.8rem;color:#ffffffd1;line-height:1.8;font-weight:300;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);padding:1rem;border-radius:1rem}.list{position:absolute;width:100%;margin-top:8px;background:#1f1f2e;border-radius:15px;overflow:hidden;box-shadow:0 15px 40px #00000080;z-index:1000}.autocomplete-items{padding:12px 18px;cursor:pointer;transition:.2s}.autocomplete-items:hover{background-color:#ff2e63;color:#fff}@media (max-width: 720px){.display-container{grid-template-columns:1fr}.container-character-image{width:100%;height:260px}.character-name{text-align:center}}