/* 信封开场动画 */
@keyframes envelopeFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes sealPulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.08); opacity: 0.85; }
}

@keyframes shimmer {
  0% { background-position: -200% center; }
  100% { background-position: 200% center; }
}

@keyframes envelopeOpen {
  0% { transform: perspective(600px) rotateX(0deg); }
  100% { transform: perspective(600px) rotateX(-180deg); }
}

@keyframes fadeSlideUp {
  0% { opacity: 0; transform: translateY(20px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeOut {
  0% { opacity: 1; }
  100% { opacity: 0; }
}

@keyframes slideInUp {
  0% { opacity: 0; transform: translateY(100%); }
  100% { opacity: 1; transform: translateY(0); }
}

.envelope-float {
  animation: envelopeFloat 3s ease-in-out infinite;
}

.seal-pulse {
  animation: sealPulse 2s ease-in-out infinite;
}

.shimmer-text {
  background: linear-gradient(90deg, #c9a96e 0%, #f0d48a 25%, #c9a96e 50%, #f0d48a 75%, #c9a96e 100%);
  background-size: 200% auto;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shimmer 3s linear infinite;
}

.envelope-flap-open {
  animation: envelopeOpen 0.8s ease-in-out forwards;
  transform-origin: top center;
}

.fade-slide-up {
  animation: fadeSlideUp 0.6s ease-out forwards;
}

.fade-out {
  animation: fadeOut 0.5s ease-out forwards;
}

.slide-in-up {
  animation: slideInUp 0.8s ease-out forwards;
}

/* 信封纹理 */
.envelope-texture {
  background: linear-gradient(135deg, #f5e6c8 0%, #e8d5a8 25%, #f0ddb0 50%, #e2cfa0 75%, #f5e6c8 100%);
}

/* 火漆印章 */
.wax-seal {
  background: radial-gradient(circle at 35% 35%, #c0392b 0%, #922b21 40%, #7b241c 70%, #641e16 100%);
  box-shadow: 0 4px 15px rgba(120, 30, 20, 0.5), inset 0 1px 3px rgba(255, 255, 255, 0.2);
}

/* 手写体风格 */
.handwriting {
  font-family: 'STKaiti', 'KaiTi', '楷体', serif;
}

/* 花瓣飘落动画 */
@keyframes petalFall {
  0% {
    transform: translateY(-10vh) rotate(0deg);
    opacity: 0;
  }
  10% {
    opacity: 0.8;
  }
  90% {
    opacity: 0.6;
  }
  100% {
    transform: translateY(110vh) rotate(360deg);
    opacity: 0;
  }
}

.petal-fall {
  animation: petalFall linear infinite;
}