fix: anchor trunk origin to the slash scale

site/tests/browser/landing.spec.ts

@@ -89,7 +89,7 @@ test('hover streams are masked at the actual slash edges throughout the loop', a
   await expect(page.locator('.tap-stream-b')).toHaveCSS('opacity', '0');
 });
 
-test('trunk thickness keeps the same proportion to the slash throughout scaling', async ({ page }, testInfo) => {
+test('trunk thickness and origin stay proportional to the slash throughout scaling', async ({ page }, testInfo) => {
   await page.clock.install({ time: new Date('2026-01-01T00:00:00Z') });
   await page.clock.pauseAt(new Date('2026-01-01T00:00:01Z'));
   await armed(page);
@@ -102,12 +102,20 @@ test('trunk thickness keeps the same proportion to the slash throughout scaling'
       const path = document.querySelector<SVGPathElement>('.trunk-line')!;
       const matrix = path.getScreenCTM()!;
       const stroke = parseFloat(getComputedStyle(path).strokeWidth) * Math.hypot(matrix.a, matrix.b);
-      const slashHeight = document.querySelector('.root-shape')!.getBoundingClientRect().height;
-      return { stroke, slashHeight, opacity: Number(getComputedStyle(path).opacity) };
+      const slash = document.querySelector('.root-shape')!.getBoundingClientRect();
+      const start = path.getPointAtLength(0).matrixTransform(matrix);
+      return {
+        stroke, slashHeight: slash.height, opacity: Number(getComputedStyle(path).opacity),
+        anchorX: (start.x - slash.left) / slash.width,
+        gapRatio: (start.y - slash.bottom) / slash.height,
+      };
     });
     expect(ink.opacity).toBeGreaterThan(0);
     // At rest: 1px trunk, 21px of actual slash ink (56/64 of its 24px box).
     expect(ink.stroke / ink.slashHeight).toBeCloseTo(1 / 21, 5);
+    // The same local anchor at every scale: centred, 1.5px below 21px of ink.
+    expect(ink.anchorX).toBeCloseTo(.5, 5);
+    expect(ink.gapRatio).toBeCloseTo(1 / 14, 5);
     expect(ink.stroke).toBeLessThan(previousWidth);
     if ([1520, 2000, 2480].includes(time)) await page.screenshot({ path: testInfo.outputPath(`proportions-${time}.png`) });
     previousTime = time;
@@ -194,7 +202,7 @@ test('continuous motion overlaps growth, travel and reveal without intermediate
   expect(Math.abs(extended.dx)).toBeLessThan(.1);
   expect(Math.abs(extended.axis)).toBeLessThan(.1);
   expect(extended.dy).toBeGreaterThan(0);
-  expect(extended.gap).toBeCloseTo(8, 0);
+  expect(extended.gap).toBeCloseTo(0, 1);
   expect(extended.bottom).toBeLessThan(page.viewportSize()!.height);
   await page.screenshot({ path: testInfo.outputPath('04-travelling-trunk.png') });
   await page.clock.runFor(920); // 2600ms: moving tree, SVG handoff AND panel onset.