/* 动态世界的独立图层：水下生物、下潜涟漪和返航小船。 */
.world-life {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 1;
}
.journey-effects {
  position: fixed;
  inset: 0;
  z-index: 240;
  pointer-events: none;
  overflow: hidden;
  contain: strict;
}
.portal-ripple {
  position: absolute;
  width: 380px;
  height: 380px;
  border-radius: 50%;
  border: 18px solid #8cf2e9;
  outline: 3px solid #e5ffff;
  box-shadow:
    0 0 0 30px #74e5f146,
    0 0 0 70px #6ecbeb26,
    inset 0 0 70px #a6ffff80,
    0 0 70px #a6ffff90;
  animation: portal-rush 0.8s cubic-bezier(0.15, 0.65, 0.2, 1) both;
}
.journey-bubble {
  position: absolute;
  width: var(--size);
  height: var(--size);
  border: 2px solid #b7fff5bb;
  border-radius: 50%;
  background: radial-gradient(
    circle at 30% 25%,
    #f5ffffaa,
    #aaf1f51f 28%,
    transparent 60%
  );
  box-shadow:
    inset -3px -3px 8px #7de3ee45,
    0 0 14px #a4eff733;
  animation: portal-bubble 0.85s ease-out both;
}
.return-vessel {
  position: absolute;
  left: 0;
  top: 0;
  width: 185px;
  height: 150px;
  filter: drop-shadow(0 18px 10px #052d6433) drop-shadow(0 0 18px #b7f9fc66);
}
.return-vessel svg {
  width: 100%;
  height: 100%;
  stroke: none;
}
@keyframes portal-rush {
  from {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.06) rotate(-25deg);
  }
  50% {
    opacity: 0.72;
  }
  to {
    opacity: 0;
    transform: translate(-50%, -50%) scale(7) rotate(18deg);
  }
}
@keyframes portal-bubble {
  from {
    transform: translate(-50%, -50%) scale(0.25);
    opacity: 0.9;
  }
  to {
    transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy)))
      scale(1.2);
    opacity: 0;
  }
}
.motion-off .world-life,
.motion-off .journey-effects {
  display: none;
}
@media (prefers-reduced-motion: reduce) {
  .world-life,
  .journey-effects {
    display: none;
  }
}