:root{
/* 4px base; xxs exists for chip padding */
--space-xxs:2px;
--space-xs:4px;
--space-sm:8px;
--space-md:12px;
--space-lg:16px;
--space-xl:20px;
--space-2xl:24px;
--space-3xl:32px;
--space-4xl:40px;
--space-5xl:48px;
--space-6xl:64px;

/* radii */
--radius-none:0px;
--radius-xs:4px;
--radius-sm:6px;   /* buttons, inputs */
--radius-md:8px;   /* cards, code blocks */
--radius-lg:12px;
--radius-pill:9999px;

/* containers */
--container-marketing:1280px;   /* max-w-7xl */
--container-page:1440px;
--container-docs-sidebar:300px;
--container-toc:280px;
--gutter:16px;
--gutter-desktop:32px;
--band-padding-y:48px;

/* controls */
--control-height:53px;   /* the hero command button, measured */
--tap-min:44px;

/* breakpoints, for reference: mobile 375 · tablet 768 · desktop 1024 · desktop-lg 1200 · landing-xl 1440 */
}