/* Broken celestial paths, in the scene's existing foreground/background planes. */
.celestial-plane {
  position: absolute;
  inset: 0;
  display: block;
  pointer-events: none;
  user-select: none;
  -webkit-user-select: none;
  overflow: visible;
  contain: layout style;
}
.celestial-svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.celestial-svg path,
.celestial-svg circle {
  pointer-events: none;
}
.celestial-plane--back { opacity: .94; }
.celestial-plane--front {
  opacity: .88;
  mix-blend-mode: screen;
}
.layered-stage[data-celestial] .stage-orbit { opacity: .94; }
.layered-stage[data-celestial] .stage-orbit > .layer-reveal {
  border-color: transparent;
  border-radius: 0;
}
.layered-stage[data-celestial] .stage-orbit > .layer-reveal > .celestial-plane {
  inset: 0;
  writing-mode: horizontal-tb;
}
.layered-stage[data-celestial] .stage-orbit > .layer-reveal > i,
.layered-stage[data-celestial] .stage-orbit > .layer-reveal > b {
  display: none;
}
.layered-stage[data-celestial] .stage-orbit > .layer-reveal > span:not(.celestial-plane) {
  opacity: .55;
  font-size: 7px;
  letter-spacing: .24em;
}
/* The screenshot's closed ellipse was this foreground border. */
.layered-stage[data-celestial="promise"] .spell-foreground > i,
.layered-stage[data-celestial="promise"] .spell-foreground > span {
  display: none;
}
.layered-stage[data-celestial="promise"] .spell-foreground > b { color: #d7c492; }
.layered-stage[data-celestial="journey"] .wind-line,
.layered-stage[data-celestial="journey"] .wind-spark { display: none; }
.layered-stage[data-celestial="promise"] .celestial-plane--front { opacity: .96; }
.layered-stage[data-celestial="wish"] .celestial-plane--front { opacity: .72; }
.layered-stage[data-celestial="journey"] .celestial-plane--front { opacity: .82; }
.title-orbit[data-celestial] {
  border-color: transparent;
  border-radius: 0;
  pointer-events: none;
}
.title-orbit[data-celestial]::before,
.title-orbit[data-celestial]::after { display: none; }
.title-orbit[data-celestial] .celestial-plane {
  inset: -5%;
  opacity: .9;
}
.title-orbit[data-celestial] .celestial-haze { opacity: .12; }
.title-orbit[data-celestial] .celestial-dust-field { opacity: .32; }
@media (max-width: 760px) {
  .layered-stage[data-celestial] .celestial-plane--back { opacity: .84; }
  .layered-stage[data-celestial] .celestial-plane--front { opacity: .8; }
  .celestial-haze { opacity: .17; }
  .celestial-dust:nth-child(3n) { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .celestial-trace { opacity: .25; }
}