body {
    background-color: #050505;
    background-image: 
        radial-gradient(circle at 15% 50%, rgba(234, 179, 8, 0.05) 0%, transparent 50%),
        radial-gradient(circle at 85% 30%, rgba(50, 50, 50, 0.3) 0%, transparent 50%);
    background-attachment: fixed;
    background-size: cover;
    animation: pulseBg 15s ease-in-out infinite alternate;
}



@keyframes pulseBg {
    0% { background-position: 0% 0%; }
    100% { background-position: 100% 100%; }
}

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #111; }
::-webkit-scrollbar-thumb { background: #333; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: #eab308; }

.glass-panel {
    background: rgba(15, 15, 15, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(234, 179, 8, 0.15);
}


/* --- ANIMATIONS DES ROLES (Leaderboard) --- */
.role-animated {
    background-size: 200% auto;
    animation: textShine 3s linear infinite;
}

@keyframes textShine {
    to { background-position: 200% center; }
}


.role-admin { 
    background-image: linear-gradient(to right, #ef4444 0%, #eab308 25%, #ef4444 50%, #eab308 75%, #ef4444 100%); 
}

.role-diamond { 
    background-image: linear-gradient(to right, #06b6d4 0%, #cffafe 25%, #06b6d4 50%, #cffafe 75%, #06b6d4 100%); 
}

.role-gold { 
    background-image: linear-gradient(to right, #ca8a04 0%, #fef08a 25%, #ca8a04 50%, #fef08a 75%, #ca8a04 100%); 
}

.role-silver { 
    background-image: linear-gradient(to right, #71717a 0%, #e4e4e7 25%, #71717a 50%, #e4e4e7 75%, #71717a 100%); 
}