refactor: restructure navigation into 5 grouped hubs, off the 22-item flat strip

Implements the researched IA fix: mobile nav UX consensus caps primary
destinations at 4-5 (uxpin.com, fintech/banking 2026 UX research), and
this app had grown to 22 tabs in one horizontally-scrolling row —
exactly the anti-pattern that research flags for choice paralysis and
slower task completion.

New structure — 5 bottom-nav hubs, grouped by what the user is actually
trying to do, not build order:
- Home: Coverage (unchanged, still the landing screen)
- Estate: Assets, Faraid, Insurance, Wassiyah, Hibah, Family Waqf,
  Nominate, Claims (H2)
- Giving: Zakat, Sadaqah, Khairat
- Family: Tree, Trigger, Mutawalli, Manage (was 'Family', renamed to
  avoid colliding with the hub's own label), Neighbourhood
- Daily: Prayer Times, Qibla, Quran, Locate

Each hub reveals its own sub-nav one tap in, instead of every tab
competing for space in a single row. Settings moved out of the tab
strip entirely into a header gear icon, matching the banking-app pattern
of keeping settings out of primary thumb-reach real estate. The bottom
nav is now fixed (thumb-zone), sub-nav keeps the old sticky-top position.

Cross-component navigation (nav.js requestedTab, used by the Family
Tree's 'give sadaqah in memory' link) now resolves a tab label to its
owning (hub, sub-tab) pair instead of a flat index — verified live.

This touches every E2E suite: a single click on a tab's old selector no
longer reaches it (hub, then sub-tab). Added a shared gotoTab(page, label)
helper to e2e-auth-helper.cjs encapsulating the two-step navigation, and
migrated all ~22 affected test files off direct nav-button selectors —
mechanical substitution followed by manual fixes for local clickTab
wrappers, template-literal selectors, and active-state assertions that
needed to target the new .hub-tab/.subnav structure specifically.

Full regression after migration: every suite passes (one isolated
Family Tree flake confirmed clean on rerun, unrelated to navigation).

e2e-family-agent.cjs

@@ -4,6 +4,7 @@
 // dashboard, can add an asset — but cannot fire the death trigger (owner-only,
 // enforced by RLS, not just hidden in the UI).
 const { chromium } = require('playwright');
+const { gotoTab } = require('./e2e-auth-helper.cjs');
 const BASE = 'https://moslem04.falahos.my/';
 const results = [];
 function record(name, pass, detail = '') { results.push({ name, pass, detail }); console.log(`${pass ? 'PASS' : 'FAIL'}  ${name}${detail ? '  — ' + detail : ''}`); }
@@ -60,10 +61,10 @@ async function main() {
   await ownerPage.locator('.field:has-text("Family name") input').fill(familyName);
   await ownerPage.locator('button.btn-primary', { hasText: 'Create family' }).click();
   await ownerPage.waitForTimeout(1000);
-  const onMainApp = await ownerPage.locator('nav button.tab', { hasText: 'Coverage' }).isVisible().catch(() => false);
+  const onMainApp = await ownerPage.locator('.hub-tab[aria-label="Home"]').isVisible().catch(() => false);
   record('Owner: creating a family lands on the main app', onMainApp);
 
-  await ownerPage.locator('nav button[aria-label="Family"]').click();
+  await gotoTab(ownerPage, 'Manage');
   await ownerPage.waitForTimeout(300);
   await ownerPage.locator('.field:has-text("Invite by email") input').fill(agentEmail);
   await ownerPage.locator('.field:has-text("Role") select').selectOption('agent');
@@ -81,10 +82,10 @@ async function main() {
   record('Agent: sees pending invite from owner on sign-in', inviteVisible);
 
   await inviteRow.locator('.btn-small', { hasText: 'Accept' }).click();
-  const agentOnMainApp = await agentPage.locator('nav button[aria-label="Coverage"]').waitFor({ state: 'visible', timeout: 10000 }).then(() => true).catch(() => false);
+  const agentOnMainApp = await agentPage.locator('.hub-tab[aria-label="Home"]').waitFor({ state: 'visible', timeout: 10000 }).then(() => true).catch(() => false);
   record('Agent: accepting invite lands on the main app for that family', agentOnMainApp);
 
-  await agentPage.locator('nav button[aria-label="Assets"]').click();
+  await gotoTab(agentPage, 'Assets');
   await agentPage.waitForTimeout(400);
   await agentPage.locator('.field:has-text("Description") input').fill('Agent-added asset');
   await agentPage.locator('.field:has-text("Estimated value") input').fill('50000');
@@ -93,12 +94,12 @@ async function main() {
   record('Agent: can add an asset to the family estate', assetAddedByAgent);
 
   // Owner should see the agent-added asset too (shared, live data — not per-device)
-  await ownerPage.locator('nav button[aria-label="Assets"]').click();
+  await gotoTab(ownerPage, 'Assets');
   const ownerSeesAgentAsset = await ownerPage.locator('.asset-row', { hasText: 'Agent-added asset' }).waitFor({ state: 'visible', timeout: 10000 }).then(() => true).catch(() => false);
   record('Owner: sees the asset the agent just added (shared family data)', ownerSeesAgentAsset);
 
   // ── Agent tries the Death Trigger — should be visibly restricted ──
-  await agentPage.locator('nav button[aria-label="Trigger"]').click();
+  await gotoTab(agentPage, 'Trigger');
   const agentRestrictionVisible = await agentPage.locator('.agent-restriction').waitFor({ state: 'visible', timeout: 10000 }).then(() => true).catch(() => false);
   record('Agent: sees explicit "owner-only to fire" restriction notice', agentRestrictionVisible);
 
@@ -117,7 +118,7 @@ async function main() {
   record('Agent: fire-trigger button stays disabled even with all fields filled (role check)', fireBtnDisabledForAgent);
 
   // ── Owner fires it — should work, enforced by RLS as role=owner ──
-  await ownerPage.locator('nav button[aria-label="Trigger"]').click();
+  await gotoTab(ownerPage, 'Trigger');
   await ownerPage.waitForTimeout(1000);
   const ownerAttestorInputs = ownerPage.locator('.attestor-row input');
   const attestorCount = await ownerAttestorInputs.count();