/* Neon white glow + flickering snow particles — username "exovain" */

.username-block {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.neon-username {
  position: relative;
  display: inline-block;
  font-weight: 700;
  font-size: inherit;
  line-height: 1.25;
  isolation: isolate;
}

/* Soft bloom behind letters */
.neon-username__glow {
  position: absolute;
  inset: 0;
  z-index: 0;
  color: #fff;
  filter: blur(6px);
  opacity: 0.75;
  pointer-events: none;
  animation: neon-bloom 4.2s ease-in-out infinite;
}

/* Main neon white text */
.neon-username__text {
  position: relative;
  z-index: 2;
  color: #ffffff;
  text-shadow:
    0 0 4px rgba(255, 255, 255, 1),
    0 0 10px rgba(255, 255, 255, 0.95),
    0 0 22px rgba(255, 255, 255, 0.75),
    0 0 38px rgba(230, 240, 255, 0.45),
    0 0 56px rgba(200, 220, 255, 0.25);
  animation: neon-flicker 2.8s linear infinite;
}

/* Snow / static particle layers */
.neon-username__snow {
  position: absolute;
  pointer-events: none;
  z-index: 3;
  border-radius: 2px;
  mix-blend-mode: screen;
}

.neon-username__snow--a {
  inset: -0.35em -0.65em -0.15em;
  background-image:
    radial-gradient(circle, rgba(255,255,255,0.95) 0 0.6px, transparent 0.7px),
    radial-gradient(circle, rgba(255,255,255,0.7) 0 0.45px, transparent 0.55px),
    radial-gradient(circle, rgba(255,255,255,0.85) 0 0.5px, transparent 0.6px);
  background-size: 14px 18px, 11px 13px, 16px 20px;
  background-position: 0 0, 6px 4px, 3px 9px;
  opacity: 0.55;
  animation: snow-drift-a 3.2s steps(8) infinite, snow-flicker 1.4s steps(4) infinite;
}

.neon-username__snow--b {
  inset: -0.2em -0.5em -0.35em;
  background-image:
    radial-gradient(circle, rgba(255,255,255,0.9) 0 0.55px, transparent 0.65px),
    radial-gradient(circle, rgba(255,255,255,0.55) 0 0.35px, transparent 0.45px);
  background-size: 18px 14px, 9px 11px;
  background-position: 2px 1px, 10px 7px;
  opacity: 0.4;
  animation: snow-drift-b 4.1s steps(10) infinite reverse, snow-flicker 2.1s steps(5) infinite 0.3s;
}

.neon-username__snow--c {
  inset: -0.45em -0.4em -0.25em;
  background-image:
    radial-gradient(circle, rgba(255,255,255,1) 0 0.7px, transparent 0.8px),
    radial-gradient(circle, rgba(255,255,255,0.65) 0 0.4px, transparent 0.5px),
    radial-gradient(circle, rgba(255,255,255,0.8) 0 0.55px, transparent 0.65px);
  background-size: 12px 16px, 15px 12px, 10px 14px;
  background-position: 4px 2px, 1px 8px, 8px 5px;
  opacity: 0.35;
  animation: snow-drift-c 5s steps(12) infinite, snow-flicker 1.8s steps(6) infinite 0.6s;
}

/* Calm neon flicker — subtle power surges like reference image */
@keyframes neon-flicker {
  0%, 100% {
    opacity: 1;
    filter: brightness(1);
    text-shadow:
      0 0 4px rgba(255, 255, 255, 1),
      0 0 10px rgba(255, 255, 255, 0.95),
      0 0 22px rgba(255, 255, 255, 0.75),
      0 0 38px rgba(230, 240, 255, 0.45);
  }
  6% {
    opacity: 0.88;
    filter: brightness(1.25);
  }
  7% {
    opacity: 1;
    filter: brightness(0.92);
  }
  8% {
    opacity: 0.94;
    filter: brightness(1.15);
  }
  9% { opacity: 1; filter: brightness(1); }
  42% {
    opacity: 0.96;
    filter: brightness(1.08);
  }
  43% {
    opacity: 0.82;
    filter: brightness(1.35);
    text-shadow:
      0 0 6px rgba(255, 255, 255, 1),
      0 0 16px rgba(255, 255, 255, 1),
      0 0 30px rgba(255, 255, 255, 0.85),
      0 0 48px rgba(230, 240, 255, 0.55);
  }
  44% { opacity: 1; filter: brightness(1); }
  72% {
    opacity: 0.9;
    filter: brightness(1.2);
  }
  73% { opacity: 1; filter: brightness(0.98); }
}

@keyframes neon-bloom {
  0%, 100% { opacity: 0.65; transform: scale(1); }
  43% { opacity: 0.95; transform: scale(1.02); }
  72% { opacity: 0.78; transform: scale(1.01); }
}

@keyframes snow-drift-a {
  0% { transform: translate(0, 0); }
  25% { transform: translate(2px, -3px); }
  50% { transform: translate(-1px, 2px); }
  75% { transform: translate(3px, 1px); }
  100% { transform: translate(0, 0); }
}

@keyframes snow-drift-b {
  0% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(-2px, 2px) scale(1.02); }
  66% { transform: translate(2px, -2px) scale(0.98); }
  100% { transform: translate(0, 0) scale(1); }
}

@keyframes snow-drift-c {
  0% { transform: translate(0, 0); opacity: 0.35; }
  40% { transform: translate(1px, 3px); opacity: 0.55; }
  70% { transform: translate(-2px, -1px); opacity: 0.3; }
  100% { transform: translate(0, 0); opacity: 0.35; }
}

@keyframes snow-flicker {
  0%, 100% { opacity: 0.45; }
  25% { opacity: 0.75; }
  50% { opacity: 0.35; }
  75% { opacity: 0.65; }
}

/* Verified badge — GIF or SVG */
.verified-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  vertical-align: middle;
  line-height: 0;
}

.verified-badge__gif,
.verified-badge svg {
  width: 1.35em;
  height: 1.35em;
  object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.35));
}

.profile-header .username-block,
.home-hero .profile-hero__username-row .username-block {
  font-size: 1.05rem;
}

.profile-card-mini .username-block {
  font-size: 1rem;
}

@media (prefers-reduced-motion: reduce) {
  .neon-username__text,
  .neon-username__glow,
  .neon-username__snow {
    animation: none !important;
  }

  .neon-username__snow { opacity: 0.35; }
}
