@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
    
    body { font-family: 'Inter', sans-serif; }
    
    .chart-container { 
        position: relative; 
        width: 100%; 
        max-width: 800px; 
        margin-left: auto; 
        margin-right: auto; 
        height: 350px; 
        max-height: 400px;
    }

    .card-hover:hover { 
        transform: translateY(-2px);
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    }
    
    /* Dark mode specific hover shadow adjustment */
    .dark .card-hover:hover {
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.3);
    }

    .transition-all { 
        transition-property: all; 
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); 
        transition-duration: 300ms;
    }
    
    /* Custom Scrollbar */
    ::-webkit-scrollbar { width: 8px; }
    ::-webkit-scrollbar-track { background: #f1f5f9; }
    ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
    ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

    /* Dark Mode Scrollbar */
    .dark ::-webkit-scrollbar-track { background: #0f172a; }
    .dark ::-webkit-scrollbar-thumb { background: #334155; }
    .dark ::-webkit-scrollbar-thumb:hover { background: #475569; }