*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}#root{min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:0 20px}.card{background:#fff;border-radius:12px;box-shadow:0 10px 30px #0000001a;padding:2rem;margin:1rem 0;animation:fadeIn .5s ease-out}.btn{padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block;text-align:center}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.btn-secondary{background:#6c757d;color:#fff}.btn-secondary:hover{background:#5a6268;transform:translateY(-2px)}.btn-danger{background:#dc3545;color:#fff}.btn-danger:hover{background:#c82333;transform:translateY(-2px)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.form-group{margin-bottom:1.5rem}.form-input{width:100%;padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:16px;transition:all .3s ease;background:#fff}.form-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.form-input::placeholder{color:#6c757d}.table{width:100%;border-collapse:collapse;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 5px 15px #0000001a}.table th{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:16px;text-align:left;font-weight:600}.table td{padding:16px;border-bottom:1px solid #e9ecef}.table tr:hover{background:#f8f9fa}.alert{padding:12px 16px;border-radius:8px;margin:1rem 0;font-weight:500}.alert-error{background:#f8d7da;color:#721c24;border:1px solid #f5c6cb}.alert-success{background:#d4edda;color:#155724;border:1px solid #c3e6cb}.text-center{text-align:center}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}.mr-2{margin-right:1rem}.flex{display:flex}.justify-between{justify-content:space-between}.align-center{align-items:center}.gap-2{gap:1rem}@media (max-width: 768px){.container{padding:0 15px}.card{padding:1.5rem;margin:.5rem 0}.btn{padding:10px 20px;font-size:14px}.table{font-size:14px}.table th,.table td{padding:12px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}