:root{
--motion-fast:120ms; /* @kind other */
--motion-base:200ms; /* @kind other */
--motion-slow:320ms; /* @kind other */
--ease-standard:cubic-bezier(0.4,0,0.2,1); /* @kind other */
--ease-entrance:cubic-bezier(0,0,0.2,1); /* @kind other */
--sg-press:0.98; /* @kind other */
--sg-enter-drift:8px; /* @kind other */
--sg-enter-drift-soft:4px; /* @kind other */
--sg-stagger:40ms; /* @kind other */
}
@keyframes sg-enter{from{opacity:0;transform:translateY(var(--sg-enter-drift))}to{opacity:1;transform:none}}
@keyframes sg-enter-soft{from{opacity:0;transform:translateY(var(--sg-enter-drift-soft))}to{opacity:1;transform:none}}
@keyframes sg-fade{from{opacity:0}to{opacity:1}}
/* Entrance: fade + small upward drift, ease-out. Stagger with --sg-i (index); the
   whole sequence is capped at ~400ms by clamping the delay. */
.sg-enter{animation:sg-enter var(--motion-base) var(--ease-entrance) both;animation-delay:calc(min(var(--sg-i,0) * var(--sg-stagger), 200ms))}
.sg-enter-soft{animation:sg-enter-soft var(--motion-base) var(--ease-entrance) both}
@media (prefers-reduced-motion: reduce){
:root{--sg-press:1; /* @kind other */
--sg-enter-drift:0px;
--sg-enter-drift-soft:0px;
--sg-stagger:0ms; /* @kind other */
}
.sg-enter,.sg-enter-soft{animation:sg-fade var(--motion-fast) linear both;animation-delay:0ms}
*,*::before,*::after{transition-duration:1ms!important;transition-delay:0ms!important}
}
