gui: opening the folded context window on Routing no longer scrolls the page 4px; the folded card keeps the open card's padding, so its title stays where it is and the browser's scroll anchoring has nothing to follow (af798bd1's fold)

The folded card had padding-block 10px against the open card's 14px, so
the title moved down 4px as the card opened and scroll anchoring moved
the page with it, at the top of the page too. A click never moves the
page. Folded, the card is 50px instead of 42px, still one line.

routing-ctx-fold now opens the card with the title in view and checks
that scrollTop is the same and the title moved at most 1px. On
af798bd1's assets it fails in Chromium and WebKit ("200 -> 204", "0 -> 4");
with this change it passes 3/3 in each.

internal/gui/assets/context.css

@@ -117,7 +117,8 @@ i.dot.free { background: var(--k-free); box-shadow: inset 0 0 0 1px color-mix(in
 .ctx-card.shut .ctx-fold .tw svg { transform: rotate(-90deg); }
 .ctx-short { display: none; flex: none; font-size: 11.5px; color: var(--muted); white-space: nowrap; }
 .ctx-card.shut .ctx-short { display: inline; }
-.ctx-card.shut { padding-block: 10px; }
+/* the padding is the open card's, so the title stays where it is when it
+   opens and the page doesn't follow it (it moved 4px with a 10px one) */
 .ctx-card.shut > :not(.ctx-head) { display: none; }
 :where(.ctx-card.shut.max420) .ctx-model { display: none; }
 

internal/gui/tests/routing-ctx-fold.test.cjs

@@ -137,8 +137,17 @@ for (const engine of (process.env.BROWSER ? [process.env.BROWSER] : ["chromium",
         await page.waitForTimeout(500);
         assert.equal((await look(page)).shut, true, "it stays folded after the page comes back");
 
-        // opened again, it is all there
-        await fold(page);
+        // opened again, it is all there; its title stays where it was and
+        // the page doesn't follow it (a click never moves the page: with
+        // a folded padding of its own, it moved 4px)
+        const b = page.locator(".rt-ctx .ctx-fold");
+        await click(page, page.locator(".rt-ctx .ctx-short"));
+        const before = await b.evaluate((e) => [e.getBoundingClientRect().top, document.querySelector("#view-routing").scrollTop]);
+        await b.click();
+        await page.waitForTimeout(800);
+        const moved = await b.evaluate((e) => [e.getBoundingClientRect().top, document.querySelector("#view-routing").scrollTop]);
+        assert.equal(moved[1], before[1], `opening it doesn't scroll the page: ${before} -> ${moved}`);
+        assert(Math.abs(moved[0] - before[0]) <= 1, `its title stays under the pointer: ${before} -> ${moved}`);
         const again = await look(page);
         assert.equal(again.shut, false);
         assert.equal(again.expanded, "true");