:root {
  --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 */
  --duration-fast: 150ms; /* @kind other */   /* micro-interactions: hover, colour change */
  --duration-base: 250ms; /* @kind other */   /* most transitions */
  --duration-slow: 400ms; /* @kind other */   /* large element entrances — hard ceiling */
}

/* Entrance presets. Never combine two on one element. */
@keyframes gl-fade-in { from { opacity: 0 } to { opacity: 1 } }
@keyframes gl-scale-in { from { opacity: 0; transform: scale(0.95) } to { opacity: 1; transform: scale(1) } }
@keyframes gl-slide-up { from { opacity: 0; transform: translateY(8px) } to { opacity: 1; transform: translateY(0) } }
@keyframes gl-slide-in-right { from { transform: translateX(100%) } to { transform: translateX(0) } }
@keyframes gl-slide-in-left { from { transform: translateX(-100%) } to { transform: translateX(0) } }
@keyframes gl-spin { to { transform: rotate(360deg) } }
@keyframes gl-pulse { 0%, 100% { opacity: 1 } 50% { opacity: 0.5 } }

@media (prefers-reduced-motion: reduce) {
  .gl-anim-fade, .gl-anim-scale, .gl-anim-slide-up,
  .gl-anim-slide-in-right, .gl-anim-slide-in-left { animation: none !important }
}