@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=Exo+2:wght@300;400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;700&family=Rajdhani:wght@300;400;500;600&display=swap');
        
    /* For Chrome, Edge, Safari */
    ::-webkit-scrollbar {
        width: 10px;
        background: transparent;
    }
    ::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, #ff1e56 0%, #ff4b2b 100%);
        border-radius: 8px;
        box-shadow: 0 0 8px 2px #ff1e56, 0 0 2px 0 #ff4b2b;
    }
    ::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(180deg, #ff4b2b 0%, #ff1e56 100%);
        box-shadow: 0 0 12px 4px #ff1e56, 0 0 4px 0 #ff4b2b;
    }

    /* For Firefox */
    * {
        scrollbar-width: thin;
        scrollbar-color: #ff1e56 #18181b;
    }
        .hidden { display: none; }
        :root {
            --neon-red: #ff0040;
            --dark-red: #cc0033;
            --glass-bg: rgba(255, 255, 255, 0.05);
            --glass-border: rgba(255, 255, 255, 0.1);
        }

        body {
            font-family: 'Exo 2', sans-serif;
            background: linear-gradient(135deg, #0a0a0a 0%, #1a0a0a 50%, #0a0a0a 100%);
            overflow-x: hidden;
        }

        .neon-glow {
            box-shadow: 0 0 20px var(--neon-red), 0 0 40px var(--neon-red), 0 0 60px var(--neon-red);
        }

        .glass-morphism {
            background: var(--glass-bg);
            backdrop-filter: blur(10px);
            border: 1px solid var(--glass-border);
        }

        .holographic {
            background: linear-gradient(45deg, rgba(255, 0, 64, 0.1), rgba(255, 0, 64, 0.05), rgba(255, 255, 255, 0.02));
            backdrop-filter: blur(15px);
        }

        .waveform-bar {
            animation: waveform 1.5s ease-in-out infinite alternate;
        }

        @keyframes waveform {
            0% {
                height: 20%;
            }

            100% {
                height: 100%;
            }
        }

        .floating {
            animation: float 3s ease-in-out infinite;
        }

        @keyframes float {

            0%,
            100% {
                transform: translateY(0px);
            }

            50% {
                transform: translateY(-10px);
            }
        }

        .glow-text {
            text-shadow: 0 0 10px var(--neon-red), 0 0 20px var(--neon-red);
        }

        .carousel-item {
            transition: all 0.3s ease;
        }

        .carousel-item:hover {
            transform: scale(1.05);
            box-shadow: 0 10px 30px rgba(255, 0, 64, 0.3);
        }

        .track-item:hover {
            background: rgba(255, 0, 64, 0.1);
            transform: translateX(10px);
        }

        .nav-item:hover {
            color: var(--neon-red);
            text-shadow: 0 0 10px var(--neon-red);
        }