body{margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app,body{min-height:100vh}.app{display:flex;flex-direction:column}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 20px #0000001a;color:#fff;padding:2rem;text-align:center}.app-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.app-header p{font-size:1.1rem;opacity:.9}.app-content{grid-gap:2rem;display:grid;flex:1 1;gap:2rem;grid-template-columns:350px 1fr;margin:0 auto;max-width:1400px;padding:2rem;width:100%}.sidebar{display:flex;flex-direction:column}.character-grid h3{color:#333;font-size:1.2rem;margin-bottom:1rem}.grid{grid-gap:.75rem;display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));max-height:60vh;overflow-y:auto;padding-right:.5rem}.grid::-webkit-scrollbar{width:6px}.grid::-webkit-scrollbar-track{background:#f1f1f1;border-radius:3px}.grid::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.grid::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.main-content{align-items:flex-start}.main-content,.no-selection{display:flex;justify-content:center}.no-selection{align-items:center;background:#fff;border-radius:20px;box-shadow:0 10px 30px #0000001a;color:#666;font-size:1.2rem;height:400px}@media (max-width:768px){.app-content{gap:1rem;grid-template-columns:1fr;padding:1rem}.app-header h1{font-size:2rem}.app-header p{font-size:1rem}.grid{gap:.5rem;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));max-height:40vh}.main-content{order:-1}.sidebar{order:1}}@media (max-width:480px){.app-header{padding:1rem}.app-header h1{font-size:1.5rem}.app-content{padding:.5rem}.grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}}.fade-in{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}button:focus,input:focus,select:focus{outline:2px solid #667eea;outline-offset:2px}.loading{align-items:center;color:#666;display:flex;height:200px;justify-content:center}.loading:after{animation:spin 1s linear infinite;border:2px solid #f3f3f3;border-radius:50%;border-top-color:#667eea;content:"";height:20px;margin-left:10px;width:20px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}
/*# sourceMappingURL=main.b01cabc8.css.map*/