body {
            background-color: #0a0a12;
            color: #e2e8f0;
            font-family: 'Rajdhani', sans-serif;
            overflow-x: hidden;
        }
        
        /* Custom Scrollbar */
        ::-webkit-scrollbar {
            width: 8px;
        }
        ::-webkit-scrollbar-track {
            background: #0a0a12;
        }
        ::-webkit-scrollbar-thumb {
            background: #333;
            border-radius: 4px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #b026ff;
        }

        /* Neon Glow Utilities */
        .glow-text-purple {
            text-shadow: 0 0 10px rgba(176, 38, 255, 0.7), 0 0 20px rgba(176, 38, 255, 0.5);
        }
        .glow-text-cyan {
            text-shadow: 0 0 10px rgba(0, 243, 255, 0.7), 0 0 20px rgba(0, 243, 255, 0.5);
        }
        .glow-box {
            box-shadow: 0 0 15px rgba(0, 243, 255, 0.3);
        }

        /* Card Hover Effects */
        .game-card {
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        .game-card:hover {
            transform: translateY(-10px) scale(1.02);
            box-shadow: 0 0 30px rgba(176, 38, 255, 0.4);
            border-color: #00f3ff;
        }

        /* Glitch Effect for Title */
        .glitch-wrapper {
            position: relative;
        }
        .glitch-wrapper::before,
        .glitch-wrapper::after {
            content: attr(data-text);
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
        .glitch-wrapper::before {
            left: 2px;
            text-shadow: -1px 0 #ff0099;
            clip: rect(44px, 450px, 56px, 0);
            animation: glitch-anim-1 5s infinite linear alternate-reverse;
        }
        .glitch-wrapper::after {
            left: -2px;
            text-shadow: -1px 0 #00f3ff;
            clip: rect(44px, 450px, 56px, 0);
            animation: glitch-anim-2 5s infinite linear alternate-reverse;
        }
        @keyframes glitch-anim-1 {
            0% { clip: rect(30px, 9999px, 10px, 0); }
            20% { clip: rect(80px, 9999px, 90px, 0); }
            40% { clip: rect(10px, 9999px, 50px, 0); }
            60% { clip: rect(40px, 9999px, 20px, 0); }
            80% { clip: rect(70px, 9999px, 60px, 0); }
            100% { clip: rect(20px, 9999px, 80px, 0); }
        }
        @keyframes glitch-anim-2 {
            0% { clip: rect(60px, 9999px, 10px, 0); }
            20% { clip: rect(10px, 9999px, 80px, 0); }
            40% { clip: rect(50px, 9999px, 20px, 0); }
            60% { clip: rect(20px, 9999px, 60px, 0); }
            80% { clip: rect(80px, 9999px, 10px, 0); }
            100% { clip: rect(40px, 9999px, 90px, 0); }
        }

        /* Modal Animation */
        .modal-enter {
            opacity: 0;
            transform: scale(0.9);
        }
        .modal-enter-active {
            opacity: 1;
            transform: scale(1);
            transition: opacity 300ms, transform 300ms;
        }
        .modal-exit {
            opacity: 1;
        }
        .modal-exit-active {
            opacity: 0;
            transform: scale(0.9);
            transition: opacity 300ms, transform 300ms;
        }