.loader-frame {
  z-index: 9999999;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, 0.018)),
    radial-gradient(84vw 74vw at var(--bg-spot-1-x, 14%) var(--bg-spot-1-y, 12%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 22%,
      var(--theme-spot-1, rgba(255, 41, 41, 0.065)) 54%,
      rgba(0, 0, 0, 0) 88%),
    radial-gradient(80vw 70vw at var(--bg-spot-2-x, 84%) var(--bg-spot-2-y, 18%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 20%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 52%,
      rgba(0, 0, 0, 0) 89%),
    radial-gradient(86vw 76vw at var(--bg-spot-3-x, 50%) var(--bg-spot-3-y, 88%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-3, rgba(255, 156, 156, 0.042)) 56%,
      rgba(0, 0, 0, 0) 90%),
    var(--theme-bg, #f0f0f0);
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  isolation: isolate;
  overflow: hidden;
  will-change: opacity;
  view-transition-name: loader;
}

.loader-frame.loader-frame-live {
  background: transparent;
}

.loader-frame.loader-frame-live[data-loader-live-renderer="energy"].loader-frame-live-fallback {
  background: var(--critical-energy-background, #000);
}

.loader-frame.loader-frame-live[data-loader-live-renderer="grainient"].loader-frame-live-fallback {
  background: #050505;
}

.loader-frame.loader-frame-live[data-loader-live-renderer="video"].loader-frame-live-fallback {
  background: #050505;
}

.loader-live-background {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
  background: transparent;
  opacity: 0;
  transition: opacity 180ms ease;
}

.loader-live-background[data-energy-motion="page-scroll"],
.loader-live-background[data-energy-motion="index-zoom"] {
  transform: translate3d(0, var(--site-energy-translate-y, 0px), 0) scale(var(--site-energy-scale, 1));
  transform-origin: center center;
  will-change: transform;
}

.loader-live-background[data-energy-motion="page-scroll"] {
  inset: 0 auto auto 0;
  width: 100%;
  height: var(--site-energy-height, 100%);
  transform: scale(var(--site-energy-scale, 1));
}

.loader-live-background[data-loader-live-renderer="energy"] {
  background: var(--critical-energy-background, #000);
}

.loader-live-background[data-loader-live-renderer="grainient"] {
  background: #050505;
}

.loader-live-background[data-loader-live-renderer="video"] {
  background: #050505;
  opacity: 1;
  transition: none;
}

.loader-live-background .site-video-background-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center center;
  background: #050505;
}

.loader-frame.loader-frame-live-ready .loader-live-background {
  opacity: 1;
}

.loader-frame.loader-frame-live-ready {
  background: transparent;
}

html[data-background-renderer="video"] .loader-frame.loader-frame-live-ready {
  background: transparent !important;
}

html[data-background-renderer="video"] .loader-frame.loader-frame-live-ready .loader-live-background {
  opacity: 1 !important;
}

html.loader-pending,
html.loader-pending body,
html.loader-pending body *,
html.loader-pending #page-loader,
html.loader-pending #page-loader *,
.loader-frame,
.loader-frame *,
.loader-frame lottie-player,
.loader-frame .loader,
.loader-frame .loader-placeholder {
  cursor: none !important;
}

html.loader-pending body > :not(#page-loader) {
  visibility: hidden !important;
}

html.loader-pending #page-loader {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

html.page-long .loader-frame {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, 0.018)),
    radial-gradient(84vw 74vw at var(--bg-spot-1-x, 14%) var(--bg-spot-1-y, 12%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 22%,
      var(--theme-spot-1, rgba(255, 41, 41, 0.065)) 54%,
      rgba(0, 0, 0, 0) 88%),
    radial-gradient(80vw 70vw at var(--bg-spot-2-x, 84%) var(--bg-spot-2-y, 18%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 20%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 52%,
      rgba(0, 0, 0, 0) 89%),
    radial-gradient(86vw 76vw at var(--bg-spot-3-x, 50%) var(--bg-spot-3-y, 88%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-3, rgba(255, 156, 156, 0.042)) 56%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(80vw 70vw at var(--bg-spot-4-x, 22%) var(--bg-spot-4-y, 48%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 20%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 51%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(76vw 66vw at var(--bg-spot-5-x, 80%) var(--bg-spot-5-y, 64%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-1, rgba(255, 41, 41, 0.065)) 54%,
      rgba(0, 0, 0, 0) 90%),
    var(--theme-bg, #f0f0f0);
}

html.page-very-long .loader-frame {
  background:
    linear-gradient(120deg, rgba(255, 255, 255, 0.016), rgba(255, 255, 255, 0) 45%, rgba(0, 0, 0, 0.018)),
    radial-gradient(84vw 74vw at var(--bg-spot-1-x, 14%) var(--bg-spot-1-y, 12%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 22%,
      var(--theme-spot-1, rgba(255, 41, 41, 0.065)) 54%,
      rgba(0, 0, 0, 0) 88%),
    radial-gradient(80vw 70vw at var(--bg-spot-2-x, 84%) var(--bg-spot-2-y, 18%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 20%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 52%,
      rgba(0, 0, 0, 0) 89%),
    radial-gradient(86vw 76vw at var(--bg-spot-3-x, 50%) var(--bg-spot-3-y, 88%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-3, rgba(255, 156, 156, 0.042)) 56%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(80vw 70vw at var(--bg-spot-4-x, 22%) var(--bg-spot-4-y, 48%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 20%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 51%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(76vw 66vw at var(--bg-spot-5-x, 80%) var(--bg-spot-5-y, 64%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-1, rgba(255, 41, 41, 0.065)) 54%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(78vw 68vw at var(--bg-spot-6-x, 18%) var(--bg-spot-6-y, 78%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 24%,
      var(--theme-spot-3, rgba(255, 156, 156, 0.042)) 56%,
      rgba(0, 0, 0, 0) 90%),
    radial-gradient(74vw 64vw at var(--bg-spot-7-x, 82%) var(--bg-spot-7-y, 92%),
      rgba(0, 0, 0, 0) 0%,
      rgba(0, 0, 0, 0) 22%,
      var(--theme-spot-2, rgba(255, 98, 98, 0.048)) 52%,
      rgba(0, 0, 0, 0) 91%),
    var(--theme-bg, #f0f0f0);
}

html[data-background-renderer="grainient"] .loader-frame,
html.page-long[data-background-renderer="grainient"] .loader-frame,
html.page-very-long[data-background-renderer="grainient"] .loader-frame {
  background: #050505;
}

html[data-background-renderer="video"] .loader-frame,
html.page-long[data-background-renderer="video"] .loader-frame,
html.page-very-long[data-background-renderer="video"] .loader-frame {
  background: #050505;
}

.loader-frame::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  transition: opacity 140ms ease;
  mix-blend-mode: normal;
  background: url('/ASSETS/video/Grain.gif');
  background-repeat: repeat;
  background-size: var(--grain-size, 420px 420px);
}

.loader-frame.loader-ready::after {
  opacity: var(--grain-opacity, 0.05);
}

.loader-frame.est-cache {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loader-frame.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.loader {
  width: 300px;
  height: 300px;
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 0;
  opacity: 1;
  visibility: visible;
  transition: opacity 140ms ease, visibility 0s linear 140ms;
}

.loader-frame.loader-ready .loader {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.loader-placeholder {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 3;
  background: var(--theme-accent);
  -webkit-mask: url('/ASSETS/lottie/loader-first-frame.svg?v=2') center / contain no-repeat;
  mask: url('/ASSETS/lottie/loader-first-frame.svg?v=2') center / contain no-repeat;
  opacity: 1;
  visibility: visible;
  transition: opacity 180ms ease, visibility 0s linear 180ms;
}

.loader-frame lottie-player {
  width: 300px;
  height: 300px;
  display: block;
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transition: opacity 180ms ease, visibility 0s linear 180ms;
}

.loader.has-lottie-ready.show-lottie lottie-player {
  opacity: 1;
  visibility: visible;
  transition-delay: 0s;
}

.loader.has-lottie-ready.show-lottie .loader-placeholder {
  opacity: 0;
  visibility: hidden;
  transition-delay: 0s, 180ms;
}

.loader-inner {
  position: absolute;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 3px solid var(--theme-accent-outline);
  border-top-color: var(--theme-accent);
  animation: loader-spin 0.9s linear infinite;
  z-index: 1;
  display: none;
}

.loader.fallback-visible .loader-inner {
  display: block;
}

@keyframes loader-spin {
  to {
    transform: rotate(360deg);
  }
}

html.low-perf .loader-inner { z-index: 2; }

::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-old(loader),
::view-transition-new(loader) {
  animation: none;
  mix-blend-mode: normal;
}

::view-transition-image-pair(root) {
  isolation: auto;
}
