/* ========== 星空闪烁 ========== */
@keyframes twinkle {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}
@keyframes twinkle-bright {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.3); }
}

/* ========== 流星 ========== */
@keyframes shooting-star {
  0% { transform: translateX(0) translateY(0); opacity: 1; width: 0; }
  30% { opacity: 1; width: 80px; }
  100% { transform: translateX(-350px) translateY(350px); opacity: 0; width: 120px; }
}

/* ========== 灯塔光束 ========== */
@keyframes beam-sweep {
  0% { transform: rotate(-15deg); opacity: 0.6; }
  25% { opacity: 0.9; }
  50% { transform: rotate(15deg); opacity: 0.7; }
  75% { opacity: 0.95; }
  100% { transform: rotate(-15deg); opacity: 0.6; }
}
@keyframes beam-flicker {
  0%, 100% { opacity: 0.7; }
  10% { opacity: 0.9; }
  30% { opacity: 0.6; }
  50% { opacity: 1; }
  70% { opacity: 0.75; }
  90% { opacity: 0.85; }
}

/* ========== 海浪（潮涌漂移） ========== */
@keyframes wave-drift-1 {
  0%   { transform: translateX(0)    translateY(0); }
  25%  { transform: translateX(-12%) translateY(-6px); }
  50%  { transform: translateX(-25%) translateY(3px); }
  75%  { transform: translateX(-37%) translateY(-4px); }
  100% { transform: translateX(-50%) translateY(0); }
}
@keyframes wave-drift-2 {
  0%   { transform: translateX(-50%) translateY(0); }
  25%  { transform: translateX(-37%) translateY(5px); }
  50%  { transform: translateX(-25%) translateY(-3px); }
  75%  { transform: translateX(-12%) translateY(4px); }
  100% { transform: translateX(0)    translateY(0); }
}
@keyframes wave-drift-3 {
  0%   { transform: translateX(-25%) translateY(0); }
  25%  { transform: translateX(-37%) translateY(-5px); }
  50%  { transform: translateX(-50%) translateY(2px); }
  75%  { transform: translateX(-62%) translateY(-3px); }
  100% { transform: translateX(-75%) translateY(0); }
}

/* ========== 轮船随波起伏 ========== */
@keyframes ship-bob {
  0%   { transform: translateY(0)    rotate(0deg); }
  15%  { transform: translateY(-8px)  rotate(-1.2deg); }
  30%  { transform: translateY(3px)   rotate(0.5deg); }
  45%  { transform: translateY(-10px) rotate(-1.8deg); }
  60%  { transform: translateY(2px)   rotate(0.8deg); }
  75%  { transform: translateY(-6px)  rotate(-1deg); }
  100% { transform: translateY(0)    rotate(0deg); }
}

/* ========== 海鸟 ========== */
@keyframes seagull-fly {
  0% { transform: translate(0, 0) scale(0.5); opacity: 0; }
  10% { opacity: 0.8; }
  50% { transform: translate(-40vw, -5vh) scale(0.7); opacity: 0.6; }
  100% { transform: translate(-80vw, 5vh) scale(0.4); opacity: 0; }
}

/* ========== 游轮航行 ========== */
@keyframes ship-sail {
  0% { transform: translateX(80vw); }
  100% { transform: translateX(-30vw); }
}

/* ========== 脉冲发光 ========== */
@keyframes pulse-glow {
  0%, 100% { box-shadow: 0 0 10px rgba(0, 212, 255, 0.6), 0 0 30px rgba(0, 212, 255, 0.2); }
  50% { box-shadow: 0 0 20px rgba(0, 212, 255, 0.9), 0 0 50px rgba(0, 212, 255, 0.4); }
}

/* ========== Toast ========== */
@keyframes toast-in {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes toast-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-10px); }
}

/* ========== 淡入 ========== */
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes fade-in-up {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ========== 水母漂浮 ========== */
@keyframes jellyfish-float {
  0% { transform: translateY(0) translateX(0); opacity: 0; }
  15% { opacity: 0.7; }
  85% { opacity: 0.7; }
  100% { transform: translateY(-60vh) translateX(20px); opacity: 0; }
}

/* ========== 涟漪 ========== */
@keyframes ripple-expand {
  0% { transform: scale(0); opacity: 0.8; }
  100% { transform: scale(3); opacity: 0; }
}

/* ========== 呼吸光效 ========== */
@keyframes breathe {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.8; }
}