.particles {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.particle {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(244, 201, 93, 0.72);
  box-shadow: 0 0 18px rgba(244, 201, 93, 0.65);
  animation: drift var(--duration, 12s) linear infinite;
}

@keyframes drift {
  from { transform: translate3d(var(--x, 0), 110vh, 0) scale(0.7); opacity: 0; }
  12% { opacity: 1; }
  80% { opacity: 0.9; }
  to { transform: translate3d(calc(var(--x, 0) + 40px), -10vh, 0) scale(1.2); opacity: 0; }
}

.coin-core { animation: pulseGlow 3.2s ease-in-out infinite; }
@keyframes pulseGlow {
  0%, 100% { transform: translateY(0) rotate(-4deg); }
  50% { transform: translateY(-10px) rotate(4deg); }
}

.success-pop { animation: successPop 700ms cubic-bezier(.2,1.5,.3,1); }
@keyframes successPop {
  from { transform: scale(0.82); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

.coin-burst {
  position: absolute;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #fff4b8, #e7ab2c 65%, #7c4c10);
  animation: burst 900ms ease-out forwards;
}

@keyframes burst {
  to { transform: translate(var(--dx), var(--dy)) rotate(420deg); opacity: 0; }
}

[data-animations="off"] *, [data-animations="off"] *::before, [data-animations="off"] *::after {
  animation: none !important;
  transition: none !important;
}