feat(types): add 5 spacing tokens to semantic-palette (P1.4)

spacing-1..5 = 4/8/12/16/24 px — a 4-point base scale covering xs through xl.
All tokens use type="number" with plain scalar values. Palette total grows to 57.

packages/pen-core/src/__tests__/semantic-palette.test.ts

@@ -510,6 +510,46 @@ describe('letterSpacing tokens (2 sparse numeric)', () => {
 
   it('palette total grows to 52 (50 + 2 letterSpacing)', () => {
     const p = getSemanticPalette();
-    expect(Object.keys(p.variables).length).toBe(52);
+    expect(Object.keys(p.variables).length).toBeGreaterThanOrEqual(52);
+  });
+});
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Task 1.4 — Spacing tokens (5: spacing-1…5 = 4/8/12/16/24)
+// ─────────────────────────────────────────────────────────────────────────────
+
+describe('spacing tokens (5 numeric)', () => {
+  const SPACING: Record<string, number> = {
+    'spacing-1': 4,
+    'spacing-2': 8,
+    'spacing-3': 12,
+    'spacing-4': 16,
+    'spacing-5': 24,
+  };
+
+  it('all 5 spacing tokens present', () => {
+    const p = getSemanticPalette();
+    for (const name of Object.keys(SPACING)) {
+      expect(p.variables[name], `missing: ${name}`).toBeDefined();
+    }
+  });
+
+  it('spacing tokens are type="number"', () => {
+    const p = getSemanticPalette();
+    for (const name of Object.keys(SPACING)) {
+      expect((p.variables[name] as VariableDefinition).type, `${name} type`).toBe('number');
+    }
+  });
+
+  it('spacing token values match spec (4/8/12/16/24)', () => {
+    const p = getSemanticPalette();
+    for (const [name, expected] of Object.entries(SPACING)) {
+      expect((p.variables[name] as VariableDefinition).value, name).toBe(expected);
+    }
+  });
+
+  it('palette total grows to 57 (52 + 5 spacing)', () => {
+    const p = getSemanticPalette();
+    expect(Object.keys(p.variables).length).toBe(57);
   });
 });

packages/pen-core/src/variables/semantic-palette.ts

@@ -227,6 +227,13 @@ const PALETTE: Record<string, PaletteEntry> = {
   'type-caption-weight': { single: 400, description: 'Caption / helper text — font weight' },
   'type-caption-line-height': { single: 1.4, description: 'Caption / helper text — line height multiplier' },
 
+  // ── Spacing scale (5 numeric, 4-point base) ──────────────────────────────
+  'spacing-1': { single: 4, description: 'Spacing step 1 — 4 px (xs)' },
+  'spacing-2': { single: 8, description: 'Spacing step 2 — 8 px (sm)' },
+  'spacing-3': { single: 12, description: 'Spacing step 3 — 12 px (md)' },
+  'spacing-4': { single: 16, description: 'Spacing step 4 — 16 px (lg)' },
+  'spacing-5': { single: 24, description: 'Spacing step 5 — 24 px (xl)' },
+
   // ── Sparse letterSpacing (2 numeric) ─────────────────────────────────────
   'type-display-letter-spacing': {
     single: -0.5,