/* Effets pseudo — variables partagées */
.name-preview{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;font-weight:900;letter-spacing:.2px;font-size:1.6rem;color:var(--base,#e5e7eb)}
.fx-target{position:relative;display:inline-flex;align-items:center;gap:.5rem;color:var(--base,#e5e7eb)}
/* Neon */
.fx-neon.fx-on{ text-shadow:0 0 6px var(--fx,#8b5cf6),0 0 18px color-mix(in srgb,var(--fx,#8b5cf6) 70%, transparent); animation:fxNeon 1.7s ease-in-out infinite }
@keyframes fxNeon{ 50%{ text-shadow:0 0 12px var(--fx),0 0 32px color-mix(in srgb,var(--fx) 90%, transparent); filter:brightness(1.06) } }
/* Stars */
.fx-stars.fx-on{ position:relative }
.fx-stars.fx-on::after{content:'✦ ✧ ✨ ✧ ✦'; position:absolute; left:-10px; right:-10px; top:-8px; bottom:-8px; pointer-events:none; font-size:.9rem; opacity:.45; color:var(--fx); text-shadow:0 0 6px var(--fx); animation:fxStars 2.2s ease-in-out infinite}
@keyframes fxStars{50%{transform:translateY(-1px) scale(1.02); opacity:.8}}
/* RGB */
.fx-rgb.fx-on{background:linear-gradient(90deg,#ff0040,#ffa600,#ffee00,#19e68c,#00c2ff,#9b5cf6,#ff0040); background-size:200% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:fxRGB 3.2s linear infinite}
@keyframes fxRGB{to{background-position:200% 0}}
/* Fire */
.fx-fire.fx-on{color:#ffd5b0; text-shadow:0 0 6px color-mix(in srgb,var(--fx) 70%, #ff7300), 0 0 20px color-mix(in srgb,var(--fx) 40%, #ff3b00); animation:fxFire 1.1s steps(2,end) infinite}
@keyframes fxFire{50%{filter:hue-rotate(-10deg) brightness(1.08)}}
/* Holo */
.fx-holo.fx-on{background:conic-gradient(from 0deg,#ff9ad5,#f5f5f5,#9ad5ff,#c2ff9a,#ff9ad5); background-size:200% 200%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:fxHolo 3.4s linear infinite}
@keyframes fxHolo{to{background-position:200% 200%}}
/* Scanline */
.fx-scanline.fx-on{position:relative}
.fx-scanline.fx-on::after{content:''; position:absolute; left:0; right:0; top:-30%; height:40%; background:linear-gradient(180deg, transparent, color-mix(in srgb,var(--fx) 60%, transparent), transparent); animation:fxScan 1.6s ease-in-out infinite}
@keyframes fxScan{50%{transform:translateY(180%)}}
/* Comet */
.fx-comet.fx-on{position:relative}
.fx-comet.fx-on::after{content:''; position:absolute; left:0; right:0; bottom:-4px; height:2px; background:linear-gradient(90deg, transparent, var(--fx), transparent); animation:fxComet 1.4s ease-in-out infinite; border-radius:2px}
@keyframes fxComet{0%{transform:translateX(-55%)}50%{transform:translateX(55%)}100%{transform:translateX(-55%)}}
/* Pulse */
.fx-pulse.fx-on{animation:fxPulse 1.6s ease-in-out infinite; text-shadow:0 0 10px color-mix(in srgb,var(--fx) 60%, transparent)}
@keyframes fxPulse{50%{transform:scale(1.02)}}
/* Bounce */
.fx-bounce.fx-on{animation:fxB 1.2s ease-in-out infinite; text-shadow:0 0 8px color-mix(in srgb, var(--fx) 55%, transparent)}
@keyframes fxB{50%{transform:translateY(-1px)}}
/* Laser */
.fx-laser.fx-on{position:relative}
.fx-laser.fx-on::after{content:''; position:absolute; left:-20%; top:-30%; width:140%; height:160%; background:linear-gradient(100deg, transparent 47%, rgba(255,255,255,.85) 50%, transparent 53%); mix-blend-mode:screen; filter:blur(.5px); animation:fxLaser 2s linear infinite}
@keyframes fxLaser{to{transform:translateX(40%)}}
/* Trail */
.fx-trail.fx-on{position:relative}
.fx-trail.fx-on::after{content:attr(data-text); position:absolute; inset:0; pointer-events:none; color:var(--fx); opacity:.20; filter:blur(1.2px); transform:translateX(0); animation:fxTrail 1.2s ease-in-out infinite alternate; mix-blend-mode:screen}
@keyframes fxTrail{to{transform:translateX(2px) translateY(-1px)}}
/* Typewriter */
.fx-typewriter.fx-on{overflow:hidden; animation:fxType 2.2s steps(16,end) infinite}
@keyframes fxType{0%{clip-path:inset(0 100% 0 0)}60%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
/* Quake */
.fx-quake.fx-on{animation:fxQuake .9s steps(2,end) infinite; text-shadow:0 0 8px color-mix(in srgb, var(--fx) 50%, transparent)}
@keyframes fxQuake{50%{transform:translate(.6px,-.4px) skewX(.4deg); filter:blur(.2px)}}

/* --- Badge VIP: exactement comme vip_custom.php --- */
