/* Motion polish: envelope/letter sequencing and dialog entrance. */

.envelope {
  transition: transform 0.65s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.65s ease;
  will-change: transform;
}

.envelope-wrapper.is-opening .envelope {
  transform: translateY(-6px) scale(1.012);
  box-shadow:
    0 26px 70px rgba(0, 0, 0, 0.9),
    0 0 40px rgba(192, 132, 252, 0.16);
}

.envelope-flap {
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  transform-style: preserve-3d;
  will-change: transform;
}

.wax-seal {
  transition:
    transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1),
    opacity 0.42s ease,
    filter 0.42s ease;
  will-change: transform, opacity;
}

.envelope-flap.flap-open .wax-seal {
  transform: translateX(-50%) translateY(-8px) scale(1.5) rotate(18deg);
  opacity: 0;
  filter: blur(1.5px);
}

.envelope-flap.flap-open .wax-seal::after {
  animation: none;
  opacity: 0;
}

.envelope-wrapper.is-opening .letter-peek {
  transform: translateX(-50%) translateY(-8px);
  transition: transform 0.7s 0.1s cubic-bezier(0.22, 1, 0.36, 1);
}

.letter-paper-container {
  transform-origin: top center;
  animation: letterUnfold 0.78s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes letterUnfold {
  0% {
    opacity: 0;
    transform: translateY(18px) scaleY(0.94) scaleX(0.98);
  }
  55% {
    opacity: 1;
    transform: translateY(-2px) scaleY(1.008) scaleX(1.003);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scaleY(1) scaleX(1);
  }
}

.letter-paper-container.is-closing {
  animation: letterFold 0.32s ease forwards;
}

@keyframes letterFold {
  to {
    opacity: 0;
    transform: translateY(-10px) scaleY(0.97);
  }
}

.modal-backdrop[style*="display: flex"] {
  opacity: 0;
  pointer-events: none;
}

.modal-backdrop.is-open {
  opacity: 1;
  pointer-events: all;
}

.modal-backdrop[style*="display: flex"] .modal-card {
  transform: scale(0.88) translateY(20px);
}

.modal-backdrop.is-open .modal-card {
  transform: scale(1) translateY(0);
}

.wish-card {
  transform: scale(0.94) translateY(16px);
  transition: transform 0.42s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.wish-backdrop[style*="display: flex"] .wish-card {
  transform: scale(0.94) translateY(16px);
}

.wish-backdrop.is-open .wish-card {
  transform: scale(1) translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .envelope,
  .envelope-flap,
  .wax-seal,
  .letter-paper-container,
  .wish-card {
    transition: none !important;
    animation: none !important;
  }

  .envelope-wrapper.is-opening .envelope,
  .wish-card {
    transform: none;
  }

  .envelope-flap.flap-open .wax-seal {
    transform: translateX(-50%);
    opacity: 1;
    filter: none;
  }
}

.modal-backdrop.is-closing,
.wish-backdrop.is-closing {
  opacity: 0;
  pointer-events: none;
}

.modal-backdrop.is-closing .modal-card,
.wish-backdrop.is-closing .wish-card {
  transform: scale(0.94) translateY(12px);
}

@media (prefers-reduced-motion: reduce) {
  .modal-backdrop,
  .modal-card,
  .wish-backdrop,
  .wish-card {
    transition: none !important;
  }
}

.celebration-toast.is-hiding {
  animation: toastFadeOut 0.26s ease forwards;
}

@keyframes toastFadeOut {
  to {
    opacity: 0;
    transform: translateY(10px) scale(0.98);
  }
}
