/* Colored sparks and short trails gently burst behind the page content. */
body.spark-objects-enabled {
  isolation: isolate;
}
.spark-object-field {
  position: fixed;
  inset: 0;
  height: 100vh;
  height: 100lvh;
  z-index: -1;
  opacity: .68;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}
body:not([data-page="home"]) .spark-object-field {
  opacity: .64;
}
.ambient-spark {
  position: absolute;
  width: calc(var(--spark-size) * .8);
  height: calc(var(--spark-size) * .8);
  background: currentColor;
  clip-path: polygon(50% 0, 59% 39%, 100% 50%, 59% 59%, 50% 100%, 41% 59%, 0 50%, 41% 39%);
  transform-origin: center;
  opacity: 0;
  animation: ambient-spark-scatter var(--spark-duration) linear var(--spark-delay) infinite both;
  will-change: transform, opacity;
}
.ambient-spark--trail {
  clip-path: polygon(50% 0, 61% 43%, 50% 100%, 39% 43%);
}
.ambient-spark--blue {
  color: #369edb;
}
.ambient-spark--violet {
  color: #9164cb;
}
.ambient-spark--mint {
  color: #69bd91;
}
.spark-object-field[data-paused="true"] .ambient-spark {
  animation-play-state: paused;
}
@keyframes ambient-spark-scatter {
  0% {
    transform: var(--spark-start);
    opacity: 0;
  }
  16% {
    transform: var(--spark-middle);
    opacity: .94;
    animation-timing-function: cubic-bezier(.2, .6, .35, 1);
  }
  76% {
    transform: var(--spark-drift);
    opacity: .52;
  }
  100% {
    transform: var(--spark-end);
    opacity: 0;
  }
}
.spark-objects-enabled .page-intro {
  background: var(--paper);
}
@media (max-width: 760px) {
  .ambient-spark {
    width: calc(var(--spark-size) * .704);
    height: calc(var(--spark-size) * .704);
  }
}
@media (prefers-reduced-motion: reduce) {
  .ambient-spark {
    animation: none;
    transform: var(--spark-rest);
    opacity: .5;
    will-change: auto;
  }
}
@media print {
  .spark-object-field {
    display: none;
  }
}