refactor(simbolo): extraer la geometría del ≡ a lib/simbolo.ts

components/primitives/SimboloTresLineas.tsx

@@ -3,16 +3,13 @@
 import { useRef, useState, useEffect } from 'react';
 import { motion } from 'framer-motion';
 import { usePrefersReducedMotion } from '@/lib/motion';
+import { BARRAS_SIMBOLO } from '@/lib/simbolo';
 
 // The manual's own description of the ≡ symbol, made literal: "las líneas van
 // de muchas/desordenadas (complejidad) a pocas/alineadas (claridad)". Five
 // uneven bars resolve, once in view, into the three clean aligned bars of the
 // official icon (see app/icon.svg) — decorative, one-shot, never loops.
-const FINAL = [
-  { x: 13, y: 13, width: 38, height: 8 },
-  { x: 13, y: 28, width: 38, height: 8 },
-  { x: 13, y: 43, width: 38, height: 8 },
-];
+const FINAL = BARRAS_SIMBOLO;
 
 const BARS = [
   { from: { x: 6, y: 9, width: 22, height: 6, opacity: 0.9 }, to: FINAL[0] },

components/primitives/__tests__/simbolo.test.ts

@@ -0,0 +1,19 @@
+import { describe, it, expect } from 'vitest';
+import { BARRAS_SIMBOLO, LINEAS_SIMBOLO } from '@/lib/simbolo';
+
+describe('geometría del ≡', () => {
+  it('define exactly the three bars of the mark', () => {
+    expect(BARRAS_SIMBOLO).toHaveLength(3);
+  });
+
+  it('keeps the three bars aligned and equal in width', () => {
+    const anchos = new Set(BARRAS_SIMBOLO.map((b) => b.width));
+    const izquierdas = new Set(BARRAS_SIMBOLO.map((b) => b.x));
+    expect(anchos.size).toBe(1);
+    expect(izquierdas.size).toBe(1);
+  });
+
+  it('derives stroke lines through each bar centre', () => {
+    expect(LINEAS_SIMBOLO.map((l) => l.y1)).toEqual([17, 32, 47]);
+  });
+});