/* Layout uses an 8px base; 4px and 12px are reserved for small internal gaps. */
:root{
 --space-4:4px;--space-8:8px;--space-12:12px;--space-16:16px;
 --space-24:24px;--space-32:32px;--space-40:40px;--space-48:48px;
 --space-56:56px;--space-64:64px;--space-80:80px;--space-96:96px;
 --space-112:112px;--space-120:120px;--space-128:128px;--space-144:144px;
 --radius-small:8px;--radius-panel:16px;--radius-pill:9999px;
 --control-height:48px;--icon-small:16px;--icon-large:24px;
 --header-height:144px;--footer-height:64px;--page-gutter:64px;
}
@media(max-width:1200px){:root{--page-gutter:32px}}
@media(max-width:600px){:root{--header-height:120px;--page-gutter:24px}}
@media(max-width:360px){:root{--page-gutter:16px}}