body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;margin:0;padding:20px;background-color:#f0f2f5;color:#1c1e21;display:flex;justify-content:center;align-items:flex-start;min-height:100vh}.container{background-color:#fff;padding:25px;border-radius:8px;box-shadow:0 2px 4px #0000001a,0 8px 16px #0000001a;width:100%;max-width:700px}h1{text-align:center;color:#1877f2;margin-bottom:25px;font-size:2em}.api-key-note{background-color:#fffbe6;border:1px solid #ffe58f;color:#8a6d3b;padding:10px 15px;border-radius:4px;margin-bottom:20px;font-size:.9em}.api-key-note p{margin:0}.api-key-note code{background-color:#f9f2f4;padding:2px 4px;border-radius:3px;font-family:monospace}.input-section{margin-bottom:25px;display:flex;flex-direction:column;gap:15px}.input-group{display:flex;flex-direction:column}.input-section label{font-weight:600;margin-bottom:5px;color:#333}.input-section input[type=text]{padding:10px;border:1px solid #dddfe2;border-radius:6px;font-size:1em;width:calc(100% - 22px)}.input-section input[type=text]:focus{border-color:#1877f2;box-shadow:0 0 0 2px #1877f233;outline:none}.input-section button{padding:12px 20px;background-color:#1877f2;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:1.1em;font-weight:600;transition:background-color .2s ease-in-out}.input-section button:hover{background-color:#166fe5}.input-section button:disabled{background-color:#a0c3ff;cursor:not-allowed}.status-message{text-align:center;font-size:1.1em;padding:15px;margin:20px 0;border-radius:6px;display:flex;align-items:center;justify-content:center}.error-message{background-color:#ffebe8;border:1px solid #ffc9c2;color:#c92a2a}#loading .spinner{border:4px solid rgba(0,0,0,.1);width:24px;height:24px;border-radius:50%;border-left-color:#1877f2;animation:spin 1s ease infinite;margin-right:10px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}#results{margin-top:25px;padding:20px;border:1px solid #e0e0e0;border-radius:8px;background-color:#f9fafb}#results h2{text-align:center;margin-bottom:20px;color:#1877f2;font-size:1.5em}#results p{line-height:1.6;color:#333;margin-bottom:10px}#results strong{color:#050505;font-weight:600}.character-details{display:flex;justify-content:space-between;margin-bottom:20px;gap:20px;flex-wrap:wrap}.character-card{background-color:#fff;border:1px solid #dddfe2;border-radius:8px;padding:20px;flex:1;min-width:250px;box-shadow:0 1px 2px #0000000d}.character-card h3{margin-top:0;margin-bottom:15px;color:#1c1e21;border-bottom:1px solid #e7e7e7;padding-bottom:10px;font-size:1.2em}#fight_description{background-color:#e9f5ff;padding:15px;border-radius:6px;border-left:4px solid #1877f2}.footer{margin-top:30px;text-align:center;padding:15px 0;border-top:1px solid #e0e0e0;color:#65676b;font-size:.9em}.footer p{margin:5px 0}.footer a{color:#1877f2;text-decoration:none;font-weight:500}.footer a:hover{text-decoration:underline}