/* motion.css — keyframes global + kelas gerak (owner class: mo-*). Hanya transform & opacity. */
@keyframes pageIn{from{opacity:0}to{opacity:1}}
@keyframes pageOut{from{opacity:1}to{opacity:0}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeOut{from{opacity:1}to{opacity:0}}
@keyframes sheetIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes sheetOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(8px) scale(.985)}}
@keyframes sheetUp{from{transform:translateY(100%)}to{transform:none}}
@keyframes sheetDown{from{transform:none}to{transform:translateY(100%)}}
@keyframes popIn{0%{transform:scale(.8);opacity:.4}60%{transform:scale(1.06);opacity:1}100%{transform:scale(1)}}
@keyframes rowFlash{from{background-color:var(--flash,var(--flash-default))}to{background-color:transparent}}
@keyframes toastIn{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}
@keyframes toastInUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes toastOut{from{opacity:1}to{opacity:0;transform:scale(.96)}}
@keyframes spin{to{transform:rotate(360deg)}}

/* dipasang core/motion.js. Buka halaman cukup pudar — tanpa geser & tanpa muncul berurutan,
   supaya tetap tenang dilihat saat bolak-balik halaman. Gerak lain hanya untuk umpan balik aksi. */
.mo-enter{animation:pageIn var(--dur-base) var(--ease-out) both}
.mo-leave{animation:pageOut 100ms var(--ease-in) both}
.mo-pop{animation:popIn var(--dur-slow) var(--ease-out)}
.mo-flash{animation:rowFlash 900ms var(--ease-out)}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-delay:0ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}
}