/* ── Space & layout ──────────────────────────────────────────────────────────
   4px base. The system uses two rhythms: a tight UI rhythm (1–6) and an
   editorial rhythm (8–20) for marketing surfaces and slides. */
:root {
  --space-0:0px;   --space-px:1px;  --space-1:4px;   --space-2:8px;
  --space-3:12px;  --space-4:16px;  --space-5:20px;  --space-6:24px;
  --space-7:32px;  --space-8:40px;  --space-9:48px;  --space-10:56px;
  --space-11:64px; --space-12:80px; --space-14:96px; --space-16:128px;
  --space-20:180px;

  --gutter:var(--space-6);
  --gutter-wide:var(--space-11);
  --page-max:1240px;
  --prose-max:64ch; /* @kind spacing */
  --section-y:clamp(var(--space-11), 9vw, var(--space-16));

  --control-h-sm:30px;
  --control-h:38px;
  --control-h-lg:48px;
  --control-pad-x:var(--space-4);
  --field-gap:var(--space-2);

  --grid-12:repeat(12,minmax(0,1fr)); /* @kind other */
  --hairline:1px;
}