/* Live person-code feedback only. The coach's scanner uses its original styles. */
[data-qr-person].is-celebrating {
  width: min(100%, 22rem);
  min-height: 22rem;
}
[data-qr-person] .qr-person-celebration {
  background: #fff1c9;
  color: #613314;
  border: 3px solid #ce672f;
  box-shadow: 0 8px 24px rgba(97, 51, 20, .18);
  gap: .65rem;
  padding: 1.25rem;
  pointer-events: auto;
  isolation: isolate;
}
[data-qr-person] .qr-person-celebration > :not(button) { pointer-events: none; }
[data-qr-person] .qr-person-celebration strong {
  position: relative;
  z-index: 1;
  font-size: clamp(2rem, 7vw, 3rem);
  font-weight: 900;
  line-height: 1.1;
}
[data-qr-person] .qr-celebration-name { font-size: 1.2rem; line-height: 1.25; }
[data-qr-person] [data-qr-confirm-welcome] {
  font-size: clamp(1.15rem, 4.8vw, 1.5rem);
  font-weight: 900;
  line-height: 1.25;
}
[data-qr-person] .qr-person-stickers {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .8rem;
}
[data-qr-person] .qr-person-stickers img { width: 48px; height: 48px; }
[data-qr-person] .qr-person-stickers img:nth-child(2) { width: 64px; height: 64px; }
[data-qr-person] .qr-person-celebration.is-active .qr-person-stickers img {
  animation: qr-person-sticker-bounce 1.4s ease-in-out infinite;
}
[data-qr-person] .qr-person-stickers img:nth-child(2) { animation-delay: .2s; }
[data-qr-person] .qr-person-stickers img:nth-child(3) { animation-delay: .4s; }
[data-qr-person] .qr-person-celebration.is-active strong {
  animation: qr-person-title-pop 1.8s ease-in-out infinite;
}
[data-qr-person] .qr-person-dismiss {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  border: 0;
  border-radius: .4rem;
  background: transparent;
  cursor: pointer;
}
[data-qr-person] .qr-person-dismiss:focus-visible {
  outline: 3px solid #613314;
  outline-offset: 4px;
}
[data-qr-person] .qr-person-dismiss-hint {
  font-size: .75rem;
  line-height: 1.4;
  color: #784420;
}
@keyframes qr-person-sticker-bounce {
  0%, 100% { transform: translateY(0) rotate(-8deg); }
  50% { transform: translateY(-8px) rotate(8deg); }
}
@keyframes qr-person-title-pop {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}
@media (prefers-reduced-motion: reduce) {
  [data-qr-person] .qr-person-celebration.is-active strong,
  [data-qr-person] .qr-person-celebration.is-active .qr-person-stickers img {
    animation: none;
  }
}