:root{--primary:#004e92;--primary-dark:#036;--accent:#00c6ff;--bg:#f8fafc;--card-bg:#ffffffe6;--text:#1e293b;--text-light:#64748b;--success:#10b981;--error:#ef4444;--border:#e2e8f0;--font-family:"Inter", system-ui, -apple-system, sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);background-color:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.5}#root{flex-direction:column;min-height:100vh;display:flex}.app-container{flex:1;display:flex}.sidebar{background:linear-gradient(180deg, var(--primary) 0%, var(--primary-dark) 100%);color:#fff;flex-direction:column;gap:2rem;width:280px;padding:2rem;display:flex;box-shadow:4px 0 10px #0000000d}.main-content{flex-direction:column;flex:1;gap:2rem;width:100%;max-width:1200px;margin:0 auto;padding:2.5rem;display:flex}.logo-container{align-items:center;gap:.75rem;font-size:1.25rem;font-weight:700;display:flex}.logo-icon{width:32px;height:32px;color:var(--primary);background:#fff;border-radius:8px;justify-content:center;align-items:center;display:flex}.card{background:var(--card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:12px;padding:1.5rem;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 6px -1px #0000000d,0 2px 4px -1px #00000008}.card:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px #0000001a}.btn{cursor:pointer;border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.875rem;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-outline{border:1px solid var(--border);color:var(--text);background:0 0}.btn-outline:hover{background:#f1f5f9}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover{background:#dc2626}.input-group{flex-direction:column;gap:.5rem;display:flex}.input-group label{color:var(--text-light);font-size:.875rem;font-weight:600}input{border:1px solid var(--border);border-radius:8px;width:100%;padding:.75rem;font-family:inherit;font-size:1rem;transition:border-color .2s}input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 3px #004e921a}h1{color:var(--primary);font-size:1.875rem;font-weight:700}h2{font-size:1.5rem;font-weight:600}h3{font-size:1.25rem;font-weight:600}.text-sm{color:var(--text-light);font-size:.875rem}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;background:#0f172a99;justify-content:center;align-items:center;animation:.3s fadeIn;display:flex;position:fixed;inset:0}.modal-content{text-align:center;background:#fff;border-radius:16px;flex-direction:column;align-items:center;gap:1.5rem;width:90%;max-width:400px;padding:2.5rem;display:flex;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.spinner{border:4px solid #f1f5f9;border-top:4px solid var(--primary);border-radius:50%;width:40px;height:40px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.animate-fade-in{animation:.4s forwards fadeIn}