:root {--color-bg: #f8f9fa;--color-surface: #ffffff;--color-text: #1a202c;--color-primary: #6366f1;--color-secondary: #6c757d;--color-accent: #f59e0b;--radius: 0.75rem;} [data-theme="dark"] {--color-bg: #0f172a;--color-surface: #1e293b;--color-text: #e2e8f0;--color-secondary: #94a3b8;} body {background: var(--color-bg) !important;color: var(--color-text) !important;font-family: 'Inter', sans-serif;} .card {background: var(--color-surface) !important;border: none !important;border-radius: var(--radius) !important;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;transition: transform 0.1s ease;} .card:hover {transform: translateY(-2px);} .nav-link.active {color: var(--color-primary) !important;font-weight: 600;} .btn-primary {background-color: var(--color-primary) !important;border-color: var(--color-primary) !important;} .btn-primary:hover {filter: brightness(1.05);} .sidebar, .offcanvas {transition: all 0.3s ease;} .animate-fade {opacity: 0;animation: fadeInUp 0.8s forwards;}