/* Drawn circles, using the three flat colours sampled from the supplied artwork. */
body[data-confetti="on"] { isolation: isolate; }
body[data-confetti="on"] > .wrap,
body[data-confetti="on"] > .fh { position: relative; z-index: 1; }
.zarya-confetti {
  position: fixed;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  contain: strict;
}
.zarya-confetti-back { z-index: 0; }
.zarya-confetti-front { z-index: 2; }
.confetti-mote {
  position: absolute;
  top: 0;
  left: var(--x);
  width: var(--size);
  height: var(--size);
  animation: confetti-fall var(--fall-time) linear var(--fall-delay) infinite;
}
.confetti-dot {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  animation: confetti-sway var(--sway-time) ease-in-out var(--sway-delay) infinite alternate;
}
.confetti-gold { background: #edc16a; opacity: .42; }
.confetti-green { background: #668160; opacity: .60; }
.confetti-dark { background: #28332f; opacity: .70; }
.zarya-confetti-front .confetti-gold { opacity: .28; }
.zarya-confetti-front .confetti-green { opacity: .32; }
.zarya-confetti-front .confetti-dark { opacity: .28; }
@keyframes confetti-fall {
  0% { transform: translate3d(calc(-50% + var(--drift-start)),-64px,0); opacity: 0; }
  6%,94% { opacity: 1; }
  100% { transform: translate3d(calc(-50% + var(--drift-end)),calc(100vh + 64px),0); opacity: 0; }
}
@keyframes confetti-sway {
  0% { transform: translate3d(calc(-1 * var(--sway)),0,0); }
  43% { transform: translate3d(calc(.35 * var(--sway)),var(--bob),0); }
  100% { transform: translate3d(var(--sway),calc(-1 * var(--bob)),0); }
}
.confetti-paused .confetti-mote,
.confetti-paused .confetti-dot { animation-play-state: paused; }
@media(prefers-reduced-motion:reduce) { .zarya-confetti { display: none; } }
@media print { .zarya-confetti { display: none; } }
