/* Corsa Motive — spacing, radius, shadow, motion tokens (tailwind.config.ts + globals.css). */
:root{
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;

  /* Radii — Corsa runs tight/engineered radii, not the generous rounding common elsewhere */
  --radius-sm:2px;
  --radius:4px;
  --radius-md:8px;
  --radius-lg:14px;
  --radius-pill:999px;

  --shadow-1:0 1px 0 rgba(255,255,255,.04) inset,0 1px 2px rgba(0,0,0,.6);
  --shadow-2:0 12px 30px -12px rgba(0,0,0,.7),0 2px 6px rgba(0,0,0,.5);
  --shadow-3:0 30px 60px -20px rgba(0,0,0,.8),0 8px 16px rgba(0,0,0,.5);

  --ease-spring:cubic-bezier(.34,1.56,.64,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1);        /* @kind other */
  --ease-in-out:cubic-bezier(.4,0,.2,1);      /* @kind other */
  --t-fast:120ms; /* @kind other */
  --t-mid:200ms; /* @kind other */
  --t-slow:320ms; /* @kind other */
}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes cm-pulse{0%{box-shadow:0 0 0 0 currentColor;opacity:1}70%{box-shadow:0 0 0 7px transparent;opacity:.7}100%{box-shadow:0 0 0 0 transparent;opacity:1}}
@keyframes cm-fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes cm-page-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
.cm-pulse-dot{animation:cm-pulse 1.8s ease-out infinite}
.cm-fade-in{animation:cm-fade-in var(--t-mid) var(--ease-out) both}
.cm-interactive{transition:transform var(--t-fast) var(--ease-out),box-shadow var(--t-mid) var(--ease-out),border-color var(--t-mid) var(--ease-out)}
.cm-interactive:hover{transform:translateY(-1px)}
.cm-interactive:active{transform:scale(.985)}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
