/* V89 - process summary sparks: slower motion, equalized edge speed, only 3 sparks */

/* Hide 4th spark from previous version */
#process .process-summary .summary-spark.spark-4 {
  display: none !important;
}

/* Keep only 3 sparks and make them slightly tighter */
#process .process-summary .summary-spark {
  width: 24px !important;
  height: 10px !important;
}

/*
  Frame is much wider than tall, so the spark must spend much more time
  on top/bottom edges and much less on left/right edges.
  This equalizes perceived speed in horizontal and vertical travel.
*/
@keyframes v89-border-run-balanced {
  0% {
    left: 0%;
    top: 0%;
    transform: translate(-10px,-5px);
  }
  44% {
    left: 100%;
    top: 0%;
    transform: translate(-14px,-5px);
  }
  50% {
    left: 100%;
    top: 100%;
    transform: translate(-14px,-5px);
  }
  94% {
    left: 0%;
    top: 100%;
    transform: translate(-10px,-5px);
  }
  100% {
    left: 0%;
    top: 0%;
    transform: translate(-10px,-5px);
  }
}

/* Slower overall movement */
#process .process-summary .summary-spark.spark-1 {
  animation: v89-border-run-balanced 22s linear infinite !important;
}
#process .process-summary .summary-spark.spark-2 {
  animation: v89-border-run-balanced 22s linear infinite -7.33s !important;
}
#process .process-summary .summary-spark.spark-3 {
  animation: v89-border-run-balanced 22s linear infinite -14.66s !important;
}