:root {
            --audi-red: #FF2D00;
            --audi-blue: #0057FF;
            --audi-gray: #1A1A1A;
            --audi-light-gray: #2D2D2D;
            --audi-border: #404040;
        }
        
        * {
            font-family: 'Inter', sans-serif;
        }
        
        .glass-effect {
            background: rgba(255, 255, 255, 0.03);
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.08);
        }
        
        .dashboard-gradient {
            background: linear-gradient(135deg, #0A0A0A 0%, #1A1A1A 50%, #0F0F0F 100%);
        }
        
        .pulse-ring {
            animation: pulse 2s infinite;
        }
        
        @keyframes pulse {
            0% { box-shadow: 0 0 0 0 rgba(255, 45, 0, 0.4); }
            70% { box-shadow: 0 0 0 10px rgba(255, 45, 0, 0); }
            100% { box-shadow: 0 0 0 0 rgba(255, 45, 0, 0); }
        }
        
        .slide-in {
            animation: slideIn 0.3s ease-out;
        }
        
        @keyframes slideIn {
            from { opacity: 0; transform: translateY(-10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        .severity-critical { color: var(--audi-red); }
        .severity-high { color: #FF6B00; }
        .severity-medium { color: #FFD600; }
        .severity-low { color: #00FF88; }
        
        .text-glow {
            text-shadow: 0 0 10px rgba(255, 45, 0, 0.3);
        }
        
        .dashboard-grid {
            background-image: 
                linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
                linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
            background-size: 50px 50px;
        }


        /* Glass Card */

        .glass-card {
  background: rgba(17, 24, 39, 0.7);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.4);
}
        
        /* Mobile Optimizations */
        @media (max-width: 640px) {
            .mobile-padding {
                padding-left: 1rem;
                padding-right: 1rem;
            }
            
            .mobile-text-lg {
                font-size: 1.5rem;
                line-height: 2rem;
            }
            
            .mobile-text-xl {
                font-size: 2rem;
                line-height: 2.5rem;
            }
            
            .mobile-stack {
                display: flex;
                flex-direction: column;
            }
            
            .mobile-center {
                text-align: center;
            }
            
            .mobile-full-width {
                width: 90%;
            }
            
            .mobile-touch-friendly {
                padding: 0.75rem 1rem;
                min-height: 44px;
            }
            
            .mobile-no-overflow {
                overflow-x: hidden;
            }
        }
        
        /* Prevent horizontal overflow */
        html, body {
            overflow-x: hidden;
            max-width: 100%;
        }
        
        /* Better touch targets */
        button, 
        a, 
        input, 
        .clickable {
            touch-action: manipulation;
        }
        
        /* Better scrolling */
        * {
            -webkit-tap-highlight-color: transparent;
        }

        /* ADD “POP” STYLING to thuumbs up */
        .feedback-btn.clicked {
  transform: scale(0.95);
  opacity: 0.8;
}