:root{--color-background:#eff1f5;--color-primary:#4c4f69;--color-accent:#8caaee;--color-secondary:#ef9f76;--color-text:#5c5f77;--color-primary-light:#a78bfa;--color-primary-dark:#5b21b6;--color-accent-light:#22d3ee;--color-accent-dark:#0891b2;--color-white:#fff;--color-gray-50:#f8fafc;--color-gray-100:#f1f5f9;--color-gray-200:#e2e8f0;--color-gray-300:#cbd5e1;--color-gray-400:#94a3b8;--color-gray-500:#64748b;--color-gray-600:#475569;--color-gray-700:#334155;--color-gray-800:#1e293b;--color-gray-900:#0f172a;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#3b82f6;--shadow-sm:0 1px 2px 0 rgba(124,58,237,.05);--shadow-md:0 4px 6px -1px rgba(124,58,237,.1);--shadow-lg:0 10px 15px -3px rgba(124,58,237,.1);--shadow-xl:0 20px 25px -5px rgba(124,58,237,.1);--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--radius-xl:12px;--radius-full:9999px;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:16px;--spacing-lg:24px;--spacing-xl:32px;--spacing-2xl:48px;--font-size-xs:12px;--font-size-sm:14px;--font-size-base:16px;--font-size-lg:18px;--font-size-xl:20px;--font-size-2xl:24px;--font-size-3xl:32px;--font-size-4xl:48px;--font-size-5xl:56px;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--transition-fast:.15s ease;--transition-base:.2s ease;--transition-slow:.3s ease;--navbar-height:60px;--content-max-width:1200px}body{background-color:var(--color-background);color:var(--color-text);font-size:var(--font-size-base)}.bg-primary{background-color:var(--color-primary)}.bg-accent{background-color:var(--color-accent)}.bg-secondary{background-color:var(--color-secondary)}.bg-background{background-color:var(--color-background)}.text-primary{color:var(--color-primary)}.text-accent{color:var(--color-accent)}.text-secondary{color:var(--color-secondary)}.text-default{color:var(--color-text)}.text-white{color:var(--color-white)}.btn-primary{background-color:var(--color-primary);color:var(--color-white);padding:var(--spacing-md)var(--spacing-xl);border-radius:var(--radius-lg);font-weight:var(--font-weight-semibold);transition:all var(--transition-base);cursor:pointer;border:none}.btn-primary:hover{background-color:var(--color-accent);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.btn-accent{background-color:var(--color-accent);color:var(--color-white);padding:var(--spacing-md)var(--spacing-xl);border-radius:var(--radius-lg);font-weight:var(--font-weight-semibold);transition:all var(--transition-base);cursor:pointer;border:none}.btn-accent:hover{background-color:var(--color-primary);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card{background-color:var(--color-white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md);border:2px solid var(--color-gray-200)}.card-primary{background-color:var(--color-white);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-md);border:2px solid var(--color-primary)}.link{color:var(--color-accent);transition:color var(--transition-fast);text-decoration:none}.link:hover{color:var(--color-primary)}.navbar{background-color:var(--color-background);border-bottom:4px solid var(--color-background);box-shadow:var(--color-background)}.navbar .logo{color:var(--color-accent);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);letter-spacing:-1px}.navbar .nav-link{color:var(--color-primary);font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);opacity:.9}.navbar .nav-link:hover{color:var(--color-accent);opacity:100}.input{border:2px solid var(--color-gray-300);border-radius:var(--radius-md);padding:var(--spacing-sm)var(--spacing-md);font-size:var(--font-size-base);transition:border-color var(--transition-fast)}.input:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px rgba(124,58,237,.1)}.table-header{background-color:var(--color-gray-100);border-bottom:2px solid var(--color-primary);font-weight:var(--font-weight-semibold)}.table-row:hover{background-color:var(--color-gray-50)}.badge-primary{background-color:var(--color-primary);color:var(--color-white);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.badge-accent{background-color:var(--color-accent);color:var(--color-white);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.badge-secondary{background-color:var(--color-secondary);color:var(--color-gray-900);padding:var(--spacing-xs)var(--spacing-sm);border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.fade-in{animation:fadeIn var(--transition-slow)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.slide-up{animation:slideUp var(--transition-slow)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}[data-tutorial-active=true]{border-radius:6px;position:relative;z-index:9999!important}.viz-grid::-webkit-scrollbar{display:none}