:root {
  --font: var(--font-body);
  --on-action: var(--on-signal);
  --sp-1: var(--sp1); --sp-2: var(--sp2); --sp-3: var(--sp3); --sp-4: var(--sp4);
  --sp-5: var(--sp5); --sp-6: var(--sp6); --sp-7: var(--sp7); --sp-8: var(--sp8);
  --r-control: var(--r-ctrl);
  --h-control: var(--btn); --h-chip: var(--chip); --h-row: var(--row);
  --gutter: 40px;
}
@media (min-width: 768px) and (max-width: 1279px) { :root { --gutter: 24px; } }
@media (max-width: 767px) { :root { --gutter: 16px; } }
:root[data-device="pos"] { --gutter: 24px; }