/* ═══════════════════════════════════════════════════════════
   Divi Glide Preloaders – v1.6.4
   Moved from transitions.css for better architectural separation.
   All legacy "ape" identifiers renamed to "divi".
═══════════════════════════════════════════════════════════ */
#divi-preloader {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--pre-bg, #fff);
  transition: opacity var(--pre-overlay-fade, 250ms) cubic-bezier(0.4, 0, 0.2, 1), visibility var(--pre-overlay-fade, 250ms);
}

#divi-preloader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.divi-preloader-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  animation: diviPreInnerIn var(--pre-fade-in, 250ms) ease both;
}

#divi-preloader.pre-content-out .divi-preloader-inner {
  animation: none;
  opacity: 0;
  transition: opacity var(--pre-fade-out, 250ms) ease;
}

@keyframes diviPreInnerIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.pre-pulse {
  width: 100%;
  aspect-ratio: 1/1;
  background: var(--pre-accent, #2563eb);
  border-radius: 50%;
  animation: diviPulse 1.2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes diviPulse {

  0%,
  100% {
    transform: scale(.75);
    opacity: .7
  }

  50% {
    transform: scale(1);
    opacity: 1
  }
}

.pre-liquid {
  width: 100%;
  aspect-ratio: 1/1;
  border: 4px solid rgba(0, 0, 0, .08);
  border-left-color: var(--pre-accent, #2563eb);
  border-radius: 50%;
  animation: diviSpin .9s linear infinite;
}

@keyframes diviSpin {
  to {
    transform: rotate(360deg)
  }
}

.pre-hud {
  width: 100%;
  aspect-ratio: 1/1;
  border: 2px dashed var(--pre-accent, #2563eb);
  border-radius: 50%;
  animation: diviSpin 4s linear infinite;
}

.pre-scan {
  width: 100%;
  aspect-ratio: 1/1;
  position: relative;
}

.pre-scan::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 3px;
  background: var(--pre-accent, #2563eb);
  box-shadow: 0 0 18px var(--pre-accent, #2563eb);
  border-radius: 2px;
  animation: diviScan 1.4s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes diviScan {

  0%,
  100% {
    transform: translateY(-100%) scaleX(.6);
    opacity: 0
  }

  50% {
    transform: translateY(100%) scaleX(1);
    opacity: 1
  }
}

.pre-orb {
  width: 100%;
  aspect-ratio: 1/1;
  position: relative;
}

.pre-orb::before,
.pre-orb::after {
  content: '';
  position: absolute;
  width: 28%;
  height: 28%;
  background: var(--pre-accent, #2563eb);
  border-radius: 50%;
}

.pre-orb::before {
  top: 0;
  left: 0;
  animation: diviOrb1 1.4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

.pre-orb::after {
  bottom: 0;
  right: 0;
  animation: diviOrb2 1.4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
  opacity: .55;
}

@keyframes diviOrb1 {

  0%,
  100% {
    transform: translate(0, 0)scale(.5)
  }

  50% {
    transform: translate(250%, 250%)scale(1)
  }
}

@keyframes diviOrb2 {

  0%,
  100% {
    transform: translate(0, 0)scale(.5)
  }

  50% {
    transform: translate(-250%, -250%)scale(1)
  }
}

.pre-bar {
  width: 100%;
  height: 6px;
  background: rgba(0, 0, 0, .06);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

.pre-bar::after {
  content: '';
  position: absolute;
  left: -45%;
  top: 0;
  height: 100%;
  width: 40%;
  background: var(--pre-accent, #2563eb);
  border-radius: 2px;
  animation: diviBar 1s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes diviBar {
  0% {
    left: -45%
  }

  100% {
    left: 105%
  }
}

.pre-custom-img,
.pre-custom-video {
  width: 100%;
  height: auto;
  max-height: 100%;
  aspect-ratio: inherit;
  object-fit: contain;
  display: block;
}

.divi-preloader-inner.anim-bounce {
  animation: diviBounce 1.4s ease-in-out infinite;
}

.divi-preloader-inner.anim-pulse {
  animation: diviPulse 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

.divi-preloader-inner.anim-float {
  animation: diviFloat 2.5s ease-in-out infinite;
}

.divi-preloader-inner.anim-spin {
  animation: diviSpin 3s linear infinite;
}

.divi-preloader-inner.anim-scale {
  animation: diviScale 1.8s ease-in-out infinite;
}

.divi-preloader-inner.anim-fade-quick {
  animation: diviFadeQuick 0.6s ease-in-out infinite alternate;
}

.divi-preloader-inner.anim-fade-slow {
  animation: diviFadeSlow 2s ease-in-out infinite alternate;
}

.divi-preloader-inner.anim-glow-bright {
  animation: diviGlowBright 1.2s ease-in-out infinite alternate;
}

.divi-preloader-inner.anim-glow-dim {
  animation: diviGlowDim 2s ease-in-out infinite alternate;
}

.divi-preloader-inner.anim-heartbeat {
  animation: diviHeartbeat 1.2s ease-in-out infinite;
}

.divi-preloader-inner.anim-shake {
  animation: diviShake 0.5s ease-in-out infinite;
}

.divi-preloader-inner.anim-flip {
  animation: diviFlip 2.5s linear infinite;
}

@keyframes diviBounce {

  0%,
  100% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-16px)
  }
}

@keyframes diviFloat {

  0%,
  100% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-10px)
  }
}

@keyframes diviScale {

  0%,
  100% {
    transform: scale(1)
  }

  50% {
    transform: scale(1.18)
  }
}

@keyframes diviFadeQuick {
  0% {
    opacity: 0.2;
  }

  100% {
    opacity: 1;
  }
}

@keyframes diviFadeSlow {
  0% {
    opacity: 0.1;
  }

  100% {
    opacity: 1;
  }
}

@keyframes diviGlowBright {
  0% {
    filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.3));
    transform: scale(1);
  }

  100% {
    filter: drop-shadow(0 0 20px rgba(255, 255, 255, 0.9)) brightness(1.3);
    transform: scale(1.05);
  }
}

@keyframes diviGlowDim {
  0% {
    filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.8));
    opacity: 1;
  }

  100% {
    filter: drop-shadow(0 0 0px rgba(255, 255, 255, 0));
    opacity: 0.3;
  }
}

@keyframes diviHeartbeat {

  0%,
  100% {
    transform: scale(1);
  }

  14% {
    transform: scale(1.13);
  }

  28% {
    transform: scale(1);
  }

  42% {
    transform: scale(1.13);
  }

  70% {
    transform: scale(1);
  }
}

@keyframes diviShake {

  0%,
  100% {
    transform: translateX(0) rotate(0deg);
  }

  25% {
    transform: translateX(-4px) rotate(-4deg);
  }

  75% {
    transform: translateX(4px) rotate(4deg);
  }
}

@keyframes diviFlip {
  0% {
    transform: perspective(400px) rotateY(0deg);
  }

  100% {
    transform: perspective(400px) rotateY(360deg);
  }
}

/* Divi Glide - Extended Loader Library */

/* Mode 1 - Geometric */
.divi-loader-1 {
  font-weight: bold;
  font-family: sans-serif;
  font-size: 30px;
  animation: divi_fl_1_l1 1s linear infinite alternate;
  color: var(--pre-accent);
}

.divi-loader-1:before {
  content: attr(data-text)
}

@keyframes divi_fl_1_l1 {
  to {
    opacity: 0
  }
}

/* Mode 2 - Progress Bars */
.divi-loader-2 {
  width: fit-content;
  font-weight: bold;
  font-family: sans-serif;
  font-size: 30px;
  padding-bottom: 8px;
  background: linear-gradient(currentColor 0 0) 0 100%/0% 3px no-repeat;
  animation: divi_fl_2_l2 2s linear infinite;
  color: var(--pre-accent);
}

.divi-loader-2:before {
  content: attr(data-text)
}

@keyframes divi_fl_2_l2 {
  to {
    background-size: 100% 3px
  }
}

/* Mode 3 - Progress Bars */
.divi-loader-3 {
  width: fit-content;
  font-weight: bold;
  font-family: sans-serif;
  font-size: 30px;
  padding: 0 5px 8px 0;
  background: repeating-linear-gradient(90deg, currentColor 0 8%, #0000 0 10%) 200% 100%/200% 3px no-repeat;
  animation: divi_fl_3_l3 2s steps(6) infinite;
  color: var(--pre-accent);
}

.divi-loader-3:before {
  content: attr(data-text)
}

@keyframes divi_fl_3_l3 {
  to {
    background-position: 80% 100%
  }
}

/* Mode 4 - Geometric */
.divi-loader-4 {
  width: fit-content;
  font-weight: bold;
  font-family: monospace;
  font-size: 30px;
  line-height: 1.2;
  padding: 10px 0;
  clip-path: inset(0 100% 0 0);
  animation: divi_fl_4_l5 2s steps(11) infinite;
  color: var(--pre-accent);
}

.divi-loader-4:before {
  content: attr(data-text)
}

@keyframes divi_fl_4_l5 {
  to {
    clip-path: inset(0 -1ch 0 0)
  }
}

/* Mode 5 - Progress Bars */
.divi-loader-5 {
  font-weight: bold;
  font-family: monospace;
  font-size: 30px;
  line-height: 1.2em;
  display: inline-grid;
}

.divi-loader-5:before,
.divi-loader-5:after {
  content: attr(data-text);
  grid-area: 1/1;
  -webkit-mask: linear-gradient(90deg, var(--pre-accent) 50%, #0000 0) 0 50%/2ch 100%;
  color: var(--pre-accent) !important;
  text-shadow: 0 calc(var(--s, 1)*1.2em) 0 var(--pre-accent);
  animation: divi_fl_5_l15 1s infinite alternate;
}

.divi-loader-5:after {
  -webkit-mask-position: 1ch 50%;
  --s: -1;
}

@keyframes divi_fl_5_l15 {
  0% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(calc(var(--s, 1)*-0.2em));
  }
}

/* Mode 6 - Dots & Orbs */
.divi-loader-6 {
  width: 60px;
  aspect-ratio: 4;
  background: radial-gradient(circle closest-side, var(--pre-accent) 90%, #0000) 0/calc(100%/3) 100% space;
  clip-path: inset(0 100% 0 0);
  animation: divi_fl_6_l1 1s steps(4) infinite;
}

@keyframes divi_fl_6_l1 {
  to {
    clip-path: inset(0 -34% 0 0)
  }
}

/* Mode 7 - Dots & Orbs */
.divi-loader-7 {
  width: 60px;
  aspect-ratio: 2;
  --_g: no-repeat radial-gradient(circle closest-side, var(--pre-accent) 90%, #0000);
  background:
    var(--_g) 0% 50%,
    var(--_g) 50% 50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 50%;
  animation: divi_fl_7_l3 1s infinite linear;
}

@keyframes divi_fl_7_l3 {
  20% {
    background-position: 0% 0%, 50% 50%, 100% 50%
  }

  40% {
    background-position: 0% 100%, 50% 0%, 100% 50%
  }

  60% {
    background-position: 0% 50%, 50% 100%, 100% 0%
  }

  80% {
    background-position: 0% 50%, 50% 50%, 100% 100%
  }
}

/* Mode 8 - Circular */
.divi-loader-8 {
  width: 15px;
  aspect-ratio: 1;
  border-radius: 50%;
  animation: divi_fl_8_l5 1s infinite linear alternate;
}

@keyframes divi_fl_8_l5 {
  0% {
    box-shadow: 20px 0 var(--pre-accent), -20px 0 color-mix(in srgb, var(--pre-accent), transparent 80%);
    background: var(--pre-accent)
  }

  33% {
    box-shadow: 20px 0 var(--pre-accent), -20px 0 color-mix(in srgb, var(--pre-accent), transparent 80%);
    background: color-mix(in srgb, var(--pre-accent), transparent 80%)
  }

  66% {
    box-shadow: 20px 0 color-mix(in srgb, var(--pre-accent), transparent 80%), -20px 0 var(--pre-accent);
    background: color-mix(in srgb, var(--pre-accent), transparent 80%)
  }

  100% {
    box-shadow: 20px 0 color-mix(in srgb, var(--pre-accent), transparent 80%), -20px 0 var(--pre-accent);
    background: var(--pre-accent)
  }
}

/* Mode 9 - Dots & Orbs */
.divi-loader-9 {
  width: 60px;
  aspect-ratio: 4;
  --_g: no-repeat radial-gradient(circle closest-side, var(--pre-accent) 90%, #0000);
  background:
    var(--_g) 0% 50%,
    var(--_g) 50% 50%,
    var(--_g) 100% 50%;
  background-size: calc(100%/3) 100%;
  animation: divi_fl_9_l7 1s infinite linear;
}

@keyframes divi_fl_9_l7 {
  33% {
    background-size: calc(100%/3) 0%, calc(100%/3) 100%, calc(100%/3) 100%
  }

  50% {
    background-size: calc(100%/3) 100%, calc(100%/3) 0%, calc(100%/3) 100%
  }

  66% {
    background-size: calc(100%/3) 100%, calc(100%/3) 100%, calc(100%/3) 0%
  }
}

/* Mode 10 - Geometric */
.divi-loader-10 {
  width: 60px;
  aspect-ratio: 1;
  --_g: no-repeat radial-gradient(farthest-side, var(--pre-accent) 90%, #0000);
  background: var(--_g), var(--_g), var(--_g);
  background-size: 25% 25%;
  animation: divi_fl_10_l17 1s infinite;
}

@keyframes divi_fl_10_l17 {
  0% {
    background-position: 0% -100%, 50% -100%, 100% -100%
  }

  16.67% {
    background-position: 0% 50%, 50% -100%, 100% -100%
  }

  33.33% {
    background-position: 0% 50%, 50% 50%, 100% -100%
  }

  45%,
  55% {
    background-position: 0% 50%, 50% 50%, 100% 50%
  }

  66.67% {
    background-position: 0% 200%, 50% 50%, 100% 50%
  }

  83.33% {
    background-position: 0% 200%, 50% 200%, 100% 50%
  }

  100% {
    background-position: 0% 200%, 50% 200%, 100% 200%
  }
}

/* Mode 11 - Circular */
.divi-loader-11 {
  width: 50px;
  height: 12px;
  --_g: no-repeat radial-gradient(farthest-side, var(--pre-accent) 94%, #0000);
  background:
    var(--_g) left,
    var(--_g) right;
  background-size: 12px 12px;
  position: relative;
}

.divi-loader-11:before {
  content: "";
  position: absolute;
  height: 12px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--pre-accent);
  inset: 0;
  margin: auto;
  animation: divi_fl_11_l25-1 1s, divi_fl_11_l25-2 0.5s;
  animation-timing-function: cubic-bezier(.5, -900, .5, 900);
  animation-iteration-count: infinite;
}

@keyframes divi_fl_11_l25-1 {
  100% {
    transform: translate(0.12px)
  }
}

@keyframes divi_fl_11_l25-2 {
  100% {
    inset: -0.15px 0 0;
  }
}

/* Mode 12 - Geometric */
.divi-loader-12 {
  height: 15px;
  aspect-ratio: 5;
  --_g: no-repeat radial-gradient(farthest-side, var(--pre-accent) 94%, #0000);
  background: var(--_g), var(--_g), var(--_g), var(--_g);
  background-size: 20% 100%;
  animation:
    divi_fl_12_l40-1 .75s infinite alternate,
    divi_fl_12_l40-2 1.5s infinite alternate;
}

@keyframes divi_fl_12_l40-1 {

  0%,
  10% {
    background-position: 0 0, 0 0, 0 0, 0 0
  }

  33% {
    background-position: 0 0, calc(100%/3) 0, calc(100%/3) 0, calc(100%/3) 0
  }

  66% {
    background-position: 0 0, calc(100%/3) 0, calc(2*100%/3) 0, calc(2*100%/3) 0
  }

  90%,
  100% {
    background-position: 0 0, calc(100%/3) 0, calc(2*100%/3) 0, 100% 0
  }
}

@keyframes divi_fl_12_l40-2 {

  0%,
  49.99% {
    transform: scale(1)
  }

  50%,
  100% {
    transform: scale(-1)
  }
}

/* Mode 13 - Geometric */
.divi-loader-13 {
  width: 32px;
  aspect-ratio: 1;
  --_g: no-repeat radial-gradient(farthest-side, var(--pre-accent) 90%, #0000);
  background: var(--_g), var(--_g), var(--_g), var(--_g);
  background-size: 40% 40%;
  animation: divi_fl_13_l46 1s infinite;
}

@keyframes divi_fl_13_l46 {
  0% {
    background-position: 0 0, 100% 0, 100% 100%, 0 100%
  }

  40%,
  50% {
    background-position: 100% 100%, 100% 0, 0 0, 0 100%
  }

  90%,
  100% {
    background-position: 100% 100%, 0 100%, 0 0, 100% 0
  }
}

/* Mode 14 - Geometric */
.divi-loader-14 {
  height: 30px;
  aspect-ratio: 2.5;
  --_g: no-repeat radial-gradient(farthest-side, var(--pre-accent) 90%, #0000);
  background: var(--_g), var(--_g), var(--_g), var(--_g);
  background-size: 20% 50%;
  animation: divi_fl_14_l43 1s infinite linear;
}

@keyframes divi_fl_14_l43 {
  0% {
    background-position: calc(0*100%/3) 50%, calc(1*100%/3) 50%, calc(2*100%/3) 50%, calc(3*100%/3) 50%
  }

  16.67% {
    background-position: calc(0*100%/3) 0, calc(1*100%/3) 50%, calc(2*100%/3) 50%, calc(3*100%/3) 50%
  }

  33.33% {
    background-position: calc(0*100%/3) 100%, calc(1*100%/3) 0, calc(2*100%/3) 50%, calc(3*100%/3) 50%
  }

  50% {
    background-position: calc(0*100%/3) 50%, calc(1*100%/3) 100%, calc(2*100%/3) 0, calc(3*100%/3) 50%
  }

  66.67% {
    background-position: calc(0*100%/3) 50%, calc(1*100%/3) 50%, calc(2*100%/3) 100%, calc(3*100%/3) 0
  }

  83.33% {
    background-position: calc(0*100%/3) 50%, calc(1*100%/3) 50%, calc(2*100%/3) 50%, calc(3*100%/3) 100%
  }

  100% {
    background-position: calc(0*100%/3) 50%, calc(1*100%/3) 50%, calc(2*100%/3) 50%, calc(3*100%/3) 50%
  }
}

/* Mode 15 - Progress Bars */
.divi-loader-15 {
  width: 45px;
  aspect-ratio: 1;
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c) 0% 50%,
    var(--c) 50% 50%,
    var(--c) 100% 50%;
  background-size: 20% 100%;
  animation: divi_fl_15_l1 1s infinite linear;
}

@keyframes divi_fl_15_l1 {
  0% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }

  33% {
    background-size: 20% 10%, 20% 100%, 20% 100%
  }

  50% {
    background-size: 20% 100%, 20% 10%, 20% 100%
  }

  66% {
    background-size: 20% 100%, 20% 100%, 20% 10%
  }

  100% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }
}

/* Mode 16 - Progress Bars */
.divi-loader-16 {
  width: 45px;
  aspect-ratio: 1;
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c) 0% 100%,
    var(--c) 50% 100%,
    var(--c) 100% 100%;
  animation: divi_fl_16_l2 1s infinite linear;
}

@keyframes divi_fl_16_l2 {
  0% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }

  20% {
    background-size: 20% 60%, 20% 100%, 20% 100%
  }

  40% {
    background-size: 20% 80%, 20% 60%, 20% 100%
  }

  60% {
    background-size: 20% 100%, 20% 80%, 20% 60%
  }

  80% {
    background-size: 20% 100%, 20% 100%, 20% 80%
  }

  100% {
    background-size: 20% 100%, 20% 100%, 20% 100%
  }
}

/* Mode 17 - Progress Bars */
.divi-loader-17 {
  width: 45px;
  aspect-ratio: 1;
  background:
    linear-gradient(#0000 calc(1*100%/6), var(--pre-accent) 0 calc(3*100%/6), #0000 0) left bottom,
    linear-gradient(#0000 calc(2*100%/6), var(--pre-accent) 0 calc(4*100%/6), #0000 0) center bottom,
    linear-gradient(#0000 calc(3*100%/6), var(--pre-accent) 0 calc(5*100%/6), #0000 0) right bottom;
  background-size: 20% 600%;
  background-repeat: no-repeat;
  animation: divi_fl_17_l3 1s infinite linear;
}

@keyframes divi_fl_17_l3 {
  100% {
    background-position: left top, center top, right top
  }
}

/* Mode 18 - Progress Bars */
.divi-loader-18 {
  width: 45px;
  aspect-ratio: .75;
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c) 0% 50%,
    var(--c) 50% 50%,
    var(--c) 100% 50%;
  background-size: 20% 60%;
  animation: divi_fl_18_l9 1s infinite;
}

@keyframes divi_fl_18_l9 {
  33% {
    background-position: 0% 0%, 50% 100%, 100% 0%
  }

  66% {
    background-position: 0% 100%, 50% 0%, 100% 100%
  }
}

/* Mode 20 - Circular */
.divi-loader-20 {
  width: 50px;
  padding: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--pre-accent);
  --_m:
    conic-gradient(#0000 10%, var(--pre-accent)),
    linear-gradient(var(--pre-accent) 0 0) content-box;
  -webkit-mask: var(--_m);
  mask: var(--_m);
  -webkit-mask-composite: source-out;
  mask-composite: subtract;
  animation: divi_fl_20_l3 1s infinite linear;
}

@keyframes divi_fl_20_l3 {
  to {
    transform: rotate(1turn)
  }
}

/* Mode 21 - Circular */
.divi-loader-21 {
  width: 50px;
  --b: 8px;
  aspect-ratio: 1;
  border-radius: 50%;
  padding: 1px;
  background: conic-gradient(#0000 10%, var(--pre-accent)) content-box;
  -webkit-mask:
    repeating-conic-gradient(#0000 0deg, var(--pre-accent) 1deg 20deg, #0000 21deg 36deg),
    radial-gradient(farthest-side, #0000 calc(100% - var(--b) - 1px), var(--pre-accent) calc(100% - var(--b)));
  -webkit-mask-composite: destination-in;
  mask-composite: intersect;
  animation: divi_fl_21_l4 1s infinite steps(10);
}

@keyframes divi_fl_21_l4 {
  to {
    transform: rotate(1turn)
  }
}

/* Mode 22 - Geometric */
.divi-loader-22 {
  width: 50px;
  aspect-ratio: 1;
  --_c: no-repeat radial-gradient(farthest-side, var(--pre-accent) 92%, #0000);
  background:
    var(--_c) top,
    var(--_c) left,
    var(--_c) right,
    var(--_c) bottom;
  background-size: 12px 12px;
  animation: divi_fl_22_l7 1s infinite;
}

@keyframes divi_fl_22_l7 {
  to {
    transform: rotate(.5turn)
  }
}

/* Mode 25 - Geometric */
.divi-loader-25 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
}

.divi-loader-25::before,
.divi-loader-25::after {
  content: "";
  grid-area: 1/1;
  --c: no-repeat radial-gradient(farthest-side, var(--pre-accent) 92%, #0000);
  background:
    var(--c) 50% 0,
    var(--c) 50% 100%,
    var(--c) 100% 50%,
    var(--c) 0 50%;
  background-size: 12px 12px;
  animation: divi_fl_25_l12 1s infinite;
}

.divi-loader-25::before {
  margin: 4px;
  filter: hue-rotate(45deg);
  background-size: 8px 8px;
  animation-timing-function: linear
}

@keyframes divi_fl_25_l12 {
  100% {
    transform: rotate(.5turn)
  }
}

/* Mode 26 - Circular */
.divi-loader-26 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  color: var(--pre-accent);
  background: radial-gradient(farthest-side, currentColor calc(100% - 6px), #0000 calc(100% - 5px) 0);
  -webkit-mask: radial-gradient(farthest-side, #0000 calc(100% - 13px), var(--pre-accent) calc(100% - 12px));
  border-radius: 50%;
  animation: divi_fl_26_l19 2s infinite linear;
}

.divi-loader-26::before,
.divi-loader-26::after {
  content: "";
  grid-area: 1/1;
  background:
    linear-gradient(currentColor 0 0) center,
    linear-gradient(currentColor 0 0) center;
  background-size: 100% 10px, 10px 100%;
  background-repeat: no-repeat;
}

.divi-loader-26::after {
  transform: rotate(45deg);
}

@keyframes divi_fl_26_l19 {
  100% {
    transform: rotate(1turn)
  }
}

/* Mode 27 - Circular */
.divi-loader-27 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  border-radius: 50%;
  color: var(--pre-accent);
  background:
    linear-gradient(0deg, color-mix(in srgb, currentColor, transparent 50%) 30%, #0000 0 70%, currentColor 0) 50%/8% 100%,
    linear-gradient(90deg, color-mix(in srgb, currentColor, transparent 75%) 30%, #0000 0 70%, color-mix(in srgb, currentColor, transparent 25%) 0) 50%/100% 8%;
  background-repeat: no-repeat;
  animation: divi_fl_27_l23 1s infinite steps(12);
}

.divi-loader-27::before,
.divi-loader-27::after {
  content: "";
  grid-area: 1/1;
  border-radius: 50%;
  background: inherit;
  opacity: 0.915;
  transform: rotate(30deg);
}

.divi-loader-27::after {
  opacity: 0.83;
  transform: rotate(60deg);
}

@keyframes divi_fl_27_l23 {
  100% {
    transform: rotate(1turn)
  }
}

/* Mode 28 - Geometric */
.divi-loader-28 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
  -webkit-mask: conic-gradient(from 15deg, #0000, var(--pre-accent));
  animation: divi_fl_28_l26 1s infinite steps(12);
}

.divi-loader-28,
.divi-loader-28:before,
.divi-loader-28:after {
  background:
    radial-gradient(closest-side at 50% 12.5%,
      var(--pre-accent) 96%, #0000) 50% 0/20% 80% repeat-y,
    radial-gradient(closest-side at 12.5% 50%,
      var(--pre-accent) 96%, #0000) 0 50%/80% 20% repeat-x;
}

.divi-loader-28:before,
.divi-loader-28:after {
  content: "";
  grid-area: 1/1;
  transform: rotate(30deg);
}

.divi-loader-28:after {
  transform: rotate(60deg);
}

@keyframes divi_fl_28_l26 {
  100% {
    transform: rotate(1turn)
  }
}

/* Mode 29 - Circular */
.divi-loader-29 {
  --d: 22px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  color: var(--pre-accent);
  box-shadow:
    calc(1*var(--d)) calc(0*var(--d)) 0 0,
    calc(0.707*var(--d)) calc(0.707*var(--d)) 0 1px,
    calc(0*var(--d)) calc(1*var(--d)) 0 2px,
    calc(-0.707*var(--d)) calc(0.707*var(--d)) 0 3px,
    calc(-1*var(--d)) calc(0*var(--d)) 0 4px,
    calc(-0.707*var(--d)) calc(-0.707*var(--d))0 5px,
    calc(0*var(--d)) calc(-1*var(--d)) 0 6px;
  animation: divi_fl_29_l27 1s infinite steps(8);
}

@keyframes divi_fl_29_l27 {
  100% {
    transform: rotate(1turn)
  }
}

/* Mode 30 - Geometric */
.divi-loader-30 {
  width: 40px;
  height: 40px;
  color: var(--pre-accent);
  background:
    conic-gradient(from -45deg at top 20px left 50%, #0000, currentColor 1deg 90deg, #0000 91deg),
    conic-gradient(from 45deg at right 20px top 50%, #0000, currentColor 1deg 90deg, #0000 91deg),
    conic-gradient(from 135deg at bottom 20px left 50%, #0000, currentColor 1deg 90deg, #0000 91deg),
    conic-gradient(from -135deg at left 20px top 50%, #0000, currentColor 1deg 90deg, #0000 91deg);
  animation: divi_fl_30_l4 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
}

@keyframes divi_fl_30_l4 {
  50% {
    width: 60px;
    height: 60px;
    transform: rotate(180deg)
  }

  100% {
    transform: rotate(360deg)
  }
}

/* Mode 31 - Progress Bars */
.divi-loader-31 {
  width: 40px;
  height: 40px;
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background: var(--c), var(--c), var(--c), var(--c);
  background-size: 21px 21px;
  animation: divi_fl_31_l5 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
}

@keyframes divi_fl_31_l5 {
  0% {
    background-position: 0 0, 100% 0, 100% 100%, 0 100%
  }

  33% {
    background-position: 0 0, 100% 0, 100% 100%, 0 100%;
    width: 60px;
    height: 60px
  }

  66% {
    background-position: 100% 0, 100% 100%, 0 100%, 0 0;
    width: 60px;
    height: 60px
  }

  100% {
    background-position: 100% 0, 100% 100%, 0 100%, 0 0
  }
}

/* Mode 32 - Progress Bars */
.divi-loader-32 {
  width: 40px;
  aspect-ratio: 1;
  color: var(--pre-accent);
  position: relative;
  background:
    conic-gradient(from 134deg at top, currentColor 92deg, #0000 0) top,
    conic-gradient(from -46deg at bottom, currentColor 92deg, #0000 0) bottom;
  background-size: 100% 50%;
  background-repeat: no-repeat;
}

.divi-loader-32:before {
  content: '';
  position: absolute;
  inset: 0;
  --g: currentColor 14.5px, #0000 0 calc(100% - 14.5px), currentColor 0;
  background:
    linear-gradient(45deg, var(--g)),
    linear-gradient(-45deg, var(--g));
  animation: divi_fl_32_l7 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
}

@keyframes divi_fl_32_l7 {
  33% {
    inset: -10px;
    transform: rotate(0deg)
  }

  66% {
    inset: -10px;
    transform: rotate(90deg)
  }

  100% {
    inset: 0;
    transform: rotate(90deg)
  }
}

/* Mode 33 - Circular */
.divi-loader-33 {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
}

.divi-loader-33:before,
.divi-loader-33:after {
  content: "";
  grid-area: 1/1;
  border-radius: 50%;
  background: var(--pre-accent);
  -webkit-mask: repeating-linear-gradient(var(--pre-accent) 0 5px, #0000 0 10px);
  animation: divi_fl_33_l35 1.5s infinite;
}

.divi-loader-33:after {
  -webkit-mask: repeating-linear-gradient(#0000 0 5px, var(--pre-accent) 0 10px);
  --s: -1;
}

@keyframes divi_fl_33_l35 {

  0%,
  10% {
    transform: translate(0) rotate(0)
  }

  35% {
    transform: translate(calc(var(--s, 1)*50%)) rotate(0)
  }

  66% {
    transform: translate(calc(var(--s, 1)*50%)) rotate(calc(var(--s, 1)*180deg))
  }

  90%,
  100% {
    transform: translate(0) rotate(calc(var(--s, 1)*180deg))
  }
}

/* Mode 34 - Progress Bars */
.divi-loader-34 {
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c) 0 0,
    var(--c) 0 50%,
    var(--c) 0 100%,
    var(--c) 50% 0,
    var(--c) 50% 50%,
    var(--c) 50% 100%,
    var(--c) 100% 0,
    var(--c) 100% 50%,
    var(--c) 100% 100%;
  background-size: 16px 16px;
  animation: divi_fl_34_l31 .5s infinite alternate;
}

@keyframes divi_fl_34_l31 {

  0%,
  20% {
    width: 45px;
    height: 45px
  }

  90%,
  100% {
    width: 65px;
    height: 65px
  }
}

/* Mode 35 - Progress Bars */
.divi-loader-35 {
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c), var(--c), var(--c),
    var(--c), var(--c), var(--c),
    var(--c), var(--c), var(--c);
  background-size: 16px 16px;
  animation:
    divi_fl_35_l32-1 1s infinite,
    divi_fl_35_l32-2 1s infinite;
}

@keyframes divi_fl_35_l32-1 {

  0%,
  100% {
    width: 45px;
    height: 45px
  }

  35%,
  65% {
    width: 65px;
    height: 65px
  }
}

@keyframes divi_fl_35_l32-2 {

  0%,
  40% {
    background-position: 0 0, 0 50%, 0 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0, 50% 0, 50% 50%
  }

  60%,
  100% {
    background-position: 0 50%, 0 100%, 50% 100%, 100% 100%, 100% 50%, 100% 0, 50% 0, 0 0, 50% 50%
  }
}

/* Mode 36 - Geometric */
.divi-loader-36 {
  width: 50px;
  aspect-ratio: 1.154;
  position: relative;
  background: conic-gradient(from 120deg at 50% 64%, #0000, var(--pre-accent) 1deg 120deg, #0000 121deg);
  animation: divi_fl_36_l27-0 1.5s infinite cubic-bezier(0.3, 1, 0, 1);
}

.divi-loader-36:before,
.divi-loader-36:after {
  content: '';
  position: absolute;
  inset: 0;
  background: inherit;
  transform-origin: 50% 66%;
  animation: divi_fl_36_l27-1 1.5s infinite;
}

.divi-loader-36:after {
  --s: -1;
}

@keyframes divi_fl_36_l27-0 {

  0%,
  30% {
    transform: rotate(0)
  }

  70% {
    transform: rotate(120deg)
  }

  70.01%,
  100% {
    transform: rotate(360deg)
  }
}

@keyframes divi_fl_36_l27-1 {
  0% {
    transform: rotate(calc(var(--s, 1)*120deg)) translate(0)
  }

  30%,
  70% {
    transform: rotate(calc(var(--s, 1)*120deg)) translate(calc(var(--s, 1)*-5px), 10px)
  }

  100% {
    transform: rotate(calc(var(--s, 1)*120deg)) translate(0)
  }
}

/* Mode 37 - Progress Bars */
.divi-loader-37 {
  width: 60px;
  aspect-ratio: 1;
  color: var(--pre-accent);
  position: relative;
}

.divi-loader-37::before,
.divi-loader-37::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(currentColor 0 0) 0 calc(var(--s, 0)*-100%)/100% calc(100%/3),
    repeating-linear-gradient(90deg, currentColor 0 25%, #0000 0 50%) calc(var(--s, 0)*100%) 50%/calc(4*100%/3) calc(100%/3);
  background-repeat: no-repeat;
  animation: divi_fl_37_l26 2s infinite;
}

.divi-loader-37::after {
  --s: -1;
}

@keyframes divi_fl_37_l26 {

  0%,
  10% {
    transform: translateY(calc(var(--s, 1)*0));
    background-position: 0 calc(var(--s, 0)*-100%), calc(var(--s, 0)*100%) 50%
  }

  33% {
    transform: translateY(calc(var(--s, 1)*-20%));
    background-position: 0 calc(var(--s, 0)*-100%), calc(var(--s, 0)*100%) 50%
  }

  66% {
    transform: translateY(calc(var(--s, 1)*-20%));
    background-position: 0 calc(var(--s, 0)*-100%), calc(var(--s, 0)*100% + 100%) 50%
  }

  90%,
  100% {
    transform: translateY(calc(var(--s, 1)*0));
    background-position: 0 calc(var(--s, 0)*-100%), calc(var(--s, 0)*100% + 100%) 50%
  }
}

/* Mode 38 - Progress Bars */
.divi-loader-38 {
  width: 120px;
  height: 20px;
  background:
    linear-gradient(var(--pre-accent) 0 0) 0/0% no-repeat rgba(0, 0, 0, 0.1);
  animation: divi_fl_38_l1 2s infinite linear;
}

@keyframes divi_fl_38_l1 {
  100% {
    background-size: 100%
  }
}

/* Mode 39 - Progress Bars */
.divi-loader-39 {
  width: 80px;
  height: 40px;
  color: var(--pre-accent);
  border: 2px solid currentColor;
  border-right-color: transparent;
  padding: 3px;
  background:
    repeating-linear-gradient(90deg, currentColor 0 10px, #0000 0 15px) 0/0% no-repeat content-box content-box;
  position: relative;
  box-sizing: border-box;
  animation: divi_fl_39_l5 2s infinite steps(6);
}

.divi-loader-39::before {
  content: "";
  position: absolute;
  top: -2px;
  bottom: -2px;
  left: 100%;
  width: 10px;
  background:
    linear-gradient(transparent calc(50% - 7px), currentColor 0 calc(50% - 5px),
      transparent 0 calc(50% + 5px), currentColor 0 calc(50% + 7px), #0000 0) left /100% 100%,
    linear-gradient(currentColor calc(50% - 5px), #0000 0 calc(50% + 5px), currentColor 0) left /2px 100%,
    linear-gradient(#0000 calc(50% - 5px), currentColor 0 calc(50% + 5px), #0000 0) right/2px 100%;
  background-repeat: no-repeat;
}

@keyframes divi_fl_39_l5 {
  100% {
    background-size: 120%
  }
}

/* Mode 40 - Circular */
.divi-loader-40 {
  --r1: 154%;
  --r2: 68.5%;
  width: 60px;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, var(--pre-accent) 80%),
    radial-gradient(var(--r1) var(--r2) at bottom, var(--pre-accent) 79.5%, #0000 80%),
    radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, var(--pre-accent) 80%),
    color-mix(in srgb, var(--pre-accent), transparent 90%);
  background-size: 50.5% 220%;
  background-position: -100% 0%, 0% 0%, 100% 0%;
  background-repeat: no-repeat;
  animation: divi_fl_40_l9 2s infinite linear;
}

@keyframes divi_fl_40_l9 {
  33% {
    background-position: 0% 33%, 100% 33%, 200% 33%
  }

  66% {
    background-position: -100% 66%, 0% 66%, 100% 66%
  }

  100% {
    background-position: 0% 100%, 100% 100%, 200% 100%
  }
}

/* Mode 41 - Circular */
.divi-loader-41 {
  width: 60px;
  aspect-ratio: 1;
  border: 15px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  position: relative;
  transform: rotate(45deg);
}

.divi-loader-41::before {
  content: "";
  position: absolute;
  inset: -15px;
  border-radius: 50%;
  border: 15px solid var(--pre-accent);
  animation: divi_fl_41_l18 2s infinite linear;
}

@keyframes divi_fl_41_l18 {
  0% {
    clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0)
  }

  25% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0)
  }

  50% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%)
  }

  75% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%)
  }

  100% {
    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0)
  }
}

/* Mode 42 - Progress Bars */
.divi-loader-42 {
  width: 120px;
  height: 22px;
  border-radius: 40px;
  color: var(--pre-accent);
  border: 2px solid;
  position: relative;
}

.divi-loader-42::before {
  content: "";
  position: absolute;
  margin: 2px;
  width: 25%;
  top: 0;
  bottom: 0;
  left: 0;
  border-radius: inherit;
  background: currentColor;
  animation: divi_fl_42_l3 1s infinite linear;
}

@keyframes divi_fl_42_l3 {
  50% {
    left: 100%;
    transform: translateX(calc(-100% - 4px))
  }
}

/* Mode 43 - Geometric */
.divi-loader-43 {
  width: 20px;
  aspect-ratio: 1;
  background: var(--pre-accent);
  box-shadow: 0 0 60px 15px var(--pre-accent);
  transform: translate(-80px);
  clip-path: inset(0);
  animation:
    divi_fl_43_l4-1 0.5s ease-in-out infinite alternate,
    divi_fl_43_l4-2 1s ease-in-out infinite;
}

@keyframes divi_fl_43_l4-1 {
  100% {
    transform: translateX(80px)
  }
}

@keyframes divi_fl_43_l4-2 {
  33% {
    clip-path: inset(0 0 0 -100px)
  }

  50% {
    clip-path: inset(0 0 0 0)
  }

  83% {
    clip-path: inset(0 -100px 0 0)
  }
}

/* Mode 44 - Progress Bars */
.divi-loader-44 {
  width: 90px;
  height: 14px;
  background: repeating-linear-gradient(90deg, var(--pre-accent) 0 calc(25% - 5px), #0000 0 25%) left/calc(4*100%/3) 100%;
  animation: divi_fl_44_l1 0.5s infinite linear;
}

@keyframes divi_fl_44_l1 {
  100% {
    background-position: right
  }
}

/* Mode 45 - Dots & Orbs */
.divi-loader-45 {
  width: 90px;
  height: 14px;
  background: radial-gradient(circle closest-side, var(--pre-accent) 92%, #0000) calc(100%/3) 0/calc(100%/4) 100%;
  animation: divi_fl_45_l2 0.5s infinite linear;
}

@keyframes divi_fl_45_l2 {
  100% {
    background-position: 0 0
  }
}

/* Mode 46 - Geometric */
.divi-loader-46 {
  width: 60px;
  aspect-ratio: 1;
  --g: conic-gradient(from -90deg at 10px 10px, var(--pre-accent) 90deg, #0000 0);
  background: var(--g), var(--g), var(--g);
  background-size: 50% 50%;
  animation: divi_fl_46_l19 1s infinite;
}

@keyframes divi_fl_46_l19 {
  0% {
    background-position: 0 0, 10px 10px, 20px 20px
  }

  33% {
    background-position: 10px 10px
  }

  66% {
    background-position: 0 20px, 10px 10px, 20px 0
  }

  100% {
    background-position: 0 0, 10px 10px, 20px 20px
  }
}

/* Mode 47 - Geometric */
.divi-loader-47 {
  height: 30px;
  aspect-ratio: 6;
  --_c: transparent 64%, var(--pre-accent) 66% 98%, #0000 101%;
  background:
    radial-gradient(35% 146% at 50% 159%, var(--_c)) 0 0,
    radial-gradient(35% 146% at 50% -59%, var(--_c)) 25% 100%;
  background-size: calc(100%/3) 50%;
  background-repeat: repeat-x;
  clip-path: inset(0 100% 0 0);
  animation: divi_fl_47_l2 1s infinite linear;
}

@keyframes divi_fl_47_l2 {

  90%,
  to {
    clip-path: inset(0)
  }
}

/* Mode 48 - Geometric */
.divi-loader-48 {
  height: 30px;
  aspect-ratio: 6;
  --_c: transparent 64%, var(--pre-accent) 66% 98%, #0000 101%;
  background:
    radial-gradient(35% 146% at 50% 159%, var(--_c)) 0 0,
    radial-gradient(35% 146% at 50% -59%, var(--_c)) 25% 100%;
  background-size: calc(100%/3) 50%;
  background-repeat: repeat-x;
  clip-path: inset(0 100% 0 0);
  animation: divi_fl_48_l5 1.5s infinite linear;
}

@keyframes divi_fl_48_l5 {
  50% {
    clip-path: inset(0)
  }

  to {
    clip-path: inset(0 0 0 100%)
  }
}

/* Mode 49 - Geometric */
.divi-loader-49 {
  display: inline-grid;
  padding: 5px;
  background: var(--pre-bg);
  filter: blur(4px) contrast(12);
}

.divi-loader-49:before,
.divi-loader-49:after {
  content: "";
  grid-area: 1/1;
  height: 40px;
  aspect-ratio: 3;
  --_c: transparent 64%, var(--pre-accent) 66% 98%, #0000 101%;
  background:
    radial-gradient(35% 146% at 50% 159%, var(--_c)) 0 0,
    radial-gradient(35% 146% at 50% -59%, var(--_c)) 100% 100%;
  background-size: calc(200%/3) 50%;
  background-repeat: repeat-x;
  clip-path: inset(0 100% 0 0);
  animation: divi_fl_49_l16 1.5s infinite linear;
}

.divi-loader-49:after {
  scale: -1 1;
  animation-delay: -.75s;
}

@keyframes divi_fl_49_l16 {
  50% {
    clip-path: inset(0)
  }

  to {
    clip-path: inset(0 0 0 100%)
  }
}

/* Mode 50 - Text/Filling */
.divi-loader-50 {
  display: inline-block;
  width: fit-content;
  font-size: 40px;
  font-family: inherit;
  font-weight: bold;
  line-height: normal;
  padding: 0;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1px var(--pre-accent);
  background-image: linear-gradient(90deg, var(--pre-accent) 100%, var(--pre-accent) 100%);
  background-position: 0 center;
  background-size: 0% 100%;
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  animation: divi_fl_50_l1 1.5s linear infinite;
}

.divi-loader-50:before {
  content: attr(data-text);
}

@keyframes divi_fl_50_l1 {
  0% {
    background-size: 0% 100%;
  }

  100% {
    background-size: 110% 100%;
  }
}

/* Mode 57 - Geometric */
.divi-loader-57 {
  height: 70px;
  aspect-ratio: 1;
  animation: divi_fl_57_l5 .8s infinite alternate ease-out;
  background: var(--pre-accent);
}

@keyframes divi_fl_57_l5 {
  0% {
    clip-path: shape(from 99.42% 44.63%, curve to 99.42% 55.37% with 100.00% 50.00%, curve to 97.10% 65.87% with 98.83% 60.75%, curve to 92.59% 75.63% with 95.38% 70.99%, curve to 86.09% 84.18% with 89.80% 80.26%, curve to 77.89% 91.14% with 82.37% 88.11%, curve to 68.40% 96.18% with 73.42% 94.18%, curve to 58.04% 99.05% with 63.38% 98.18%, curve to 47.31% 99.63% with 52.71% 99.93%, curve to 36.70% 97.90% with 41.91% 99.34%, curve to 26.72% 93.92% with 31.49% 96.45%, curve to 17.82% 87.88% with 21.94% 91.38%, curve to 10.43% 80.08% with 13.70% 84.38%, curve to 4.89% 70.87% with 7.16% 75.78%, curve to 1.46% 60.69% with 2.62% 65.97%, curve to 0.29% 50.00% with 0.29% 55.41%, curve to 1.46% 39.31% with 0.29% 44.59%, curve to 4.89% 29.13% with 2.62% 34.03%, curve to 10.43% 19.92% with 7.16% 24.22%, curve to 17.82% 12.12% with 13.70% 15.62%, curve to 26.72% 6.08% with 21.94% 8.62%, curve to 36.70% 2.10% with 31.49% 3.55%, curve to 47.31% 0.37% with 41.91% 0.66%, curve to 58.04% 0.95% with 52.71% 0.07%, curve to 68.40% 3.82% with 63.38% 1.82%, curve to 77.89% 8.86% with 73.42% 5.82%, curve to 86.09% 15.82% with 82.37% 11.89%, curve to 92.59% 24.37% with 89.80% 19.74%, curve to 97.10% 34.13% with 95.38% 29.01%, curve to 99.42% 44.63% with 98.83% 39.25%)
  }

  to {
    clip-path: shape(from 94.59% 45.14%, curve to 89.43% 53.72% with 95.04% 50.00%, curve to 83.01% 61.17% with 83.83% 57.45%, curve to 82.17% 69.66% with 82.20% 64.90%, curve to 79.82% 78.41% with 82.13% 74.43%, curve to 71.51% 80.81% with 77.52% 82.40%, curve to 64.23% 87.96% with 65.50% 79.23%, curve to 57.49% 91.99% with 62.96% 96.68%, curve to 47.27% 91.50% with 52.02% 87.30%, curve to 38.80% 91.55% with 42.51% 95.70%, curve to 28.78% 89.01% with 35.09% 87.41%, curve to 20.39% 85.31% with 22.47% 90.61%, curve to 17.51% 75.02% with 18.32% 80.01%, curve to 13.35% 66.76% with 16.70% 70.04%, curve to 13.08% 58.58% with 10.00% 63.48%, curve to 10.65% 49.40% with 16.15% 53.68%, curve to 4.90% 39.92% with 5.15% 45.12%, curve to 6.48% 29.82% with 4.65% 34.72%, curve to 16.97% 25.92% with 8.32% 24.92%, curve to 27.78% 23.66% with 25.63% 26.91%, curve to 31.87% 14.87% with 29.94% 20.41%, curve to 38.34% 7.99% with 33.79% 9.32%, curve to 47.76% 4.14% with 42.90% 6.66%, curve to 55.93% 9.19% with 52.62% 1.62%, curve to 62.32% 18.84% with 59.23% 16.77%, curve to 72.22% 18.37% with 65.42% 20.92%, curve to 81.35% 20.12% with 79.02% 15.83%, curve to 81.77% 30.29% with 83.67% 24.41%, curve to 87.01% 38.23% with 79.88% 36.18%, curve to 94.59% 45.14% with 94.14% 40.28%)
  }
}

/* Mode 58 - Geometric */
.divi-loader-58 {
  height: 70px;
  aspect-ratio: 1;
  background: var(--pre-accent);
  animation: divi_fl_58_l6 2s infinite linear;
}

@keyframes divi_fl_58_l6 {

  0%,
  100% {
    clip-path: shape(from 99.49% 44.97%, curve to 99.49% 55.03% with 100.00% 50.00%, curve to 97.46% 64.89% with 98.98% 60.06%, curve to 93.49% 74.14% with 95.95% 69.72%, curve to 87.74% 82.40% with 91.04% 78.56%, curve to 80.45% 89.34% with 84.45% 86.24%, curve to 71.91% 94.66% with 76.45% 92.43%, curve to 62.47% 98.16% with 67.37% 96.89%, curve to 52.52% 99.68% with 57.57% 99.42%, curve to 42.47% 99.17% with 47.47% 99.94%, curve to 32.72% 96.65% with 37.47% 98.40%, curve to 23.69% 92.21% with 27.98% 94.89%, curve to 15.73% 86.05% with 19.39% 89.54%, curve to 9.17% 78.42% with 12.06% 82.57%, curve to 4.29% 69.62% with 6.28% 74.27%, curve to 1.27% 60.01% with 2.29% 64.97%, curve to 0.26% 50.00% with 0.26% 55.06%, curve to 1.27% 39.99% with 0.26% 44.94%, curve to 4.29% 30.38% with 2.29% 35.03%, curve to 9.17% 21.58% with 6.28% 25.73%, curve to 15.73% 13.95% with 12.06% 17.43%, curve to 23.69% 7.79% with 19.39% 10.46%, curve to 32.72% 3.35% with 27.98% 5.11%, curve to 42.47% 0.83% with 37.47% 1.60%, curve to 52.52% 0.32% with 47.47% 0.06%, curve to 62.47% 1.84% with 57.57% 0.58%, curve to 71.91% 5.34% with 67.37% 3.11%, curve to 80.45% 10.66% with 76.45% 7.57%, curve to 87.74% 17.60% with 84.45% 13.76%, curve to 93.49% 25.86% with 91.04% 21.44%, curve to 97.46% 35.11% with 95.95% 30.28%, curve to 99.49% 44.97% with 98.98% 39.94%)
  }

  30% {
    clip-path: shape(from 73.99% 47.36%, curve to 79.87% 53.85% with 72.28% 50.00%, curve to 88.83% 62.47% with 87.47% 57.70%, curve to 79.89% 65.44% with 90.19% 67.25%, curve to 71.86% 69.51% with 69.59% 63.63%, curve to 71.30% 77.50% with 74.14% 75.39%, curve to 64.93% 80.21% with 68.45% 79.61%, curve to 58.77% 85.38% with 61.42% 80.82%, curve to 52.40% 83.06% with 56.12% 89.93%, curve to 44.62% 81.30% with 48.67% 76.18%, curve to 39.82% 79.35% with 40.57% 86.43%, curve to 34.42% 74.21% with 39.08% 72.26%, curve to 21.83% 78.57% with 29.75% 76.16%, curve to 16.56% 74.04% with 13.91% 80.98%, curve to 24.21% 61.81% with 19.20% 67.09%, curve to 14.76% 55.79% with 29.23% 56.52%, curve to 5.19% 50.50% with 0.30% 55.05%, curve to 15.10% 43.28% with 10.08% 45.94%, curve to 25.35% 39.92% with 20.12% 40.63%, curve to 21.89% 28.82% with 30.57% 39.22%, curve to 21.55% 21.22% with 13.21% 18.41%, curve to 33.36% 23.58% with 29.89% 24.02%, curve to 38.67% 18.26% with 36.82% 23.14%, curve to 44.18% 10.34% with 40.52% 13.39%, curve to 50.54% 18.08% with 47.83% 7.29%, curve to 56.70% 25.72% with 53.24% 28.87%, curve to 65.38% 19.77% with 60.16% 22.56%, curve to 76.19% 16.76% with 70.59% 16.97%, curve to 82.03% 22.05% with 81.79% 16.55%, curve to 81.63% 32.12% with 82.27% 27.54%, curve to 78.35% 40.71% with 81.00% 36.70%, curve to 73.99% 47.36% with 75.70% 44.72%)
  }
}

/* Mode 59 - Geometric */
.divi-loader-59 {
  height: 70px;
  aspect-ratio: 1;
  background: var(--pre-accent);
  animation: divi_fl_59_l7 1s alternate infinite linear;
}

@keyframes divi_fl_59_l7 {
  0% {
    clip-path: shape(from 88.24% 45.24%, curve to 91.98% 55.69% with 87.83% 50.00%, curve to 92.19% 65.72% with 96.13% 61.37%, curve to 82.51% 71.89% with 88.25% 70.08%, curve to 73.92% 77.12% with 76.76% 73.71%, curve to 67.64% 83.99% with 71.08% 80.54%, curve to 59.29% 86.72% with 64.20% 87.45%, curve to 50.03% 85.75% with 54.37% 85.99%, curve to 41.01% 85.79% with 45.69% 85.51%, curve to 31.92% 84.32% with 36.32% 86.06%, curve to 24.54% 78.88% with 27.52% 82.57%, curve to 14.92% 73.54% with 21.57% 75.19%, curve to 11.17% 65.38% with 8.28% 71.90%, curve to 13.06% 54.43% with 14.06% 58.86%, curve to 10.82% 45.02% with 12.06% 50.00%, curve to 8.58% 33.89% with 9.57% 40.04%, curve to 10.15% 22.35% with 7.59% 27.74%, curve to 18.38% 14.68% with 12.71% 16.96%, curve to 30.31% 13.49% with 24.05% 12.41%, curve to 40.48% 9.19% with 36.56% 14.57%, curve to 49.83% 5.21% with 44.39% 3.81%, curve to 59.83% 9.34% with 55.27% 6.61%, curve to 70.71% 11.45% with 64.39% 12.06%, curve to 81.77% 14.24% with 77.03% 10.83%, curve to 84.04% 25.54% with 86.51% 17.65%, curve to 85.11% 36.95% with 81.57% 33.43%, curve to 88.24% 45.24% with 88.65% 40.47%)
  }

  to {
    clip-path: shape(from 99.27% 44.02%, curve to 99.27% 55.98% with 100.00% 50.00%, curve to 96.41% 67.60% with 98.55% 61.97%, curve to 90.85% 78.20% with 94.27% 73.24%, curve to 82.91% 87.15% with 87.43% 83.16%, curve to 73.07% 93.95% with 78.40% 91.15%, curve to 61.88% 98.19% with 67.73% 96.75%, curve to 50.00% 99.64% with 56.03% 99.64%, curve to 38.12% 98.19% with 43.97% 99.64%, curve to 26.93% 93.95% with 32.27% 96.75%, curve to 17.09% 87.15% with 21.60% 91.15%, curve to 9.15% 78.20% with 12.57% 83.16%, curve to 3.59% 67.60% with 5.73% 73.24%, curve to 0.73% 55.98% with 1.45% 61.97%, curve to 0.73% 44.02% with 0.00% 50.00%, curve to 3.59% 32.40% with 1.45% 38.03%, curve to 9.15% 21.80% with 5.73% 26.76%, curve to 17.09% 12.85% with 12.57% 16.84%, curve to 26.93% 6.05% with 21.60% 8.85%, curve to 38.12% 1.81% with 32.27% 3.25%, curve to 50.00% 0.36% with 43.97% 0.36%, curve to 61.88% 1.81% with 56.03% 0.36%, curve to 73.07% 6.05% with 67.73% 3.25%, curve to 82.91% 12.85% with 78.40% 8.85%, curve to 90.85% 21.80% with 87.43% 16.84%, curve to 96.41% 32.40% with 94.27% 26.76%, curve to 99.27% 44.02% with 98.55% 38.03%);
  }
}

/* Mode 60 - Circular */
.divi-loader-60 {
  height: 80px;
  aspect-ratio: 1;
  padding: 10px;
  border-radius: 50%;
  box-sizing: border-box;
  position: relative;
  mask: conic-gradient(var(--pre-accent) 0 0) content-box exclude, conic-gradient(var(--pre-accent) 0 0);
  filter: blur(12px);
}

.divi-loader-60:before {
  content: "";
  position: absolute;
  inset: 0;
  background: conic-gradient(#0000 35%, var(--pre-accent), #0000 65%);
  animation: divi_fl_60_l1 1.5s linear infinite;
}

@keyframes divi_fl_60_l1 {
  to {
    rotate: 1turn
  }
}

/* Mode 61 - Circular */
.divi-loader-61 {
  height: 80px;
  aspect-ratio: 1;
  padding: 10px;
  border-radius: 50%;
  box-sizing: border-box;
  position: relative;
  mask: conic-gradient(var(--pre-accent) 0 0) content-box exclude, conic-gradient(var(--pre-accent) 0 0);
  filter: blur(12px);
}

.divi-loader-61:before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-conic-gradient(#0000 0 5%, var(--pre-accent), #0000 20% 50%);
  animation: divi_fl_61_l2 1.5s linear infinite;
}

@keyframes divi_fl_61_l2 {
  to {
    rotate: 1turn
  }
}

/* Mode 62 - Geometric */
.divi-loader-62 {
  height: 80px;
  aspect-ratio: 1;
  padding: 10px;
  border-radius: 20px;
  box-sizing: border-box;
  position: relative;
  mask: conic-gradient(var(--pre-accent) 0 0) content-box exclude, conic-gradient(var(--pre-accent) 0 0);
  filter: blur(12px);
}

.divi-loader-62:before {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-conic-gradient(#0000 0 5%, var(--pre-accent), #0000 20% 50%);
  animation: divi_fl_62_l3 1.5s linear infinite;
}

@keyframes divi_fl_62_l3 {
  to {
    rotate: 1turn
  }
}

/* Mode 77 - Progress Bars */
.divi-loader-77 {
  width: 35px;
  aspect-ratio: 1;
  --c: no-repeat linear-gradient(var(--pre-accent) 0 0);
  background:
    var(--c) 0 0,
    var(--c) 100% 0,
    var(--c) 100% 100%,
    var(--c) 0 100%;
  animation:
    divi_fl_77_l2-1 2s infinite,
    divi_fl_77_l2-2 2s infinite;
}

@keyframes divi_fl_77_l2-1 {
  0% {
    background-size: 0 4px, 4px 0, 0 4px, 4px 0
  }

  12.5% {
    background-size: 100% 4px, 4px 0, 0 4px, 4px 0
  }

  25% {
    background-size: 100% 4px, 4px 100%, 0 4px, 4px 0
  }

  37.5% {
    background-size: 100% 4px, 4px 100%, 100% 4px, 4px 0
  }

  45%,
  55% {
    background-size: 100% 4px, 4px 100%, 100% 4px, 4px 100%
  }

  62.5% {
    background-size: 0 4px, 4px 100%, 100% 4px, 4px 100%
  }

  75% {
    background-size: 0 4px, 4px 0, 100% 4px, 4px 100%
  }

  87.5% {
    background-size: 0 4px, 4px 0, 0 4px, 4px 100%
  }

  100% {
    background-size: 0 4px, 4px 0, 0 4px, 4px 0
  }
}

@keyframes divi_fl_77_l2-2 {

  0%,
  49.9% {
    background-position: 0 0, 100% 0, 100% 100%, 0 100%
  }

  50%,
  100% {
    background-position: 100% 0, 100% 100%, 0 100%, 0 0
  }
}

/* Mode 78 - Progress Bars */
.divi-loader-78 {
  width: 60px;
  height: 20px;
  display: grid;
  color: var(--pre-accent);
}

.divi-loader-78:before,
.divi-loader-78:after {
  content: "";
  grid-area: 1/1;
  --c: #0000 calc(100%/3), var(--pre-accent) 0 calc(2*100%/3), #0000 0;
  --c1: linear-gradient(90deg, var(--c));
  --c2: linear-gradient(0deg, var(--c));
  background: var(--c1), var(--c2), var(--c1), var(--c2);
  background-size: 300% 4px, 4px 300%;
  background-repeat: no-repeat;
  animation: divi_fl_78_l15 1.5s infinite;
}

.divi-loader-78:after {
  animation-delay: -.75s;
}

@keyframes divi_fl_78_l15 {
  0% {
    background-position: 50% 0, 100% 100%, 0 100%, 0 0
  }

  25% {
    background-position: 0 0, 100% 50%, 0 100%, 0 0
  }

  50% {
    background-position: 0 0, 100% 0, 50% 100%, 0 0
  }

  75% {
    background-position: 0 0, 100% 0, 100% 100%, 0 50%
  }

  75.01% {
    background-position: 100% 0, 100% 0, 100% 100%, 0 50%
  }

  100% {
    background-position: 50% 0, 100% 0, 100% 100%, 0 100%
  }
}

/* Mode 79 - Circular */
.divi-loader-79 {
  width: 28px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--pre-accent);
  transform-origin: top;
  display: grid;
  animation: divi_fl_79_l3-0 1s infinite linear;
}

.divi-loader-79::before,
.divi-loader-79::after {
  content: "";
  grid-area: 1/1;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  transform-origin: top;
  animation: inherit;
  animation-name: divi_fl_79_l3-1;
}

.divi-loader-79::after {
  background: var(--pre-accent);
  --s: 180deg;
}

@keyframes divi_fl_79_l3-0 {

  0%,
  20% {
    transform: rotate(0)
  }

  100% {
    transform: rotate(360deg)
  }
}

@keyframes divi_fl_79_l3-1 {
  50% {
    transform: rotate(var(--s, 90deg))
  }

  100% {
    transform: rotate(0)
  }
}

/* Mode 80 - Circular */
.divi-loader-80 {
  width: 50px;
  aspect-ratio: 1;
  background: var(--pre-accent);
  border-radius: 50%;
  animation: divi_fl_80_l1 3s infinite linear;
}

@keyframes divi_fl_80_l1 {
  12.5% {
    border-radius: 37% 63% 70% 30% / 30% 62% 38% 70%
  }

  25% {
    border-radius: 50% 50% 70% 30% / 52% 62% 38% 48%
  }

  37.5% {
    border-radius: 33% 67% 18% 82% / 52% 75% 25% 48%
  }

  50% {
    border-radius: 73% 27% 18% 82% / 52% 32% 68% 48%
  }

  62.5% {
    border-radius: 73% 27% 74% 26% / 64% 32% 68% 36%
  }

  75% {
    border-radius: 84% 16% 15% 85% / 55% 79% 21% 45%
  }

  87.5% {
    border-radius: 12% 88% 69% 31% / 10% 66% 34% 90%
  }
}

.pre-custom-video {
  width: 100%;
  height: 100%;
  object-fit: contain;
}