/* Home hero → Clear Space: seagreen (day) / forest dusk (night) + one-shot bubbles. */

.cs-entry-overlay {
  position: fixed;
  inset: 0;
  z-index: 10050;
  overflow: hidden;
  background: rgb(243, 245, 255);
  opacity: 0;
  pointer-events: none;
}

.cs-entry-overlay.is-active {
  opacity: 1;
  pointer-events: auto;
}

.cs-entry-overlay__lottie {
  position: absolute;
  inset: -12vmax;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
}

.cs-entry-overlay__player,
.cs-entry-overlay__lottie lottie-player {
  width: 165vmax;
  height: 165vmax;
  min-width: 115vw;
  min-height: 115vh;
  max-width: none;
  max-height: none;
  flex-shrink: 0;
  opacity: 1 !important;
  /* bubbles.json is cyan — hue-rotate(-70deg) lands on bright green */
  filter: hue-rotate(-70deg) saturate(2.8) brightness(1.25);
}

html.night-mode .cs-entry-overlay,
body.night-mode .cs-entry-overlay,
.cs-entry-overlay.cs-entry-overlay--night {
  background: #10261c;
}

html.night-mode .cs-entry-overlay__player,
html.night-mode .cs-entry-overlay__lottie lottie-player,
body.night-mode .cs-entry-overlay__player,
body.night-mode .cs-entry-overlay__lottie lottie-player,
.cs-entry-overlay--night .cs-entry-overlay__player,
.cs-entry-overlay--night .cs-entry-overlay__lottie lottie-player {
  /* Fallback while night JSON loads: dim the day green instead of cyan. */
  filter: hue-rotate(-70deg) saturate(0.72) brightness(0.42);
}

html.night-mode .cs-entry-overlay--night-json .cs-entry-overlay__player,
html.night-mode .cs-entry-overlay--night-json .cs-entry-overlay__lottie lottie-player,
body.night-mode .cs-entry-overlay--night-json .cs-entry-overlay__player,
body.night-mode .cs-entry-overlay--night-json .cs-entry-overlay__lottie lottie-player,
.cs-entry-overlay--night-json .cs-entry-overlay__player,
.cs-entry-overlay--night-json .cs-entry-overlay__lottie lottie-player {
  /* Remapped forest JSON — do not re-hue. */
  filter: none;
}

html.cs-enter-pending,
html.cs-enter-pending body {
  background: seagreen !important;
}

html.cs-enter-pending.cs-enter-night,
html.cs-enter-pending.cs-enter-night body {
  background: #10261c !important;
}

html.cs-enter-pending body > * {
  opacity: 0;
}

html.cs-enter-pending.cs-enter-play body > * {
  opacity: 1;
  transition: opacity 0.75s ease;
}
