/* ==========================================================================
   Стили ника игрока на всех страницах сайта (module_page_profiles, css_always).
   Класс .nick-styled ставит assets/js/always.js; две классовые части в селекторе
   нужны, чтобы цвет ника модуля (.admin-nick, топ-цвета и т.п.) не перебивал стиль.
   ========================================================================== */
.nick-styled.nick-style--accent,
.nick-styled.nick-style--sunset,
.nick-styled.nick-style--ocean,
.nick-styled.nick-style--toxic,
.nick-styled.nick-style--aurora,
.nick-styled.nick-style--rainbow,
.nick-styled.nick-style--gold,
.nick-styled.nick-style--fire,
.nick-styled.nick-style--ice {
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.nick-styled.nick-style--accent {
  background-image: linear-gradient(90deg, var(--span), var(--text-default));
}

.nick-styled.nick-style--sunset {
  background-image: linear-gradient(90deg, #ff7a18, #ff3d77 60%, #b44dff);
}

.nick-styled.nick-style--ocean {
  background-image: linear-gradient(90deg, #00e0ff, #0072ff);
}

.nick-styled.nick-style--toxic {
  background-image: linear-gradient(90deg, #d4ff00, #2cff6a);
  filter: drop-shadow(0 0 6px rgba(120, 255, 60, .35));
}

.nick-styled.nick-style--aurora {
  background-image: linear-gradient(90deg, #7f5af0, #2cb67d, #00c2ff, #7f5af0);
  background-size: 300% 100%;
  animation: nick-style-flow 6s linear infinite;
}

.nick-styled.nick-style--rainbow {
  background-image: linear-gradient(90deg, #ff4d4d, #ffb84d, #f9ff4d, #4dff88, #4dd2ff, #a64dff, #ff4d4d);
  background-size: 300% 100%;
  animation: nick-style-flow 4s linear infinite;
}

.nick-styled.nick-style--gold {
  background-image: linear-gradient(110deg, #b8860b 0%, #ffd86b 30%, #fff6c9 45%, #ffd86b 60%, #b8860b 100%);
  background-size: 250% 100%;
  animation: nick-style-shine 3s ease-in-out infinite;
  filter: drop-shadow(0 0 4px rgba(255, 200, 80, .3));
}

.nick-styled.nick-style--neon {
  color: #a8ff8c;
  text-shadow: 0 0 4px #39ff14, 0 0 12px #39ff14, 0 0 24px rgba(57, 255, 20, .6);
  animation: nick-style-pulse 2.4s ease-in-out infinite;
}

.nick-styled.nick-style--pink {
  color: #ffd1f1;
  text-shadow: 0 0 4px #ff2ebd, 0 0 12px #ff2ebd, 0 0 24px rgba(255, 46, 189, .6);
  animation: nick-style-pulse 2.4s ease-in-out infinite;
}

.nick-styled.nick-style--fire {
  background-image: linear-gradient(0deg, #ff3c00, #ff9a00 45%, #ffe259);
  background-size: 100% 200%;
  animation: nick-style-fire 1.6s ease-in-out infinite alternate;
  filter: drop-shadow(0 0 6px rgba(255, 90, 0, .45));
}

.nick-styled.nick-style--ice {
  background-image: linear-gradient(90deg, #ffffff, #bfeaff 40%, #6fd0ff);
  filter: drop-shadow(0 0 6px rgba(120, 210, 255, .45));
}

.nick-styled.nick-style--glitch {
  color: var(--text-default);
  animation: nick-style-glitch 2.5s steps(1) infinite;
}

.nick-styled.nick-style--shadow {
  color: var(--text-default);
  text-shadow: 1px 1px 0 var(--span), 2px 2px 0 var(--span-half), 3px 3px 0 var(--span-middle);
}

@keyframes nick-style-flow {
  to {
    background-position: 300% 0;
  }
}

@keyframes nick-style-shine {
  0%,
  100% {
    background-position: 100% 0;
  }
  50% {
    background-position: 0 0;
  }
}

@keyframes nick-style-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: .78;
  }
}

@keyframes nick-style-fire {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 100%;
  }
}

@keyframes nick-style-glitch {
  0%,
  86%,
  100% {
    text-shadow: 2px 0 rgba(255, 0, 80, .7), -2px 0 rgba(0, 220, 255, .7);
    transform: none;
  }
  88% {
    text-shadow: 3px 0 #ff0050, -3px 0 #00dcff;
    transform: translateX(-1px);
  }
  92% {
    text-shadow: -3px 0 #ff0050, 3px 0 #00dcff;
    transform: translateX(1px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nick-styled {
    animation: none !important;
  }
}
