/* Bucket assignment. Units run the intake rail to the splitter and drop
   alternately into the control bucket and the variant bucket. Each landing
   steps that bucket's level up; both stand at the even split from three
   quarters of the cycle until the cohort clears in the last twelfth. */

.pulsar-abtesting-bucket .abtesting-bucket-unit {
  stroke-dasharray: 5 300;
  stroke-dashoffset: 0;
  stroke-linecap: butt;
  animation-duration: 4800ms;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.34, 0, 0.26, 1);
}

.pulsar-abtesting-bucket .abtesting-bucket-unit-a {
  animation-name: abtesting-bucket-unit-a;
}

.pulsar-abtesting-bucket .abtesting-bucket-unit-b {
  animation-name: abtesting-bucket-unit-b;
}

.pulsar-abtesting-bucket .abtesting-bucket-fill {
  transform-box: fill-box;
  transform-origin: bottom center;
  animation-duration: 4800ms;
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.pulsar-abtesting-bucket .abtesting-bucket-fill-a {
  animation-name: abtesting-bucket-fill-a;
}

.pulsar-abtesting-bucket .abtesting-bucket-fill-b {
  animation-name: abtesting-bucket-fill-b;
}

@keyframes abtesting-bucket-unit-b {
  0%,
  6% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
  29% {
    stroke-dashoffset: -100;
    opacity: 1;
  }
  29.5%,
  93% {
    stroke-dashoffset: -100;
    opacity: 0;
  }
  93.5% {
    stroke-dashoffset: 0;
    opacity: 0;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
}

@keyframes abtesting-bucket-unit-a {
  0%,
  42% {
    stroke-dashoffset: 0;
    opacity: 0;
  }
  46% {
    stroke-dashoffset: 0;
    opacity: 1;
  }
  71% {
    stroke-dashoffset: -100;
    opacity: 1;
  }
  71.5%,
  100% {
    stroke-dashoffset: -100;
    opacity: 0;
  }
}

@keyframes abtesting-bucket-fill-b {
  0%,
  26% {
    transform: scaleY(0.55);
  }
  33%,
  88% {
    transform: scaleY(0.82);
  }
  100% {
    transform: scaleY(0.55);
  }
}

@keyframes abtesting-bucket-fill-a {
  0%,
  68% {
    transform: scaleY(0.55);
  }
  75%,
  88% {
    transform: scaleY(0.82);
  }
  100% {
    transform: scaleY(0.55);
  }
}

@media (prefers-reduced-motion: reduce) {
  .pulsar-abtesting-bucket .abtesting-bucket-unit,
  .pulsar-abtesting-bucket .abtesting-bucket-fill {
    animation: none;
  }
  .pulsar-abtesting-bucket .abtesting-bucket-unit-a,
  .pulsar-abtesting-bucket .abtesting-bucket-unit-b {
    opacity: 0;
  }
  .pulsar-abtesting-bucket .abtesting-bucket-fill-a,
  .pulsar-abtesting-bucket .abtesting-bucket-fill-b {
    transform: scaleY(0.82);
  }
}