feat(search): show the list view's rows beside the map

The list beside the map used its own cut-down card, so it showed less
than the list view (no phase, age range, denomination, trend, local
authority) and looked different. It now renders the list view's
SchoolRow / SecondarySchoolRow, through one renderRow shared by the list
view, the map pane and the phone's bottom sheet, which also gains
Remove from compare. CompactSchoolItem and its styles are gone.

The rows switched to their stacked layout on a max-width: 640px media
query, which never fires in a ~430px pane on a desktop screen. It is now
a container query on the list the row sits in (`results`, set on the
list view, the map pane and the bottom sheet). 600px of list is a 632px
screen less padding, so phones lay out as before.

Clicking a row, outside its links and buttons, still picks its pin, and
the selected row is outlined. The pane widens to 360–460px for the
taller rows.

The bottom sheet's close button was a 30px target; it is now 44px with
the same 30px circle (MOBILE.md), and the phone journey checks it.

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

e2e/tests/journeys.spec.ts

@@ -561,6 +561,10 @@ test('a desktop postcode search opens on the map with the list beside it', async
   const pane = page.locator('[class*="mapListPane"]');
   const card = pane.locator('[data-urn]').first();
   await expect(card).toBeVisible({ timeout: 15_000 });
+  // The list view's own row, not a cut-down card: it carries the same View
+  // link and Compare button.
+  await expect(card.getByRole('link', { name: 'View', exact: true })).toBeVisible();
+  await expect(card.getByRole('button', { name: /Compar/ })).toBeVisible();
   await expect(page.locator('.sc-pin').first()).toBeVisible({ timeout: 15_000 });
 
   // The split runs to the bottom of the screen rather than stopping short.
@@ -629,7 +633,8 @@ for (const width of [360, 390, 402, 430]) {
     const small = await page.evaluate(() => {
       const toolbar = document.querySelector('[class*="resultsToolbar"]');
       const fabEl = document.querySelector('[class*="viewFab"]');
-      return [...(toolbar?.querySelectorAll('a, button, input, select') ?? []), fabEl]
+      const closeEl = document.querySelector('[class*="closeSheetBtn"]');
+      return [...(toolbar?.querySelectorAll('a, button, input, select') ?? []), fabEl, closeEl]
         .filter((el): el is HTMLElement => !!el && !!(el as HTMLElement).offsetParent)
         .map((el) => ({ t: el.innerText?.trim().slice(0, 24) || el.getAttribute('aria-label'),
           w: el.getBoundingClientRect().width, h: el.getBoundingClientRect().height }))