/* Essence — motion. Fades and short slides; spring is rationed. */
:root{
  --dur-instant:100ms; /* @kind other */--dur-fast:150ms; /* @kind other */--dur-normal:200ms; /* @kind other */--dur-moderate:300ms; /* @kind other */--dur-slow:500ms; /* @kind other */
  --ease-default:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-in:cubic-bezier(0.4,0,1,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,0.2,1); /* @kind other */
  --ease-in-out:cubic-bezier(0.4,0,0.2,1); /* @kind other */
  --ease-spring:cubic-bezier(0.34,1.56,0.64,1); /* @kind other */ /* use sparingly */
}
@keyframes essence-fade-in{from{opacity:0}to{opacity:1}}
@keyframes essence-slide-up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@keyframes essence-slide-down{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
@keyframes essence-slide-in-right{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:translateX(0)}}
@keyframes essence-scale-in{from{opacity:0;transform:scale(0.97)}to{opacity:1;transform:scale(1)}}
@keyframes essence-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes essence-spin{to{transform:rotate(360deg)}}
@keyframes essence-pulse{0%,100%{box-shadow:0 0 0 0 rgba(32,190,160,0.3)}50%{box-shadow:0 0 0 6px rgba(32,190,160,0)}}
/* ── Named moments ──────────────────────────────────────────────────────────────
   Motion in Essence is purposeful: it either shows a thing happening to the user's data, or it
   doesn't happen. Three moments are SIGNATURE — they get real choreography because they are the
   moments a user is deciding whether to trust us:

     1. Local encryption      the data being sealed on this device
     2. Consent granted       a field leaving for a named recipient
     3. Consent revoked       that access closing again

   Every other moment gets micro-motion: a fade, an 8px slide, a 0.98 press, a single tick. */

/* 1 — encryption: a sweep that fills, with the ambient security pulse behind it */
@keyframes essence-encrypt-sweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@keyframes essence-seal{0%{transform:scale(0.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1);opacity:1}}
/* 2 — consent: a field travels the distance to its recipient, then lands */
@keyframes essence-transfer{0%{transform:translateX(0);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateX(var(--transfer-distance,150px));opacity:0}}
@keyframes essence-land{0%{transform:scale(0.9);opacity:0}100%{transform:scale(1);opacity:1}}
/* 3 — revoke: the channel closes from both ends and the row goes quiet */
@keyframes essence-close-in{0%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes essence-desaturate{0%{filter:none;opacity:1}100%{filter:grayscale(1);opacity:0.55}}
/* micro-motion */
@keyframes essence-tick{0%{stroke-dashoffset:24}100%{stroke-dashoffset:0}}
@keyframes essence-band-drift{0%{transform:translateX(0)}100%{transform:translateX(var(--band-shift,-50%))}}
@keyframes essence-band-sheen{0%{background-position:0 0}100%{background-position:var(--sheen-shift,120px) 0}}
@keyframes essence-arrive{0%{transform:translateY(-6px);opacity:0}100%{transform:translateY(0);opacity:1}}
@keyframes essence-countdown{0%,100%{opacity:1}50%{opacity:0.45}}

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