From 199c1b3b3ca40909bc964f4a363294c8d84ecc66 Mon Sep 17 00:00:00 2001
From: David <60177543+davd-gzl@users.noreply.github.com>
Date: Wed, 22 Jul 2026 19:17:37 +0000
Subject: [PATCH 1/2] Filters persist fully across sessions; stats airport
 tiles open airports
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Every filter VALUE now persists to localStorage, not just status/minPop/sort/
  mode: date, folder, category, country, continent and the growth flags ride in
  one JSON blob, restored + validated field-by-field. The map and the lists both
  reopen exactly as you left them. (listOnly stays session-scoped — it's a mode,
  not a value.)
- Stats "airports" tiles (the KPI and the counter strip) opened the generic
  "visited" list; they now open Places narrowed to your visited AIRPORTS via a
  new "airports" view.
- World-level stats tiles clear any country drill-down before opening, so they
  never stay stuck on the last country a card opened (matters now that the
  country filter persists).
---
 .../src/features/stats/StatStrip.tsx          | 10 ++-
 .../src/features/stats/StatsView.tsx          | 18 +++--
 .../src/features/visits/PlacesScreen.tsx      |  4 ++
 apps/postcards/src/lib/store/useFilters.ts    | 65 ++++++++++++++++++-
 apps/postcards/src/lib/store/useUi.ts         |  1 +
 apps/postcards/tests/unit/filterState.spec.ts | 29 +++++++++
 6 files changed, 117 insertions(+), 10 deletions(-)

diff --git a/apps/postcards/src/features/stats/StatStrip.tsx b/apps/postcards/src/features/stats/StatStrip.tsx
index e362165..e3e84d6 100644
--- a/apps/postcards/src/features/stats/StatStrip.tsx
+++ b/apps/postcards/src/features/stats/StatStrip.tsx
@@ -2,6 +2,7 @@ import { useMemo } from "react";
 import { useVisits } from "../../lib/store/useVisits";
 import { useSettings } from "../../lib/store/useSettings";
 import { useUi, type PlacesView } from "../../lib/store/useUi";
+import { useFilters } from "../../lib/store/useFilters";
 import { getReferenceData } from "../../lib/reference/referenceData";
 import { computeCoverage } from "./computeStats";
 import { formatInt, formatPercent } from "../../lib/format/format";
@@ -64,7 +65,12 @@ export function StatStrip() {
       <button
         type="button"
         className="ss-item"
-        onClick={() => openPlaces(view)}
+        onClick={() => {
+          // World-level shortcut — drop any country drill-down so it shows the
+          // whole world, not the last country you opened from a stats card.
+          useFilters.getState().set({ country: "" });
+          openPlaces(view);
+        }}
         title={t("statStrip.openAria", { label })}
         aria-label={aria}
       >
@@ -90,7 +96,7 @@ export function StatStrip() {
       <span className="ss-sep" aria-hidden />
       <Counter num={stats.cov.citiesVisited} label={t("statStrip.been")} cls="ss-been" view="visited" />
       {stats.cov.airportsVisited > 0 && (
-        <Counter num={stats.cov.airportsVisited} label={t("statStrip.airports")} cls="ss-air" view="visited" />
+        <Counter num={stats.cov.airportsVisited} label={t("statStrip.airports")} cls="ss-air" view="airports" />
       )}
       <Counter num={stats.want} label={t("statStrip.want")} cls="ss-want" view="wishlist" />
       <Counter num={stats.fav} label={t("statStrip.fav")} cls="ss-fav" view="favorites" />
diff --git a/apps/postcards/src/features/stats/StatsView.tsx b/apps/postcards/src/features/stats/StatsView.tsx
index 6e72a57..8c6c636 100644
--- a/apps/postcards/src/features/stats/StatsView.tsx
+++ b/apps/postcards/src/features/stats/StatsView.tsx
@@ -16,7 +16,7 @@ import {
 } from "./computeStats";
 import { travelTotals } from "../travel/distance";
 import { MODE_GLYPH } from "../travel/modes";
-import { useUi } from "../../lib/store/useUi";
+import { useUi, type PlacesView } from "../../lib/store/useUi";
 import { useFilters } from "../../lib/store/useFilters";
 import { countryFlag, formatDate, formatInt, formatKm, formatPercent } from "../../lib/format/format";
 import { CONTINENT_COLORS, CONTINENT_ORDER } from "../../lib/reference/continents";
@@ -376,6 +376,12 @@ export function StatsView() {
     useFilters.getState().set({ minPop, country: "" });
     useUi.getState().openPlaces("visited");
   }
+  // The coverage-hero + KPI tiles are all world-level: drop any country
+  // drill-down before opening the view so they never stay narrowed to one country.
+  function openWorld(view: PlacesView) {
+    useFilters.getState().set({ country: "" });
+    useUi.getState().openPlaces(view);
+  }
   function flyToRegion(iso2: string) {
     return (name: string) => {
       const sub = ref.subdivisionsOf(iso2).find((s) => s.name === name);
@@ -444,7 +450,7 @@ export function StatsView() {
               total: formatInt(coverage.worldCountryCount),
               pct: worldPctLabel,
             })}
-            onClick={() => useUi.getState().openPlaces("countries")}
+            onClick={() => openWorld("countries")}
           >
             <span className="stat-bar-top">
               <span className="stat-bar-name">{t("stats.bars.countries")}</span>
@@ -468,7 +474,7 @@ export function StatsView() {
               total: formatInt(coverage.worldCityCount),
               pct: cityPctLabel,
             })}
-            onClick={() => useUi.getState().openPlaces("visited")}
+            onClick={() => openWorld("visited")}
           >
             <span className="stat-bar-top">
               <span className="stat-bar-name">{t("stats.bars.cities")}</span>
@@ -526,7 +532,7 @@ export function StatsView() {
             type="button"
             className="kpi"
             title={t("stats.kpi.countriesTitle")}
-            onClick={() => useUi.getState().openPlaces("countries")}
+            onClick={() => openWorld("countries")}
           >
             <span className="kpi-num kpi-air">{formatInt(coverage.countriesVisited)}</span>
             <span className="kpi-label">{t("stats.kpi.countries")}</span>
@@ -558,7 +564,7 @@ export function StatsView() {
               type="button"
               className="kpi"
               title={t("stats.kpi.visitedTitle")}
-              onClick={() => useUi.getState().openPlaces("visited")}
+              onClick={() => openWorld("airports")}
             >
               <span className="kpi-num kpi-air">{formatInt(coverage.airportsVisited)}</span>
               <span className="kpi-label">{t("stats.kpi.airports")}</span>
@@ -569,7 +575,7 @@ export function StatsView() {
               type="button"
               className="kpi"
               title={t("stats.kpi.monumentsTitle")}
-              onClick={() => useUi.getState().openPlaces("monuments")}
+              onClick={() => openWorld("monuments")}
             >
               <span className="kpi-num kpi-want">{formatInt(coverage.monumentsVisited)}</span>
               <span className="kpi-label">{t("stats.kpi.monuments")}</span>
diff --git a/apps/postcards/src/features/visits/PlacesScreen.tsx b/apps/postcards/src/features/visits/PlacesScreen.tsx
index 98e2ed7..4d40588 100644
--- a/apps/postcards/src/features/visits/PlacesScreen.tsx
+++ b/apps/postcards/src/features/visits/PlacesScreen.tsx
@@ -108,6 +108,10 @@ function mapRequest(view: PlacesView): { kind?: Kind; status?: Status; collectio
       return { kind: "cities", status: "all", collection: null };
     case "monuments":
       return { kind: "monuments", status: "all", collection: null };
+    case "airports":
+      // The airports you've actually been through (the count these tiles show),
+      // not the whole world of airports.
+      return { kind: "airports", status: "visited", collection: null };
     case "moments":
       return { collection: "moments" };
     case "passport":
diff --git a/apps/postcards/src/lib/store/useFilters.ts b/apps/postcards/src/lib/store/useFilters.ts
index ad20568..55d8727 100644
--- a/apps/postcards/src/lib/store/useFilters.ts
+++ b/apps/postcards/src/lib/store/useFilters.ts
@@ -72,12 +72,16 @@ export const DEFAULT_FILTERS: FilterState = {
   listOnly: false,
 };
 
-// Persisted preference dimensions reuse the keys the old inline controls used, so
-// upgrading users keep their choices; session dimensions are never written.
+// Every filter VALUE persists across sessions (the map and the lists both read
+// this store, so both reopen exactly as you left them). status/minPop/sort/mode
+// keep their own legacy keys (so upgrading users keep those choices); the rest
+// ride in one JSON blob. `listOnly` is the only thing NOT saved — it's a per-
+// session scope toggle (whether the filter also narrows the map), not a value.
 const STATUS_KEY = "postcards-city-filter";
 const MINPOP_KEY = "postcards-city-minpop";
 const SORT_KEY = "postcards-list-sort";
 const MODE_KEY = "postcards-map-mode";
+const EXTRA_KEY = "postcards-filter-extra";
 
 function readLocal(key: string): string | null {
   try {
@@ -114,11 +118,67 @@ function loadMode(): FilterMode {
   return v === "cities" || v === "monuments" || v === "airports" ? v : "all";
 }
 
+/** The remaining value dimensions (date/folder/category/country/continent/growth),
+ *  restored from the JSON blob and validated field-by-field so a corrupt or stale
+ *  entry falls back to its default rather than throwing. */
+function loadExtra(): Pick<
+  FilterState,
+  "date" | "folder" | "category" | "country" | "continent" | "favoritesOnly" | "hasPhoto" | "hasNote"
+> {
+  const base = {
+    date: DEFAULT_FILTERS.date,
+    folder: DEFAULT_FILTERS.folder,
+    category: DEFAULT_FILTERS.category,
+    country: DEFAULT_FILTERS.country,
+    continent: DEFAULT_FILTERS.continent,
+    favoritesOnly: DEFAULT_FILTERS.favoritesOnly,
+    hasPhoto: DEFAULT_FILTERS.hasPhoto,
+    hasNote: DEFAULT_FILTERS.hasNote,
+  };
+  const raw = readLocal(EXTRA_KEY);
+  if (!raw) return base;
+  try {
+    const p = JSON.parse(raw) as Record<string, unknown>;
+    const str = (v: unknown) => (typeof v === "string" ? v : undefined);
+    const bool = (v: unknown) => (typeof v === "boolean" ? v : undefined);
+    let date: FilterDate = DEFAULT_FILTERS.date;
+    const d = p.date as Record<string, unknown> | undefined;
+    if (d && d.mode === "undated") date = { mode: "undated" };
+    else if (d && d.mode === "range" && typeof d.from === "string" && typeof d.to === "string")
+      date = { mode: "range", from: d.from, to: d.to };
+    return {
+      date,
+      folder: str(p.folder) ?? base.folder,
+      category: str(p.category) ?? base.category,
+      country: str(p.country) ?? base.country,
+      continent: str(p.continent) ?? base.continent,
+      favoritesOnly: bool(p.favoritesOnly) ?? base.favoritesOnly,
+      hasPhoto: bool(p.hasPhoto) ?? base.hasPhoto,
+      hasNote: bool(p.hasNote) ?? base.hasNote,
+    };
+  } catch {
+    return base;
+  }
+}
+
 function persist(state: FilterState): void {
   writeLocal(STATUS_KEY, state.status.join(","));
   writeLocal(MINPOP_KEY, String(state.minPop));
   writeLocal(SORT_KEY, state.sort);
   writeLocal(MODE_KEY, state.mode);
+  writeLocal(
+    EXTRA_KEY,
+    JSON.stringify({
+      date: state.date,
+      folder: state.folder,
+      category: state.category,
+      country: state.country,
+      continent: state.continent,
+      favoritesOnly: state.favoritesOnly,
+      hasPhoto: state.hasPhoto,
+      hasNote: state.hasNote,
+    }),
+  );
 }
 
 /** True iff every dimension is at its default (⇒ no active filters, empty summary). */
@@ -156,6 +216,7 @@ export const useFilters = create<FilterStore>((set, get) => ({
   minPop: loadMinPop(),
   sort: loadSort(),
   mode: loadMode(),
+  ...loadExtra(),
   set: (partial) => {
     set(partial);
     persist(get());
diff --git a/apps/postcards/src/lib/store/useUi.ts b/apps/postcards/src/lib/store/useUi.ts
index f37634d..3dd3c06 100644
--- a/apps/postcards/src/lib/store/useUi.ts
+++ b/apps/postcards/src/lib/store/useUi.ts
@@ -11,6 +11,7 @@ export type PlacesView =
   | "countries"
   | "cities"
   | "monuments"
+  | "airports"
   | "moments"
   | "passport";
 
diff --git a/apps/postcards/tests/unit/filterState.spec.ts b/apps/postcards/tests/unit/filterState.spec.ts
index 8cde033..4355d07 100644
--- a/apps/postcards/tests/unit/filterState.spec.ts
+++ b/apps/postcards/tests/unit/filterState.spec.ts
@@ -60,4 +60,33 @@ describe("useFilters store", () => {
     expect(localStorage.getItem("postcards-city-minpop")).toBe("1000000");
     expect(localStorage.getItem("postcards-list-sort")).toBe("az");
   });
+
+  it("persists EVERY value dimension (date/folder/category/country/continent/growth) across sessions", () => {
+    useFilters.getState().set({
+      date: { mode: "range", from: "2020-01-01", to: "2020-12-31" },
+      folder: "Japan 2019",
+      category: "cultural",
+      country: "FR",
+      continent: "Europe",
+      favoritesOnly: true,
+      hasPhoto: true,
+      hasNote: true,
+    });
+    const blob = JSON.parse(localStorage.getItem("postcards-filter-extra") ?? "{}");
+    expect(blob.date).toEqual({ mode: "range", from: "2020-01-01", to: "2020-12-31" });
+    expect(blob.folder).toBe("Japan 2019");
+    expect(blob.category).toBe("cultural");
+    expect(blob.country).toBe("FR");
+    expect(blob.continent).toBe("Europe");
+    expect(blob.favoritesOnly).toBe(true);
+    expect(blob.hasPhoto).toBe(true);
+    expect(blob.hasNote).toBe(true);
+    // clearAll wipes the persisted blob back to defaults.
+    useFilters.getState().clearAll();
+    const cleared = JSON.parse(localStorage.getItem("postcards-filter-extra") ?? "{}");
+    expect(cleared.country).toBe("");
+    expect(cleared.folder).toBe("");
+    expect(cleared.favoritesOnly).toBe(false);
+    expect(cleared.date).toEqual({ mode: "all" });
+  });
 });

From ecc6d77390c1936fec5782d7bccee374240dfd84 Mon Sep 17 00:00:00 2001
From: David <60177543+davd-gzl@users.noreply.github.com>
Date: Wed, 22 Jul 2026 19:25:02 +0000
Subject: [PATCH 2/2] =?UTF-8?q?Backup:=20"Save=20everything"=20=E2=80=94?=
 =?UTF-8?q?=20a=20.zip=20with=20data=20+=20photos=20as=20real=20image=20fi?=
 =?UTF-8?q?les?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The JSON export already embeds photos (base64), but a giant single file is
unwieldy and the images aren't browsable. Add a complete, portable archive:

- New "Save everything (.zip)" export → a dependency-free ZIP (store method —
  photos are already compressed) holding a compact JSON manifest plus every
  photo as a real, openable file under photos/. The manifest is the canonical
  portable file with each photo's data URL swapped for a "zip:photos/…" ref, so
  the JSON stays small and readable.
- Import now understands the .zip (detected by magic bytes): it re-inlines the
  referenced image files back into data URLs and restores through the SAME
  validated JSON path (Constitution VI — data stays inert). A missing image
  file drops that photo rather than breaking the restore.
- Tiny CRC-32 + zip reader/writer in lib/backup/zip.ts (no new dependency).

Verified: zip codec round-trip incl. a known CRC-32 vector; archive→import
restores photos byte-identically; existing JSON/CSV import unaffected.
---
 apps/postcards/src/features/backup/Backup.tsx |  69 +++++++-
 .../src/features/backup/archiveZip.ts         | 116 +++++++++++++
 .../src/features/backup/exportJson.ts         |   2 +-
 apps/postcards/src/lib/backup/zip.ts          | 152 ++++++++++++++++++
 apps/postcards/src/lib/download.ts            |  10 +-
 apps/postcards/src/lib/i18n/en.ts             |   5 +-
 apps/postcards/src/lib/i18n/fr.ts             |   5 +-
 apps/postcards/src/lib/i18n/ko.ts             |   5 +-
 apps/postcards/tests/unit/archiveZip.spec.ts  |  94 +++++++++++
 9 files changed, 445 insertions(+), 13 deletions(-)
 create mode 100644 apps/postcards/src/features/backup/archiveZip.ts
 create mode 100644 apps/postcards/src/lib/backup/zip.ts
 create mode 100644 apps/postcards/tests/unit/archiveZip.spec.ts

diff --git a/apps/postcards/src/features/backup/Backup.tsx b/apps/postcards/src/features/backup/Backup.tsx
index 47ecb7b..fa4ea30 100644
--- a/apps/postcards/src/features/backup/Backup.tsx
+++ b/apps/postcards/src/features/backup/Backup.tsx
@@ -9,7 +9,7 @@ import { getReferenceData } from "../../lib/reference/referenceData";
 import { backfillUpdatedAt } from "../../lib/schema/helpers";
 import { replaceAllPortable } from "../../lib/db/visitsDb";
 import { toMarkdown } from "./exportMarkdown";
-import { download } from "../../lib/download";
+import { download, downloadBlob } from "../../lib/download";
 import { DurabilityNote } from "../../ui/DurabilityNote";
 import {
   markBackedUp,
@@ -55,6 +55,31 @@ async function deliver(filename: string, text: string, type: string): Promise<vo
   download(filename, text, type);
 }
 
+/** Same delivery, but for a BINARY file (the .zip archive): native writes the
+ *  bytes as base64 then shares; the web shares/downloads the Blob directly. */
+async function deliverBlob(filename: string, blob: Blob, type: string): Promise<void> {
+  if (Capacitor.isNativePlatform()) {
+    const bytes = new Uint8Array(await blob.arrayBuffer());
+    let bin = "";
+    for (let i = 0; i < bytes.length; i += 0x8000) bin += String.fromCharCode(...bytes.subarray(i, i + 0x8000));
+    const { uri } = await Filesystem.writeFile({ path: filename, data: btoa(bin), directory: Directory.Cache });
+    await Share.share({ title: filename, url: uri });
+    return;
+  }
+  if (typeof navigator !== "undefined" && typeof navigator.canShare === "function") {
+    const file = new File([blob], filename, { type });
+    if (navigator.canShare({ files: [file] })) {
+      try {
+        await navigator.share({ files: [file], title: filename });
+        return;
+      } catch (err) {
+        if (err instanceof DOMException && err.name === "AbortError") return;
+      }
+    }
+  }
+  downloadBlob(filename, blob);
+}
+
 export function Backup() {
   const t = useT();
   const ref = useMemo(() => getReferenceData(), []);
@@ -86,6 +111,19 @@ export function Backup() {
       setMessage({ kind: "err", text: t("backup.msg.exportJsonErr") });
     }
   }
+  async function exportArchive() {
+    try {
+      const { buildArchive, ARCHIVE_FILENAME } = await import("./archiveZip");
+      const bytes = buildArchive(visits, trips, stories);
+      // Copy into a fresh ArrayBuffer so the Blob owns exactly these bytes.
+      await deliverBlob(ARCHIVE_FILENAME, new Blob([bytes.slice()], { type: "application/zip" }), "application/zip");
+      // A full archive (data + photos) is a real backup — reset the reminder clock.
+      markBackedUp(Date.now());
+      setReminderDue(false);
+    } catch {
+      setMessage({ kind: "err", text: t("backup.msg.exportZipErr") });
+    }
+  }
   async function exportMd() {
     try {
       await deliver("places.md", toMarkdown(visits, trips, ref), "text/markdown");
@@ -125,7 +163,21 @@ export function Backup() {
     const file = e.target.files?.[0];
     e.target.value = "";
     if (!file) return;
-    const text = await file.text();
+    const buf = new Uint8Array(await file.arrayBuffer());
+    // A .zip "Save everything" archive is a FULL RESTORE — unpack it back into the
+    // standard JSON (re-inlining the photo files) and restore that. Detected by the
+    // ZIP magic bytes, not the extension, so a mislabelled file still works.
+    const { looksLikeZip } = await import("../../lib/backup/zip");
+    if (looksLikeZip(buf)) {
+      try {
+        const { archiveToJson } = await import("./archiveZip");
+        await restoreFromJson(archiveToJson(buf));
+      } catch {
+        setMessage({ kind: "err", text: t("backup.msg.zipUnreadable") });
+      }
+      return;
+    }
+    const text = new TextDecoder().decode(buf);
     // A JSON backup ({…}) is a FULL RESTORE (replaces everything); anything else
     // is treated as a places table (CSV/TSV) and MERGED in. The format is picked
     // from the content, not the extension, so a mislabelled file still works.
@@ -244,7 +296,10 @@ export function Backup() {
       <p className="muted">{t("backup.intro")}</p>
 
       <div className="btn-row">
-        <button className="btn" type="button" onClick={() => void exportJson()}>
+        <button className="btn" type="button" onClick={() => void exportArchive()}>
+          {t("backup.export.all")}
+        </button>
+        <button className="btn-ghost" type="button" onClick={() => void exportJson()}>
           {t("backup.export.data")}
         </button>
         <button className="btn-ghost" type="button" onClick={() => void exportCsv()}>
@@ -259,7 +314,7 @@ export function Backup() {
         <input
           ref={fileInput}
           type="file"
-          accept="application/json,.json,text/csv,.csv,.tsv,text/plain"
+          accept="application/zip,.zip,application/json,.json,text/csv,.csv,.tsv,text/plain"
           onChange={onImport}
           style={{ display: "none" }}
           aria-hidden="true"
@@ -277,8 +332,10 @@ export function Backup() {
         </p>
       )}
       <p className="muted small">
-        Import understands two things. A <strong>.json backup</strong> is a full restore — it{" "}
-        <strong>⚠ replaces everything on this device</strong> (you'll be asked to confirm). A{" "}
+        <strong>Save everything</strong> writes a <strong>.zip</strong> holding your data plus every
+        photo as a real image file — the most complete, portable backup. Import understands three
+        things. A <strong>.zip archive</strong> or a <strong>.json backup</strong> is a full restore —
+        it <strong>⚠ replaces everything on this device</strong> (you'll be asked to confirm). A{" "}
         <strong>.csv places list</strong> (columns like <code>lat, lon, country, city, been</code>,
         where <code>been</code> tags are <code>been</code> / <code>want</code> / <code>fave</code>){" "}
         is merged in — it only adds and updates places, never erasing your trips or stories. Files
diff --git a/apps/postcards/src/features/backup/archiveZip.ts b/apps/postcards/src/features/backup/archiveZip.ts
new file mode 100644
index 0000000..48e5bda
--- /dev/null
+++ b/apps/postcards/src/features/backup/archiveZip.ts
@@ -0,0 +1,116 @@
+import type { Story, Trip, Visit } from "../../lib/schema/models";
+import { zipStore, unzipStore, type ZipEntry } from "../../lib/backup/zip";
+import { buildFile } from "./exportJson";
+
+// The "Save everything" archive: one .zip holding a compact JSON manifest plus
+// every photo as a real, openable image FILE (photos/0001.jpg …). The manifest
+// is the canonical portable file with each photo's inline data URL swapped for a
+// "zip:photos/…" reference, so the JSON stays small and readable while the images
+// live as browsable files. Import reverses it: re-inline the referenced bytes
+// into data URLs, then hand the reconstructed standard JSON to the normal
+// validator (Constitution VI: still parsed, never executed).
+
+export const ARCHIVE_FILENAME = "postcards-backup.zip";
+export const MANIFEST_NAME = "backup.postcards.json";
+
+const EXT_OF: Record<string, string> = {
+  "image/jpeg": "jpg",
+  "image/png": "png",
+  "image/webp": "webp",
+  "image/gif": "gif",
+  "image/avif": "avif",
+};
+const MIME_OF: Record<string, string> = {
+  jpg: "image/jpeg",
+  jpeg: "image/jpeg",
+  png: "image/png",
+  webp: "image/webp",
+  gif: "image/gif",
+  avif: "image/avif",
+};
+
+const B64_CHUNK = 0x8000;
+
+/** Decode a `data:<mime>;base64,<payload>` URL into raw bytes + its mime. */
+function decodeDataUrl(dataUrl: string): { bytes: Uint8Array; mime: string } {
+  const comma = dataUrl.indexOf(",");
+  const meta = dataUrl.slice(5, comma); // between "data:" and ","
+  const mime = meta.replace(/;base64$/i, "") || "application/octet-stream";
+  const bin = atob(dataUrl.slice(comma + 1));
+  const bytes = new Uint8Array(bin.length);
+  for (let i = 0; i < bin.length; i++) bytes[i] = bin.charCodeAt(i);
+  return { bytes, mime };
+}
+
+/** Re-encode raw image bytes as an inline base64 data URL. */
+function bytesToDataUrl(bytes: Uint8Array, mime: string): string {
+  let bin = "";
+  for (let i = 0; i < bytes.length; i += B64_CHUNK) {
+    bin += String.fromCharCode(...bytes.subarray(i, i + B64_CHUNK));
+  }
+  return `data:${mime};base64,${btoa(bin)}`;
+}
+
+type PhotoLike = { src: string; caption: string | null };
+
+/** Build the complete "everything" archive as ZIP bytes. */
+export function buildArchive(
+  visits: Visit[],
+  trips: Trip[] = [],
+  stories: Story[] = [],
+  now = new Date(),
+): Uint8Array {
+  const file = buildFile(visits, trips, stories, now); // validated, data-URL photos
+  const photoEntries: ZipEntry[] = [];
+  let n = 0;
+  const stash = (photos?: PhotoLike[]) =>
+    photos?.map((p) => {
+      const { bytes, mime } = decodeDataUrl(p.src);
+      const ext = EXT_OF[mime] ?? "bin";
+      const name = `photos/${String(++n).padStart(4, "0")}.${ext}`;
+      photoEntries.push({ name, data: bytes });
+      return { src: `zip:${name}`, caption: p.caption ?? null };
+    });
+  const manifest = {
+    ...file,
+    visits: file.visits.map((v) => (v.photos && v.photos.length ? { ...v, photos: stash(v.photos) } : v)),
+    stories: file.stories.map((s) => (s.photos && s.photos.length ? { ...s, photos: stash(s.photos) } : s)),
+  };
+  const json = new TextEncoder().encode(JSON.stringify(manifest, null, 2));
+  return zipStore([{ name: MANIFEST_NAME, data: json }, ...photoEntries]);
+}
+
+/**
+ * Turn an archive's bytes back into a standard Postcards JSON string, re-inlining
+ * each "zip:photos/…" reference from its stored image file. The result is fed to
+ * the normal `importFile` validator. Throws if there's no manifest inside.
+ */
+export function archiveToJson(bytes: Uint8Array): string {
+  const entries = unzipStore(bytes);
+  const manifest =
+    entries.find((e) => e.name === MANIFEST_NAME) ?? entries.find((e) => e.name.endsWith(".json"));
+  if (!manifest) throw new Error("no backup manifest in archive");
+  const fileMap = new Map(entries.map((e) => [e.name, e.data] as const));
+  const obj = JSON.parse(new TextDecoder().decode(manifest.data)) as Record<string, unknown>;
+  const reinline = (photos: unknown): PhotoLike[] =>
+    (Array.isArray(photos) ? photos : [])
+      .map((p): PhotoLike | null => {
+        const ph = p as PhotoLike;
+        if (typeof ph.src === "string" && ph.src.startsWith("zip:")) {
+          const name = ph.src.slice(4);
+          const data = fileMap.get(name);
+          if (!data) return null; // referenced image missing — drop rather than break restore
+          const ext = name.split(".").pop()?.toLowerCase() ?? "";
+          return { src: bytesToDataUrl(data, MIME_OF[ext] ?? "application/octet-stream"), caption: ph.caption ?? null };
+        }
+        return ph;
+      })
+      .filter((p): p is PhotoLike => p !== null);
+  const withPhotos = (rec: unknown) => {
+    const r = rec as { photos?: unknown };
+    return r.photos ? { ...r, photos: reinline(r.photos) } : r;
+  };
+  if (Array.isArray(obj.visits)) obj.visits = obj.visits.map(withPhotos);
+  if (Array.isArray(obj.stories)) obj.stories = obj.stories.map(withPhotos);
+  return JSON.stringify(obj);
+}
diff --git a/apps/postcards/src/features/backup/exportJson.ts b/apps/postcards/src/features/backup/exportJson.ts
index ae2b718..3196b49 100644
--- a/apps/postcards/src/features/backup/exportJson.ts
+++ b/apps/postcards/src/features/backup/exportJson.ts
@@ -14,7 +14,7 @@ import { getReferenceData } from "../../lib/reference/referenceData";
 /** Build the canonical portable file object from the current visits + trips + stories.
  *  `tombstones` is written only for device sync; a plain backup passes none, so the
  *  exported file stays free of an empty `tombstones` key. */
-function buildFile(
+export function buildFile(
   visits: Visit[],
   trips: Trip[] = [],
   stories: Story[] = [],
diff --git a/apps/postcards/src/lib/backup/zip.ts b/apps/postcards/src/lib/backup/zip.ts
new file mode 100644
index 0000000..215f2a0
--- /dev/null
+++ b/apps/postcards/src/lib/backup/zip.ts
@@ -0,0 +1,152 @@
+// A tiny, dependency-free ZIP reader/writer — "store" method only (no
+// compression). Photos are already-compressed JPEG/PNG/WebP, so deflating them
+// would gain nothing; the JSON manifest is small. This keeps the app free of a
+// zip dependency (constitution: open, replaceable, minimal deps) while giving a
+// portable "everything, images included" archive that any OS can open.
+//
+// Pure and synchronous over byte arrays — unit-testable without a DOM. Only the
+// fields we emit are honoured on read; entries using any method other than 0
+// (store) are skipped rather than mis-decoded.
+
+const LOCAL_SIG = 0x04034b50;
+const CENTRAL_SIG = 0x02014b50;
+const EOCD_SIG = 0x06054b50;
+
+export interface ZipEntry {
+  name: string;
+  data: Uint8Array;
+}
+
+// Standard CRC-32 (IEEE 802.3), table built once.
+const CRC_TABLE = (() => {
+  const t = new Uint32Array(256);
+  for (let n = 0; n < 256; n++) {
+    let c = n;
+    for (let k = 0; k < 8; k++) c = c & 1 ? 0xedb88320 ^ (c >>> 1) : c >>> 1;
+    t[n] = c >>> 0;
+  }
+  return t;
+})();
+
+export function crc32(bytes: Uint8Array): number {
+  let c = 0xffffffff;
+  for (let i = 0; i < bytes.length; i++) c = CRC_TABLE[(c ^ bytes[i]!) & 0xff]! ^ (c >>> 8);
+  return (c ^ 0xffffffff) >>> 0;
+}
+
+const utf8 = new TextEncoder();
+
+/** Build a ZIP archive (store method) from a list of named byte blobs. */
+export function zipStore(entries: ZipEntry[]): Uint8Array {
+  const locals: Uint8Array[] = [];
+  const centrals: Uint8Array[] = [];
+  let offset = 0;
+
+  for (const e of entries) {
+    const name = utf8.encode(e.name);
+    const crc = crc32(e.data);
+    const size = e.data.length;
+
+    const local = new Uint8Array(30 + name.length);
+    const lv = new DataView(local.buffer);
+    lv.setUint32(0, LOCAL_SIG, true);
+    lv.setUint16(4, 20, true); // version needed
+    lv.setUint16(6, 0, true); // flags
+    lv.setUint16(8, 0, true); // method: store
+    lv.setUint16(10, 0, true); // mod time
+    lv.setUint16(12, 0x21, true); // mod date (1980-01-01, arbitrary/stable)
+    lv.setUint32(14, crc, true);
+    lv.setUint32(18, size, true); // compressed size
+    lv.setUint32(22, size, true); // uncompressed size
+    lv.setUint16(26, name.length, true);
+    lv.setUint16(28, 0, true); // extra len
+    local.set(name, 30);
+    locals.push(local, e.data);
+
+    const central = new Uint8Array(46 + name.length);
+    const cv = new DataView(central.buffer);
+    cv.setUint32(0, CENTRAL_SIG, true);
+    cv.setUint16(4, 20, true); // version made by
+    cv.setUint16(6, 20, true); // version needed
+    cv.setUint16(8, 0, true);
+    cv.setUint16(10, 0, true);
+    cv.setUint16(12, 0, true);
+    cv.setUint16(14, 0x21, true);
+    cv.setUint32(16, crc, true);
+    cv.setUint32(20, size, true);
+    cv.setUint32(24, size, true);
+    cv.setUint16(28, name.length, true);
+    cv.setUint16(30, 0, true); // extra
+    cv.setUint16(32, 0, true); // comment
+    cv.setUint16(34, 0, true); // disk start
+    cv.setUint16(36, 0, true); // internal attrs
+    cv.setUint32(38, 0, true); // external attrs
+    cv.setUint32(42, offset, true); // local header offset
+    central.set(name, 46);
+    centrals.push(central);
+
+    offset += local.length + e.data.length;
+  }
+
+  const centralSize = centrals.reduce((n, c) => n + c.length, 0);
+  const eocd = new Uint8Array(22);
+  const ev = new DataView(eocd.buffer);
+  ev.setUint32(0, EOCD_SIG, true);
+  ev.setUint16(8, entries.length, true);
+  ev.setUint16(10, entries.length, true);
+  ev.setUint32(12, centralSize, true);
+  ev.setUint32(16, offset, true); // central dir offset
+  ev.setUint16(20, 0, true); // comment len
+
+  const total = offset + centralSize + eocd.length;
+  const out = new Uint8Array(total);
+  let p = 0;
+  for (const part of [...locals, ...centrals, eocd]) {
+    out.set(part, p);
+    p += part.length;
+  }
+  return out;
+}
+
+const utf8dec = new TextDecoder();
+
+/** True if the bytes start with a local-file-header ZIP signature ("PK\003\004"). */
+export function looksLikeZip(bytes: Uint8Array): boolean {
+  return bytes.length >= 4 && bytes[0] === 0x50 && bytes[1] === 0x4b && bytes[2] === 0x03 && bytes[3] === 0x04;
+}
+
+/** Read all stored (method 0) entries by walking the central directory. */
+export function unzipStore(bytes: Uint8Array): ZipEntry[] {
+  const dv = new DataView(bytes.buffer, bytes.byteOffset, bytes.byteLength);
+  // Find the End Of Central Directory record (scan back from the end past any comment).
+  let eocd = -1;
+  for (let i = bytes.length - 22; i >= 0; i--) {
+    if (dv.getUint32(i, true) === EOCD_SIG) {
+      eocd = i;
+      break;
+    }
+  }
+  if (eocd < 0) throw new Error("not a zip archive");
+  const count = dv.getUint16(eocd + 10, true);
+  let p = dv.getUint32(eocd + 16, true); // central dir offset
+  const out: ZipEntry[] = [];
+  for (let i = 0; i < count; i++) {
+    if (dv.getUint32(p, true) !== CENTRAL_SIG) break;
+    const method = dv.getUint16(p + 10, true);
+    const size = dv.getUint32(p + 24, true);
+    const nameLen = dv.getUint16(p + 28, true);
+    const extraLen = dv.getUint16(p + 30, true);
+    const commentLen = dv.getUint16(p + 32, true);
+    const localOff = dv.getUint32(p + 42, true);
+    const name = utf8dec.decode(bytes.subarray(p + 46, p + 46 + nameLen));
+    if (method === 0) {
+      // Jump to the local header to find where the data actually starts.
+      const lNameLen = dv.getUint16(localOff + 26, true);
+      const lExtraLen = dv.getUint16(localOff + 28, true);
+      const dataStart = localOff + 30 + lNameLen + lExtraLen;
+      out.push({ name, data: bytes.subarray(dataStart, dataStart + size) });
+    }
+    p += 46 + nameLen + extraLen + commentLen;
+  }
+  return out;
+}
diff --git a/apps/postcards/src/lib/download.ts b/apps/postcards/src/lib/download.ts
index 1bf56ab..5499659 100644
--- a/apps/postcards/src/lib/download.ts
+++ b/apps/postcards/src/lib/download.ts
@@ -1,6 +1,5 @@
-/** Trigger a browser download of `text` as `filename`, tagged with MIME `type`. */
-export function download(filename: string, text: string, type: string) {
-  const blob = new Blob([text], { type });
+/** Trigger a browser download of `blob` as `filename`. */
+export function downloadBlob(filename: string, blob: Blob) {
   const url = URL.createObjectURL(blob);
   const a = document.createElement("a");
   a.href = url;
@@ -10,3 +9,8 @@ export function download(filename: string, text: string, type: string) {
   // synchronously can cancel it in some browsers).
   setTimeout(() => URL.revokeObjectURL(url), 10_000);
 }
+
+/** Trigger a browser download of `text` as `filename`, tagged with MIME `type`. */
+export function download(filename: string, text: string, type: string) {
+  downloadBlob(filename, new Blob([text], { type }));
+}
diff --git a/apps/postcards/src/lib/i18n/en.ts b/apps/postcards/src/lib/i18n/en.ts
index cda2856..221ced3 100644
--- a/apps/postcards/src/lib/i18n/en.ts
+++ b/apps/postcards/src/lib/i18n/en.ts
@@ -349,10 +349,13 @@ export const en = {
   "backup.reminder.later": "Later",
   "backup.intro":
     "Everything lives in one portable file on your device. Export it to a drive or git, or share it straight to your cloud (Drive, Nextcloud, Files…). Nothing leaves your device unless you export it.",
-  "backup.export.data": "Export data",
+  "backup.export.all": "Save everything (.zip)",
+  "backup.export.data": "Export data (.json)",
   "backup.export.csv": "Export places (.csv)",
   "backup.export.md": "Export summary (.md)",
   "backup.import": "Import…",
+  "backup.msg.exportZipErr": "Couldn't build the archive. Your data is unchanged.",
+  "backup.msg.zipUnreadable": "Couldn't read this archive — it may be incomplete.",
   "backup.msg.exportJsonErr": "Couldn't build the export file. Your data is unchanged.",
   "backup.msg.exportMdErr": "Couldn't build the summary file. Your data is unchanged.",
   "backup.msg.exportCsvErr": "Couldn't build the places file. Your data is unchanged.",
diff --git a/apps/postcards/src/lib/i18n/fr.ts b/apps/postcards/src/lib/i18n/fr.ts
index 16f6e06..f36ecbd 100644
--- a/apps/postcards/src/lib/i18n/fr.ts
+++ b/apps/postcards/src/lib/i18n/fr.ts
@@ -343,10 +343,13 @@ export const fr: Messages = {
   "backup.reminder.later": "Plus tard",
   "backup.intro":
     "Tout se trouve dans un seul fichier portable sur votre appareil. Exportez-le vers un disque ou git, ou partagez-le directement vers votre cloud (Drive, Nextcloud, Fichiers…). Rien ne quitte votre appareil tant que vous ne l'exportez pas.",
-  "backup.export.data": "Exporter les données",
+  "backup.export.all": "Tout sauvegarder (.zip)",
+  "backup.export.data": "Exporter les données (.json)",
   "backup.export.csv": "Exporter les lieux (.csv)",
   "backup.export.md": "Exporter le résumé (.md)",
   "backup.import": "Importer…",
+  "backup.msg.exportZipErr": "Impossible de créer l'archive. Vos données sont inchangées.",
+  "backup.msg.zipUnreadable": "Impossible de lire cette archive — elle est peut-être incomplète.",
   "backup.msg.exportJsonErr": "Impossible de créer le fichier d'export. Vos données sont inchangées.",
   "backup.msg.exportMdErr": "Impossible de créer le fichier de résumé. Vos données sont inchangées.",
   "backup.msg.exportCsvErr": "Impossible de créer le fichier des lieux. Vos données sont inchangées.",
diff --git a/apps/postcards/src/lib/i18n/ko.ts b/apps/postcards/src/lib/i18n/ko.ts
index 33f3cfc..3bd0de4 100644
--- a/apps/postcards/src/lib/i18n/ko.ts
+++ b/apps/postcards/src/lib/i18n/ko.ts
@@ -343,10 +343,13 @@ export const ko: Messages = {
   "backup.reminder.later": "나중에",
   "backup.intro":
     "모든 것이 기기의 휴대 가능한 파일 하나에 들어 있습니다. 드라이브나 git으로 내보내거나 클라우드(Drive, Nextcloud, 파일 등)로 바로 공유하세요. 내보내기 전에는 아무것도 기기를 떠나지 않습니다.",
-  "backup.export.data": "데이터 내보내기",
+  "backup.export.all": "모두 저장 (.zip)",
+  "backup.export.data": "데이터 내보내기 (.json)",
   "backup.export.csv": "장소 내보내기 (.csv)",
   "backup.export.md": "요약 내보내기 (.md)",
   "backup.import": "가져오기…",
+  "backup.msg.exportZipErr": "아카이브를 만들 수 없습니다. 데이터는 변경되지 않았습니다.",
+  "backup.msg.zipUnreadable": "이 아카이브를 읽을 수 없습니다 — 불완전할 수 있습니다.",
   "backup.msg.exportJsonErr": "내보내기 파일을 만들 수 없습니다. 데이터는 변경되지 않았습니다.",
   "backup.msg.exportMdErr": "요약 파일을 만들 수 없습니다. 데이터는 변경되지 않았습니다.",
   "backup.msg.exportCsvErr": "장소 파일을 만들 수 없습니다. 데이터는 변경되지 않았습니다.",
diff --git a/apps/postcards/tests/unit/archiveZip.spec.ts b/apps/postcards/tests/unit/archiveZip.spec.ts
new file mode 100644
index 0000000..0c05c01
--- /dev/null
+++ b/apps/postcards/tests/unit/archiveZip.spec.ts
@@ -0,0 +1,94 @@
+import { describe, it, expect } from "vitest";
+import { zipStore, unzipStore, looksLikeZip, crc32 } from "../../src/lib/backup/zip";
+import { buildArchive, archiveToJson, MANIFEST_NAME } from "../../src/features/backup/archiveZip";
+import { importFile } from "../../src/features/backup/importJson";
+import type { Visit } from "../../src/lib/schema/models";
+
+const enc = (s: string) => new TextEncoder().encode(s);
+const dec = (b: Uint8Array) => new TextDecoder().decode(b);
+
+// A valid 1×1 PNG as an inline data URL (same fixture the backup tests use).
+const dataUrl =
+  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAAC0lEQVR42mP8z8BQDwAEhQGAhKmMIQAAAABJRU5ErkJggg==";
+
+function visit(): Visit {
+  return {
+    visitId: crypto.randomUUID(),
+    place: { kind: "city", id: "paris-fr", name: "Paris", countryId: "FR" },
+    date: "2019-08-12",
+    note: null,
+    status: "visited",
+    favorite: false,
+    addedAt: new Date().toISOString(),
+  };
+}
+
+describe("zip codec (store method)", () => {
+  it("round-trips names and bytes", () => {
+    const files = [
+      { name: MANIFEST_NAME, data: enc('{"hello":"world"}') },
+      { name: "photos/0001.png", data: new Uint8Array([0, 1, 2, 255, 254, 128]) },
+      { name: "photos/0002.bin", data: new Uint8Array(0) }, // empty file is fine
+    ];
+    const zip = zipStore(files);
+    expect(looksLikeZip(zip)).toBe(true);
+    const out = unzipStore(zip);
+    expect(out.map((e) => e.name)).toEqual(files.map((f) => f.name));
+    expect(dec(out[0]!.data)).toBe('{"hello":"world"}');
+    expect([...out[1]!.data]).toEqual([0, 1, 2, 255, 254, 128]);
+    expect(out[2]!.data.length).toBe(0);
+  });
+
+  it("crc32 matches the known IEEE value for a standard string", () => {
+    // crc32("The quick brown fox jumps over the lazy dog") = 0x414FA339
+    expect(crc32(enc("The quick brown fox jumps over the lazy dog")) >>> 0).toBe(0x414fa339);
+  });
+
+  it("looksLikeZip is false for plain JSON/text", () => {
+    expect(looksLikeZip(enc('{"format":"postcards"}'))).toBe(false);
+  });
+});
+
+describe('"Save everything" archive round-trip (data + photos-as-files)', () => {
+  it("stores photos as separate image FILES and a photo-less manifest, then restores identically", () => {
+    const original: Visit[] = [
+      { ...visit(), photos: [{ src: dataUrl, caption: "the tower" }, { src: dataUrl, caption: null }] },
+    ];
+    const bytes = buildArchive(original, [], []);
+    const entries = unzipStore(bytes);
+
+    // The manifest exists and carries NO inline base64 — photos became file refs.
+    const manifest = entries.find((e) => e.name === MANIFEST_NAME)!;
+    const manifestText = dec(manifest.data);
+    expect(manifestText).not.toContain("base64,");
+    expect(manifestText).toContain("zip:photos/");
+
+    // The images live as real files.
+    const photoFiles = entries.filter((e) => e.name.startsWith("photos/"));
+    expect(photoFiles).toHaveLength(2);
+    expect(photoFiles[0]!.name).toBe("photos/0001.png");
+
+    // Unpack → standard JSON → validate → photos are byte-identical to the originals.
+    const json = archiveToJson(bytes);
+    expect(json).toContain("base64,"); // re-inlined
+    const result = importFile(json);
+    expect(result.ok).toBe(true);
+    if (result.ok) {
+      expect(result.visits[0]!.photos).toEqual([
+        { src: dataUrl, caption: "the tower" },
+        { src: dataUrl, caption: null },
+      ]);
+    }
+  });
+
+  it("drops a photo whose image file is missing rather than breaking the restore", () => {
+    const original: Visit[] = [{ ...visit(), photos: [{ src: dataUrl, caption: null }] }];
+    const bytes = buildArchive(original, [], []);
+    // Rebuild the archive WITHOUT the photo file, keeping only the manifest.
+    const entries = unzipStore(bytes).filter((e) => e.name === MANIFEST_NAME);
+    const stripped = zipStore(entries.map((e) => ({ name: e.name, data: e.data })));
+    const result = importFile(archiveToJson(stripped));
+    expect(result.ok).toBe(true);
+    if (result.ok) expect(result.visits[0]!.photos ?? []).toHaveLength(0);
+  });
+});