/* Phase 2: keep the TODAY junction legible as the quiet center of the map. */
html[data-crossroad-phase="prelaunch"] .present-marker {
  isolation: isolate;
}

html[data-crossroad-phase="prelaunch"] .intersection-sanctuary {
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  width: 196px;
  height: 168px;
  translate: -50% -50%;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(5, 13, 21, .74) 0 20%,
    rgba(5, 13, 21, .48) 42%,
    rgba(5, 13, 21, .16) 62%,
    transparent 76%
  );
  pointer-events: none;
}

html[data-crossroad-phase="prelaunch"] .present-marker::before,
html[data-crossroad-phase="prelaunch"] .present-marker::after {
  z-index: 1;
}

html[data-crossroad-phase="prelaunch"] .present-marker .origin-core {
  z-index: 6;
}

html[data-crossroad-phase="prelaunch"] .present-marker .origin-today,
html[data-crossroad-phase="prelaunch"] .present-marker .axis-sector-label {
  z-index: 5;
}

/* TODAY stays upper-left; the two axis signs leave a clear ring around the core. */
html[data-crossroad-phase="prelaunch"] .present-marker .origin-today {
  right: calc(50% + 24px);
  bottom: calc(50% + 22px);
}

html[data-crossroad-phase="prelaunch"] .present-marker .axis-sector-prediction {
  left: calc(50% + 18px);
  top: calc(50% - 18px);
}

html[data-crossroad-phase="prelaunch"] .present-marker .axis-sector-official {
  right: auto;
  left: 50%;
  top: calc(50% + 18px);
  translate: -50% 0;
}

/* The rail still continues, but its clipped ends dissolve into the water. */
html[data-crossroad-phase="prelaunch"] .prediction-zone {
  --rail-edge-fade: 72px;
}

html[data-crossroad-phase="prelaunch"] .prediction-days-ahead {
  transition: opacity 160ms ease-out;
}

html[data-crossroad-phase="prelaunch"] .prediction-days-ahead.is-edge-clipped {
  opacity: 0;
}

/* Interactive scenery yields more decisively inside the protected junction. */
html[data-crossroad-phase="prelaunch"] .ambient-art-item.is-ducked:not(.is-excluded):not(.is-entering):not(.is-leaving) img {
  opacity: .16;
}

@media (max-width: 760px) {
  html[data-crossroad-phase="prelaunch"] .intersection-sanctuary {
    width: 148px;
    height: 132px;
  }

  html[data-crossroad-phase="prelaunch"] .present-marker .origin-today {
    right: calc(50% + 18px);
    bottom: calc(50% + 18px);
  }

  html[data-crossroad-phase="prelaunch"] .present-marker .axis-sector-prediction {
    left: calc(50% + 14px);
    top: calc(50% - 14px);
  }

  html[data-crossroad-phase="prelaunch"] .present-marker .axis-sector-official {
    top: calc(50% + 14px);
  }

  html[data-crossroad-phase="prelaunch"] .prediction-zone {
    --rail-edge-fade: 32px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-crossroad-phase="prelaunch"] .intersection-sanctuary,
  html[data-crossroad-phase="prelaunch"] .prediction-days-ahead {
    transition: none;
  }
}
