/* 4px base grid with two sub-grid steps (2, 6) for control interiors. */
:root{
--space-0:0px;
--space-px:1px;
--space-0-5:2px;
--space-1:4px;
--space-1-5:6px;
--space-2:8px;
--space-3:12px;
--space-4:16px;
--space-5:20px;
--space-6:24px;
--space-8:32px;
--space-10:40px;
--space-12:48px;
--space-16:64px;
--space-20:80px;
--space-24:96px;
--space-32:128px;
--space-40:160px;

/* Component interior rhythm */
--control-h-sm:28px; /* @kind spacing */
--control-h-md:36px; /* @kind spacing */
--control-h-lg:44px; /* @kind spacing */
--control-h-xl:52px; /* @kind spacing */
--control-pad-x-sm:var(--space-2-5,10px);
--control-pad-x-md:var(--space-3);
--control-pad-x-lg:var(--space-5);
--gap-inline:var(--space-2);
--gap-stack:var(--space-3);
--gap-section:var(--space-12);

/* Page rhythm */
--layout-gutter:var(--space-6); /* @kind spacing */
--layout-max:1200px; /* @kind spacing */
--layout-max-wide:1440px; /* @kind spacing */
--layout-section-y:var(--space-24); /* @kind spacing */
--sidebar-w:248px; /* @kind spacing */
--rail-w:56px; /* @kind spacing */
--composer-max:820px; /* @kind spacing */
}