:root{
/* Eight steps, all multiples of 0.5rem. Component padding draws from 1–4,
   section padding from 5–8. Nothing between the steps. */
--space-1:0.5rem;
--space-2:1rem;
--space-3:1.5rem;
--space-4:2rem;
--space-5:3rem;
--space-6:4rem;
--space-7:6rem;
--space-8:8rem;

/* Layout */
--wrap:1280px; /* @kind spacing */
--wrap--narrow:640px; /* @kind spacing */
--gutter:var(--space-3);
--gutter-lg:var(--space-5);
--section-y:var(--space-6);
--section-y-lg:var(--space-7);

/* Breakpoints (reference values; media queries cannot read custom properties) */
--bp-sm:640px; /* @kind other */
--bp-md:768px; /* @kind other */
--bp-lg:900px; /* @kind other */
--bp-xl:1024px; /* @kind other */

/* Targets */
--target-min:48px; /* @kind spacing */
--target-compact:44px; /* @kind spacing */
}