@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.48; transform: scale(0.82); }
}

.pulse-dot {
  animation: pulse 1.8s var(--ease) infinite;
}

.draw-line {
  stroke-dasharray: var(--len, 1000);
  stroke-dashoffset: var(--len, 1000);
  animation: draw 1.25s var(--ease-out) forwards;
  animation-delay: var(--delay, 0s);
}

@keyframes draw {
  to { stroke-dashoffset: 0; }
}

.pop-in {
  transform-box: fill-box;
  transform-origin: center bottom;
  opacity: 0;
  animation: popIn 0.55s var(--ease-out) forwards;
  animation-delay: var(--delay, 0s);
}

@keyframes popIn {
  from { opacity: 0; transform: scaleY(0.3); }
  to { opacity: 1; transform: scaleY(1); }
}

.pop-dot {
  transform-box: fill-box;
  transform-origin: center;
  opacity: 0;
  animation: popDot 0.36s var(--ease-out) forwards;
  animation-delay: var(--delay, 0s);
}

@keyframes popDot {
  from { opacity: 0; transform: scale(0); }
  to { opacity: 1; transform: scale(1); }
}
