/* ============================================================
   RADII — generously rounded
   ============================================================ */
:root {
  --radius-sm:   8px;    /* small controls, swatches */
  --radius-md:   12px;   /* buttons, inputs, fields */
  --radius-lg:   16px;   /* inner cards */
  --radius-xl:   18px;   /* large rounding */
  --radius-2xl:  20px;   /* primary surface cards */
  --radius-pill: 20px;   /* chips */
  --radius-full: 9999px; /* avatars, dots, badges */
}