/* Approved dark fog background; the 70% shade covers only the background layers. */
html.hotcs-dark-fog-background body {
  background-image: none !important;
  background-color: #0a080d !important;
  isolation: isolate;
}
.hcfog-background {
  position: fixed;
  inset: 0;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  background: #0a080d;
  contain: strict;
}
.hcfog-background__base {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 45% 50% at 101% 28%, #34233f9c, transparent 78%),
    radial-gradient(ellipse 50% 70% at 8% 64%, #31203c70, transparent 80%),
    radial-gradient(ellipse 68% 46% at 67% 110%, #66342436, transparent 82%),
    #0a080d;
}
.hcfog-background__mist {
  position: absolute;
  inset: -5%;
  background:
    url('/app/templates/neo_remastered/assets/halloween-navigation-20261009/decor/bp-nav-mist-v3.webp') -380px 32% / 1200px 630px no-repeat,
    url('/app/templates/neo_remastered/assets/halloween-navigation-20261009/decor/bp-nav-mist-v3.webp') calc(100% + 360px) 45% / 1300px 780px no-repeat;
  opacity: .18;
  filter: brightness(.67);
  mix-blend-mode: screen;
  mask-image: linear-gradient(90deg,#000,transparent 42%,transparent 69%,#000);
  animation: hcfog-drift 32s ease-in-out infinite alternate;
}
.hcfog-background__vignette {
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 90% 90% at 60% 33%, transparent 27%, #06050988 100%);
}
.hcfog-background__shade {
  position: absolute;
  inset: 0;
  background: #07060b;
  opacity: .7;
}
@keyframes hcfog-drift {
  from { transform: translate3d(-.8%,1%,0); }
  to { transform: translate3d(.8%,-1%,0); }
}
@media(max-width:600px) {
  .hcfog-background__mist { background-size: 780px 600px, 830px 690px; opacity: .12; }
}
@media(prefers-reduced-motion:reduce) {
  .hcfog-background__mist { animation: none; }
}
