/* ============================================
   animations.css — 过渡动画、按键反馈动画
   ============================================ */

/* 判定线呼吸 */
@keyframes judge-breathe {
  0%, 100% {
    opacity: 0.7;
    box-shadow: 0 0 10px var(--accent), 0 0 20px var(--accent-glow);
  }
  50% {
    opacity: 1;
    box-shadow: 0 0 16px var(--accent), 0 0 36px var(--accent-glow);
  }
}

/* 评级字母入场 */
@keyframes grade-in {
  0% {
    opacity: 0;
    transform: scale(0.5);
  }
  60% {
    opacity: 1;
    transform: scale(1.08);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* 结算统计逐项入场 */
@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fade-up {
  opacity: 0;
  animation: fade-up 0.5s var(--ease-out) forwards;
}

/* 音符占位符轻微浮动 */
@keyframes note-float {
  0%, 100% {
    transform: translateX(-50%) translateY(0);
  }
  50% {
    transform: translateX(-50%) translateY(-6px);
  }
}

.note.float {
  animation: note-float 2.2s ease-in-out infinite;
}

.note.float.diamond {
  animation: note-float-diamond 2.2s ease-in-out infinite;
}

@keyframes note-float-diamond {
  0%, 100% {
    transform: translateX(-50%) translateY(0) rotate(45deg);
  }
  50% {
    transform: translateX(-50%) translateY(-6px) rotate(45deg);
  }
}

/* Combo 连击颜色渐变 */
.combo.gradient {
  background: linear-gradient(90deg, var(--judge-cool), var(--accent), var(--judge-just));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* 按键按下时的涟漪提示 */
@keyframes press-pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(0, 212, 255, 0.5);
  }
  100% {
    box-shadow: 0 0 0 18px rgba(0, 212, 255, 0);
  }
}

.key-zone.pressed {
  animation: press-pulse 0.3s ease-out;
}

/* Logo 呼吸微光 */
@keyframes logo-glow {
  0%, 100% {
    text-shadow: 0 0 18px var(--accent-glow);
  }
  50% {
    text-shadow: 0 0 28px var(--accent-glow), 0 0 44px var(--accent-glow);
  }
}

.logo-mark {
  animation: logo-glow 3s ease-in-out infinite;
}
