/* 动画效果 */

/* 撒花粒子 */
.confetti {
  position: fixed;
  width: 8px; height: 8px;
  pointer-events: none;
  z-index: 300;
  animation: confettiFall 1.5s ease-out forwards;
}
@keyframes confettiFall {
  0% { transform: translateY(0) rotate(0); opacity: 1; }
  100% { transform: translateY(100vh) rotate(720deg); opacity: 0; }
}

/* 升级金光 */
.levelup-overlay {
  position: fixed;
  inset: 0;
  background: radial-gradient(circle, rgba(99,102,241,0.3), transparent 70%);
  z-index: 250;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.levelup-overlay.show { display: flex; animation: levelupFlash 2s ease forwards; }
.levelup-text {
  font-size: 32px;
  font-weight: 800;
  background: linear-gradient(135deg, #f59e0b, #fbbf24, #f59e0b);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-align: center;
  animation: levelupPop 0.6s ease;
}
.levelup-text .sub { font-size: 16px; display: block; margin-top: 8px; }

@keyframes levelupFlash {
  0% { opacity: 0; }
  20% { opacity: 1; }
  80% { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes levelupPop {
  0% { transform: scale(0.5); opacity: 0; }
  60% { transform: scale(1.15); }
  100% { transform: scale(1); opacity: 1; }
}

/* 火焰跳动 */
.flame-anim {
  display: inline-block;
  animation: flameFlicker 0.6s ease-in-out infinite alternate;
}
@keyframes flameFlicker {
  0% { transform: scale(1) rotate(-2deg); }
  100% { transform: scale(1.08) rotate(2deg); }
}

/* 成就解锁弹窗 */
.achievement-popup {
  position: fixed;
  top: 80px;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: #fff;
  padding: 14px 20px;
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(99,102,241,0.5);
  z-index: 280;
  display: flex;
  align-items: center;
  gap: 12px;
  animation: achSlideIn 0.5s ease, achSlideOut 0.5s ease 3s forwards;
  max-width: 90%;
}
.achievement-popup .ach-icon { font-size: 32px; }
.achievement-popup .ach-text .ach-title { font-size: 13px; opacity: 0.9; }
.achievement-popup .ach-text .ach-name { font-size: 16px; font-weight: 700; }

@keyframes achSlideIn {
  from { transform: translateX(-50%) translateY(-80px); opacity: 0; }
  to { transform: translateX(-50%) translateY(0); opacity: 1; }
}
@keyframes achSlideOut {
  to { transform: translateX(-50%) translateY(-80px); opacity: 0; }
}

/* 打卡按钮按下波纹 */
.cat-card.checked {
  animation: checkPop 0.4s ease;
}
@keyframes checkPop {
  0% { transform: scale(1); }
  50% { transform: scale(0.92); }
  100% { transform: scale(1); }
}

/* 计时器脉冲 */
.timer-pulse {
  animation: timerPulse 2s ease-in-out infinite;
}
@keyframes timerPulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.6; }
}

/* 休息提醒 */
.break-reminder {
  background: linear-gradient(135deg, #f59e0b, #ef4444);
  color: #fff;
}