/* Profile entrance — frozi-style per-block CSS animations */

.profile-entrance-enabled {
  perspective: 1200px;
  perspective-origin: 50% 40%;
}

.profile-enter-item {
  opacity: 0;
  animation-fill-mode: both;
  animation-play-state: paused;
  transform-origin: center center;
  will-change: transform, opacity;
}

.profile-entrance-run .profile-enter-item {
  animation-play-state: running;
}

/* Exact frozi keyframes (+ opacity so items are never stuck invisible) */
@keyframes peZoomOut {
  0% { opacity: 0; transform: scale(0.5); }
  60% { opacity: 1; transform: scale(1.05); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes peZoomIn {
  0% { opacity: 0; transform: scale(1.5); }
  60% { opacity: 1; transform: scale(0.95); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes peSlideUp {
  0% { opacity: 0; transform: translateY(75px) scale(1.05); }
  60% { opacity: 1; transform: translateY(-5px) scale(0.95); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes peSlideDown {
  0% { opacity: 0; transform: translateY(-75px) scale(1.05); }
  60% { opacity: 1; transform: translateY(5px) scale(0.95); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes peSlideLeft {
  0% { opacity: 0; transform: translateX(75px) scale(1.05); }
  60% { opacity: 1; transform: translateX(-5px) scale(0.95); }
  100% { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes peSlideRight {
  0% { opacity: 0; transform: translateX(-75px) scale(1.05); }
  60% { opacity: 1; transform: translateX(5px) scale(0.95); }
  100% { opacity: 1; transform: translateX(0) scale(1); }
}

@keyframes peSlideBLTR {
  0% { opacity: 0; transform: translate(-75px, 75px) scale(1.05); }
  60% { opacity: 1; transform: translate(5px, -5px) scale(0.95); }
  100% { opacity: 1; transform: translate(0, 0) scale(1); }
}

@keyframes peSlideBRTL {
  0% { opacity: 0; transform: translate(75px, 75px) scale(1.05); }
  60% { opacity: 1; transform: translate(-5px, -5px) scale(0.95); }
  100% { opacity: 1; transform: translate(0, 0) scale(1); }
}

@keyframes peSlideTLBR {
  0% { opacity: 0; transform: translate(-75px, -75px) scale(1.05); }
  60% { opacity: 1; transform: translate(5px, 5px) scale(0.95); }
  100% { opacity: 1; transform: translate(0, 0) scale(1); }
}

@keyframes peSlideTRBL {
  0% { opacity: 0; transform: translate(75px, -75px) scale(1.05); }
  60% { opacity: 1; transform: translate(-5px, 5px) scale(0.95); }
  100% { opacity: 1; transform: translate(0, 0) scale(1); }
}

@keyframes peBounce {
  0% { opacity: 0; transform: translateY(0); }
  20% { opacity: 1; transform: translateY(-25px); }
  40% { transform: translateY(15px); }
  60% { transform: translateY(-10px); }
  80% { transform: translateY(5px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes peWobble {
  0% { opacity: 0; transform: none; }
  15% { opacity: 1; transform: translateX(-8px) rotate(-3deg); }
  30% { transform: translateX(6px) rotate(2deg); }
  45% { transform: translateX(-4px) rotate(-1.5deg); }
  60% { transform: translateX(2px) rotate(1deg); }
  75% { transform: translateX(-1px) rotate(-0.5deg); }
  100% { opacity: 1; transform: none; }
}

@keyframes peSpin {
  0% { opacity: 0; transform: rotate(0deg) scale(0.6); }
  100% { opacity: 1; transform: rotate(1turn) scale(1); }
}

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

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

@keyframes peBlurIn {
  0% { opacity: 0; filter: blur(12px); transform: scale(1.06); }
  100% { opacity: 1; filter: blur(0); transform: scale(1); }
}

.profile-enter-effect-zoom-out { animation-name: peZoomOut; animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1); }
.profile-enter-effect-zoom-in { animation-name: peZoomIn; animation-timing-function: cubic-bezier(0.34, 1.56, 0.64, 1); }
.profile-enter-effect-slide-up { animation-name: peSlideUp; animation-timing-function: ease-out; }
.profile-enter-effect-slide-down { animation-name: peSlideDown; animation-timing-function: ease-out; }
.profile-enter-effect-slide-left { animation-name: peSlideLeft; animation-timing-function: ease-out; }
.profile-enter-effect-slide-right { animation-name: peSlideRight; animation-timing-function: ease-out; }
.profile-enter-effect-slide-bl-tr { animation-name: peSlideBLTR; animation-timing-function: ease-out; }
.profile-enter-effect-slide-br-tl { animation-name: peSlideBRTL; animation-timing-function: ease-out; }
.profile-enter-effect-slide-tl-br { animation-name: peSlideTLBR; animation-timing-function: ease-out; }
.profile-enter-effect-slide-tr-bl { animation-name: peSlideTRBL; animation-timing-function: ease-out; }
.profile-enter-effect-bounce { animation-name: peBounce; animation-timing-function: ease-out; }
.profile-enter-effect-wobble { animation-name: peWobble; animation-timing-function: ease-in-out; }
.profile-enter-effect-spin { animation-name: peSpin; animation-timing-function: ease; }
.profile-enter-effect-fade-up { animation-name: peFadeUp; animation-timing-function: cubic-bezier(0.22, 1, 0.36, 1); }
.profile-enter-effect-fade-in { animation-name: peFadeIn; animation-timing-function: ease; }
.profile-enter-effect-blur-in { animation-name: peBlurIn; animation-timing-function: ease; }

@media (prefers-reduced-motion: reduce) {
  .profile-enter-item {
    opacity: 1 !important;
    animation: none !important;
    filter: none !important;
    transform: none !important;
  }
}