/* Mosquet — spacing, sizing, radii. 4px base, editorial whitespace. */
:root {
  --space-0:   0;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --space-4:   16px;
  --space-5:   24px;
  --space-6:   32px;
  --space-7:   48px;
  --space-8:   64px;
  --space-9:   96px;
  --space-10:  128px;
  --space-11:  160px;

  /* Layout */
  --container:      1200px;
  --container-prose: 720px;
  --gutter:         clamp(20px, 5vw, 64px); /* @kind spacing */

  /* Radii — restrained; the brand is angular. Monogram uses a soft square. */
  --radius-0:   0;
  --radius-sm:  3px;
  --radius-md:  6px;
  --radius-lg:  10px;
  --radius-monogram: 22%;  /* squircle ratio of the >_ mark */
  --radius-pill: 999px;

  /* Control heights */
  --control-sm: 32px;
  --control-md: 40px;
  --control-lg: 48px;

  /* Hairline */
  --hairline: 1px;
}