/* ──────────────────────────────────────────────────────────────
   OZYN.AI — Spacing, radius, shadow & motion tokens
   Spacing is a soft 4px-ish rhythm expressed in rem. Radii are
   generous: pills (999px) for actions/chips, soft rounding for
   cards. Shadows are whisper-quiet — long, very low-opacity drops;
   the system leans on hairline borders instead of elevation.
   ────────────────────────────────────────────────────────────── */
:root {
  /* ── Spacing ── */
  --space-1: 0.25rem;   /* 4 */
  --space-2: 0.5rem;    /* 8 */
  --space-3: 0.75rem;   /* 12 */
  --space-4: 1rem;      /* 16 */
  --space-5: 1.5rem;    /* 24 */
  --space-6: 2rem;      /* 32 */
  --space-7: 3rem;      /* 48 */
  --space-8: 4rem;      /* 64 */
  --space-9: 6rem;      /* 96 — section padding */

  /* ── Radius ── */
  --radius-xs: 5px;     /* speech-bubble tail corner */
  --radius-sm: 8px;
  --radius-md: 10px;    /* small buttons, inset blocks */
  --radius-lg: 14px;    /* work cards, list rows */
  --radius-xl: 18px;    /* composer, inputs group */
  --radius-2xl: 22px;   /* large shells, modals */
  --radius-pill: 999px; /* buttons, chips, badges, avatars */

  /* ── Shadow (quiet) ── */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px rgba(15, 23, 42, 0.06);
  --shadow-lg: 0 20px 60px -38px rgba(0, 0, 0, 0.22);
  --shadow-pop: 0 12px 40px -18px rgba(0, 0, 0, 0.28);

  /* ── Motion ── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);   /* @kind other */ /* entrances */
  --ease-snap: cubic-bezier(0.2, 0.8, 0.2, 1); /* @kind other */ /* sheets, swipe */
  --dur-fast: 0.15s;  /* @kind other */
  --dur-base: 0.25s;  /* @kind other */
  --dur-slow: 0.38s;  /* @kind other */

  /* ── Control heights ── */
  --control-sm: 36px;
  --control-md: 44px;   /* min tap target */
  --control-lg: 52px;   /* primary CTA / inputs */
}
