/* Nick gracza (profile.js): przycisk w nagłówku (wygląd: style.css .nick-chip) i dymek do zmiany nicku - bez okna modalnego */

.nick-pop {
  position: absolute; top: calc(100% + 12px); right: 0; z-index: 70; width: min(340px, calc(100vw - 24px));
  display: flex; flex-direction: column; gap: 8px; padding: 14px 14px 12px; border-radius: 8px;
  background: linear-gradient(#2a2527, #171416); color: var(--text);
  box-shadow: inset 0 0 0 1px var(--gold-2), inset 0 0 0 3px #0c0d0d, 0 12px 30px rgba(0, 0, 0, 0.7);
  animation: nick-pop-in 0.16s ease-out;
}
.nick-pop[hidden] { display: none; }
/* Strzałka wskazująca przycisk z nickiem */
.nick-pop::before {
  content: ""; position: absolute; top: -7px; right: 26px; width: 12px; height: 12px; transform: rotate(45deg);
  background: #2a2527; box-shadow: -1px -1px 0 0 var(--gold-2);
}
@keyframes nick-pop-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.nick-pop-title { margin: 0; font: 800 1rem var(--font-display); color: var(--gold); text-shadow: 0 1px 1px #000; }
.nick-pop-lead { margin: 0; font-size: 0.84rem; line-height: 1.45; color: var(--text-2); }
.nick-form { display: flex; flex-direction: column; gap: 8px; }
.nick-pop-row { display: flex; gap: 8px; }
.nick-pop-row input { flex: 1; min-width: 0; }
.nick-pop-row .btn { flex: none; padding: 0 16px; }
.nick-error { margin: 0; text-align: left; font-size: 0.8rem; }
.nick-pop-skip {
  align-self: flex-start; padding: 2px 0; border: 0; background: none; cursor: pointer;
  font: inherit; font-size: 0.8rem; color: var(--muted); text-decoration: underline;
}
.nick-pop-skip:hover, .nick-pop-skip:focus-visible { color: var(--gold-2); }

@media (max-width: 560px) {
  /* Na telefonie dymek na całą szerokość pod nagłówkiem */
  .nick-pop { position: fixed; top: calc(var(--header-h) + 8px); left: 12px; right: 12px; width: auto; }
  .nick-pop::before { right: 34px; }
  .nick-pop-row .btn { padding: 0 14px; }
}
@media (prefers-reduced-motion: reduce) { .nick-pop { animation: none; } }