/* ============ Neon Wildflowers - animations.css ============ */

/* ---------- Neon hero text flicker ---------- */
.hero-tagline{
  text-shadow: 0 0 8px var(--neon-pink), 0 0 18px var(--neon-pink), 0 0 2px #fff;
  animation: neonFlicker 6s infinite;
}
@keyframes neonFlicker{
  0%, 92%, 100% { opacity: 1; }
  93% { opacity: .4; }
  94% { opacity: 1; }
  95% { opacity: .6; }
  96% { opacity: 1; }
}

/* ---------- Floating hero stickers / graffiti tags (spawned by main.js) ---------- */
.floating-sticker{
  position:absolute; font-family: var(--font-deco); pointer-events:none; user-select:none;
  animation: floatUp linear infinite;
  opacity: .35;
}
@keyframes floatUp{
  0% { transform: translateY(20px) rotate(0deg); opacity:0; }
  10% { opacity:.35; }
  90% { opacity:.35; }
  100% { transform: translateY(-420px) rotate(8deg); opacity:0; }
}

/* ---------- Status dot pulse ---------- */
.status-dot{ animation: statusPulse 2.4s ease-in-out infinite; }
@keyframes statusPulse{
  0%, 100% { box-shadow: 0 0 4px var(--member-color); }
  50% { box-shadow: 0 0 14px var(--member-color); }
}

/* ---------- Polaroid tilt (gallery) ---------- */
.masonry-item:nth-child(3n){ transform: rotate(-1deg); }
.masonry-item:nth-child(3n+1){ transform: rotate(1deg); }
.masonry-item:nth-child(3n+2){ transform: rotate(-0.4deg); }

/* ---------- Profile decoration effects ---------- */
.profile-banner.effect-visualizer{
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.18) 0 4px, transparent 4px 10px);
  background-size: 200% 100%;
  animation: visualizerMove 3s linear infinite, none;
}
@keyframes visualizerMove{ 0%{ background-position-x: 0; } 100%{ background-position-x: -200%; } }

.profile-banner.effect-soundwave::after{
  content: ""; position:absolute; inset:0;
  background-image: repeating-linear-gradient(90deg, transparent 0 8px, rgba(255,255,255,.15) 8px 10px);
  animation: soundwavePulse 1.6s ease-in-out infinite;
}
@keyframes soundwavePulse{ 0%,100%{ transform: scaleY(.6); } 50%{ transform: scaleY(1.1); } }

.profile-banner.effect-sparkles::after{
  content: "✦ ✧ ✦ ✧ ✦ ✧ ✦"; position:absolute; inset:0; display:flex; align-items:center; justify-content:space-around;
  font-size: 1.2rem; color:#fff; opacity:.6; animation: sparkleTwinkle 2s ease-in-out infinite;
}
@keyframes sparkleTwinkle{ 0%,100%{ opacity:.2; } 50%{ opacity:.8; } }

.profile-banner.effect-glitch::after{
  content:""; position:absolute; inset:0; background: rgba(255,255,255,.08);
  animation: glitchJump 2.6s steps(1) infinite;
}
@keyframes glitchJump{
  0%, 96%, 100% { clip-path: inset(0 0 100% 0); transform: translateX(0); }
  97% { clip-path: inset(20% 0 60% 0); transform: translateX(-6px); }
  98% { clip-path: inset(50% 0 10% 0); transform: translateX(6px); }
  99% { clip-path: inset(0 0 90% 0); transform: translateX(-3px); }
}

.profile-banner.effect-clouds::after{
  content:"☁ ☁ ☁"; position:absolute; inset:0; display:flex; align-items:center; justify-content:space-around;
  font-size:1.6rem; color:#fff; opacity:.45; animation: cloudDrift 12s linear infinite;
}
@keyframes cloudDrift{ 0%{ transform: translateX(-20px); } 100%{ transform: translateX(20px); } }

.profile-banner.effect-nightclub{
  animation: nightclubFlash 1.4s ease-in-out infinite;
}
@keyframes nightclubFlash{
  0%,100%{ filter: hue-rotate(0deg) brightness(1); }
  50%{ filter: hue-rotate(40deg) brightness(1.25); }
}

.profile-banner.effect-moonstatic::after{
  content:""; position:absolute; inset:0;
  background-image: radial-gradient(rgba(255,255,255,.5) 1px, transparent 1px);
  background-size: 14px 14px; opacity:.25; animation: moonFlicker 4s ease-in-out infinite;
}
@keyframes moonFlicker{ 0%,100%{ opacity:.15; } 50%{ opacity:.35; } }

.profile-banner.effect-pixelglitch::after{
  content:""; position:absolute; inset:0;
  background-image: linear-gradient(rgba(255,255,255,.2) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.2) 1px, transparent 1px);
  background-size: 8px 8px; animation: pixelShift 1.2s steps(4) infinite;
}
@keyframes pixelShift{ 0%{ background-position: 0 0; } 100%{ background-position: 8px 8px; } }

.profile-banner.effect-gemshine::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 30%, rgba(255,255,255,.35) 50%, transparent 70%);
  background-size: 300% 100%; animation: gemSweep 2.6s ease-in-out infinite;
}
@keyframes gemSweep{ 0%{ background-position-x: 100%; } 100%{ background-position-x: -100%; } }

.profile-banner.effect-inkbrush::after{
  content:""; position:absolute; inset:0;
  background-image: repeating-linear-gradient(20deg, rgba(0,0,0,.15) 0 6px, transparent 6px 30px);
  animation: inkDrift 5s ease-in-out infinite;
}
@keyframes inkDrift{ 0%,100%{ opacity:.5; } 50%{ opacity:.85; } }

.profile-banner.effect-petalfall::after{
  content:"❀ ❀ ❀ ❀"; position:absolute; inset:0; display:flex; align-items:flex-start; justify-content:space-around;
  font-size:1.1rem; color:#fff; opacity:.5; animation: petalFall 5s linear infinite;
}
@keyframes petalFall{ 0%{ transform: translateY(-10px) rotate(0deg); } 100%{ transform: translateY(140px) rotate(180deg); } }

/* ---------- Lightbox transition ---------- */
.lightbox-inner{ transform: scale(.92); transition: transform .2s ease; }
.lightbox.open .lightbox-inner{ transform: scale(1); }

/* ---------- Glitch text (error pages) ---------- */
.glitch-text{ position: relative; }
.glitch-text::before, .glitch-text::after{
  content: attr(data-text); position:absolute; left:0; top:0; width:100%;
  clip-path: inset(0 0 0 0);
}
.glitch-text::before{ color: var(--neon-cyan); animation: glitchShift 2.5s infinite; left: -2px; }
.glitch-text::after{ color: var(--neon-purple); animation: glitchShift 2.5s infinite reverse; left: 2px; }
@keyframes glitchShift{
  0%, 90%, 100% { clip-path: inset(0 0 0 0); transform: translate(0,0); }
  91% { clip-path: inset(10% 0 60% 0); transform: translate(-3px,1px); }
  93% { clip-path: inset(60% 0 5% 0); transform: translate(3px,-1px); }
}

@media (prefers-reduced-motion: reduce){
  *{ animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}