fix(web): lift the jump sheet above the bottom tab bar

On mobile the last item in "Jump to section" was painted over by the fixed
bottom tab bar and could not be tapped. Reported as nearby schools missing
from the menu; it was there, underneath the bar.

The sticky nav sets `position: sticky` with `z-index: 10`, which makes it a
stacking context. The sheet's own `z-index: 1600` therefore orders it only
inside that context — against the tab bar (z-index 1000) the nav's 10 is what
counts, so the bar wins. Verified on staging: every menu item returns itself
from elementFromPoint except the last, which returns the tab bar.

Latent rather than new. With five sections the list stopped just above the bar;
"Nearby schools" made six, and the sixth is the first to reach it. Any section
added later would have done the same.

Lifted only while the sheet is open, and only to 1100 — above the bar, below
the comparison toast (2000), the fullscreen map (5000) and the info popover
(9999). The backdrop rises with it, so tapping over the bar now dismisses the
sheet instead of navigating away.

The journey asks what a thumb asks: for each item, whether it is the topmost
element at its own centre. A bounding-box check cannot see this — the item is
in the viewport and the right size, just underneath something. Confirmed to
fail against current staging, naming "Nearby schools", before the fix.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

e2e/tests/journeys.spec.ts

@@ -2826,6 +2826,52 @@ test('nearby schools link on to other schools and into compare', async ({ page }
   expect(Math.abs(offsetAfter - offsetBefore)).toBeLessThanOrEqual(8);
 });
 
+/**
+ * Every section in the mobile jump sheet can actually be reached.
+ *
+ * The sheet is a fixed bottom sheet, and the app has a fixed bottom tab bar.
+ * `position: sticky` with a z-index on the sticky nav makes it a stacking
+ * context, so the sheet's own z-index orders it only within that context —
+ * against the tab bar, the nav's value is what counts. The last item in the
+ * sheet was therefore painted over and untappable as soon as the list grew
+ * long enough to reach the bar, which adding "Nearby schools" is what did.
+ *
+ * Bounding boxes are not enough to catch this: the item is in the viewport and
+ * the right size, it is simply underneath something. So this asks the question
+ * a thumb asks — what is on top at this point.
+ */
+test('every section in the mobile jump sheet is tappable, not under the tab bar', async ({ page }) => {
+  await page.setViewportSize({ width: 390, height: 844 });
+  await searchByName(page, 'Primary');
+  await schoolLinks(page).first().click();
+  await page.waitForURL(/\/school\//);
+
+  // Scroll down so the sticky nav is docked and the sheet has somewhere to open.
+  await page.evaluate(() => window.scrollTo({ top: 1200 }));
+  // Two controls carry aria-haspopup: the mobile "Section" button and the
+  // desktop "All" one, which is display:none here but still in the DOM.
+  await page.locator('[aria-haspopup="menu"]:visible').click();
+
+  const sheet = page.locator('[role="menu"]');
+  await expect(sheet).toBeVisible();
+
+  const covered = await sheet.evaluate((panel: HTMLElement) =>
+    Array.from(panel.querySelectorAll('[role="menuitem"]'))
+      .map((el) => {
+        const box = el.getBoundingClientRect();
+        const hit = document.elementFromPoint(
+          Math.round(box.left + box.width / 2),
+          Math.round(box.top + box.height / 2),
+        );
+        return { label: (el as HTMLElement).innerText.trim().replace(/\s+/g, ' '), reachable: !!(hit && hit.closest('[role="menuitem"]')) };
+      })
+      .filter((item) => !item.reachable)
+      .map((item) => item.label),
+  );
+
+  expect(covered).toEqual([]);
+});
+
 /**
  * The nearby-schools section at MOBILE.md's three reference widths.
  *