/* widget_motion */
기본값은 **천천히 자연스럽게** — 지속시간 0.9초, 곡선은 감속(cubic-bezier(.16,1,.3,1)). 예전 기본(0.7초 / ease)은 눈에 띄게 빨라 툭 튀어나오는 느낌이었다(사용자 지적). 모달의 표시 기본값(지속시간 '조금 느리게', 곡선 '감속')과 여기 값이 **같아야** 한다 — 운영자가 아무것도 안 골랐을 때 보이는 값과 실제 동작이 어긋나지 않는다. .anim-on [data-anim]{opacity:0; transition:opacity var(--anim-dur,.9s) var(--anim-ease,cubic-bezier(.16,1,.3,1)), transform var(--anim-dur,.9s) var(--anim-ease,cubic-bezier(.16,1,.3,1)), filter var(--anim-dur,.9s) var(--anim-ease,cubic-bezier(.16,1,.3,1)); transition-delay:var(--anim-delay,0s); will-change:opacity, transform;}
.anim-notrans, .anim-notrans > *{transition:none !important; animation:none !important;}
.anim-on [data-anim="slide-up"]{transform:translateY(40px);}
.anim-on [data-anim="slide-down"]{transform:translateY(-40px);}
.anim-on [data-anim="zoom-in"]{transform:scale(.86);}
.anim-on [data-anim="zoom-out"]{transform:scale(1.18);}
.anim-on [data-anim="blur-in"]{filter:blur(12px);}
.anim-on [data-anim="slide-left"]{transform:translateX(-40px);}
.anim-on [data-anim="slide-right"]{transform:translateX(40px);}
.anim-on [data-anim="rotate-in"]{transform:rotate(-6deg) scale(.96);}
.anim-on [data-anim="flip-x"]{transform:perspective(800px) rotateX(70deg);}
.anim-on [data-anim="flip-y"]{transform:perspective(800px) rotateY(70deg);}
.anim-on [data-anim="skew"]{transform:skewX(-12deg) translateX(28px);}
.anim-on [data-anim="roll-in"]{transform:rotate(-120deg) translateX(-30px);}
.anim-on [data-anim].on{opacity:1; transform:none; filter:none;}
/* anim-on */
.anim-on [data-anim="stagger"]{opacity:1;}
.anim-on [data-anim="stagger"] > *{opacity:0;}
.anim-on [data-anim="stagger"] > *.wm-in{opacity:1; animation:anim-stagger-in var(--anim-dur,.9s) var(--anim-ease,cubic-bezier(.16,1,.3,1)) var(--wm-delay,0s) backwards;}
@keyframes anim-stagger-in{from {opacity:0; transform:translateY(30px);} to {opacity:1; transform:none;}}
@media (prefers-reduced-motion: reduce){
.anim-on [data-anim], .anim-on [data-anim] > *{opacity:1 !important; transform:none !important; filter:none !important; transition:none !important; animation:none !important;}
}
