.crossroad-top-underwater {
  position: fixed;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  touch-action: none;
  opacity: 0;
  transition: none;
}

.crossroad-top-underwater.is-ready {
  opacity: .32;
}

.crossroad-top-underwater[hidden] {
  display: none;
}

@media (prefers-reduced-motion: reduce) {
  .crossroad-top-underwater {
    display: none;
  }
}