/* ============================================================
   LiveSOP — Spacing & radius tokens
   Derived from component paddings/gaps in LiveSOP.fig
   (buttons gap 10, input pad 8/16, card radius 16, button radius 8).
   ============================================================ */
:root {
  --space-2: 2px;
  --space-4: 4px;
  --space-6: 6px;
  --space-8: 8px;
  --space-10: 10px;
  --space-11: 11px;   /* card header gap */
  --space-12: 12px;
  --space-16: 16px;   /* input horizontal padding */
  --space-20: 20px;   /* card body padding */
  --space-22: 22px;
  --space-24: 24px;
  --space-32: 32px;

  /* ---- Radii (exact from source) ---- */
  --radius-sm: 5px;    /* chips / small containers */
  --radius-md: 8px;    /* buttons, inputs, selects */
  --radius-lg: 10px;   /* soft inputs / segmented control */
  --radius-xl: 16px;   /* cards */
  --radius-pill: 999px;

  /* ---- Control heights ---- */
  --control-sm: 32px;  /* small button */
  --control-md: 40px;  /* input / large button */
}