Add Insights, Observe-first, compare, handout layouts, richer search, backup nudge

- Commentary and study aids wait for 15 words of your own Observe notes.
- Insights page: this week's own work, themes across studies, words you keep
  studying, what slipped in recalls, open follow-ups.
- Recall can record what slipped; session notes (teach it back, who came,
  group notes, follow-ups); "Pray about this" from Apply.
- Compare any two passages side by side.
- Handout layouts: standard, questions only, large print, note-taking.
- Search understands "in <book>", "last week/month/year" and a year.
- Home shows the last backup age and nudges after two weeks.
- Phone: the stage bar scrolls instead of clipping Script and Export.

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

src/pages/HomePage.jsx

@@ -14,6 +14,7 @@ import {
   formatRelativeDate,
   loadProjectIndex,
 } from '../utils/bibleUtils.jsx';
+import { backupAge, lastBackupAt } from '../utils/backup.js';
 import { loadProjectById } from '../utils/projectStorage.js';
 import { compactPassages } from '../utils/passageSummary.js';
 import { getPlan, getPlanSchedule, formatDayReadings, nextUnreadDayIndex, computeStreak } from '../utils/readingPlans.js';
@@ -38,6 +39,8 @@ export default function HomePage() {
     audioState,
     audioProgress,
     openImportProject,
+    setCurrentPage,
+    openBackup,
     openNewProject,
     pullLatestFromServer,
     resumeProject,
@@ -130,6 +133,7 @@ export default function HomePage() {
       active="studies"
       actions={(
         <>
+          <button type="button" onClick={() => setCurrentPage('insights')} className={linkBtn} title="This week, themes, words, what slipped, follow-ups">Insights</button>
           <button type="button" onClick={openImportProject} className={linkBtn} title="Set up a whole series from a session list (.docx)">Import Session List</button>
           <button type="button" onClick={openNewProject} className="rounded-full bg-[var(--r-accent)] px-4 py-1.5 text-sm font-medium text-[var(--r-on)] hover:opacity-90">+ New Project</button>
         </>
@@ -137,6 +141,15 @@ export default function HomePage() {
     >
       <main className="mx-auto grid max-w-6xl gap-6 px-4 py-6 lg:grid-cols-[minmax(0,1fr)_21rem]">
         <section className="min-w-0">
+          {projectIndex.length > 0 && (() => {
+            const age = backupAge(lastBackupAt());
+            return (
+              <p className={`mb-3 flex flex-wrap items-center gap-2 px-1 text-xs ${age.stale ? 'text-[var(--r-danger,#b42318)]' : 'text-[var(--r-sub)]'}`}>
+                {age.text}.
+                <button type="button" onClick={openBackup} className="text-[var(--r-accent)] hover:underline">Back up now</button>
+              </p>
+            );
+          })()}
           <WeeklyRecall />
           <RecallHistory />
           <IqDailyCard />