/* ============================================================
   MEDSY — SPACING, RADII & BREAKPOINTS
   A consistent 4px rhythm, a tuned set of radii, and four
   breakpoints. Everything composes from these steps.
   ============================================================ */
:root{
  /* ---- spacing scale · 4px rhythm ---- */
  --s-1:4px;
  --s-2:8px;
  --s-3:12px;
  --s-4:16px;
  --s-5:24px;
  --s-6:32px;
  --s-7:48px;
  --s-8:64px;
  --s-9:96px;

  /* ---- radii ---- */
  --r-sm:12px;
  --r:18px;
  --r-lg:28px;
  --r-xl:40px;
  --r-pill:999px;

  /* ---- breakpoints ---- @kind other ---- */
  --bp-sm:640px; /* @kind other */
  --bp-md:768px; /* @kind other */
  --bp-lg:1024px; /* @kind other */
  --bp-xl:1280px; /* @kind other */

  /* ---- layout ---- @kind other ---- */
  --maxw:1180px; /* @kind other */
  --gut:clamp(20px,5vw,64px); /* @kind other */
}