/* ==========================================================================
   CYBER REFLEX - HOMEPAGE CARD STYLES
   ========================================================================== */

.crx-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    /* max-width: 380px; */
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.crx-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(255, 0, 85, 0.08) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(255, 0, 85, 0.3);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(255, 0, 85, 0.05);
    backdrop-filter: blur(12px);
}

.crx-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(0, 240, 255, 0.35),
                inset 0 0 15px rgba(255, 0, 85, 0.2);
}

.crx-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(255, 0, 85, 0.12);
    border: 1px solid rgba(255, 0, 85, 0.4);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #ff0055;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(255, 0, 85, 0.5);
    margin-bottom: 16px;
}

.crx-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #00f0ff;
    box-shadow: 0 0 10px #00f0ff;
    animation: crxGlowPulse 1.5s infinite ease-in-out;
}

@keyframes crxGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #00f0ff;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #00f0ff, 0 0 22px #00f0ff;
    }
}

.crx-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ffffff 30%, #ff0055 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.crx-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.crx-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.crx-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #ff0055;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.crx-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.crx-game-card:hover .crx-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.crx-game-card:hover .crx-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}

/* ==========================================================================
   EMOJI CYBER GUESS - HOMEPAGE CARD STYLES
   ========================================================================== */

.eqz-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    /* max-width: 380px; */
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.eqz-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(255, 187, 0, 0.1) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(255, 187, 0, 0.3);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(255, 187, 0, 0.05);
    backdrop-filter: blur(12px);
}

.eqz-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(0, 240, 255, 0.35),
                inset 0 0 15px rgba(255, 187, 0, 0.2);
}

.eqz-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(255, 187, 0, 0.12);
    border: 1px solid rgba(255, 187, 0, 0.4);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #ffbb00;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(255, 187, 0, 0.5);
    margin-bottom: 16px;
}

.eqz-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #00f0ff;
    box-shadow: 0 0 10px #00f0ff;
    animation: eqzGlowPulse 1.5s infinite ease-in-out;
}

@keyframes eqzGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #00f0ff;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #00f0ff, 0 0 22px #00f0ff;
    }
}

.eqz-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ffffff 30%, #ffbb00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.eqz-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.eqz-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.eqz-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #ffbb00;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.eqz-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.eqz-game-card:hover .eqz-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.eqz-game-card:hover .eqz-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}
/* ==========================================================================
   NEON GRAVITY DASH - HOMEPAGE CARD STYLES
   ========================================================================== */

.ngd-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    /* max-width: 380px; */
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.ngd-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(0, 255, 204, 0.1) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(0, 255, 204, 0.3);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(0, 255, 204, 0.05);
    backdrop-filter: blur(12px);
}

.ngd-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(0, 240, 255, 0.35),
                inset 0 0 15px rgba(0, 255, 204, 0.2);
}

.ngd-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(0, 255, 204, 0.12);
    border: 1px solid rgba(0, 255, 204, 0.4);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #00ffcc;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(0, 255, 204, 0.5);
    margin-bottom: 16px;
}

.ngd-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ff0055;
    box-shadow: 0 0 10px #ff0055;
    animation: ngdGlowPulse 1.5s infinite ease-in-out;
}

@keyframes ngdGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #ff0055;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #ff0055, 0 0 22px #ff0055;
    }
}

.ngd-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ffffff 30%, #00ffcc 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ngd-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.ngd-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.ngd-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #00ffcc;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.ngd-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.ngd-game-card:hover .ngd-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.ngd-game-card:hover .ngd-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}

/* ==========================================================================
   CYBER BALLOON POP - HOMEPAGE CARD STYLES
   ========================================================================== */
/* ==========================================================================
   NEW GAME HIGHLIGHT & BADGE ANIMATION STYLES
   ========================================================================== */

/* 1. New Game Badge (Top Right Corner) */
.new-game-badge {
    position: absolute;
    top: 14px;
    right: 14px;
    background: linear-gradient(135deg, #ff0055 0%, #ffbb00 100%);
    color: #ffffff;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 1.2px;
    padding: 4px 10px;
    border-radius: 12px;
    box-shadow: 0 0 12px rgba(255, 0, 85, 0.7);
    display: inline-flex;
    align-items: center;
    gap: 4px;
    z-index: 5;
    animation: newBadgePulse 1.8s infinite alternate ease-in-out;
}

.new-badge-spark {
    font-size: 0.7rem;
    display: inline-block;
    animation: spinSpark 3s linear infinite;
}

/* 2. Highlight Card Shimmer & Glowing Border for .is-new */
a.is-new {
    border-color: rgba(255, 0, 85, 0.6) !important;
    animation: newCardBorderGlow 3s infinite alternate ease-in-out;
}

/* Subtle Shimmer Light Pass across the New Card */
a.is-new::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
        45deg,
        transparent 45%,
        rgba(255, 255, 255, 0.08) 50%,
        transparent 55%
    );
    transform: rotate(30deg);
    animation: shimmerLight 4s infinite linear;
    pointer-events: none;
}

/* Keyframe Animations */
@keyframes newBadgePulse {
    0% {
        transform: scale(0.96);
        box-shadow: 0 0 8px rgba(255, 0, 85, 0.5);
    }
    100% {
        transform: scale(1.05);
        box-shadow: 0 0 18px rgba(255, 0, 85, 0.9), 0 0 25px rgba(255, 187, 0, 0.6);
    }
}

@keyframes spinSpark {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

@keyframes newCardBorderGlow {
    0% {
        box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                    0 0 12px rgba(255, 0, 85, 0.2);
    }
    100% {
        box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                    0 0 22px rgba(255, 0, 85, 0.5),
                    inset 0 0 12px rgba(0, 240, 255, 0.2);
    }
}

@keyframes shimmerLight {
    0% {
        transform: translateY(-100%) rotate(30deg);
    }
    100% {
        transform: translateY(100%) rotate(30deg);
    }
}
.cbp-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.cbp-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(255, 0, 200, 0.1) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(255, 0, 200, 0.35);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(255, 0, 200, 0.05);
    backdrop-filter: blur(12px);
}

.cbp-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(0, 240, 255, 0.35),
                inset 0 0 15px rgba(255, 0, 200, 0.2);
}

.cbp-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(255, 0, 200, 0.12);
    border: 1px solid rgba(255, 0, 200, 0.4);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #ff00c8;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(255, 0, 200, 0.5);
    margin-bottom: 16px;
}

.cbp-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #00f0ff;
    box-shadow: 0 0 10px #00f0ff;
    animation: cbpGlowPulse 1.5s infinite ease-in-out;
}

@keyframes cbpGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #00f0ff;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #00f0ff, 0 0 22px #00f0ff;
    }
}

.cbp-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ffffff 30%, #ff00c8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.cbp-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.cbp-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.cbp-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #ff00c8;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.cbp-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.cbp-game-card:hover .cbp-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.cbp-game-card:hover .cbp-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}

/* ==========================================================================
   SPECTRUM SHIFT - HOMEPAGE CARD STYLES
   ========================================================================== */

.sps-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.sps-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(0, 240, 255, 0.12) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 0, 150, 0.05) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(0, 240, 255, 0.35);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(0, 240, 255, 0.05);
    backdrop-filter: blur(12px);
}

.sps-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(255, 0, 200, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(255, 0, 200, 0.35),
                inset 0 0 15px rgba(0, 240, 255, 0.2);
}

.sps-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(0, 240, 255, 0.12);
    border: 1px solid rgba(0, 240, 255, 0.4);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #00f0ff;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(0, 240, 255, 0.5);
    margin-bottom: 16px;
}

.sps-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ff0088;
    box-shadow: 0 0 10px #ff0088;
    animation: spsGlowPulse 1.5s infinite ease-in-out;
}

@keyframes spsGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #ff0088;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #ff0088, 0 0 22px #ff0088;
    }
}

.sps-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #00f0ff 0%, #ff0088 50%, #ffbb00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sps-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.sps-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.sps-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #00f0ff;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.sps-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.sps-game-card:hover .sps-play-btn {
    color: #ff0088;
    text-shadow: 0 0 10px rgba(255, 0, 136, 0.6);
}

.sps-game-card:hover .sps-arrow-icon {
    transform: translateX(6px);
    stroke: #ff0088;
}

/* ==========================================================================
   CYBER REALITY SLIDER - HOMEPAGE CARD STYLES
   ========================================================================== */

.crs-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.crs-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(170, 0, 255, 0.15) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(170, 0, 255, 0.4);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(170, 0, 255, 0.1);
    backdrop-filter: blur(12px);
}

.crs-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(170, 0, 255, 0.4),
                inset 0 0 15px rgba(0, 240, 255, 0.2);
}

.crs-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(170, 0, 255, 0.15);
    border: 1px solid rgba(170, 0, 255, 0.5);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #aa00ff;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(170, 0, 255, 0.5);
    margin-bottom: 16px;
}

.crs-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #00f0ff;
    box-shadow: 0 0 10px #00f0ff;
    animation: crsGlowPulse 1.5s infinite ease-in-out;
}

@keyframes crsGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #00f0ff;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #00f0ff, 0 0 22px #00f0ff;
    }
}

.crs-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ffffff 30%, #aa00ff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.crs-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.crs-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.crs-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #aa00ff;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.crs-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.crs-game-card:hover .crs-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.crs-game-card:hover .crs-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}

/* ==========================================================================
   THE CHAOS ENGINE - HOMEPAGE CARD STYLES
   ========================================================================== */

.ice-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 240px;
    padding: 24px;
    border-radius: 16px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

.ice-theme-neon {
    background: radial-gradient(100% 100% at 0% 0%, rgba(255, 0, 85, 0.15) 0%, rgba(8, 8, 17, 0.95) 100%),
                linear-gradient(135deg, rgba(0, 240, 255, 0.05) 0%, rgba(0, 0, 0, 0.6) 100%);
    border: 1px solid rgba(255, 0, 85, 0.4);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.8),
                0 0 15px rgba(255, 0, 85, 0.1);
    backdrop-filter: blur(12px);
}

.ice-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: rgba(0, 240, 255, 0.8);
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.9),
                0 0 25px rgba(255, 0, 85, 0.4),
                inset 0 0 15px rgba(0, 240, 255, 0.2);
}

.ice-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    padding: 6px 14px;
    border-radius: 20px;
    background: rgba(255, 0, 85, 0.15);
    border: 1px solid rgba(255, 0, 85, 0.5);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 1.5px;
    color: #ff0055;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(255, 0, 85, 0.5);
    margin-bottom: 16px;
}

.ice-badge-pulse {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #00f0ff;
    box-shadow: 0 0 10px #00f0ff;
    animation: iceGlowPulse 1.5s infinite ease-in-out;
}

@keyframes iceGlowPulse {
    0%, 100% {
        transform: scale(0.9);
        opacity: 0.7;
        box-shadow: 0 0 6px #00f0ff;
    }
    50% {
        transform: scale(1.3);
        opacity: 1;
        box-shadow: 0 0 14px #00f0ff, 0 0 22px #00f0ff;
    }
}

.ice-card-content h3 {
    margin: 0 0 8px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.45rem;
    font-weight: 900;
    letter-spacing: 1px;
    background: linear-gradient(90deg, #ff0055 0%, #00f0ff 50%, #ffbb00 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ice-card-content p {
    margin: 0 0 20px 0;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #a0a5c0;
}

.ice-card-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px dashed rgba(255, 255, 255, 0.1);
}

.ice-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #ff0055;
    letter-spacing: 1.2px;
    transition: color 0.3s ease;
}

.ice-arrow-icon {
    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.ice-game-card:hover .ice-play-btn {
    color: #00f0ff;
    text-shadow: 0 0 10px rgba(0, 240, 255, 0.6);
}

.ice-game-card:hover .ice-arrow-icon {
    transform: translateX(6px);
    stroke: #00f0ff;
}

/* ==========================================================================
   THE HOURLY CLASH - VOTING BOOTH DESIGN (NEW VISUAL THEME)
   ========================================================================== */

.hvc-game-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
    min-height: 250px;
    padding: 22px;
    border-radius: 20px;
    text-decoration: none;
    box-sizing: border-box;
    overflow: hidden;
    transition: transform 0.35s cubic-bezier(0.175, 0.885, 0.32, 1.275), 
                box-shadow 0.35s ease, 
                border-color 0.35s ease;
    cursor: pointer;
    font-family: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
}

/* Free Unsplash Voting / Battle Image Overlay + Split Neon Gradient */
.hvc-theme-voting {
    background-color: #080814;
    border: 1px solid rgba(0, 240, 255, 0.4);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.9),
                0 0 20px rgba(255, 0, 85, 0.2);
}

.hvc-card-bg-overlay {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    /* High quality free Unsplash polling/battle abstract texture */
    background-image: linear-gradient(135deg, rgba(255, 0, 85, 0.45) 0%, rgba(5, 5, 18, 0.88) 50%, rgba(0, 240, 255, 0.45) 100%),
                      url('../assets/voters.jpg');
    background-size: cover;
    background-position: center;
    opacity: 0.65;
    transition: opacity 0.35s ease, transform 0.5s ease;
    z-index: 1;
}

.hvc-game-card:hover .hvc-card-bg-overlay {
    opacity: 0.85;
    transform: scale(1.06);
}

/* Content Stacking Over BG */
.hvc-top-badges, .hvc-card-content, .hvc-card-footer {
    position: relative;
    z-index: 2;
}

.hvc-top-badges {
    display: flex;
    gap: 8px;
    align-items: center;
    margin-bottom: 12px;
}

.hvc-card-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 20px;
    background: rgba(0, 240, 255, 0.18);
    border: 1px solid rgba(0, 240, 255, 0.6);
    font-family: 'Orbitron', sans-serif;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 1.2px;
    color: #00f0ff;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(0, 240, 255, 0.6);
    backdrop-filter: blur(6px);
}

.hvc-badge-pulse {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #ff0055;
    box-shadow: 0 0 8px #ff0055;
    animation: hvcGlowPulse 1.2s infinite ease-in-out;
}

@keyframes hvcGlowPulse {
    0%, 100% { transform: scale(0.9); opacity: 0.7; }
    50% { transform: scale(1.3); opacity: 1; box-shadow: 0 0 14px #ff0055; }
}

.hvc-card-content h3 {
    margin: 0 0 6px 0;
    font-family: 'Orbitron', sans-serif;
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: 1.2px;
    background: linear-gradient(90deg, #ffffff 0%, #00f0ff 50%, #ff0055 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: drop-shadow(0 2px 8px rgba(0,0,0,0.8));
}

.hvc-card-content p {
    margin: 0 0 16px 0;
    font-size: 0.92rem;
    line-height: 1.45;
    color: #e0e6ff;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.9);
}

.hvc-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
    border-top: 1px dashed rgba(255, 255, 255, 0.2);
}

.hvc-ballot-icon {
    font-size: 1.4rem;
    filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.5));
    animation: floatIcon 2s infinite ease-in-out;
}

@keyframes floatIcon {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-4px); }
}

.hvc-play-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    font-weight: 800;
    color: #ffffff;
    background: rgba(255, 0, 85, 0.85);
    padding: 8px 16px;
    border-radius: 20px;
    letter-spacing: 1.2px;
    box-shadow: 0 0 15px rgba(255, 0, 85, 0.5);
    transition: all 0.3s ease;
}

.hvc-game-card:hover {
    transform: translateY(-6px) scale(1.02);
    border-color: #00f0ff;
    box-shadow: 0 15px 35px -10px rgba(0, 0, 0, 0.95),
                0 0 30px rgba(0, 240, 255, 0.5);
}

.hvc-game-card:hover .hvc-play-btn {
    background: #00f0ff;
    color: #050510;
    box-shadow: 0 0 20px rgba(0, 240, 255, 0.8);
}

.hvc-game-card:hover .hvc-arrow-icon {
    transform: translateX(5px);
    stroke: #050510;
}


.ao-theme-trading {
    background: rgba(255, 0, 85, 0.85)!important;
    border: 1px solid rgba(0, 240, 255, 0.25)!important;
    box-shadow: 0 8px 24px rgba(0, 240, 255, 0.1)!important;
}

.ao-theme-trading .ngd-badge-pulse {
    background-color: #ffbb00;
}

.ao-theme-trading:hover {
    border-color: #00f0ff;
    box-shadow: 0 12px 30px rgba(0, 240, 255, 0.25);
}

.ngd-card-chart-preview {
    background: rgba(0, 240, 255, 0.04);
    border: 1px dashed rgba(0, 240, 255, 0.2);
    border-radius: 12px;
    padding: 10px;
    margin: 12px 0;
}

.ngd-chart-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 700;
}

.ngd-ticker {
    color: #fff;
    font-family: 'Space Grotesk', sans-serif;
}

.ngd-price-up {
    color: #00ff88;
    font-family: 'Orbitron', sans-serif;
}

.ngd-mini-graph {
    margin-top: 8px;
    height: 35px;
    width: 100%;
}

.ngd-graph-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
}

@keyframes pulseDot {
    0% { r: 3; opacity: 1; }
    50% { r: 6; opacity: 0.5; }
    100% { r: 3; opacity: 1; }
}

.ngd-ping-dot {
    animation: pulseDot 1.2s infinite ease-in-out;
}