/* Explain: App-specific component classes (e.g., glow effects, card styles). */
.glow-text {
    text-shadow: 0 0 14px rgba(0, 229, 255, 0.55);
}

.glow-box {
    box-shadow: 0 0 28px rgba(0, 229, 255, 0.28);
}

.btn-neon {
    transition: all 0.3s ease;
}

.btn-neon:hover {
    box-shadow: 0 0 28px rgba(0, 229, 255, 0.5);
}

.card-gaming {
    background: var(--surface-color);
    border: 1px solid var(--border-color);
    transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.card-gaming:hover {
    transform: translateY(-6px);
    border-color: var(--primary-color);
    box-shadow: 0 18px 40px rgba(0, 229, 255, 0.16);
}

.marquee-track {
    animation: marquee 28s linear infinite;
}

@keyframes marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}