: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;

--gutter:24px;
--page-margin:clamp(20px,6vw,96px);
--measure:64ch; /* @kind spacing */
--content-max:1280px;
--content-narrow:720px;

/* Surfaces and structure stay orthogonal; media and controls are rounded. */
--radius-none:0;
--radius-xs:2px;
--radius-sm:4px;
--radius-md:8px;
/* Form fields: rounded to match the interactive layer without going full pill. */
--radius-field:8px;
/* Every photograph, render and image tile carries this radius. */
--radius-media:8px;
--radius-media-lg:8px;
--radius-pill:999px;

--border-hairline:1px;
--border-medium:2px;
}