@keyframes animateFromTopLeft {
  0% { opacity: 0; transform: scale(0.92) translateY(-10px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}

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

@keyframes slideOutToRight {
  0% { opacity: 1; transform: translateX(0) scale(1); }
  100% { opacity: 0; transform: translateX(30px) scale(0.98); }
}

@keyframes scaleUpTick {
  0% { opacity: 0; transform: scale(0.4); }
  70% { transform: scale(1.1); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes splashFadeOutSequence {
  0% { opacity: 1; transform: scale(1); }
  100% { opacity: 0; transform: scale(0.96); visibility: hidden; }
}

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

@keyframes shakeRedAnim {
  0% { transform: translateX(0); border-color: #ffb3b3; }
  20% { transform: translateX(-8px); border-color: #ffb3b3; }
  40% { transform: translateX(8px); border-color: #ffb3b3; }
  60% { transform: translateX(-6px); border-color: #ffb3b3; }
  80% { transform: translateX(6px); border-color: #ffb3b3; }
  100% { transform: translateX(0); border-color: var(--text-primary); }
}

.splash-logo-container { animation: splashFadeOutSequence 0.8s cubic-bezier(0.16, 1, 0.3, 1) 1.2s forwards; }
.setup-step-box.fade-in-input { animation: inputFadeInSequence 0.6s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.clean-transparent-input.shake-red { animation: shakeRedAnim 0.5s ease; }
.success-tick-icon.animate-tick { animation: scaleUpTick 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
.app-screen { animation: animateFromTopLeft 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.setup-step.step-visible { animation: animateFromTopLeft 0.3s cubic-bezier(0.16,1,0.3,1) forwards; }
.wizard-step.step-visible { animation: animateFromTopLeft 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.documents-content-wrapper { animation: fadeSlideIn 0.3s cubic-bezier(0.16,1,0.3,1) forwards; }
.editor-screen.active { animation: animateFromTopLeft 0.35s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.editor-screen.closing { animation: slideOutToRight 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.nav-item.active::after { animation: scaleUpTick 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }