@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap";
:root{--bg-primary:#f4f6f8;--bg-secondary:#fff;--bg-tertiary:#e9ecef;--bg-card:#fff;--bg-card-hover:#f8f9fa;--bg-input:#fff;--bg-overlay:#0006;--accent-primary:#022964;--accent-secondary:#043987;--accent-soft:#0229641f;--accent-softer:#0229640f;--accent-glow:#02296433;--accent-gradient:linear-gradient(135deg, #022964 0%, #043987 100%);--text-primary:#1e293b;--text-secondary:#475569;--text-muted:#64748b;--text-inverse:#fff;--success:#10b981;--success-soft:#10b98126;--warning:#f59e0b;--warning-soft:#f59e0b26;--error:#ef4444;--error-soft:#ef444426;--info:#3b82f6;--info-soft:#3b82f626;--border-primary:#e2e8f0;--border-secondary:#cbd5e1;--border-accent:#0229644d;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-full:9999px;--shadow-sm:0 1px 3px #0006;--shadow-md:0 4px 12px #00000080;--shadow-lg:0 8px 32px #0009;--shadow-accent:0 4px 20px #d4a84326;--transition-fast:.15s ease;--transition-base:.25s ease;--transition-slow:.4s ease;--sidebar-width:260px;--sidebar-collapsed:72px;--topbar-height:64px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}button{cursor:pointer;border:none;outline:none;font-family:inherit}input,select,textarea{outline:none;font-family:inherit}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);transition:all var(--transition-base);white-space:nowrap;padding:10px 20px;font-size:.875rem;font-weight:600;display:inline-flex}.btn-primary{background:var(--accent-gradient);color:var(--text-inverse);box-shadow:var(--shadow-accent)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 24px #d4a84340}.btn-secondary{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-secondary)}.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--border-accent)}.btn-danger{background:var(--error-soft);color:var(--error);border:1px solid #f8717133}.btn-danger:hover{background:#f8717133}.btn-sm{padding:6px 14px;font-size:.8125rem}.btn-icon{border-radius:var(--radius-sm);background:var(--bg-tertiary);width:36px;height:36px;color:var(--text-secondary);border:1px solid var(--border-primary);padding:0}.btn-icon:hover{color:var(--accent-primary);border-color:var(--border-accent)}.input-group{flex-direction:column;gap:6px;display:flex}.input-group label{color:var(--text-secondary);letter-spacing:.02em;font-size:.8125rem;font-weight:500}.input-field{background:var(--bg-input);border:1px solid var(--border-secondary);border-radius:var(--radius-md);color:var(--text-primary);transition:border-color var(--transition-fast);padding:10px 14px;font-size:.875rem}.input-field:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-soft)}.input-field::placeholder{color:var(--text-muted)}.card{background:var(--bg-card);border:1px solid var(--border-primary);border-radius:var(--radius-lg);padding:var(--space-lg);transition:all var(--transition-base)}.card:hover{border-color:var(--border-secondary)}.badge{border-radius:var(--radius-full);letter-spacing:.03em;align-items:center;padding:3px 10px;font-size:.75rem;font-weight:600;display:inline-flex}.badge-success{background:var(--success-soft);color:var(--success)}.badge-warning{background:var(--warning-soft);color:var(--warning)}.badge-error{background:var(--error-soft);color:var(--error)}.badge-info{background:var(--info-soft);color:var(--info)}.badge-accent{background:var(--accent-soft);color:var(--accent-primary)}.data-table{border-collapse:separate;border-spacing:0;width:100%}.data-table thead th{text-align:left;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);background:var(--bg-secondary);border-bottom:1px solid var(--border-primary);padding:12px 16px;font-size:.75rem;font-weight:600}.data-table thead th:first-child{border-radius:var(--radius-md) 0 0 0}.data-table thead th:last-child{border-radius:0 var(--radius-md) 0 0}.data-table tbody td{color:var(--text-primary);border-bottom:1px solid var(--border-primary);transition:background var(--transition-fast);padding:14px 16px;font-size:.875rem}.data-table tbody tr:hover td{background:var(--bg-card-hover)}.data-table tbody tr:last-child td{border-bottom:none}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-fade-in{animation:.4s forwards fadeIn}.animate-slide-in{animation:.4s forwards slideInRight}.animate-scale-in{animation:.3s forwards scaleIn}.toast-container{top:var(--space-lg);right:var(--space-lg);z-index:10000;gap:var(--space-sm);flex-direction:column;display:flex;position:fixed}.toast{border-radius:var(--radius-md);box-shadow:var(--shadow-lg);min-width:280px;padding:12px 20px;font-size:.875rem;font-weight:500;animation:.3s slideInRight}.toast-success{color:#a7f3d0;background:#065f46;border:1px solid #34d3994d}.toast-error{color:#fecaca;background:#7f1d1d;border:1px solid #f871714d}.empty-state{padding:var(--space-2xl);color:var(--text-muted);text-align:center;justify-content:center;align-items:center;gap:var(--space-md);flex-direction:column;display:flex}.empty-state svg{opacity:.4}.spinner{border:2px solid var(--border-secondary);border-top-color:var(--accent-primary);border-radius:50%;width:20px;height:20px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.loading-screen{justify-content:center;align-items:center;gap:var(--space-md);min-height:100vh;display:flex}.loading-screen .spinner{width:32px;height:32px}