/* --- BASE CONTAINER --- */
.profile_effect_overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
    border-radius: 15px;
    mix-blend-mode: normal;
}

/* ================= 1-20: THE CLASSICS (REMASTERED) ================= */

/* 1. Fire (Smooth Ember Glow) */
.effect_fire {
    background: radial-gradient(circle at 50% 120%, rgba(255, 69, 0, 0.4), transparent 70%);
    box-shadow: inset 0 -20px 50px rgba(255, 69, 0, 0.3);
    filter: blur(2px);
    animation: emberGlow 6s ease-in-out infinite alternate;
}
@keyframes emberGlow { 0% { opacity: 0.6; transform: scale(1); } 100% { opacity: 0.9; transform: scale(1.1); } }

/* 2. Storm (Electric Current) */
.effect_lightning {
    background: 
        repeating-linear-gradient(45deg, transparent, transparent 10px, rgba(0, 255, 255, 0.1) 10px, rgba(0, 255, 255, 0.6) 11px, transparent 12px),
        repeating-linear-gradient(-45deg, transparent, transparent 20px, rgba(255, 255, 255, 0.1) 20px, rgba(255, 255, 255, 0.4) 21px, transparent 22px);
    background-size: 200% 200%;
    box-shadow: inset 0 0 30px rgba(0, 255, 255, 0.4);
    filter: contrast(1.5);
    animation: electricFlow 3s linear infinite;
    mix-blend-mode: screen;
}
@keyframes electricFlow { 0% { background-position: 0% 0%, 0% 0%; } 100% { background-position: 100% 100%, -100% 100%; } }

/* 3. Neon (Cyberpunk Pulse) */
.effect_neon {
    box-shadow: inset 0 0 20px rgba(255, 0, 255, 0.3), inset 0 0 10px rgba(0, 255, 255, 0.3);
    animation: neonBreathe 4s ease-in-out infinite alternate;
}
@keyframes neonBreathe { from { opacity: 0.7; box-shadow: inset 0 0 20px rgba(255,0,255,0.3); } to { opacity: 1; box-shadow: inset 0 0 40px rgba(255,0,255,0.5); } }

/* 4. Glitch (Chromatic Drift) */
.effect_glitch::before {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(255,0,0,0.1), rgba(0,0,255,0.1));
    mix-blend-mode: color-dodge;
    animation: glitchSlide 5s ease-in-out infinite alternate;
    background-size: 200% 100%;
}
@keyframes glitchSlide { 0% { background-position: 0% 50%; } 100% { background-position: 100% 50%; } }

/* 5. Rain */
.effect_rain {
    width: 100%; height: 100%;
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.2) 100%), 
        url('data:image/svg+xml;utf8,%3Csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"%3E%3Crect width="1" height="10" fill="white" opacity="0.3"/%3E%3C/svg%3E');
    background-size: 100% 100%, 20px 40px; animation: rainDrop 0.5s linear infinite;
}
@keyframes rainDrop { from { background-position: 0 0; } to { background-position: 0 100px; } }

/* 6. Snow (Dreamy Flakes) */
.effect_snow {
    background-image: radial-gradient(white 2px, transparent 3px), radial-gradient(rgba(255,255,255,0.7) 1px, transparent 2px);
    background-size: 100px 100px, 50px 50px;
    animation: snowFloat 15s linear infinite;
    opacity: 0.8;
}
@keyframes snowFloat { 0% { background-position: 0 0, 0 0; } 100% { background-position: 50px 200px, -20px 150px; } }

/* 7. Hearts (Soft Love) */
.effect_hearts {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='%23ffb7c5'%3E%3Cpath d='M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    animation: heartRise 8s linear infinite;
    opacity: 0.5;
}
@keyframes heartRise { from { background-position: 0 100%; } to { background-position: 0 0; } }

/* 8. Matrix (Digital Rain) */
.effect_matrix {
    background-image: linear-gradient(0deg, transparent 20%, rgba(0, 255, 70, 0.2) 50%, transparent 80%);
    background-size: 100% 40px;
    animation: matrixScan 4s linear infinite;
}
@keyframes matrixScan { from { background-position: 0 0; } to { background-position: 0 100px; } }

/* 9. Stars (Deep Space) */
.effect_stars {
    background: radial-gradient(1px 1px at 10px 10px, white, transparent), radial-gradient(1px 1px at 50px 50px, white, transparent);
    background-size: 100px 100px;
    animation: starTwinkle 4s ease-in-out infinite alternate;
}
@keyframes starTwinkle { 0% { opacity: 0.3; } 100% { opacity: 0.8; } }

/* 10. Confetti (Celebration) */
.effect_confetti {
    background-image: radial-gradient(#ff6b6b 2px, transparent 3px), radial-gradient(#4ecdc4 2px, transparent 3px);
    background-size: 60px 60px;
    background-position: 0 0, 30px 30px;
    animation: confettiFall 6s linear infinite;
}
@keyframes confettiFall { from { background-position: 0 0, 30px 30px; } to { background-position: 20px 100px, 50px 130px; } }

/* 11. Rainbow (Pastel Gradient) */
.effect_rainbow {
    background: linear-gradient(45deg, rgba(255,0,0,0.1), rgba(255,165,0,0.1), rgba(255,255,0,0.1), rgba(0,128,0,0.1), rgba(0,0,255,0.1), rgba(75,0,130,0.1), rgba(238,130,238,0.1));
    background-size: 400% 400%;
    animation: rainbowFlow 10s ease infinite;
}
@keyframes rainbowFlow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

/* 12. Plasma (Liquid Purple) */
.effect_plasma {
    background: radial-gradient(circle at 50% 50%, rgba(147, 112, 219, 0.3), transparent 60%);
    filter: blur(10px);
    animation: plasmaPulse 5s ease-in-out infinite alternate;
}
@keyframes plasmaPulse { 0% { transform: scale(1); opacity: 0.5; } 100% { transform: scale(1.4); opacity: 0.8; } }

/* 13. Clouds (Moving Mist) */
.effect_clouds {
    background: linear-gradient(to right, transparent 0%, rgba(255,255,255,0.2) 50%, transparent 100%);
    background-size: 200% 100%;
    animation: cloudDrift 10s linear infinite;
    filter: blur(8px);
}
@keyframes cloudDrift { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }

/* 14. Bubbles (Aesthetic Soap Bubbles) */
.effect_bubbles {
    background-image: 
        radial-gradient(circle, rgba(255,255,255,0.1) 30%, rgba(255,255,255,0.6) 60%, transparent 70%),
        radial-gradient(circle, rgba(255,255,255,0.1) 20%, rgba(255,255,255,0.4) 50%, transparent 60%);
    background-size: 60px 60px, 30px 30px; 
    background-position: 0 0, 50px 50px;
    animation: bubbleFloat 12s linear infinite;
    opacity: 0.6;
}
@keyframes bubbleFloat { 
    0% { background-position: 0 100vh, 50px 120vh; }
    25% { background-position: 20px 75vh, 40px 90vh; }
    50% { background-position: 0 50vh, 60px 60vh; }
    75% { background-position: -20px 25vh, 40px 30vh; }
    100% { background-position: 0 -10vh, 50px -10vh; } 
}

/* 15. Gold (Luxury Sheen) */
.effect_gold {
    background: linear-gradient(120deg, transparent 30%, rgba(255, 215, 0, 0.25) 50%, transparent 70%);
    background-size: 200% 100%;
    animation: goldShine 4s infinite;
}
@keyframes goldShine { 0% { background-position: 150%; } 100% { background-position: -50%; } }

/* 16. Spot (Searchlight - Cinematic Sweep) */
.effect_spotlight {
    background: radial-gradient(circle at 50% 50%, transparent 20%, rgba(0,0,0,0.85) 50%);
    animation: searchSweep 6s ease-in-out infinite alternate;
    mix-blend-mode: multiply;
}
@keyframes searchSweep { 
    0% { background-position: 20% 30%; background-size: 150% 150%; } 
    100% { background-position: 80% 70%; background-size: 130% 130%; } 
}

/* 17. Pulse (Radar) */
.effect_pulse {
    box-shadow: inset 0 0 20px rgba(0, 255, 255, 0.4);
    animation: radarPulse 2s infinite ease-in-out;
}
@keyframes radarPulse { 0% { opacity: 0.5; } 50% { opacity: 1; box-shadow: inset 0 0 40px rgba(0,255,255,0.6); } 100% { opacity: 0.5; } }

/* 18. Scanner (Laser Sweep) */
.effect_scanner {
    background: linear-gradient(to bottom, transparent 48%, rgba(50, 205, 50, 0.5) 50%, transparent 52%);
    background-size: 100% 200%;
    animation: scanSweep 3s linear infinite;
}
@keyframes scanSweep { 0% { background-position: 0 0; } 100% { background-position: 0 100%; } }

/* 19. Retro TV (Realistic Tube Screen) */
.effect_tv {
    background: 
        radial-gradient(circle, transparent 50%, rgba(0,0,0,0.6) 100%),
        repeating-linear-gradient(transparent 0, transparent 2px, rgba(0,0,0,0.1) 3px),
        linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,0.05) 50%, rgba(255,255,255,0));
    background-size: 100% 100%, 100% 4px, 100% 100%;
    animation: tvRoll 10s linear infinite;
    mix-blend-mode: overlay;
    box-shadow: inset 0 0 50px rgba(0,0,0,0.5);
}
@keyframes tvRoll { 0% { background-position: 0 0, 0 0, 0 -100vh; } 100% { background-position: 0 0, 0 0, 0 100vh; } }

/* 20. Cosmic (Nebula) */
.effect_cosmic {
    background: radial-gradient(circle at 80% 20%, rgba(255,0,255,0.2), transparent 50%), radial-gradient(circle at 20% 80%, rgba(0,255,255,0.2), transparent 50%);
    mix-blend-mode: screen;
    animation: cosmicShift 8s infinite alternate;
}
@keyframes cosmicShift { 0% { opacity: 0.6; } 100% { opacity: 1; } }


/* ================= 21-50: AESTHETIC SUITE (NEW) ================= */

/* 21. Ocean (Deep Blue Waves) */
.effect_ocean {
    background: linear-gradient(180deg, transparent 0%, rgba(0, 150, 255, 0.15) 50%, rgba(0, 100, 200, 0.3) 100%);
    box-shadow: inset 0 -40px 60px -20px rgba(0, 255, 255, 0.2);
    animation: waveSway 6s ease-in-out infinite alternate;
}
@keyframes waveSway { 0% { background-position: 0 10px; } 100% { background-position: 0 -10px; } }

/* 22. Flowers (Realistic Sakura Petals) */
.effect_flowers {
    /* Soft pink petals, distinct shapes, no cartoon outlines */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath d='M15 0 C5 0 5 10 15 15 C25 10 25 0 15 0 Z' fill='%23ffb7c5' opacity='0.7'/%3E%3C/svg%3E");
    background-size: 25px 25px, 15px 15px;
    background-position: 0 0, 20px 40px;
    animation: flowerSway 14s linear infinite;
}
@keyframes flowerSway { 
    0% { background-position: 0 -10vh, 20px -20vh; transform: rotate(0deg); }
    100% { background-position: -50px 110vh, 60px 110vh; transform: rotate(360deg); }
}

/* 23. Fireworks (Real Explosions) */
.effect_fireworks {
    background-image: 
        radial-gradient(circle, #ff0 2px, transparent 2.5px), 
        radial-gradient(circle, #0ff 2px, transparent 2.5px), 
        radial-gradient(circle, #f0f 2px, transparent 2.5px);
    background-size: 0% 0%;
    background-position: 50% 50%, 20% 20%, 80% 80%;
    animation: fireworkBoom 2.5s infinite ease-out;
}
@keyframes fireworkBoom { 
    0% { background-size: 0% 0%; opacity: 1; } 
    50% { background-size: 50% 50%; opacity: 0.8; } 
    100% { background-size: 100% 100%; opacity: 0; } 
}

/* 24. Roses (Falling Real Petals) */
.effect_roses {
    /* Deep red, realistic heavy petals */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50' width='50' height='50'%3E%3Cpath d='M25 0 C10 10 10 40 25 50 C40 40 40 10 25 0' fill='%238a0303' opacity='0.8'/%3E%3C/svg%3E");
    background-size: 30px 30px;
    animation: roseHeavyFall 12s linear infinite;
}
@keyframes roseHeavyFall {
    0% { background-position: 0 -50px; transform: rotate(0deg); opacity: 0; }
    10% { opacity: 1; }
    100% { background-position: 30px 120vh; transform: rotate(180deg); opacity: 0.8; }
}

/* 25. Kitty (Bouncing Bows) */
.effect_kitty {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff80ab'%3E%3Cpath d='M12 14c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm-5-3c-1.5 0-2.5 1-2.5 2.5S5.5 16 7 16s2.5-1 2.5-2.5S8.5 11 7 11zm10 0c-1.5 0-2.5 1-2.5 2.5s1 2.5 2.5 2.5 2.5-1 2.5-2.5S18.5 11 17 11z'/%3E%3C/svg%3E");
    background-size: 35px 35px;
    animation: cuteBounce 2s ease-in-out infinite alternate;
}
@keyframes cuteBounce { from { transform: translateY(0) rotate(-5deg); } to { transform: translateY(-15px) rotate(5deg); } }

/* 26. Halloween (Spooky Bats) */
.effect_halloween {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ff6600' opacity='0.5'%3E%3Cpath d='M12 2c-4 0-8 3-8 3s2 1 2 3c0 0-2 0-3 2s5 3 9 3 9-3 9-3-3-2-3-2 2-2 2-3-4-3-8-3z'/%3E%3C/svg%3E");
    background-size: 50px 50px;
    animation: batFly 10s linear infinite;
}
@keyframes batFly { 0% { background-position: -50px 100%; } 100% { background-position: 100% -50px; } }

/* 27. Flutter (Ethereal Butterfly Wings) */
.effect_butterfly {
    /* Soft, glowing butterfly silhouette */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white' opacity='0.6'%3E%3Cpath d='M12 2C7 2 7 9 12 9C17 9 17 2 12 2ZM12 10C6 10 2 14 2 18C2 22 8 22 12 18C16 22 22 22 22 18C22 14 18 10 12 10Z'/%3E%3C/svg%3E");
    background-size: 40px 40px;
    filter: drop-shadow(0 0 5px rgba(255,192,203,0.8));
    animation: butterflyFloat 8s ease-in-out infinite;
}
@keyframes butterflyFloat {
    0% { background-position: 10% 100%; transform: scale(0.8); }
    50% { background-position: 80% 50%; transform: scale(1); }
    100% { background-position: 20% -20%; transform: scale(0.8); }
}

/* 28. Galaxy (Purple Space) */
.effect_galaxy {
    background: radial-gradient(circle at center, rgba(75, 0, 130, 0.4), transparent 80%), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='white'%3E%3Ccircle cx='10' cy='20' r='1' opacity='0.5'/%3E%3Ccircle cx='80' cy='60' r='1' opacity='0.3'/%3E%3C/svg%3E");
    background-size: 100% 100%, 100px 100px;
    animation: spaceTwist 20s linear infinite;
}
@keyframes spaceTwist { from { background-position: 0 0; } to { background-position: 50px 50px; } }

/* 29. Sparkles (Magic) */
.effect_sparkles {
    background-image: radial-gradient(white 1px, transparent 2px);
    background-size: 20px 20px;
    animation: twinkleSoft 2s infinite alternate;
}
@keyframes twinkleSoft { 0% { opacity: 0.2; } 100% { opacity: 0.8; box-shadow: 0 0 5px white; } }

/* 30. Cozy (Coffee Steam) */
.effect_coffee {
    background: radial-gradient(ellipse at center, rgba(255,255,255,0.4) 0%, transparent 60%);
    background-size: 50% 80%;
    background-position: 50% 100%;
    filter: blur(8px);
    animation: steamRising 4s infinite linear;
    opacity: 0.6;
}
@keyframes steamRising { 0% { background-position: 50% 120%; opacity: 0; } 50% { opacity: 0.6; } 100% { background-position: 50% 20%; opacity: 0; } }

/* 31. Vibe (Music Equalizer) */
.effect_music {
    background: repeating-linear-gradient(90deg, transparent, transparent 10px, rgba(29, 185, 84, 0.4) 10px, rgba(29, 185, 84, 0.4) 15px);
    background-size: 100% 30%;
    background-position: 0 100%;
    background-repeat: repeat-x;
    animation: equalizer 1s infinite alternate ease-in-out;
}
@keyframes equalizer { 0% { background-size: 100% 10%; } 100% { background-size: 100% 40%; } }

/* 32. City (Urban Lights) */
.effect_city {
    background: linear-gradient(90deg, rgba(255, 159, 67, 0.1) 1px, transparent 1px), linear-gradient(rgba(255, 159, 67, 0.1) 1px, transparent 1px);
    background-size: 30px 30px;
    box-shadow: inset 0 -30px 50px rgba(0,0,0,0.8);
}

/* 33. Feathers (Soft Drift) */
.effect_feathers {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='white' opacity='0.4'%3E%3Cpath d='M19 13c-2 0-4.5-2.5-4.5-2.5S13 13 11 13s-5-3.5-5-3.5 1 5 3 7c2 2 4 3 6 3s4-2 6-4c.5-1-1-2.5-2-2.5z'/%3E%3C/svg%3E");
    background-size: 60px 60px;
    animation: featherFall 8s ease-in-out infinite;
}
@keyframes featherFall { 0% { background-position: 0 0; } 50% { background-position: 20px 40px; } 100% { background-position: 0 80px; } }

/* 34. Electric (Blue Zap) */
.effect_electric {
    box-shadow: inset 0 0 15px rgba(0, 210, 211, 0.5);
    border: 1px solid rgba(0, 210, 211, 0.3);
    animation: zapFlicker 3s infinite;
}
@keyframes zapFlicker { 0%, 100% { opacity: 0.8; } 5% { opacity: 1; } 10% { opacity: 0.8; } }

/* 35. Pixel (Aesthetic Floating Particles) */
.effect_pixel {
    /* Floating pixel bits, not just a static icon */
    background-image: linear-gradient(45deg, #ff6b6b 2px, transparent 2px);
    background-size: 20px 20px;
    opacity: 0.7;
    animation: pixelFloatUp 8s linear infinite;
}
@keyframes pixelFloatUp { 0% { background-position: 0 100%; } 100% { background-position: 20px 0; } }

/* 36. Frost (Icy Glass) */
.effect_frost {
    background: radial-gradient(circle, rgba(200, 240, 255, 0.15) 0%, transparent 70%);
    backdrop-filter: blur(1px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.1);
}

/* 37. Vaporwave (Sunset Gradient) */
.effect_vaporwave {
    background: linear-gradient(180deg, rgba(255, 159, 243, 0.15), rgba(84, 160, 255, 0.15));
    animation: vaporShift 6s ease-in-out infinite alternate;
}
@keyframes vaporShift { from { filter: hue-rotate(0deg); } to { filter: hue-rotate(15deg); } }

/* 38. Flex (Realistic Falling Cash) */
.effect_cash {
    /* Detailed bill shape green rectangle */
    background-image: linear-gradient(135deg, #85bb65 25%, #6aa34b 25%, #6aa34b 50%, #85bb65 50%, #85bb65 75%, #6aa34b 75%, #6aa34b 100%);
    background-size: 30px 15px;
    opacity: 0.8;
    animation: cashTumble 5s linear infinite;
}
@keyframes cashTumble {
    0% { background-position: 0 -20px; transform: rotateX(0deg); }
    100% { background-position: 20px 100vh; transform: rotateX(360deg); }
}

/* 39. XOXO (Fading Lipstick Prints) */
.effect_kisses {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 20'%3E%3Cpath d='M15 10 Q20 0 25 5 Q30 10 25 15 Q20 20 15 15 Q10 20 5 15 Q0 10 5 5 Q10 0 15 10 Z' fill='%23ff0055' opacity='0.4' filter='blur(1px)'/%3E%3C/svg%3E");
    background-size: 50px 50px;
    background-repeat: space;
    animation: kissBreathe 4s ease-in-out infinite alternate;
}
@keyframes kissBreathe { 0% { opacity: 0.3; transform: scale(0.95); } 100% { opacity: 0.7; transform: scale(1.05); } }

/* 40. Wish (Real Shooting Star) */
.effect_shootingstar {
    overflow: hidden;
}
.effect_shootingstar::after {
    content: ""; position: absolute; top: -50px; right: -50px;
    width: 200px; height: 2px;
    /* Fading tail for realism */
    background: linear-gradient(to left, rgba(255,255,255,0), rgba(255,255,255,1) 50%, rgba(255,255,255,0));
    transform: rotate(-45deg);
    animation: realShoot 6s infinite ease-in-out;
    filter: drop-shadow(0 0 4px white);
}
@keyframes realShoot {
    0% { transform: translate(0, 0) rotate(-45deg); opacity: 0; }
    10% { opacity: 1; }
    30% { transform: translate(-400px, 400px) rotate(-45deg); opacity: 0; }
    100% { opacity: 0; }
}

/* 41. Bubblegum (Pink Pop) */
.effect_bubblegum {
    background: radial-gradient(circle at 50% 50%, rgba(253, 121, 168, 0.2), transparent 70%);
    box-shadow: inset 0 0 30px rgba(253, 121, 168, 0.4);
    mix-blend-mode: screen;
}

/* 42. Tropical (Sunset Vibes) */
.effect_tropical {
    background: linear-gradient(to top, rgba(250, 177, 160, 0.3), rgba(255, 234, 167, 0.1));
    border-bottom: 2px solid rgba(250, 177, 160, 0.5);
}

/* 43. Angel (Divine Light) */
.effect_angel {
    background: radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.6) 0%, transparent 60%);
    box-shadow: inset 0 0 20px rgba(255, 255, 255, 0.4);
    animation: angelGlow 4s ease-in-out infinite alternate;
}
@keyframes angelGlow { 0% { opacity: 0.5; } 100% { opacity: 0.9; } }

/* 44. Demon (Dark Mist) */
.effect_demon {
    background: linear-gradient(to top, rgba(139, 0, 0, 0.4), transparent);
    box-shadow: inset 0 -20px 40px rgba(0, 0, 0, 0.6);
}

/* 45. Drip (Liquid Gloss Slime) */
.effect_slime {
    /* Glossy, high-res liquid drip effect */
    background: linear-gradient(180deg, rgba(50,255,50,0.8) 0%, rgba(50,255,50,0.4) 40%, transparent 100%);
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20' preserveAspectRatio='none'%3E%3Cpath d='M0 0 H100 V10 Q90 20 80 10 Q70 0 60 10 Q50 20 40 10 Q30 0 20 10 Q10 20 0 10 Z' fill='black'/%3E%3C/svg%3E");
    mask-size: 100% 40px;
    mask-repeat: repeat-x;
    animation: glossyDrip 4s infinite linear;
}
@keyframes glossyDrip { 0% { mask-position: 0 -30px; } 100% { mask-position: 0 10px; } }

/* 46. Gamer (RGB Border) */
.effect_gamer {
    box-shadow: inset 0 0 15px rgba(0,0,0,0.5);
    border: 2px solid transparent;
    animation: rgbBorderCycle 4s linear infinite;
}
@keyframes rgbBorderCycle { 
    0% { border-color: #ff6b6b; box-shadow: inset 0 0 10px #ff6b6b; } 
    33% { border-color: #54a0ff; box-shadow: inset 0 0 10px #54a0ff; } 
    66% { border-color: #1dd1a1; box-shadow: inset 0 0 10px #1dd1a1; } 
    100% { border-color: #ff6b6b; box-shadow: inset 0 0 10px #ff6b6b; } 
}

/* 47. UFO (Alien Grid) */
.effect_alien {
    background: 
        linear-gradient(rgba(57, 255, 20, 0.2) 1px, transparent 1px),
        linear-gradient(90deg, rgba(57, 255, 20, 0.2) 1px, transparent 1px);
    background-size: 20px 20px;
    box-shadow: inset 0 0 40px rgba(57, 255, 20, 0.3);
    perspective: 500px;
    transform: scale(1.1);
    animation: gridFloat 5s linear infinite;
}
@keyframes gridFloat { 0% { background-position: 0 0; } 100% { background-position: 0 20px; } }

/* 48. Meadow (Fresh Green) */
.effect_meadow {
    background: linear-gradient(to top, rgba(186, 220, 88, 0.25) 0%, transparent 50%);
    animation: meadowBreeze 6s ease-in-out infinite alternate;
}
@keyframes meadowBreeze { 0% { opacity: 0.4; } 100% { opacity: 0.8; } }

/* 49. Moon (Night Sky) */
.effect_moon {
    background: radial-gradient(circle at 85% 15%, rgba(246, 229, 141, 0.8) 5%, rgba(246, 229, 141, 0.1) 15%, transparent 30%);
    background-color: rgba(19, 15, 64, 0.2);
}

/* 50. Cherry (Iconic Pair Bobbing) */
.effect_cherry {
    /* Double cherry shape */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23d63031'%3E%3Ccircle cx='6' cy='12' r='4'/%3E%3Ccircle cx='14' cy='12' r='4'/%3E%3Cpath d='M6 12 Q10 2 14 12 M10 7 L12 4' stroke='%232d3436' stroke-width='1' fill='none'/%3E%3C/svg%3E");
    background-size: 30px 30px;
    opacity: 0.8;
    animation: cherryBob 3s ease-in-out infinite alternate;
}
@keyframes cherryBob { 0% { transform: translateY(0); } 100% { transform: translateY(-10px) rotate(5deg); } }




























.chat_avatar { display:table-cell; width:50px; vertical-align:top; position:relative; }
.cavatar  { height:50px; width:50px; border-radius:50%; display:block; overflow:hidden; cursor:pointer; }



.private_avatar { display:table-cell; width:50px; vertical-align:top; padding:0 5px; }
.avatar_private { display:block; height:40px; width:40px; border-radius:50%; overflow:hidden; }

.user_item_avatar { display:table-cell; vertical-align:middle; width:46px; position:relative; }
.user_item_avatar .acav { width:46px; height:46px; border-radius:50%; display:block; cursor:pointer; }

#private_av_wrap { width:40px; }
#private_av { cursor:pointer; width:40px; height:40px; display:block; border-radius:50%; }