/* ============================================================================
   animations.css: keyframes and motion utilities
   ----------------------------------------------------------------------------
   Every @keyframes in one place, the two utility classes that apply them, and
   the reduced-motion override. Keyframes are global, so the components that use
   them live in other files:
     popcheck → controls.css (.scrib .mark, the checkbox tick)
     stampin  → .stamp-in below
     paperin  → .pagein below
   ========================================================================== */

/* Checkbox tick: overshoots large and rotated, then settles. */
@keyframes popcheck{0%{transform:scale(2.4) rotate(14deg);opacity:0;}60%{opacity:1;}100%{transform:scale(1) rotate(-6deg) translateY(-3px);opacity:1;}}

/* A sheet of paper easing up into place (used via .pagein on screen content). */
@keyframes paperin{from{opacity:0;transform:translateY(12px) rotate(-.7deg);}to{opacity:1;transform:none;}}

/* A stamp slamming down (used via .stamp-in). */
@keyframes stampin{0%{transform:scale(2.1) rotate(10deg);opacity:0;}55%{opacity:1;}80%{transform:scale(.94) rotate(-4deg);}100%{transform:scale(1) rotate(-3deg);opacity:1;}}
.stamp-in{animation:stampin .35s cubic-bezier(.4,1.6,.6,1) both;}

.pagein{animation:paperin .4s ease both;}

/* Respect users who ask for less motion: collapse all animation/transition time. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;transition-duration:.01ms !important;}
}
