@property --g1a {
  syntax: "<number>";
  inherits: false;
  initial-value: 1;
}
@property --g1x {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 90%;
}
@property --g1y {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 20%;
}
@property --g3a {
  syntax: "<number>";
  inherits: false;
  initial-value: 0.5;
}
@property --g3x {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 90%;
}
@property --g3y {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 20%;
}
@property --g4a {
  syntax: "<number>";
  inherits: false;
  initial-value: 1;
}
@property --g4x {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 10%;
}
@property --g4y {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 0%;
}
@property --g2x {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 10%;
}
@property --g2y {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 80%;
}
:root {
  --orange-rgb: 198 97 57;
  --rose-rgb: 221 73 118;
  --peach: rgb(255 179 128 / 1);
  --teal-rgb: 0 124 117;
  --navy-rgb: 2 52 78;
  --light-blue-rgb: 52 139 143;
  --vignette: hsl(210 30% 2% / 0.55);
}

* {
  box-sizing: border-box;
}

html,
body {
  height: 100%;
}

body {
  margin: 0;
  min-height: 100svh;
  background-attachment: fixed;
  background-image: radial-gradient(100vw 40vh ellipse at var(--g1x) var(--g1y), color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 0%) 0%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 1%) 5%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 3%) 10%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 7%) 15%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 13%) 20%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 21%) 25%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 31%) 30%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 40%) 35%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 48%) 40%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 55%) 45%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 61%) 50%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 66%) 55%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 70%) 60%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 75%) 65%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 81%) 70%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 86%) 75%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 90%) 80%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 94%) 85%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 97%) 90%, color-mix(in srgb, rgb(var(--orange-rgb)/var(--g1a)), transparent 99%) 95%, transparent 100%), radial-gradient(30vw 20vh ellipse at var(--g3x) var(--g3y), color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 0%) 0%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 1%) 5%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 3%) 10%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 7%) 15%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 13%) 20%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 21%) 25%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 31%) 30%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 40%) 35%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 48%) 40%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 55%) 45%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 61%) 50%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 66%) 55%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 70%) 60%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 75%) 65%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 81%) 70%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 86%) 75%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 90%) 80%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 94%) 85%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 97%) 90%, color-mix(in srgb, rgb(var(--rose-rgb)/var(--g3a)), transparent 99%) 95%, transparent 100%), radial-gradient(70vw 50vh ellipse at var(--g4x) var(--g4y), color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 0%) 0%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 1%) 5%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 3%) 10%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 7%) 15%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 13%) 20%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 21%) 25%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 31%) 30%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 40%) 35%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 48%) 40%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 55%) 45%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 61%) 50%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 66%) 55%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 70%) 60%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 75%) 65%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 81%) 70%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 86%) 75%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 90%) 80%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 94%) 85%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 97%) 90%, color-mix(in srgb, rgb(var(--light-blue-rgb)/var(--g4a)), transparent 99%) 95%, transparent 100%), radial-gradient(50vw 30vh ellipse at var(--g2x) var(--g2y), color-mix(in srgb, var(--peach), transparent 0%) 0%, color-mix(in srgb, var(--peach), transparent 1%) 5%, color-mix(in srgb, var(--peach), transparent 3%) 10%, color-mix(in srgb, var(--peach), transparent 7%) 15%, color-mix(in srgb, var(--peach), transparent 13%) 20%, color-mix(in srgb, var(--peach), transparent 21%) 25%, color-mix(in srgb, var(--peach), transparent 31%) 30%, color-mix(in srgb, var(--peach), transparent 40%) 35%, color-mix(in srgb, var(--peach), transparent 48%) 40%, color-mix(in srgb, var(--peach), transparent 55%) 45%, color-mix(in srgb, var(--peach), transparent 61%) 50%, color-mix(in srgb, var(--peach), transparent 66%) 55%, color-mix(in srgb, var(--peach), transparent 70%) 60%, color-mix(in srgb, var(--peach), transparent 75%) 65%, color-mix(in srgb, var(--peach), transparent 81%) 70%, color-mix(in srgb, var(--peach), transparent 86%) 75%, color-mix(in srgb, var(--peach), transparent 90%) 80%, color-mix(in srgb, var(--peach), transparent 94%) 85%, color-mix(in srgb, var(--peach), transparent 97%) 90%, color-mix(in srgb, var(--peach), transparent 99%) 95%, transparent 100%), linear-gradient(135deg, rgb(var(--navy-rgb)) 0%, rgb(var(--teal-rgb)) 100%);
  background-blend-mode: normal;
  animation: drift-orange-x 26s ease-in-out infinite alternate, drift-orange-y 34s ease-in-out infinite alternate, fade-orange 30s ease-in-out infinite alternate, drift-rose-x 20s ease-in-out infinite alternate, drift-rose-y 20s ease-in-out infinite alternate, fade-rose 15s ease-in-out infinite alternate, drift-light-blue-x 20s ease-in-out infinite alternate, drift-light-blue-y 35s ease-in-out infinite alternate, fade-light-blue 60s ease-in-out infinite alternate, drift-peach-x 30s ease-in-out infinite alternate, drift-peach-y 30s ease-in-out infinite alternate;
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
}

@keyframes drift-orange-x {
  0% {
    --g1x: 150%;
  }
  50% {
    --g1x: 100%;
  }
  100% {
    --g1x: 150%;
  }
}
@keyframes drift-orange-y {
  0% {
    --g1y: 40%;
  }
  50% {
    --g1y: 50%;
  }
  100% {
    --g1y: 40%;
  }
}
@keyframes fade-orange {
  0% {
    --g1a: 1;
  }
  50% {
    --g1a: 1;
  }
  100% {
    --g1a: 1;
  }
}
@keyframes drift-rose-x {
  0% {
    --g3x: 100%;
  }
  100% {
    --g3x: 80%;
  }
}
@keyframes drift-rose-y {
  0% {
    --g3y: 30%;
  }
  50% {
    --g3y: 40%;
  }
  100% {
    --g3y: 30%;
  }
}
@keyframes fade-rose {
  0% {
    --g3a: 0.5;
  }
  50% {
    --g3a: 0.2;
  }
  100% {
    --g3a: 0.5;
  }
}
@keyframes drift-light-blue-x {
  0% {
    --g4x: 10%;
  }
  100% {
    --g4x: -40%;
  }
}
@keyframes drift-light-blue-y {
  0% {
    --g4y: 0%;
  }
  50% {
    --g4y: 50%;
  }
  100% {
    --g4y: 0%;
  }
}
@keyframes fade-light-blue {
  0% {
    --g4a: 1;
  }
  50% {
    --g4a: 0.5;
  }
  100% {
    --g4a: 1;
  }
}
@keyframes drift-peach-x {
  0% {
    --g2x: -10%;
  }
  100% {
    --g2x: 110%;
  }
}
@keyframes drift-peach-y {
  0% {
    --g2y: 100%;
  }
  100% {
    --g2y: 100%;
  }
}
@media (prefers-reduced-motion: reduce) {
  body {
    animation: none;
  }
}

/*# sourceMappingURL=background_animations.css.map */
