.credential-orb::before {
  animation: radar-pulse 2.4s ease-out infinite;
}

.credential-orb::after {
  animation: radar-ring 2.4s ease-in-out infinite;
}

.credential-orb .radar-sweep {
  position: absolute;
  inset: 9px;
  overflow: hidden;
  border-radius: 50%;
  animation: radar-rotate 2.8s linear infinite;
}

.radar-sweep::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(
    from 0deg,
    transparent 0 72%,
    rgba(141, 215, 230, 0.04) 80%,
    rgba(141, 215, 230, 0.42) 99%,
    transparent 100%
  );
}

.radar-sweep::after {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 1px;
  height: 50%;
  transform-origin: 50% 100%;
  background: linear-gradient(rgba(223, 250, 255, 0.92), rgba(141, 215, 230, 0.08));
  box-shadow: 0 0 5px rgba(141, 215, 230, 0.72);
}

.credential-orb .radar-target {
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #dffaff;
  box-shadow: 0 0 6px rgba(141, 215, 230, 0.95);
  opacity: 0.14;
  animation: radar-hit 2.8s ease-in-out infinite;
}

.target-a {
  top: 19px;
  left: 20px;
  animation-delay: 0.15s;
}

.target-b {
  top: 28px;
  right: 16px;
  animation-delay: 1.05s;
}

.target-c {
  bottom: 14px;
  left: 29px;
  animation-delay: 1.85s;
}

@keyframes radar-rotate {
  to { transform: rotate(360deg); }
}

@keyframes radar-pulse {
  0% { transform: scale(0.86); opacity: 0.15; }
  55% { opacity: 0.55; }
  100% { transform: scale(1.12); opacity: 0; }
}

@keyframes radar-ring {
  0%, 100% { transform: scale(0.96); opacity: 0.3; }
  50% { transform: scale(1.04); opacity: 0.75; }
}

@keyframes radar-hit {
  0%, 22%, 100% { transform: scale(0.65); opacity: 0.12; }
  28%, 42% { transform: scale(1.45); opacity: 1; }
  55% { transform: scale(0.8); opacity: 0.25; }
}

@media (prefers-reduced-motion: reduce) {
  .credential-orb::before,
  .credential-orb::after,
  .credential-orb .radar-sweep,
  .credential-orb .radar-target {
    animation: none;
  }
}