#root{margin:0 auto;text-align:center;font-family:Bangers,serif;display:flex;flex-direction:column;align-items:center;background-color:#111;color:#ccc}.character-container{max-width:1280px;text-align:center;padding:20px}.character-container div:nth-child(1){display:flex;justify-content:space-around;align-items:center}.character-container h1{display:flex;font-size:3rem}.character-container input{border-radius:8px;display:flex;width:250px;height:30px;border:1px solid #ccc;background-color:#333;font-size:14px;color:#ccc;text-align:center;margin:0 auto}.character-container input::placeholder{color:#747171;opacity:.7;text-align:center;font-weight:700}.character-list{display:flex;flex-wrap:wrap;gap:24px;justify-content:center;list-style:none}.character-card{width:250px;height:300px;border:1px solid #333;border-radius:10px;overflow:hidden;position:relative;transition:transform .3s ease,box-shadow .3s ease}.character-card:hover{transform:scale(1.05)}.character-image{width:100%;height:100%;object-fit:cover}.character-name{position:absolute;bottom:0;left:0;width:100%;background-color:#ec1d24e6;color:#fff;font-size:16px;text-transform:uppercase;padding:10px;text-align:left;box-shadow:0 -2px 5px #0000004d;font-family:Bangers,cursive;letter-spacing:2px}.character-loading{font-size:4rem}button{background-color:#d32f2f;color:#fff;font-family:Bangers,cursive;margin:10px;font-size:16px;padding:10px 20px;border:none;border-radius:5px;cursor:pointer;transition:background-color .3s ease}button:hover{background-color:#b71c1c}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:1000}.modal-content{background:#fffc;padding:20px;border-radius:8px;display:flex;flex-direction:column;align-items:center;max-width:600px;width:90%;box-shadow:0 4px 10px #0000004d;position:relative;color:#333}.modal-content img{width:350px;height:350px;object-fit:cover;border-radius:8px;margin-right:20px}.modal-content li{list-style:none}.header-container{display:flex;width:100%;height:180px;border-bottom:16px solid rgb(236,29,36);position:relative;justify-content:space-between;padding:0 20px}.header-container img{width:350px;object-fit:cover;transition:transform .3s ease,box-shadow .3s ease}.header-container img:hover{transform:scale(1.05);box-shadow:0 4px 12px #0003}.header-container nav{display:flex;align-items:center;width:100%;justify-content:space-between}.header-container h1{letter-spacing:3px;font-size:3rem}.footer-container{display:flex;flex-direction:row;justify-content:center;padding:20px}.footer-container span{font-size:2rem;color:#fff}.footer-container nav{display:flex;align-items:center}.footer-container div{margin:0 10px}.footer-container img:hover{transform:scale(1.05);box-shadow:0 4px 12px #0003}