/* [project]/components/primitives/UserChip.css [app-client] (css) */
.user-chip {
  vertical-align: middle;
  transition: border-color .15s;
}

.user-chip:hover {
  border-color: #6caae58c;
}

.hn-frame-shimmer {
  mix-blend-mode: screen;
  will-change: background-position;
  background: linear-gradient(115deg, #0000 40%, #ffffff8c 50%, #0000 60%) 0 0 / 250% 100% no-repeat;
  animation: 2.4s linear infinite hn-frame-shimmer;
}

@keyframes hn-frame-shimmer {
  0% {
    background-position: 200% 0;
  }

  100% {
    background-position: -100% 0;
  }
}

.hn-frame-sparkle {
  opacity: 0;
  pointer-events: none;
  will-change: opacity, transform;
  z-index: 3;
  background: radial-gradient(circle, #fff 0%, #ffeb99e6 45%, #ffe06600 80%);
  border-radius: 50%;
  width: 5px;
  height: 5px;
  animation: 2s ease-in-out infinite hn-frame-sparkle;
  position: absolute;
  transform: translate(-50%, -50%);
  box-shadow: 0 0 6px 1px #ffffffd9, 0 0 12px 2px #ffe0668c;
}

@keyframes hn-frame-sparkle {
  0%, 100% {
    opacity: 0;
    transform: translate(-50%, -50%)scale(.4);
  }

  45% {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1.2);
  }

  55% {
    opacity: 1;
    transform: translate(-50%, -50%)scale(1.2);
  }
}

@keyframes hn-username-shimmer {
  0% {
    background-position: 200% 0, 0 0;
  }

  100% {
    background-position: -100% 0, 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hn-frame-shimmer {
    background: none;
    animation: none;
  }

  .hn-frame-sparkle {
    opacity: 0;
    animation: none;
  }
}

/*# sourceMappingURL=14rh90e_gv8lj.css.map*/