/* W1: motion. Triggered animations ≤ 900 ms; the only loops are the ambient plankton and the syncing-status pulse.
   Classes are toggled by /js/motion.js. Reduced motion turns everything off (bottom of file). */

/* Ambient plankton drifting up (6 s loop) */
.plankton i { animation: cais-float var(--dur-plankton) ease-in-out infinite; }
@keyframes cais-float {
  0%, 100% { transform: translateY(0); opacity: .2; }
  50% { transform: translateY(-14px); opacity: 1; }
}

/* Orb tap ripple (900 ms) */
.orb::after { content: ""; position: absolute; inset: 2px; border-radius: 50%; pointer-events: none; opacity: 0; }
.orb.is-rippling::after { animation: cais-orb-ripple var(--dur-ripple) var(--ease-out) both; }
@keyframes cais-orb-ripple {
  0% { opacity: 1; box-shadow: 0 0 0 0 rgba(95, 245, 217, .6); }
  100% { opacity: 0; box-shadow: 0 0 0 16px rgba(95, 245, 217, 0); }
}

/* Stamp landing (600 ms): thunks in and settles at the landed pose (rotate −12°) */
/* [data-state] raises specificity so the landing wins over the syncing pulse below while it plays. */
.stamp.is-landing, .stamp[data-state].is-landing { animation: cais-stamp-in var(--dur-stamp) var(--ease-stamp) both; }
@keyframes cais-stamp-in {
  0% { opacity: 0; transform: scale(1.8) rotate(-30deg); }
  100% { opacity: 1; transform: scale(1) rotate(-12deg); }
}

/* Burst rings (600 ms each, staggered 0/120/240 ms → done by 840 ms) */
.burst-ring { animation: cais-burst 600ms var(--ease-out) both; }
@keyframes cais-burst {
  0% { opacity: .8; transform: scale(.6); }
  100% { opacity: 0; transform: scale(1.9); }
}

/* Syncing stamp: slow opacity pulse (status indicator, like a spinner) */
.stamp[data-state="syncing"] { animation: cais-sync 1.6s ease-in-out infinite; }
@keyframes cais-sync {
  0%, 100% { opacity: .55; }
  50% { opacity: 1; }
}

/* Reduced motion: no animation, no transitions, no plankton */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .plankton { display: none; }
}