chore: release v0.1.0.27

Bestehende Ereigniszeilen lassen sich nachträglich ändern; beim Speichern
oder Löschen wird nur die Skipper-Unterschrift entfernt, die Crew-Signatur bleibt.

Co-authored-by: Cursor <cursoragent@cursor.com>

README.md

@@ -0,0 +1,180 @@
+# Kapteins Daagbok
+
+Digitales Yacht-Logbuch als Progressive Web App (PWA) — offline-fähig, End-to-End-verschlüsselt und mit Passkey-Anmeldung.
+
+**Live:** [kapteins-daagbok.eu](https://kapteins-daagbok.eu)
+
+## Überblick
+
+Kapteins Daagbok richtet sich an private Skipper und Yachtbesitzer, die ihr Bordlogbuch digital führen möchten. Die App speichert Schiffsdaten, Crew-Profile und Reisetage (Törns) in einem Format, das an übliche nautische Logbuch-Vorlagen angelehnt ist.
+
+Alle sensiblen Inhalte werden **clientseitig verschlüsselt** (Web Crypto API). Der Server sieht nur ciphertext — eine Zero-Knowledge-Architektur. Daten liegen zusätzlich lokal in IndexedDB (Dexie.js) und synchronisieren im Hintergrund, sodass die App **auch offline** auf See nutzbar ist.
+
+## Funktionen
+
+- **Passkey-Authentifizierung** (WebAuthn) mit optionaler Recovery-Phrase und lokalem PIN-Fallback
+- **Mehrere Logbücher** pro Benutzerkonto — eigene Logbücher und per Einladung geteilte Logbücher (Crew-Zugang) klar getrennt
+- **Reisetage** mit Hafen, Wetter, Tankständen, Ereignissen und Tagesnummer
+- **GPS-Tracks** (GPX/KML/GeoJSON-Upload, Karte, Statistiken)
+- **Foto-Anhänge** pro Reisetag
+- **Passkey-Signaturen** für Skipper und Crew (hybride elektronische Signatur)
+- **Schiffsdaten** und **Crew-Profile** (Skipper + Mitglieder)
+- **Statistik-Dashboard** — Strecken, Verbrauch, Segel/Motor, Hafenkette (pro Logbuch oder accountweit)
+- **Kollaboration** — Crew per Einladungslink einladen (Schreib- oder Lesezugriff)
+- **Read-only-Freigabe** — öffentlicher Lese-Link für Dritte
+- **Export** — PDF pro Reisetag, CSV-Download/-Teilen
+- **Backup & Wiederherstellung** — vollständiges verschlüsseltes Logbuch-Backup (Einträge, Fotos, GPS, Crew, Schiff) als `.daagbok.json`; Restore auf gleichem oder neuem Account
+- **PWA** — installierbar auf iOS/Android, Offline-Modus, Update-Hinweise
+- **Mehrsprachig** — Deutsch und Englisch
+- **Demo-Logbuch & Onboarding-Tour** für neue Nutzer
+
+## Architektur
+
+```
+┌─────────────────┐     HTTPS/API        ┌─────────────────┐
+│  React PWA      │ ◄──────────────────► │  Express API    │
+│  Vite + Dexie   │   (nur ciphertext)   │  Prisma + PG    │
+│  IndexedDB      │                      │  PostgreSQL     │
+└─────────────────┘                      └─────────────────┘
+```
+
+| Schicht | Technologie |
+|---------|-------------|
+| Frontend | React 19, TypeScript, Vite, vite-plugin-pwa |
+| Lokaler Speicher | Dexie.js (IndexedDB), Hintergrund-Sync |
+| Backend | Node.js, Express, Prisma |
+| Datenbank | PostgreSQL 16 |
+| Auth | WebAuthn (Passkeys) via `@simplewebauthn` |
+| Krypto | Web Crypto API (AES-GCM), BIP39 Recovery |
+
+### Rollen & Zugriff
+
+| Rolle | Bedeutung |
+|-------|-----------|
+| **Owner** | Logbuch angelegt; voller Zugriff, Einladungen, Backup, Löschen |
+| **Collaborator (WRITE)** | Per Einladung; Einträge bearbeiten und als Crew signieren |
+| **Collaborator (READ)** | Nur Lesen (z. B. öffentlicher Share-Link) |
+
+Skipper- und Crew-Profile im Logbuch sind **Inhaltsdaten** (verschlüsselt), nicht an den Account gebunden. Ein Account kann gleichzeitig Owner eines eigenen und Collaborator in fremden Logbüchern sein.
+
+## Backup & Wiederherstellung
+
+Nur der **Logbuch-Eigner** kann unter **Einstellungen → Backup & Wiederherstellung** ein vollständiges Backup erstellen:
+
+1. Backup-Passphrase wählen (min. 8 Zeichen, getrennt von der Datei aufbewahren)
+2. Download als `.daagbok.json` — enthält alle verschlüsselten Payloads inkl. **Fotos** und GPS-Tracks
+3. **Wiederherstellen** in einem beliebigen Account (nach Registrierung/Login): Datei + Passphrase
+
+Vor dem Löschen eines Logbuchs weist die App auf diese Funktion hin. Crew-Einladungen und Passkey-Signaturen werden nicht mitübertragen — Inhalte bleiben lesbar, Signaturen auf neuem Account ggf. nicht mehr verifizierbar.
+
+## Projektstruktur
+
+```
+kapteins-daagbok/
+├── client/              # React-PWA (Frontend)
+│   ├── src/
+│   │   ├── components/  # UI-Komponenten
+│   │   ├── services/    # Auth, Sync, Krypto, Backup, Analytics, …
+│   │   └── i18n/        # DE/EN-Übersetzungen
+│   └── Dockerfile       # Nginx-Produktions-Image
+├── server/              # Express-API + Prisma
+│   ├── src/routes/      # auth, logbooks, sync, collaboration, sign
+│   └── prisma/          # Datenbankschema
+├── docs/                # Projektdokumentation (z. B. Plausible Events)
+├── scripts/             # Dev- und Deploy-Skripte
+├── docker-compose.yml   # Produktions-Stack (DB + Backend + Frontend)
+└── VERSION              # App-Version (Build & Footer)
+```
+
+## Voraussetzungen
+
+- **Node.js** 20+
+- **npm**
+- **Docker** (für PostgreSQL in der Entwicklung oder den vollständigen Stack)
+- Optional: OpenWeatherMap-API-Key (Wetter-Abruf in den Einstellungen)
+
+## Lokale Entwicklung
+
+### 1. Abhängigkeiten installieren
+
+```bash
+cd server && npm ci && cd ..
+cd client && npm ci && cd ..
+```
+
+### 2. Umgebungsvariablen
+
+```bash
+cp .env.example .env
+```
+
+Für lokale Passkeys: `RP_ID=localhost`, `ORIGIN=http://localhost:5173` (bzw. die tatsächliche Frontend-URL).
+
+Im `server/`-Verzeichnis eine `.env` mit `DATABASE_URL` anlegen, z. B.:
+
+```
+DATABASE_URL="postgresql://postgres:postgres@localhost:5432/daagbox?schema=public"
+RP_ID=localhost
+ORIGIN=http://localhost:5173
+```
+
+### 3. Datenbank & Schema
+
+Das Dev-Skript startet PostgreSQL in Docker (`postgres-daagbox`). Schema anwenden:
+
+```bash
+cd server && npx prisma db push && cd ..
+```
+
+### 4. Dev-Server starten
+
+```bash
+./scripts/start-dev.sh
+```
+
+| Dienst | URL |
+|--------|-----|
+| Frontend (Vite) | http://localhost:5173 |
+| Backend API | http://localhost:5000 |
+| Health Check | http://localhost:5000/api/health |
+
+## Docker (produktionsnah)
+
+Gesamten Stack lokal bauen und starten:
+
+```bash
+./scripts/start-dev-docker.sh
+```
+
+Frontend: http://localhost · API: http://localhost/api/health
+
+Umgebungsvariablen für Passkeys in `.env` setzen (`RP_ID`, `ORIGIN`).
+
+## Deployment
+
+Produktions-Update auf den Server (konfigurierbar via Umgebungsvariablen):
+
+```bash
+./scripts/update-prod.sh
+```
+
+Standard-Ziel: `root@10.0.0.25:/opt/kapteins-daagbok` — per `REMOTE_HOST`, `REMOTE_USER`, `REMOTE_DIR` überschreibbar.
+
+## Dokumentation
+
+| Dokument | Inhalt |
+|----------|--------|
+| [docs/plausible-events.md](docs/plausible-events.md) | Custom Events für Plausible Analytics |
+| [.planning/PROJECT.md](.planning/PROJECT.md) | Produktvision und Anforderungen (GSD) |
+
+## Analytics
+
+Die App nutzt [Plausible Analytics](https://plausible.io/) (self-hosted) für anonyme Nutzungsmetriken — ohne Cookies und ohne personenbezogene Daten in Event-Properties. Details und Goal-Namen: [docs/plausible-events.md](docs/plausible-events.md).
+
+## Version
+
+Aktuelle Version: siehe [VERSION](VERSION) (wird im App-Footer und beim Docker-Build eingebunden).
+
+---
+
+© 2026 KnorrLabs/Markus F.J. Busche · [kapteins-daagbok.eu](https://kapteins-daagbok.eu)

VERSION

@@ -1 +1 @@
-0.1.0.8
+0.1.0.28

client/index.html

@@ -1,16 +1,37 @@
 <!doctype html>
-<html lang="en">
+<html lang="de">
   <head>
     <meta charset="UTF-8" />
     <link rel="icon" type="image/svg+xml" href="/favicon.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta name="description" content="Digitales Yacht-Logbuch mit End-to-End-Verschlüsselung und Passkey-Anmeldung. Reisetage, GPS-Tracks, Crew und Schiffsdaten sicher dokumentieren – auch offline als PWA." />
+    <meta name="keywords" content="Yacht-Logbuch, Schiffstagebuch, Bordlogbuch, Segeln, Passkey, E2E-Verschlüsselung, GPS-Track, maritimes Logbuch" />
+    <meta name="author" content="Markus F.J. Busche" />
+    <meta name="robots" content="index, follow" />
+    <meta name="application-name" content="Kapteins Daagbok" />
+    <link rel="canonical" href="https://kapteins-daagbok.eu/" />
     <meta name="mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-capable" content="yes" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
     <meta name="apple-mobile-web-app-title" content="Daagbok" />
     <meta name="theme-color" content="#1e293b" />
     <link rel="apple-touch-icon" href="/logo.png" />
-    <title>Kapteins Daagbok</title>
+    <meta property="og:type" content="website" />
+    <meta property="og:site_name" content="Kapteins Daagbok" />
+    <meta property="og:title" content="Kapteins Daagbok – Digitales Yacht-Logbuch" />
+    <meta property="og:description" content="Sicheres, E2E-verschlüsseltes Logbuch für Skipper: Reisetage, GPS-Tracks, Crew- und Schiffsdaten – mit Passkey-Anmeldung und Offline-PWA." />
+    <meta property="og:url" content="https://kapteins-daagbok.eu/" />
+    <meta property="og:image" content="https://kapteins-daagbok.eu/logo.png" />
+    <meta property="og:image:alt" content="Kapteins Daagbok Logo" />
+    <meta property="og:locale" content="de_DE" />
+    <meta property="og:locale:alternate" content="en_US" />
+    <meta name="twitter:card" content="summary" />
+    <meta name="twitter:title" content="Kapteins Daagbok – Digitales Yacht-Logbuch" />
+    <meta name="twitter:description" content="Sicheres, E2E-verschlüsseltes Logbuch für Skipper: Reisetage, GPS-Tracks, Crew- und Schiffsdaten – mit Passkey-Anmeldung und Offline-PWA." />
+    <meta name="twitter:image" content="https://kapteins-daagbok.eu/logo.png" />
+    <meta name="twitter:image:alt" content="Kapteins Daagbok Logo" />
+    <script defer data-domain="kapteins-daagbok.eu" src="https://plausible.elpatron.me/js/script.tagged-events.js"></script>
+    <title>Kapteins Daagbok – Digitales Yacht-Logbuch</title>
   </head>
   <body>
     <div id="root"></div>

client/package-lock.json

@@ -36,6 +36,9 @@
         "typescript-eslint": "^8.59.2",
         "vite": "^8.0.12",
         "vite-plugin-pwa": "^1.3.0"
+      },
+      "optionalDependencies": {
+        "@rolldown/binding-linux-x64-gnu": "^1.0.2"
       }
     },
     "node_modules/@apideck/better-ajv-errors": {
@@ -2096,7 +2099,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [

client/package.json

@@ -38,5 +38,8 @@
     "typescript-eslint": "^8.59.2",
     "vite": "^8.0.12",
     "vite-plugin-pwa": "^1.3.0"
+  },
+  "optionalDependencies": {
+    "@rolldown/binding-linux-x64-gnu": "^1.0.2"
   }
 }

client/src/App.css

@@ -839,6 +839,42 @@ html.scheme-dark .themed-select-option.is-selected {
   background: var(--app-surface-hover);
 }
 
+.logbook-card--shared {
+  border-left: 3px solid #38bdf8;
+}
+
+.logbook-sections {
+  display: flex;
+  flex-direction: column;
+  gap: 28px;
+}
+
+.logbook-section-header h3 {
+  margin: 0 0 6px;
+  font-size: 15px;
+  font-weight: 600;
+  color: var(--app-text-heading);
+}
+
+.logbook-section-hint {
+  margin: 0 0 14px;
+  font-size: 13px;
+  line-height: 1.45;
+  color: var(--app-text-muted);
+  max-width: 52rem;
+}
+
+.card-title-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 8px;
+}
+
+.card-title-row h3 {
+  margin: 0;
+}
+
 .card-icon {
   background: var(--app-accent-bg);
   color: var(--app-accent-light);
@@ -895,6 +931,44 @@ html.scheme-dark .themed-select-option.is-selected {
   color: var(--app-text-subtle);
 }
 
+.entry-sign-badge {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 2px 8px;
+  border-radius: 999px;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  white-space: nowrap;
+}
+
+.entry-sign-badge--skipper.valid {
+  color: #86efac;
+  background: rgba(34, 197, 94, 0.12);
+  border: 1px solid rgba(34, 197, 94, 0.25);
+  padding: 3px 7px;
+}
+
+.entry-sign-badge--skipper.invalid {
+  color: #fde68a;
+  background: rgba(251, 191, 36, 0.12);
+  border: 1px solid rgba(251, 191, 36, 0.28);
+}
+
+.entry-sign-badge__sr-label {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
 .btn-delete {
   background: none;
   border: none;
@@ -999,6 +1073,13 @@ html.scheme-dark .themed-select-option.is-selected {
   color: var(--app-text-heading);
 }
 
+.app-title-row {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 10px;
+}
+
 .app-title-area .app-subtitle {
   font-size: 12px;
   color: var(--app-text-muted);
@@ -1349,6 +1430,18 @@ html.scheme-dark .themed-select-option.is-selected {
   vertical-align: middle;
 }
 
+.events-actions-td {
+  white-space: nowrap;
+}
+
+.events-actions-td .btn-icon {
+  margin-left: 4px;
+}
+
+.events-actions-td .btn-icon:first-child {
+  margin-left: 0;
+}
+
 .events-table tbody tr:hover {
   background: rgba(255, 255, 255, 0.02);
 }
@@ -2109,6 +2202,325 @@ html.theme-cupertino .events-scroll-container {
   background: rgba(255, 255, 255, 0.8);
 }
 
+/* --- Statistics dashboard --- */
+.stats-subtitle {
+  margin: 4px 0 0;
+  font-size: 14px;
+  color: var(--app-text-muted);
+  font-weight: 400;
+}
+
+.stats-scope-toggle {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin-top: 20px;
+}
+
+.stats-scope-toggle .btn {
+  width: auto;
+  padding: 10px 18px;
+}
+
+.stats-kpi-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 14px;
+  margin-top: 24px;
+}
+
+.stats-kpi-card {
+  display: flex;
+  align-items: flex-start;
+  gap: 12px;
+  padding: 16px;
+  border-radius: var(--app-radius-card);
+  border: 1px solid var(--app-border-subtle);
+}
+
+.stats-kpi-icon {
+  color: var(--app-accent-light);
+  flex-shrink: 0;
+  margin-top: 2px;
+}
+
+.stats-kpi-label {
+  display: block;
+  font-size: 12px;
+  color: var(--app-text-muted);
+  margin-bottom: 4px;
+}
+
+.stats-kpi-value {
+  font-size: 22px;
+  font-weight: 700;
+  line-height: 1.2;
+  color: var(--app-text-primary);
+}
+
+.stats-kpi-unit {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--app-text-muted);
+  margin-left: 4px;
+}
+
+.stats-section-title {
+  margin: 0 0 8px;
+  font-size: 17px;
+  font-weight: 600;
+}
+
+.stats-section-sub {
+  margin: 0 0 16px;
+  font-size: 13px;
+  color: var(--app-text-muted);
+}
+
+.stats-route-chain {
+  margin: 0;
+  font-size: 15px;
+  line-height: 1.6;
+  color: var(--app-text-primary);
+}
+
+.stats-route-arrow {
+  color: var(--app-accent-light);
+  font-weight: 600;
+}
+
+.stats-multi-track-map {
+  min-height: 320px;
+}
+
+.stats-track-legend {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px 18px;
+  margin-top: 12px;
+  font-size: 13px;
+  color: var(--app-text-muted);
+}
+
+.stats-track-legend-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.stats-track-legend-swatch {
+  width: 14px;
+  height: 14px;
+  border-radius: 3px;
+  flex-shrink: 0;
+}
+
+.stats-bar-chart {
+  display: flex;
+  align-items: flex-end;
+  gap: 8px;
+  min-height: 180px;
+  padding-top: 8px;
+  overflow-x: auto;
+}
+
+.stats-bar-column {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  min-width: 52px;
+  flex: 1 0 52px;
+}
+
+.stats-bar-column--grouped {
+  min-width: 44px;
+}
+
+.stats-bar-value {
+  font-size: 10px;
+  color: var(--app-text-muted);
+  min-height: 14px;
+  margin-bottom: 4px;
+}
+
+.stats-bar-track {
+  width: 100%;
+  max-width: 36px;
+  height: 120px;
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+  background: var(--app-surface-muted);
+  border-radius: 6px 6px 2px 2px;
+  overflow: hidden;
+}
+
+.stats-bar-track--short {
+  max-width: 14px;
+  height: 100px;
+}
+
+.stats-bar {
+  width: 100%;
+  border-radius: 4px 4px 0 0;
+  min-height: 2px;
+  transition: height 0.2s ease;
+}
+
+.stats-bar--distance {
+  background: linear-gradient(180deg, var(--app-accent-light), var(--app-accent));
+}
+
+.stats-bar--fuel {
+  background: linear-gradient(180deg, #fbbf24, #d97706);
+}
+
+.stats-bar--water {
+  background: linear-gradient(180deg, #38bdf8, #0284c7);
+}
+
+.stats-bar-label {
+  margin-top: 8px;
+  font-size: 11px;
+  color: var(--app-text-muted);
+  text-align: center;
+}
+
+.stats-bar-sublabel {
+  font-size: 10px;
+  color: var(--app-text-muted);
+  opacity: 0.85;
+}
+
+.stats-bar-group {
+  display: flex;
+  gap: 4px;
+  align-items: flex-end;
+  height: 100px;
+}
+
+.stats-consumption-chart {
+  flex-direction: column;
+  align-items: stretch;
+  min-height: auto;
+}
+
+.stats-consumption-chart .stats-bar-column--grouped {
+  display: inline-flex;
+  vertical-align: bottom;
+}
+
+.stats-consumption-chart {
+  display: block;
+  overflow-x: auto;
+  white-space: nowrap;
+  padding-bottom: 8px;
+}
+
+.stats-consumption-chart .stats-bar-column--grouped {
+  display: inline-flex;
+  white-space: normal;
+}
+
+.stats-consumption-legend {
+  display: flex;
+  gap: 20px;
+  margin-top: 16px;
+  font-size: 13px;
+  color: var(--app-text-muted);
+}
+
+.stats-consumption-legend span {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+
+.stats-legend-swatch {
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+  border-radius: 2px;
+}
+
+.stats-propulsion-bar {
+  display: flex;
+  width: 100%;
+  height: 18px;
+  border-radius: 999px;
+  overflow: hidden;
+  background: var(--app-surface-muted);
+}
+
+.stats-propulsion-segment--sail {
+  background: var(--app-accent);
+}
+
+.stats-propulsion-segment--motor {
+  background: #d97706;
+}
+
+.stats-propulsion-segment--unknown {
+  background: var(--app-text-muted);
+  opacity: 0.45;
+}
+
+.stats-propulsion-labels {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 12px 20px;
+  margin-top: 12px;
+  font-size: 13px;
+  color: var(--app-text-primary);
+}
+
+.stats-hint {
+  margin: 12px 0 0;
+  font-size: 12px;
+  color: var(--app-text-muted);
+}
+
+.stats-account-table-wrap {
+  overflow-x: auto;
+}
+
+.stats-account-table {
+  width: 100%;
+  border-collapse: collapse;
+  font-size: 14px;
+}
+
+.stats-account-table th,
+.stats-account-table td {
+  padding: 10px 12px;
+  text-align: left;
+  border-bottom: 1px solid var(--app-border-subtle);
+}
+
+.stats-account-table th {
+  font-size: 12px;
+  font-weight: 600;
+  color: var(--app-text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.03em;
+}
+
+@media (max-width: 1024px) {
+  .stats-kpi-grid {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 640px) {
+  .stats-kpi-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .stats-kpi-value {
+    font-size: 20px;
+  }
+}
+
 .signature-grid {
   align-items: start;
 }
@@ -2656,6 +3068,96 @@ html.theme-cupertino .events-scroll-container {
   border: 1px solid rgba(251, 191, 36, 0.25);
 }
 
+.role-badge {
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+  padding: 2px 8px;
+  border-radius: 999px;
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.01em;
+  white-space: nowrap;
+}
+
+.role-badge--owner {
+  color: #86efac;
+  background: rgba(34, 197, 94, 0.12);
+  border: 1px solid rgba(34, 197, 94, 0.25);
+}
+
+.role-badge--crew {
+  color: #7dd3fc;
+  background: rgba(56, 189, 248, 0.12);
+  border: 1px solid rgba(56, 189, 248, 0.28);
+}
+
+.role-badge--read {
+  color: #cbd5e1;
+  background: rgba(148, 163, 184, 0.12);
+  border: 1px solid rgba(148, 163, 184, 0.25);
+}
+
+.backup-panel .backup-section {
+  margin-bottom: 28px;
+  padding-bottom: 24px;
+  border-bottom: 1px solid var(--app-border-subtle);
+}
+
+.backup-panel .backup-section--import {
+  margin-bottom: 0;
+  padding-bottom: 0;
+  border-bottom: none;
+}
+
+.backup-section-title {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin: 0 0 8px;
+  font-size: 14px;
+  font-weight: 600;
+  color: var(--app-text-heading);
+}
+
+.backup-section-desc {
+  font-size: 13px;
+  margin: 0 0 14px;
+}
+
+.backup-actions-row {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 10px;
+  margin-top: 12px;
+}
+
+.backup-preview {
+  margin-top: 16px;
+  padding: 14px 16px;
+  border-radius: var(--app-radius-card);
+  border: 1px solid var(--app-border-subtle);
+}
+
+.backup-preview-title {
+  margin: 0 0 10px;
+  font-size: 16px;
+  font-weight: 600;
+  color: var(--app-text-heading);
+}
+
+.backup-preview-stats {
+  margin: 0 0 8px;
+  padding-left: 18px;
+  font-size: 13px;
+  color: var(--app-text-muted);
+}
+
+.backup-preview-date {
+  margin: 0;
+  font-size: 12px;
+}
+
 .app-tour-root {
   position: fixed;
   inset: 0;

client/src/App.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect } from 'react'
+import { useState, useEffect, useCallback } from 'react'
 import './App.css'
 import { DialogProvider } from './components/ModalDialog.tsx'
 import AuthOnboarding from './components/AuthOnboarding.tsx'
@@ -8,11 +8,13 @@ import CrewForm from './components/CrewForm.tsx'
 // Compass Deviation Table — für Freizeit-Skipper vorerst deaktiviert (Komponente bleibt erhalten)
 // import DeviationForm from './components/DeviationForm.tsx'
 import LogEntriesList from './components/LogEntriesList.tsx'
+import StatsDashboard from './components/StatsDashboard.tsx'
 import SettingsForm from './components/SettingsForm.tsx'
 import InvitationAcceptance from './components/InvitationAcceptance.tsx'
 import AppTourOverlay from './components/AppTourOverlay.tsx'
 import { AppTourProvider, useAppTour, type AppTab } from './context/AppTourContext.tsx'
 import { getActiveMasterKey, logoutUser } from './services/auth.js'
+import { PlausibleEvents, trackPlausibleEvent } from './services/analytics.js'
 import {
   applyAppearanceToDocument,
   resolveAppTheme,
@@ -21,12 +23,16 @@ import {
 } from './services/appearance.js'
 import { startBackgroundSync, stopBackgroundSync, syncAllLogbooks, subscribeToSyncState } from './services/sync.js'
 import ReadOnlyViewer from './components/ReadOnlyViewer.tsx'
+import DemoViewer from './components/DemoViewer.tsx'
 import PwaInstallPrompt from './components/PwaInstallPrompt.tsx'
 import PwaUpdatePrompt from './components/PwaUpdatePrompt.tsx'
 import AppFooter from './components/AppFooter.tsx'
+import LogbookRoleBadge from './components/LogbookRoleBadge.tsx'
 import { db } from './services/db.js'
+import { getLogbookAccess } from './services/logbookAccess.js'
+import type { LogbookAccessRole } from './services/logbook.js'
 import { useLiveQuery } from 'dexie-react-hooks'
-import { Ship, LogOut, ChevronLeft, Users, FileText, Settings, Wifi, WifiOff, Languages } from 'lucide-react'
+import { Ship, LogOut, ChevronLeft, Users, FileText, Settings, Wifi, WifiOff, Languages, BarChart2 } from 'lucide-react'
 import DisclaimerHeaderButton from './components/DisclaimerHeaderButton.tsx'
 import { useTranslation } from 'react-i18next'
 import {
@@ -52,11 +58,42 @@ function App() {
   const [shareToken, setShareToken] = useState('')
   const [shareKey, setShareKey] = useState('')
 
+  // Public demo mode (no account required)
+  const [isDemoMode, setIsDemoMode] = useState(() => window.location.pathname === '/demo')
+
   const syncQueueCount = useLiveQuery(
     () => activeLogbookId ? db.syncQueue.where({ logbookId: activeLogbookId }).count() : db.syncQueue.count(),
     [activeLogbookId]
   )
 
+  const activeLogbookRecord = useLiveQuery(
+    () => (activeLogbookId ? db.logbooks.get(activeLogbookId) : undefined),
+    [activeLogbookId]
+  )
+
+  const [activeAccessRole, setActiveAccessRole] = useState<LogbookAccessRole>('OWNER')
+
+  useEffect(() => {
+    if (!activeLogbookId) {
+      setActiveAccessRole('OWNER')
+      return
+    }
+
+    if (activeLogbookRecord?.isShared !== 1) {
+      setActiveAccessRole('OWNER')
+      return
+    }
+
+    const cachedRole = activeLogbookRecord.collaborationRole
+    if (cachedRole) {
+      setActiveAccessRole(cachedRole)
+    }
+
+    getLogbookAccess(activeLogbookId).then((access) => {
+      if (access) setActiveAccessRole(access.role)
+    })
+  }, [activeLogbookId, activeLogbookRecord])
+
   useEffect(() => {
     const syncAppearance = () => {
       applyAppearanceToDocument(resolveAppTheme(), resolveColorScheme())
@@ -101,21 +138,37 @@ function App() {
     }
   }, [isAuthenticated])
 
-  useEffect(() => {
+  const syncRouteFromLocation = useCallback(() => {
     const params = new URLSearchParams(window.location.search)
     const hashParams = new URLSearchParams(window.location.hash.substring(1))
+    const path = window.location.pathname
 
-    if (window.location.pathname === '/share' && params.has('token') && hashParams.has('key')) {
-      setShareToken(params.get('token') || '')
-      setShareKey(hashParams.get('key') || '')
-      setIsViewerMode(true)
+    if (path === '/demo') {
+      setIsDemoMode(true)
+      setIsViewerMode(false)
+      setIsAcceptingInvite(false)
       return
     }
 
+    setIsDemoMode(false)
+
+    if (path === '/share' && params.has('token') && hashParams.has('key')) {
+      setShareToken(params.get('token') || '')
+      setShareKey(hashParams.get('key') || '')
+      setIsViewerMode(true)
+      setIsAcceptingInvite(false)
+      return
+    }
+
+    setIsViewerMode(false)
+
     if (params.has('token')) {
       setIsAcceptingInvite(true)
+      return
     }
 
+    setIsAcceptingInvite(false)
+
     const savedUser = localStorage.getItem('active_username')
     const key = getActiveMasterKey()
     if (savedUser && key) {
@@ -129,6 +182,19 @@ function App() {
     }
   }, [])
 
+  useEffect(() => {
+    syncRouteFromLocation()
+    window.addEventListener('popstate', syncRouteFromLocation)
+    return () => window.removeEventListener('popstate', syncRouteFromLocation)
+  }, [syncRouteFromLocation])
+
+  const openDemo = useCallback(() => {
+    window.history.pushState({}, document.title, '/demo')
+    setIsDemoMode(true)
+    setIsViewerMode(false)
+    setIsAcceptingInvite(false)
+  }, [])
+
   useEffect(() => {
     registerNavigation({
       setActiveTab,
@@ -153,6 +219,7 @@ function App() {
 
   const handleAuthenticated = async () => {
     setIsAuthenticated(true)
+    trackPlausibleEvent(PlausibleEvents.LOGGED_IN)
 
     try {
       const demo = await seedDemoLogbookIfNeeded()
@@ -200,6 +267,19 @@ function App() {
     i18n.changeLanguage(nextLang)
   }
 
+  const handleExitDemo = () => {
+    window.history.replaceState({}, document.title, '/')
+    syncRouteFromLocation()
+  }
+
+  if (isDemoMode) {
+    return (
+      <div style={{ display: 'contents' }}>
+        <DemoViewer onExit={handleExitDemo} />
+      </div>
+    )
+  }
+
   if (isViewerMode) {
     return (
       <div style={{ display: 'contents' }}>
@@ -214,6 +294,7 @@ function App() {
         <InvitationAcceptance
           onAccepted={(logbookId, title) => {
             setIsAuthenticated(true)
+            trackPlausibleEvent(PlausibleEvents.LOGGED_IN)
             setIsAcceptingInvite(false)
             selectLogbook(logbookId, title)
             // Clean URL query parameters and hash anchor
@@ -231,7 +312,7 @@ function App() {
   if (!isAuthenticated) {
     return (
       <div className="auth-screen">
-        <AuthOnboarding onAuthenticated={handleAuthenticated} />
+        <AuthOnboarding onAuthenticated={handleAuthenticated} onOpenDemo={openDemo} />
       </div>
     )
   }
@@ -263,8 +344,17 @@ function App() {
               {t('nav.dashboard')}
             </button>
             <div className="app-title-area">
-              <h2>{activeLogbookTitle}</h2>
-              <p className="app-subtitle">{t('app.name')} / {activeLogbookId.substring(0, 8)}...</p>
+              <div className="app-title-row">
+                <h2>{activeLogbookTitle}</h2>
+                {activeAccessRole !== 'OWNER' && (
+                  <LogbookRoleBadge role={activeAccessRole} />
+                )}
+              </div>
+              <p className="app-subtitle">
+                {activeAccessRole !== 'OWNER'
+                  ? t('dashboard.section_shared_hint')
+                  : `${t('app.name')} / ${activeLogbookId?.substring(0, 8)}...`}
+              </p>
             </div>
           </div>
 
@@ -334,6 +424,14 @@ function App() {
           </button>
           */}
 
+          <button
+            className={`sidebar-btn ${activeTab === 'stats' ? 'active' : ''}`}
+            onClick={() => setActiveTab('stats')}
+          >
+            <BarChart2 size={18} />
+            {t('nav.stats')}
+          </button>
+
           <button
             className={`sidebar-btn ${activeTab === 'settings' ? 'active' : ''}`}
             onClick={() => setActiveTab('settings')}
@@ -362,6 +460,10 @@ function App() {
             <CrewForm logbookId={activeLogbookId} />
           )}
 
+          {activeTab === 'stats' && activeLogbookId && activeLogbookTitle && (
+            <StatsDashboard logbookId={activeLogbookId} logbookTitle={activeLogbookTitle} />
+          )}
+
           {/* Compass Deviation Table — für Freizeit-Skipper vorerst deaktiviert
           {activeTab === 'deviation' && (
             <DeviationForm logbookId={activeLogbookId} />
@@ -369,7 +471,10 @@ function App() {
           */}
 
           {activeTab === 'settings' && (
-            <SettingsForm logbookId={activeLogbookId} />
+            <SettingsForm
+              logbookId={activeLogbookId}
+              onLogbookRestored={selectLogbook}
+            />
           )}
         </main>
       </div>

client/src/components/AppTourOverlay.tsx

@@ -25,6 +25,7 @@ export default function AppTourOverlay() {
   const { t } = useTranslation()
   const {
     isActive,
+    isDemoTour,
     currentStepId,
     currentStepIndex,
     totalSteps,
@@ -104,7 +105,7 @@ export default function AppTourOverlay() {
 
   if (!isActive || !currentStepId) return null
 
-  const { title, body } = getTourStepCopy(currentStepId, t)
+  const { title, body } = getTourStepCopy(currentStepId, t, { demoMode: isDemoTour })
   const centered = isCenteredTourStep(currentStepId)
 
   const tooltipStyle = centered

client/src/components/AuthOnboarding.tsx

@@ -16,9 +16,10 @@ import RegistrationDisclaimer from './RegistrationDisclaimer.tsx'
 
 interface AuthOnboardingProps {
   onAuthenticated: () => void
+  onOpenDemo?: () => void
 }
 
-export default function AuthOnboarding({ onAuthenticated }: AuthOnboardingProps) {
+export default function AuthOnboarding({ onAuthenticated, onOpenDemo }: AuthOnboardingProps) {
   const { t, i18n } = useTranslation()
   const [username, setUsername] = useState('')
   const [loading, setLoading] = useState(false)
@@ -523,6 +524,16 @@ export default function AuthOnboarding({ onAuthenticated }: AuthOnboardingProps)
           <div style={{ flex: 1, height: '1px', background: 'rgba(255,255,255,0.1)' }}></div>
         </div>
 
+        <button
+          type="button"
+          className="btn secondary"
+          onClick={() => onOpenDemo?.()}
+          disabled={loading}
+          style={{ width: '100%' }}
+        >
+          {t('auth.explore_demo')}
+        </button>
+
         {/* Registration form */}
         <form onSubmit={handleRegister} style={{ display: 'flex', flexDirection: 'column', gap: '16px', width: '100%' }}>
           <div className="input-group">

client/src/components/CrewForm.tsx

@@ -5,6 +5,7 @@ import { getActiveMasterKey } from '../services/auth.js'
 import { getLogbookKey } from '../services/logbookKeys.js'
 import { encryptJson, decryptJson } from '../services/crypto.js'
 import { syncLogbook } from '../services/sync.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import { useDialog } from './ModalDialog.tsx'
 import { Users, User, Plus, Trash2, Edit2, Save, X, Check, Camera } from 'lucide-react'
 
@@ -236,6 +237,7 @@ export default function CrewForm({ logbookId, readOnly = false, preloadedData }:
       })
 
       setSkipperSuccess(true)
+      trackPlausibleEvent(PlausibleEvents.CREW_SAVED, { role: 'skipper', action: 'update' })
       setTimeout(() => setSkipperSuccess(false), 3000)
 
       syncLogbook(logbookId).catch((err) => console.warn('Background sync failed:', err))
@@ -337,6 +339,7 @@ export default function CrewForm({ logbookId, readOnly = false, preloadedData }:
       }
 
       setShowMemberForm(false)
+      trackPlausibleEvent(PlausibleEvents.CREW_SAVED, { role: 'crew', action: isNew ? 'create' : 'update' })
       syncLogbook(logbookId).catch((err) => console.warn('Background sync failed:', err))
     } catch (err: any) {
       console.error('Failed to save crew member:', err)
@@ -452,6 +455,7 @@ export default function CrewForm({ logbookId, readOnly = false, preloadedData }:
                   try {
                     const resized = await resizeImageFile(file)
                     setSkipPhoto(resized)
+                    trackPlausibleEvent(PlausibleEvents.PHOTO_UPLOADED, { context: 'crew', role: 'skipper' })
                   } catch (err: any) {
                     setSkipPhotoError(err.message || 'Failed to process image')
                   }
@@ -659,6 +663,7 @@ export default function CrewForm({ logbookId, readOnly = false, preloadedData }:
                     try {
                       const resized = await resizeImageFile(file)
                       setMemPhoto(resized)
+                      trackPlausibleEvent(PlausibleEvents.PHOTO_UPLOADED, { context: 'crew', role: 'crew' })
                     } catch (err: any) {
                       setMemPhotoError(err.message || 'Failed to process image')
                     }

client/src/components/DemoViewer.tsx

@@ -0,0 +1,148 @@
+import { useState, useEffect } from 'react'
+import { useTranslation } from 'react-i18next'
+import VesselForm from './VesselForm.tsx'
+import CrewForm from './CrewForm.tsx'
+import LogEntriesList from './LogEntriesList.tsx'
+import { Ship, Users, FileText, Lock, Globe, ChevronLeft, UserPlus } from 'lucide-react'
+import { buildPublicDemoFixture, type PublicDemoFixture } from '../services/demoLogbookData.js'
+import { useAppTour, type AppTab } from '../context/AppTourContext.tsx'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
+
+interface DemoViewerProps {
+  onExit: () => void
+}
+
+export default function DemoViewer({ onExit }: DemoViewerProps) {
+  const { t, i18n } = useTranslation()
+  const { registerNavigation, registerDemoTourContext, startTour } = useAppTour()
+  const [activeTab, setActiveTab] = useState<AppTab>('logs')
+  const [tourSelectedEntryId, setTourSelectedEntryId] = useState<string | null>(null)
+  const [fixture, setFixture] = useState<PublicDemoFixture>(() => buildPublicDemoFixture())
+
+  useEffect(() => {
+    trackPlausibleEvent(PlausibleEvents.DEMO_OPENED)
+  }, [])
+
+  useEffect(() => {
+    setFixture(buildPublicDemoFixture())
+  }, [i18n.language])
+
+  useEffect(() => {
+    registerNavigation({
+      setActiveTab,
+      setSelectedEntryId: setTourSelectedEntryId
+    })
+    registerDemoTourContext({ firstEntryId: fixture.firstEntryId })
+
+    const timer = window.setTimeout(() => {
+      startTour({ force: true, demoMode: true })
+    }, 400)
+
+    return () => {
+      window.clearTimeout(timer)
+      registerDemoTourContext(null)
+    }
+  }, [registerNavigation, registerDemoTourContext, startTour, fixture.firstEntryId])
+
+  const toggleLanguage = () => {
+    const nextLang = i18n.language.startsWith('de') ? 'en' : 'de'
+    i18n.changeLanguage(nextLang)
+  }
+
+  const { title, yacht, crews, entries, gpsTracks, photos, firstEntryId } = fixture
+
+  return (
+    <div className="app-layout">
+      <div className="sync-progress-bar" style={{ height: '4px', background: 'linear-gradient(90deg, #f59e0b, #3b82f6)' }} />
+
+      <header className="app-header" style={{ borderBottom: '1px solid rgba(245, 158, 11, 0.25)' }}>
+        <div className="app-header-left">
+          <button className="btn-back" onClick={onExit}>
+            <ChevronLeft size={16} />
+            {t('demo.back_to_login')}
+          </button>
+          <div className="app-title-area">
+            <div className="app-title-row">
+              <h2>{title}</h2>
+              <span className="demo-badge">{t('demo.badge')}</span>
+            </div>
+            <p className="app-subtitle" style={{ color: '#f59e0b', display: 'flex', alignItems: 'center', gap: '4px' }}>
+              <Lock size={12} />
+              <span>{t('demo.public_banner')}</span>
+            </p>
+          </div>
+        </div>
+
+        <div className="header-actions">
+          <button
+            className="btn primary"
+            onClick={onExit}
+            style={{ width: 'auto', padding: '6px 14px', fontSize: '13px' }}
+          >
+            <UserPlus size={14} style={{ marginRight: '4px' }} />
+            {t('demo.cta_register')}
+          </button>
+          <button className="btn secondary" onClick={toggleLanguage} style={{ width: 'auto', padding: '6px 12px', fontSize: '13px' }}>
+            <Globe size={14} style={{ marginRight: '4px' }} />
+            {i18n.language.startsWith('de') ? 'English' : 'Deutsch'}
+          </button>
+        </div>
+      </header>
+
+      <div className="app-body">
+        <aside className="app-sidebar">
+          <button
+            className={`sidebar-btn ${activeTab === 'logs' ? 'active' : ''}`}
+            onClick={() => setActiveTab('logs')}
+            data-tour="nav-logs"
+          >
+            <FileText size={18} />
+            {t('nav.logs')}
+          </button>
+
+          <button
+            className={`sidebar-btn ${activeTab === 'vessel' ? 'active' : ''}`}
+            onClick={() => setActiveTab('vessel')}
+            data-tour="nav-vessel"
+          >
+            <Ship size={18} />
+            {t('nav.vessel')}
+          </button>
+
+          <button
+            className={`sidebar-btn ${activeTab === 'crew' ? 'active' : ''}`}
+            onClick={() => setActiveTab('crew')}
+            data-tour="nav-crew"
+          >
+            <Users size={18} />
+            {t('nav.crew')}
+          </button>
+        </aside>
+
+        <main className="app-content">
+          {activeTab === 'logs' && (
+            <LogEntriesList
+              logbookId="demo"
+              readOnly={true}
+              preloadedYacht={yacht}
+              preloadedEntries={entries}
+              preloadedPhotos={photos}
+              preloadedGpsTracks={gpsTracks}
+              controlledSelectedEntryId={tourSelectedEntryId}
+              onSelectedEntryIdChange={setTourSelectedEntryId}
+              highlightEntryId={firstEntryId}
+            />
+          )}
+
+          {activeTab === 'vessel' && (
+            <VesselForm logbookId="demo" readOnly={true} preloadedData={yacht} />
+          )}
+
+          {activeTab === 'crew' && (
+            <CrewForm logbookId="demo" readOnly={true} preloadedData={crews} />
+          )}
+        </main>
+      </div>
+    </div>
+  )
+}

client/src/components/EntrySkipperSignBadge.tsx

@@ -0,0 +1,31 @@
+import { useTranslation } from 'react-i18next'
+import { AlertTriangle } from 'lucide-react'
+import CaptainCap from './icons/CaptainCap.tsx'
+import type { SkipperSignStatus } from '../utils/signatures.js'
+
+interface EntrySkipperSignBadgeProps {
+  status: SkipperSignStatus
+}
+
+export default function EntrySkipperSignBadge({ status }: EntrySkipperSignBadgeProps) {
+  const { t } = useTranslation()
+
+  if (status === 'none') return null
+
+  const isValid = status === 'valid'
+  const label = isValid
+    ? t('logs.sign_badge_skipper_title_valid')
+    : t('logs.sign_badge_skipper_title_invalid')
+
+  return (
+    <span
+      className={`entry-sign-badge entry-sign-badge--skipper ${isValid ? 'valid' : 'invalid'}`}
+      title={label}
+    >
+      {isValid ? <CaptainCap size={14} aria-hidden /> : <AlertTriangle size={12} aria-hidden />}
+      <span className={isValid ? 'entry-sign-badge__sr-label' : undefined}>
+        {isValid ? t('logs.sign_badge_skipper') : t('logs.sign_badge_skipper_invalid')}
+      </span>
+    </span>
+  )
+}

client/src/components/InvitationAcceptance.tsx

@@ -10,8 +10,10 @@ import {
 } from '../services/auth.js'
 import { decryptJson, encryptBuffer } from '../services/crypto.js'
 import { saveLogbookKey } from '../services/logbookKeys.js'
+import { parseCollaborationRole } from '../services/logbook.js'
 import { syncLogbook } from '../services/sync.js'
 import { db } from '../services/db.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 
 interface InvitationAcceptanceProps {
   onAccepted: (logbookId: string, title: string) => void
@@ -181,6 +183,9 @@ export default function InvitationAcceptance({ onAccepted, onCancel }: Invitatio
         throw new Error(serverError.error || (isDe ? 'Beitritt auf dem Server fehlgeschlagen.' : 'Failed to join logbook on the server.'))
       }
 
+      const acceptResult = await res.json()
+      const collaborationRole = parseCollaborationRole(acceptResult.role, 'invitation accept')
+
       await saveLogbookKey(logbookId, logbookKey)
 
       if (rawEncryptedTitle) {
@@ -189,11 +194,13 @@ export default function InvitationAcceptance({ onAccepted, onCancel }: Invitatio
           encryptedTitle: rawEncryptedTitle,
           updatedAt: new Date().toISOString(),
           isSynced: 1,
-          isShared: 1
+          isShared: 1,
+          collaborationRole
         })
       }
 
       await syncLogbook(logbookId)
+      trackPlausibleEvent(PlausibleEvents.INVITE_ACCEPTED)
       onAccepted(logbookId, decryptedTitle)
     } catch (err: any) {
       console.error('Accepting invitation failed:', err)

client/src/components/LogEntriesList.tsx

@@ -7,15 +7,19 @@ import { decryptJson, encryptJson } from '../services/crypto.js'
 import { syncLogbook } from '../services/sync.js'
 import { downloadCsv, shareCsv } from '../services/csvExport.js'
 import { downloadLogbookPagePdf } from '../services/pdfExport.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import LogEntryEditor from './LogEntryEditor.tsx'
+import EntrySkipperSignBadge from './EntrySkipperSignBadge.tsx'
 import { useDialog } from './ModalDialog.tsx'
+import { getSkipperSignStatus, type SkipperSignStatus } from '../utils/signatures.js'
 import { FileText, Plus, Trash2, ChevronRight, Calendar, Download, Share2 } from 'lucide-react'
 import {
-  carryOverTankLevelsFromPreviousDay,
+  carryOverFromPreviousDay,
   compareTravelDaysChronological,
   emptyTankLevels,
   formatTankLiters,
   getNextTravelDayNumber,
+  hasCarryOverFromPreviousDay,
   type LogEntryTankSource,
   type TravelDaySortable
 } from '../utils/logEntryTankLevels.js'
@@ -39,6 +43,7 @@ interface DecryptedEntryItem {
   departure: string
   destination: string
   updatedAt: string
+  skipperSignStatus: SkipperSignStatus
 }
 
 export default function LogEntriesList({
@@ -77,14 +82,18 @@ export default function LogEntriesList({
     setError(null)
     try {
       if (readOnly && preloadedEntries) {
-        const list = preloadedEntries.map((entry: any) => ({
-          id: entry.payloadId || entry.id,
-          date: entry.date || '',
-          dayOfTravel: entry.dayOfTravel || '',
-          departure: entry.departure || '',
-          destination: entry.destination || '',
-          updatedAt: entry.updatedAt || new Date().toISOString()
-        }))
+        const list: DecryptedEntryItem[] = []
+        for (const entry of preloadedEntries) {
+          list.push({
+            id: entry.payloadId || entry.id,
+            date: entry.date || '',
+            dayOfTravel: entry.dayOfTravel || '',
+            departure: entry.departure || '',
+            destination: entry.destination || '',
+            updatedAt: entry.updatedAt || new Date().toISOString(),
+            skipperSignStatus: await getSkipperSignStatus(entry)
+          })
+        }
 
         list.sort((a, b) => {
           const dateCompare = new Date(b.date).getTime() - new Date(a.date).getTime()
@@ -112,7 +121,8 @@ export default function LogEntriesList({
             dayOfTravel: decrypted.dayOfTravel || '',
             departure: decrypted.departure || '',
             destination: decrypted.destination || '',
-            updatedAt: entry.updatedAt
+            updatedAt: entry.updatedAt,
+            skipperSignStatus: await getSkipperSignStatus(decrypted as Record<string, unknown>)
           })
         }
       }
@@ -156,6 +166,7 @@ export default function LogEntriesList({
       } else {
         await downloadCsv(logbookId, title)
       }
+      trackPlausibleEvent(PlausibleEvents.CSV_EXPORTED)
     } catch (err: any) {
       console.error('Failed to download CSV:', err)
       setError(err.message || 'Failed to generate CSV export.')
@@ -174,6 +185,7 @@ export default function LogEntriesList({
       } else {
         await shareCsv(logbookId, title)
       }
+      trackPlausibleEvent(PlausibleEvents.CSV_SHARED)
     } catch (err: any) {
       if (err.message === 'share_unsupported') {
         const title = preloadedYacht?.name || localStorage.getItem('active_logbook_title') || 'Logbook'
@@ -203,6 +215,7 @@ export default function LogEntriesList({
       } else {
         await downloadLogbookPagePdf(logbookId, entryId, date)
       }
+      trackPlausibleEvent(PlausibleEvents.PDF_EXPORTED, { scope: 'entry' })
     } catch (err: any) {
       console.error('Failed to download PDF:', err)
       setError(err.message || 'Failed to generate PDF export.')
@@ -228,11 +241,12 @@ export default function LogEntriesList({
 
       decryptedEntries.sort(compareTravelDaysChronological)
       const previousEntry = decryptedEntries.at(-1) ?? null
-      let { freshwater, fuel } = carryOverTankLevelsFromPreviousDay(previousEntry)
+      let { freshwater, fuel, departure } = carryOverFromPreviousDay(previousEntry)
 
-      if (previousEntry && (freshwater.morning > 0 || fuel.morning > 0)) {
+      if (previousEntry && hasCarryOverFromPreviousDay({ freshwater, fuel, departure })) {
         const confirmed = await showConfirm(
           t('logs.carry_over_tanks_confirm', {
+            departure: departure || '—',
             fw: formatTankLiters(freshwater.morning),
             fuel: formatTankLiters(fuel.morning)
           }),
@@ -243,6 +257,7 @@ export default function LogEntriesList({
         if (!confirmed) {
           freshwater = emptyTankLevels()
           fuel = emptyTankLevels()
+          departure = ''
         }
       }
 
@@ -255,7 +270,7 @@ export default function LogEntriesList({
       const initialPayload = {
         date: todayStr,
         dayOfTravel: getNextTravelDayNumber(decryptedEntries),
-        departure: '',
+        departure,
         destination: '',
         freshwater,
         fuel,
@@ -288,6 +303,7 @@ export default function LogEntriesList({
 
       // Open immediately in details editor
       setSelectedEntryId(localId)
+      trackPlausibleEvent(PlausibleEvents.TRAVEL_DAY_CREATED)
       syncLogbook(logbookId).catch((err) => console.warn('Background sync failed:', err))
     } catch (err: any) {
       console.error('Failed to create entry:', err)
@@ -403,6 +419,7 @@ export default function LogEntriesList({
                   <span className="sync-badge synced">
                     {t('logs.day_of_travel')} {item.dayOfTravel}
                   </span>
+                  <EntrySkipperSignBadge status={item.skipperSignStatus} />
                   <span className="date-badge">
                     {new Date(item.date).toLocaleDateString()}
                   </span>

client/src/components/LogEntryEditor.tsx

@@ -6,7 +6,7 @@ import { getLogbookKey } from '../services/logbookKeys.js'
 import { encryptJson, decryptJson } from '../services/crypto.js'
 import { syncLogbook } from '../services/sync.js'
 import { downloadLogbookPagePdf } from '../services/pdfExport.js'
-import { FileText, Save, ChevronLeft, Check, Compass, Plus, Trash2, MapPin, CloudSun, Clock, Download, Upload } from 'lucide-react'
+import { FileText, Save, ChevronLeft, Check, Compass, Plus, Trash2, MapPin, CloudSun, Clock, Download, Upload, Pencil, X } from 'lucide-react'
 import PhotoCapture from './PhotoCapture.tsx'
 import SignatureSection from './SignatureSection.tsx'
 import TrackMap from './TrackMap.tsx'
@@ -23,6 +23,7 @@ import { buildLogEntryPayload } from '../utils/logEntryPayload.js'
 import { hashEntryForSigning } from '../utils/entryCanonicalHash.js'
 import { signLogEntry } from '../services/entrySigning.js'
 import { getLogbookAccess } from '../services/logbookAccess.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import {
   getDecryptedTrack,
   saveUploadedTrack,
@@ -75,6 +76,8 @@ export default function LogEntryEditor({
 }: LogEntryEditorProps) {
   const { t, i18n } = useTranslation()
   const { showAlert, showConfirm } = useDialog()
+  const showAlertRef = useRef(showAlert)
+  showAlertRef.current = showAlert
 
   // General details state
   const [date, setDate] = useState('')
@@ -144,6 +147,9 @@ export default function LogEntryEditor({
   const fileInputRef = useRef<HTMLInputElement | null>(null)
   const lockedContentHashRef = useRef<string | null>(null)
   const contentReadyRef = useRef(false)
+  const lastSignatureAlertHashRef = useRef<string | null>(null)
+  const skipCrewSignClearRef = useRef(false)
+  const [editingEventIndex, setEditingEventIndex] = useState<number | null>(null)
 
   const applyTrackStats = (waypoints: SavedTrack['waypoints']) => {
     const stats = computeTrackStats(waypoints)
@@ -249,14 +255,21 @@ export default function LogEntryEditor({
 
     if (entryHash !== lockedContentHashRef.current) {
       lockedContentHashRef.current = null
-      setSignSkipper('')
-      setSignCrew('')
-      void showAlert(
-        t('logs.sign_cleared_re_sign'),
-        t('logs.sign_cleared_re_sign_title')
-      )
+      const hadSkipper = !!signSkipper
+      const hadCrew = !!signCrew
+      const skipperOnly = skipCrewSignClearRef.current
+      skipCrewSignClearRef.current = false
+      if (hadSkipper) setSignSkipper('')
+      if (hadCrew && !skipperOnly) setSignCrew('')
+      if (lastSignatureAlertHashRef.current !== entryHash && (hadSkipper || (hadCrew && !skipperOnly))) {
+        lastSignatureAlertHashRef.current = entryHash
+        void showAlertRef.current(
+          skipperOnly ? t('logs.sign_cleared_skipper_re_sign') : t('logs.sign_cleared_re_sign'),
+          skipperOnly ? t('logs.sign_cleared_skipper_re_sign_title') : t('logs.sign_cleared_re_sign_title')
+        )
+      }
     }
-  }, [entryHash, signSkipper, signCrew, readOnly, showAlert, t])
+  }, [entryHash, signSkipper, signCrew, readOnly, t])
 
   const confirmSignWarning = useCallback(async (): Promise<boolean> => {
     return showConfirm(
@@ -284,6 +297,7 @@ export default function LogEntryEditor({
     setSignSkipper(signature)
     setEntryHash(hash)
     lockedContentHashRef.current = hash
+    trackPlausibleEvent(PlausibleEvents.ENTRY_SIGNED, { role: 'skipper' })
   }
 
   const handlePasskeySignCrew = async () => {
@@ -300,6 +314,7 @@ export default function LogEntryEditor({
     setSignCrew(signature)
     setEntryHash(hash)
     lockedContentHashRef.current = hash
+    trackPlausibleEvent(PlausibleEvents.ENTRY_SIGNED, { role: 'crew' })
   }
 
   // Auto-calculate Freshwater Consumption
@@ -352,6 +367,7 @@ export default function LogEntryEditor({
       setError(null)
       lockedContentHashRef.current = null
       contentReadyRef.current = false
+      lastSignatureAlertHashRef.current = null
       try {
         if (readOnly && preloadedEntry) {
           setDate(preloadedEntry.date || '')
@@ -423,7 +439,12 @@ export default function LogEntryEditor({
 
   const loadTrack = async () => {
     if (readOnly && preloadedTrack) {
-      setSavedTrack(preloadedTrack)
+      setSavedTrack({
+        waypoints: preloadedTrack.waypoints ?? [],
+        gpxContent: preloadedTrack.gpxContent ?? '',
+        filename: preloadedTrack.filename ?? 'track.gpx',
+        fileType: preloadedTrack.fileType ?? 'gpx'
+      })
       return
     }
     try {
@@ -465,6 +486,7 @@ export default function LogEntryEditor({
         await saveUploadedTrack(logbookId, entryId, text, parsedWps, file.name, fileType)
         applyTrackStats(parsedWps)
         await loadTrack()
+        trackPlausibleEvent(PlausibleEvents.GPS_TRACK_UPLOADED)
       } catch (err: any) {
         console.error('File parsing failed:', err)
         setUploadError(err.message || 'Failed to parse track file.')
@@ -676,32 +698,26 @@ export default function LogEntryEditor({
     return currentItems.includes(item.toLowerCase())
   }
 
-  const handleAddEvent = (e: React.FormEvent) => {
-    e.preventDefault()
-    if (readOnly || !evTime) return
+  const buildEventFromForm = (): LogEvent => ({
+    time: evTime,
+    mgk: evMgk.trim(),
+    rwk: evRwk.trim(),
+    windPressure: evWindPressure.trim(),
+    windDirection: evWindDirection.trim(),
+    windStrength: evWindStrength.trim(),
+    seaState: evSeaState.trim(),
+    weatherIcon: evWeatherIcon.trim(),
+    current: evCurrent.trim(),
+    heel: evHeel.trim(),
+    sailsOrMotor: evSailsOrMotor.trim(),
+    logReading: evLogReading.trim(),
+    distance: evDistance.trim(),
+    gpsLat: evGpsLat.trim(),
+    gpsLng: evGpsLng.trim(),
+    remarks: evRemarks.trim()
+  })
 
-    const newEvent: LogEvent = {
-      time: evTime,
-      mgk: evMgk.trim(),
-      rwk: evRwk.trim(),
-      windPressure: evWindPressure.trim(),
-      windDirection: evWindDirection.trim(),
-      windStrength: evWindStrength.trim(),
-      seaState: evSeaState.trim(),
-      weatherIcon: evWeatherIcon.trim(),
-      current: evCurrent.trim(),
-      heel: evHeel.trim(),
-      sailsOrMotor: evSailsOrMotor.trim(),
-      logReading: evLogReading.trim(),
-      distance: evDistance.trim(),
-      gpsLat: evGpsLat.trim(),
-      gpsLng: evGpsLng.trim(),
-      remarks: evRemarks.trim()
-    }
-
-    setEvents((prev) => [...prev, newEvent])
-
-    // Clear event form fields
+  const clearEventForm = () => {
     setEvTime('')
     setEvMgk('')
     setEvRwk('')
@@ -719,11 +735,86 @@ export default function LogEntryEditor({
     setEvGpsLng('')
     setEvRemarks('')
     setEvLocationName('')
+    setEditingEventIndex(null)
+  }
+
+  const fillEventForm = (ev: LogEvent) => {
+    setEvTime(ev.time)
+    setEvMgk(ev.mgk)
+    setEvRwk(ev.rwk)
+    setEvWindPressure(ev.windPressure)
+    setEvWindDirection(ev.windDirection)
+    setEvWindStrength(ev.windStrength)
+    setEvSeaState(ev.seaState)
+    setEvWeatherIcon(ev.weatherIcon)
+    setEvCurrent(ev.current)
+    setEvHeel(ev.heel)
+    setEvSailsOrMotor(ev.sailsOrMotor)
+    setEvLogReading(ev.logReading)
+    setEvDistance(ev.distance)
+    setEvGpsLat(ev.gpsLat)
+    setEvGpsLng(ev.gpsLng)
+    setEvRemarks(ev.remarks)
+    setEvLocationName('')
+  }
+
+  const markSkipperSignatureClearedForEventChange = () => {
+    if (!signSkipper) return
+    skipCrewSignClearRef.current = true
+    setSignSkipper('')
+  }
+
+  const handleEditEvent = (index: number) => {
+    if (readOnly) return
+    const ev = events[index]
+    if (!ev) return
+    fillEventForm(ev)
+    setEditingEventIndex(index)
+  }
+
+  const handleCancelEventEdit = () => {
+    clearEventForm()
+  }
+
+  const handleSaveEvent = (e: React.FormEvent) => {
+    e.preventDefault()
+    if (readOnly || !evTime) return
+
+    const eventData = buildEventFromForm()
+
+    if (editingEventIndex !== null) {
+      const hadSkipperSignature = !!signSkipper
+      markSkipperSignatureClearedForEventChange()
+      setEvents((prev) => prev.map((ev, idx) => (idx === editingEventIndex ? eventData : ev)))
+      if (hadSkipperSignature) {
+        void showAlertRef.current(
+          t('logs.sign_cleared_skipper_re_sign'),
+          t('logs.sign_cleared_skipper_re_sign_title')
+        )
+      }
+    } else {
+      setEvents((prev) => [...prev, eventData])
+    }
+
+    clearEventForm()
   }
 
   const handleDeleteEvent = (index: number) => {
     if (readOnly) return
+    const hadSkipperSignature = !!signSkipper
+    markSkipperSignatureClearedForEventChange()
     setEvents((prev) => prev.filter((_, idx) => idx !== index))
+    if (hadSkipperSignature) {
+      void showAlertRef.current(
+        t('logs.sign_cleared_skipper_re_sign'),
+        t('logs.sign_cleared_skipper_re_sign_title')
+      )
+    }
+    if (editingEventIndex === index) {
+      clearEventForm()
+    } else if (editingEventIndex !== null && index < editingEventIndex) {
+      setEditingEventIndex(editingEventIndex - 1)
+    }
   }
 
   const handleDownloadPdf = async () => {
@@ -731,6 +822,7 @@ export default function LogEntryEditor({
     setError(null)
     try {
       await downloadLogbookPagePdf(logbookId, entryId, date)
+      trackPlausibleEvent(PlausibleEvents.PDF_EXPORTED, { scope: 'entry' })
     } catch (err: any) {
       console.error('Failed to download PDF:', err)
       setError(err.message || 'Failed to generate PDF export.')
@@ -782,6 +874,7 @@ export default function LogEntryEditor({
       })
 
       setSuccess(true)
+      trackPlausibleEvent(PlausibleEvents.TRAVEL_DAY_SAVED)
       setTimeout(() => {
         setSuccess(false)
         onBack()
@@ -1061,8 +1154,22 @@ export default function LogEntryEditor({
                       </td>
                       <td className="remarks-td">{ev.remarks}</td>
                       {!readOnly && (
-                        <td>
-                          <button type="button" className="btn-icon logout" onClick={() => handleDeleteEvent(idx)}>
+                        <td className="events-actions-td">
+                          <button
+                            type="button"
+                            className="btn-icon"
+                            onClick={() => handleEditEvent(idx)}
+                            title={t('logs.edit_event')}
+                            disabled={editingEventIndex !== null && editingEventIndex !== idx}
+                          >
+                            <Pencil size={14} />
+                          </button>
+                          <button
+                            type="button"
+                            className="btn-icon logout"
+                            onClick={() => handleDeleteEvent(idx)}
+                            title={t('logs.delete_event')}
+                          >
                             <Trash2 size={14} />
                           </button>
                         </td>
@@ -1077,7 +1184,9 @@ export default function LogEntryEditor({
           {/* Add New Event Form Sub-Card */}
           {!readOnly && (
             <div className="member-editor-card glass">
-              <h4 style={{ margin: '0 0 16px 0', color: '#fbbf24' }}>{t('logs.add_event')}</h4>
+              <h4 style={{ margin: '0 0 16px 0', color: '#fbbf24' }}>
+                {editingEventIndex !== null ? t('logs.edit_event') : t('logs.add_event')}
+              </h4>
             
             <div className="form-grid mb-4">
               <div className="input-group">
@@ -1311,16 +1420,30 @@ export default function LogEntryEditor({
               </div>
             </div>
 
-            <button
-              type="button"
-              className="btn secondary"
-              onClick={handleAddEvent}
-              disabled={saving || !evTime}
-              style={{ width: 'auto', padding: '10px 20px', marginLeft: 'auto', display: 'flex' }}
-            >
-              <Plus size={16} />
-              Add Event Entry
-            </button>
+            <div style={{ display: 'flex', gap: '8px', marginLeft: 'auto', flexWrap: 'wrap' }}>
+              {editingEventIndex !== null && (
+                <button
+                  type="button"
+                  className="btn secondary"
+                  onClick={handleCancelEventEdit}
+                  disabled={saving}
+                  style={{ width: 'auto', padding: '10px 20px', display: 'flex' }}
+                >
+                  <X size={16} />
+                  {t('logs.cancel_event_edit')}
+                </button>
+              )}
+              <button
+                type="button"
+                className="btn secondary"
+                onClick={handleSaveEvent}
+                disabled={saving || !evTime}
+                style={{ width: 'auto', padding: '10px 20px', display: 'flex' }}
+              >
+                {editingEventIndex !== null ? <Save size={16} /> : <Plus size={16} />}
+                {editingEventIndex !== null ? t('logs.save_event_btn') : t('logs.add_event_btn')}
+              </button>
+            </div>
           </div>
           )}
         </div>
@@ -1361,7 +1484,7 @@ export default function LogEntryEditor({
                   <Upload size={16} style={{ color: '#fbbf24' }} />
                   <span className="track-info-name">{savedTrack.filename || 'track'}</span>
                   <span className="track-info-stats">
-                    {savedTrack.fileType.toUpperCase()}
+                    {(savedTrack.fileType ?? 'gpx').toUpperCase()}
                     {savedTrack.waypoints.length > 0 && (
                       <> · {savedTrack.waypoints.length} {t('logs.track_upload_points')}</>
                     )}

client/src/components/LogbookBackupPanel.tsx

@@ -0,0 +1,327 @@
+import { useRef, useState } from 'react'
+import { useTranslation } from 'react-i18next'
+import { Archive, Download, Upload, Check, AlertTriangle } from 'lucide-react'
+import { useDialog } from './ModalDialog.tsx'
+import {
+  downloadBackupBlob,
+  exportLogbookBackup,
+  parseLogbookBackupFile,
+  previewLogbookBackup,
+  restoreLogbookBackup,
+  type LogbookBackupFile,
+  type LogbookBackupPreview
+} from '../services/logbookBackup.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
+
+interface LogbookBackupPanelProps {
+  logbookId: string
+  onRestored?: (logbookId: string, title: string) => void
+}
+
+function mapBackupError(code: string, t: (key: string) => string): string {
+  switch (code) {
+    case 'BACKUP_PASSPHRASE_TOO_SHORT':
+      return t('settings.backup_passphrase_short')
+    case 'BACKUP_NOT_OWNER':
+      return t('settings.backup_not_owner')
+    case 'BACKUP_INVALID_JSON':
+      return t('settings.backup_invalid_json')
+    case 'BACKUP_INVALID_FORMAT':
+      return t('settings.backup_invalid_format')
+    case 'BACKUP_NOT_AUTHENTICATED':
+      return t('settings.backup_not_authenticated')
+    case 'BACKUP_ID_CONFLICT':
+      return t('settings.backup_id_conflict')
+    default:
+      if (code.includes('decrypt') || code.includes('operation')) {
+        return t('settings.backup_wrong_passphrase')
+      }
+      return code
+  }
+}
+
+export default function LogbookBackupPanel({ logbookId, onRestored }: LogbookBackupPanelProps) {
+  const { t } = useTranslation()
+  const { showConfirm } = useDialog()
+  const fileInputRef = useRef<HTMLInputElement>(null)
+
+  const [exportPassphrase, setExportPassphrase] = useState('')
+  const [exportConfirm, setExportConfirm] = useState('')
+  const [exporting, setExporting] = useState(false)
+
+  const [importPassphrase, setImportPassphrase] = useState('')
+  const [importFile, setImportFile] = useState<File | null>(null)
+  const [importPreview, setImportPreview] = useState<LogbookBackupPreview | null>(null)
+  const [parsedBackup, setParsedBackup] = useState<LogbookBackupFile | null>(null)
+  const [importing, setImporting] = useState(false)
+  const [previewing, setPreviewing] = useState(false)
+  const [error, setError] = useState<string | null>(null)
+  const [success, setSuccess] = useState<string | null>(null)
+
+  const handleExport = async () => {
+    setError(null)
+    setSuccess(null)
+
+    if (exportPassphrase.length < 8) {
+      setError(t('settings.backup_passphrase_short'))
+      return
+    }
+    if (exportPassphrase !== exportConfirm) {
+      setError(t('settings.backup_passphrase_mismatch'))
+      return
+    }
+
+    setExporting(true)
+    try {
+      const { blob, filename, backup } = await exportLogbookBackup(logbookId, exportPassphrase)
+      downloadBackupBlob(blob, filename)
+      setSuccess(t('settings.backup_export_success', { count: backup.counts.entries }))
+      setExportPassphrase('')
+      setExportConfirm('')
+      trackPlausibleEvent(PlausibleEvents.BACKUP_EXPORTED, {
+        entries: backup.counts.entries,
+        photos: backup.counts.photos
+      })
+    } catch (err: unknown) {
+      const message = err instanceof Error ? err.message : String(err)
+      setError(mapBackupError(message, t))
+    } finally {
+      setExporting(false)
+    }
+  }
+
+  const handleFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
+    setError(null)
+    setSuccess(null)
+    setImportPreview(null)
+    setParsedBackup(null)
+    const file = e.target.files?.[0]
+    setImportFile(file ?? null)
+    if (!file) return
+
+    try {
+      const backup = await parseLogbookBackupFile(file)
+      setParsedBackup(backup)
+    } catch (err: unknown) {
+      const message = err instanceof Error ? err.message : String(err)
+      setError(mapBackupError(message, t))
+      setImportFile(null)
+    }
+  }
+
+  const handlePreviewImport = async () => {
+    if (!parsedBackup || !importPassphrase) return
+    setPreviewing(true)
+    setError(null)
+    try {
+      const preview = await previewLogbookBackup(parsedBackup, importPassphrase)
+      setImportPreview(preview)
+    } catch (err: unknown) {
+      setImportPreview(null)
+      setError(t('settings.backup_wrong_passphrase'))
+    } finally {
+      setPreviewing(false)
+    }
+  }
+
+  const handleRestore = async (options: { overwrite?: boolean; assignNewId?: boolean } = {}) => {
+    if (!parsedBackup || !importPassphrase) return
+
+    setImporting(true)
+    setError(null)
+    try {
+      const result = await restoreLogbookBackup(parsedBackup, importPassphrase, options)
+      setSuccess(t('settings.backup_restore_success', { title: result.title }))
+      setImportFile(null)
+      setImportPassphrase('')
+      setImportPreview(null)
+      setParsedBackup(null)
+      if (fileInputRef.current) fileInputRef.current.value = ''
+      trackPlausibleEvent(PlausibleEvents.BACKUP_RESTORED, {
+        entries: parsedBackup.counts.entries,
+        photos: parsedBackup.counts.photos,
+        mode: options.overwrite ? 'overwrite' : options.assignNewId ? 'new_id' : 'same_id'
+      })
+      onRestored?.(result.logbookId, result.title)
+    } catch (err: unknown) {
+      const message = err instanceof Error ? err.message : String(err)
+      if (message === 'BACKUP_ID_CONFLICT') {
+        const overwrite = await showConfirm(
+          t('settings.backup_overwrite_confirm'),
+          t('settings.backup_restore_title'),
+          t('logs.confirm_yes'),
+          t('logs.confirm_no')
+        )
+        if (overwrite) {
+          setImporting(false)
+          return handleRestore({ overwrite: true })
+        }
+        const asNew = await showConfirm(
+          t('settings.backup_new_id_confirm'),
+          t('settings.backup_restore_title'),
+          t('logs.confirm_yes'),
+          t('logs.confirm_no')
+        )
+        if (asNew) {
+          setImporting(false)
+          return handleRestore({ assignNewId: true })
+        }
+        setError(t('settings.backup_restore_cancelled'))
+      } else {
+        setError(mapBackupError(message, t))
+      }
+    } finally {
+      setImporting(false)
+    }
+  }
+
+  return (
+    <div className="member-editor-card glass mt-6 backup-panel" style={{ borderTop: '1px solid rgba(255,255,255,0.05)', paddingTop: '24px' }}>
+      <div style={{ display: 'flex', alignItems: 'center', gap: '8px', marginBottom: '12px' }}>
+        <Archive size={20} style={{ color: '#38bdf8' }} />
+        <h3 style={{ margin: 0, color: '#38bdf8', fontSize: '16px' }}>
+          {t('settings.backup_title')}
+        </h3>
+      </div>
+
+      <p className="text-muted" style={{ fontSize: '13.5px', lineHeight: '145%', margin: '0 0 20px 0' }}>
+        {t('settings.backup_desc')}
+      </p>
+
+      {error && (
+        <div className="auth-error mb-4" role="alert">
+          <AlertTriangle size={16} style={{ display: 'inline', marginRight: 6, verticalAlign: 'text-bottom' }} />
+          {error}
+        </div>
+      )}
+
+      {success && (
+        <div className="success-toast mb-4">
+          <Check size={16} />
+          <span>{success}</span>
+        </div>
+      )}
+
+      <section className="backup-section" aria-labelledby="backup-export-heading">
+        <h4 id="backup-export-heading" className="backup-section-title">
+          <Download size={16} aria-hidden="true" />
+          {t('settings.backup_export_title')}
+        </h4>
+        <p className="text-muted backup-section-desc">{t('settings.backup_export_desc')}</p>
+
+        <div className="input-group">
+          <label htmlFor="backup-export-passphrase">{t('settings.backup_passphrase')}</label>
+          <input
+            id="backup-export-passphrase"
+            type="password"
+            className="input-text"
+            value={exportPassphrase}
+            onChange={(e) => setExportPassphrase(e.target.value)}
+            placeholder={t('settings.backup_passphrase_placeholder')}
+            autoComplete="new-password"
+            disabled={exporting}
+          />
+        </div>
+        <div className="input-group">
+          <label htmlFor="backup-export-confirm">{t('settings.backup_passphrase_confirm')}</label>
+          <input
+            id="backup-export-confirm"
+            type="password"
+            className="input-text"
+            value={exportConfirm}
+            onChange={(e) => setExportConfirm(e.target.value)}
+            autoComplete="new-password"
+            disabled={exporting}
+          />
+        </div>
+        <button
+          type="button"
+          className="btn primary"
+          onClick={handleExport}
+          disabled={exporting || !exportPassphrase || !exportConfirm}
+        >
+          <Download size={16} />
+          {exporting ? t('settings.backup_exporting') : t('settings.backup_export_btn')}
+        </button>
+      </section>
+
+      <section className="backup-section backup-section--import" aria-labelledby="backup-import-heading">
+        <h4 id="backup-import-heading" className="backup-section-title">
+          <Upload size={16} aria-hidden="true" />
+          {t('settings.backup_restore_title')}
+        </h4>
+        <p className="text-muted backup-section-desc">{t('settings.backup_restore_desc')}</p>
+
+        <div className="input-group">
+          <label htmlFor="backup-import-file">{t('settings.backup_file_label')}</label>
+          <input
+            id="backup-import-file"
+            ref={fileInputRef}
+            type="file"
+            accept=".daagbok.json,application/json"
+            className="input-text"
+            onChange={handleFileChange}
+            disabled={importing}
+          />
+        </div>
+
+        {importFile && (
+          <>
+            <div className="input-group">
+              <label htmlFor="backup-import-passphrase">{t('settings.backup_passphrase')}</label>
+              <input
+                id="backup-import-passphrase"
+                type="password"
+                className="input-text"
+                value={importPassphrase}
+                onChange={(e) => {
+                  setImportPassphrase(e.target.value)
+                  setImportPreview(null)
+                }}
+                autoComplete="current-password"
+                disabled={importing}
+              />
+            </div>
+
+            <div className="backup-actions-row">
+              <button
+                type="button"
+                className="btn secondary"
+                onClick={handlePreviewImport}
+                disabled={previewing || importing || !importPassphrase}
+              >
+                {previewing ? t('settings.backup_previewing') : t('settings.backup_preview_btn')}
+              </button>
+              <button
+                type="button"
+                className="btn primary"
+                onClick={() => handleRestore()}
+                disabled={importing || !importPassphrase}
+              >
+                <Upload size={16} />
+                {importing ? t('settings.backup_restoring') : t('settings.backup_restore_btn')}
+              </button>
+            </div>
+          </>
+        )}
+
+        {importPreview && (
+          <div className="backup-preview glass">
+            <p className="backup-preview-title">{importPreview.title}</p>
+            <ul className="backup-preview-stats">
+              <li>{t('settings.backup_stat_entries', { count: importPreview.counts.entries })}</li>
+              <li>{t('settings.backup_stat_photos', { count: importPreview.counts.photos })}</li>
+              <li>{t('settings.backup_stat_crew', { count: importPreview.counts.crews })}</li>
+              <li>{t('settings.backup_stat_tracks', { count: importPreview.counts.gpsTracks })}</li>
+            </ul>
+            <p className="text-muted backup-preview-date">
+              {t('settings.backup_exported_at', {
+                date: new Date(importPreview.exportedAt).toLocaleString()
+              })}
+            </p>
+          </div>
+        )}
+      </section>
+    </div>
+  )
+}

client/src/components/LogbookDashboard.tsx

@@ -3,6 +3,8 @@ import { useTranslation } from 'react-i18next'
 import { useLiveQuery } from 'dexie-react-hooks'
 import { db } from '../services/db.js'
 import { fetchLogbooks, createLogbook, deleteLogbook, type DecryptedLogbook } from '../services/logbook.js'
+import LogbookRoleBadge from './LogbookRoleBadge.tsx'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import { logoutUser } from '../services/auth.js'
 import { useDialog } from './ModalDialog.tsx'
 import AccountDangerZone from './AccountDangerZone.tsx'
@@ -70,6 +72,7 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout }: LogbookD
       const created = await createLogbook(newTitle.trim())
       setLogbooks((prev) => [created, ...prev])
       setNewTitle('')
+      trackPlausibleEvent(PlausibleEvents.LOGBOOK_CREATED)
     } catch (err: any) {
       setError(err.message || 'Failed to create logbook')
     } finally {
@@ -80,7 +83,7 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout }: LogbookD
   const handleDelete = async (id: string, e: React.MouseEvent) => {
     e.stopPropagation() // Prevent selecting the logbook when clicking delete
     
-    if (await showConfirm(t('dashboard.delete_confirm'), t('dashboard.title'), t('logs.confirm_yes'), t('logs.confirm_no'))) {
+    if (await showConfirm(t('dashboard.delete_confirm'), t('dashboard.delete_btn'), t('logs.confirm_yes'), t('logs.confirm_no'))) {
       setLoading(true)
       setError(null)
       try {
@@ -104,6 +107,68 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout }: LogbookD
     i18n.changeLanguage(nextLang)
   }
 
+  const ownedLogbooks = logbooks.filter((lb) => !lb.isShared)
+  const sharedLogbooks = logbooks.filter((lb) => lb.isShared)
+
+  const renderLogbookCard = (lb: DecryptedLogbook) => (
+    <div
+      key={lb.id}
+      className={`logbook-card glass${lb.isShared ? ' logbook-card--shared' : ''}`}
+      onClick={() => onSelectLogbook(lb.id, lb.title)}
+    >
+      <div className="card-icon">
+        <BookOpen size={24} />
+      </div>
+
+      <div className="card-info">
+        <div className="card-title-row">
+          <h3>{lb.title}</h3>
+          <LogbookRoleBadge role={lb.accessRole} />
+        </div>
+        <div className="card-meta">
+          <span className={`sync-badge ${lb.isSynced ? 'synced' : 'local'}`}>
+            {lb.isSynced ? t('dashboard.status_synced') : t('dashboard.status_local')}
+          </span>
+          {lb.isDemo && (
+            <span className="demo-badge">{t('demo.badge')}</span>
+          )}
+          <span className="date-badge">
+            {new Date(lb.updatedAt).toLocaleDateString(i18n.language, {
+              year: 'numeric',
+              month: 'short',
+              day: 'numeric'
+            })}
+          </span>
+        </div>
+      </div>
+
+      <button
+        className="btn-delete"
+        onClick={(e) => handleDelete(lb.id, e)}
+        title={t('dashboard.delete_btn')}
+        style={{ visibility: lb.isShared ? 'hidden' : 'visible' }}
+      >
+        <Trash2 size={18} />
+      </button>
+    </div>
+  )
+
+  const renderLogbookSection = (
+    title: string,
+    items: DecryptedLogbook[],
+    hint?: string
+  ) => (
+    <div className="logbook-section">
+      <div className="logbook-section-header">
+        <h3>{title}</h3>
+        {hint && <p className="logbook-section-hint">{hint}</p>}
+      </div>
+      <div className="logbooks-grid">
+        {items.map(renderLogbookCard)}
+      </div>
+    </div>
+  )
+
   return (
     <div className="dashboard-container">
       {/* Premium Dashboard Header */}
@@ -199,42 +264,16 @@ export default function LogbookDashboard({ onSelectLogbook, onLogout }: LogbookD
           ) : logbooks.length === 0 ? (
             <div className="dashboard-status-msg glass">{t('dashboard.no_logbooks')}</div>
           ) : (
-            <div className="logbooks-grid">
-              {logbooks.map((lb) => (
-                <div key={lb.id} className="logbook-card glass" onClick={() => onSelectLogbook(lb.id, lb.title)}>
-                  <div className="card-icon">
-                    <BookOpen size={24} />
-                  </div>
-                  
-                  <div className="card-info">
-                    <h3>{lb.title}</h3>
-                    <div className="card-meta">
-                      <span className={`sync-badge ${lb.isSynced ? 'synced' : 'local'}`}>
-                        {lb.isSynced ? t('dashboard.status_synced') : t('dashboard.status_local')}
-                      </span>
-                      {lb.isDemo && (
-                        <span className="demo-badge">{t('demo.badge')}</span>
-                      )}
-                      <span className="date-badge">
-                        {new Date(lb.updatedAt).toLocaleDateString(i18n.language, {
-                          year: 'numeric',
-                          month: 'short',
-                          day: 'numeric'
-                        })}
-                      </span>
-                    </div>
-                  </div>
-
-                  <button
-                    className="btn-delete"
-                    onClick={(e) => handleDelete(lb.id, e)}
-                    title={t('dashboard.delete_btn')}
-                    style={{ visibility: lb.isShared ? 'hidden' : 'visible' }}
-                  >
-                    <Trash2 size={18} />
-                  </button>
-                </div>
-              ))}
+            <div className="logbook-sections">
+              {ownedLogbooks.length > 0 && renderLogbookSection(
+                sharedLogbooks.length > 0 ? t('dashboard.section_owned') : t('dashboard.title'),
+                ownedLogbooks
+              )}
+              {sharedLogbooks.length > 0 && renderLogbookSection(
+                t('dashboard.section_shared'),
+                sharedLogbooks,
+                t('dashboard.section_shared_hint')
+              )}
             </div>
           )}
         </section>

client/src/components/LogbookRoleBadge.tsx

@@ -0,0 +1,37 @@
+import { useTranslation } from 'react-i18next'
+import { Anchor, Eye, Users } from 'lucide-react'
+import type { LogbookAccessRole } from '../services/logbook.js'
+
+interface LogbookRoleBadgeProps {
+  role: LogbookAccessRole
+  className?: string
+}
+
+export default function LogbookRoleBadge({ role, className = '' }: LogbookRoleBadgeProps) {
+  const { t } = useTranslation()
+
+  if (role === 'OWNER') {
+    return (
+      <span className={`role-badge role-badge--owner ${className}`.trim()} title={t('dashboard.role_owner_hint')}>
+        <Anchor size={12} aria-hidden="true" />
+        {t('dashboard.role_owner')}
+      </span>
+    )
+  }
+
+  if (role === 'READ') {
+    return (
+      <span className={`role-badge role-badge--read ${className}`.trim()} title={t('dashboard.role_read_hint')}>
+        <Eye size={12} aria-hidden="true" />
+        {t('dashboard.role_read')}
+      </span>
+    )
+  }
+
+  return (
+    <span className={`role-badge role-badge--crew ${className}`.trim()} title={t('dashboard.role_crew_hint')}>
+      <Users size={12} aria-hidden="true" />
+      {t('dashboard.role_crew')}
+    </span>
+  )
+}

client/src/components/ModalDialog.tsx

@@ -1,4 +1,4 @@
-import React, { createContext, useContext, useState, useRef } from 'react'
+import React, { createContext, useContext, useState, useRef, useCallback, useMemo } from 'react'
 
 interface DialogContextType {
   showAlert: (message: string, title?: string, confirmText?: string) => Promise<void>
@@ -25,7 +25,7 @@ export function DialogProvider({ children }: { children: React.ReactNode }) {
 
   const resolveRef = useRef<((val: any) => void) | null>(null)
 
-  const showAlert = (msg: string, headerTitle?: string, btnText?: string): Promise<void> => {
+  const showAlert = useCallback((msg: string, headerTitle?: string, btnText?: string): Promise<void> => {
     setMessage(msg)
     setTitle(headerTitle || '')
     setType('alert')
@@ -35,9 +35,14 @@ export function DialogProvider({ children }: { children: React.ReactNode }) {
     return new Promise<void>((resolve) => {
       resolveRef.current = resolve
     })
-  }
+  }, [])
 
-  const showConfirm = (msg: string, headerTitle?: string, btnConfirm?: string, btnCancel?: string): Promise<boolean> => {
+  const showConfirm = useCallback((
+    msg: string,
+    headerTitle?: string,
+    btnConfirm?: string,
+    btnCancel?: string
+  ): Promise<boolean> => {
     setMessage(msg)
     setTitle(headerTitle || '')
     setType('confirm')
@@ -48,26 +53,31 @@ export function DialogProvider({ children }: { children: React.ReactNode }) {
     return new Promise<boolean>((resolve) => {
       resolveRef.current = resolve
     })
-  }
+  }, [])
 
-  const handleConfirm = () => {
+  const handleConfirm = useCallback(() => {
     setIsOpen(false)
     if (resolveRef.current) {
       resolveRef.current(type === 'confirm' ? true : undefined)
       resolveRef.current = null
     }
-  }
+  }, [type])
 
-  const handleCancel = () => {
+  const handleCancel = useCallback(() => {
     setIsOpen(false)
     if (resolveRef.current) {
       resolveRef.current(false)
       resolveRef.current = null
     }
-  }
+  }, [])
+
+  const contextValue = useMemo(
+    () => ({ showAlert, showConfirm }),
+    [showAlert, showConfirm]
+  )
 
   return (
-    <DialogContext.Provider value={{ showAlert, showConfirm }}>
+    <DialogContext.Provider value={contextValue}>
       {children}
       {isOpen && (
         <div className="custom-dialog-overlay" onClick={type === 'alert' ? handleConfirm : undefined}>

client/src/components/MultiTrackMap.tsx

@@ -0,0 +1,179 @@
+import { Component, useEffect, useMemo, useRef } from 'react'
+import type { ErrorInfo, ReactNode } from 'react'
+import { useTranslation } from 'react-i18next'
+import L from 'leaflet'
+import type { TrackSegment } from '../services/statsAggregation.js'
+import { getTrackColor } from '../services/statsAggregation.js'
+import type { TrackWaypoint } from '../services/trackUpload.js'
+
+interface MultiTrackMapProps {
+  segments: TrackSegment[]
+}
+
+const LINE_WEIGHT = 4
+const LINE_OPACITY = 0.88
+
+function isValidWaypoint(wp: TrackWaypoint): boolean {
+  return Number.isFinite(Number(wp.lat)) && Number.isFinite(Number(wp.lng))
+}
+
+function toLatLngs(waypoints: TrackWaypoint[]): [number, number][] {
+  return waypoints
+    .filter(isValidWaypoint)
+    .map((wp) => [Number(wp.lat), Number(wp.lng)] as [number, number])
+}
+
+function MultiTrackMapInner({ segments }: MultiTrackMapProps) {
+  const { t } = useTranslation()
+  const containerRef = useRef<HTMLDivElement | null>(null)
+
+  const segmentsKey = useMemo(
+    () =>
+      segments
+        .map((seg) =>
+          seg.waypoints
+            .filter(isValidWaypoint)
+            .map((wp) => `${seg.entryId}:${wp.lat},${wp.lng}`)
+            .join('|')
+        )
+        .join('||'),
+    [segments]
+  )
+
+  useEffect(() => {
+    const container = containerRef.current
+    if (!container || segments.length === 0) return
+
+    let cancelled = false
+    const pendingFrames: number[] = []
+
+    const map = L.map(container, {
+      zoomControl: true,
+      attributionControl: true
+    })
+
+    L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
+      maxZoom: 19,
+      attribution: '&copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors'
+    }).addTo(map)
+
+    L.tileLayer('https://tiles.openseamap.org/seamark/{z}/{x}/{y}.png', {
+      maxZoom: 18,
+      attribution: 'Map data &copy; <a href="http://openseamap.org">OpenSeaMap</a> contributors'
+    }).addTo(map)
+
+    const trackGroup = L.layerGroup().addTo(map)
+    const allLatLngs: [number, number][] = []
+
+    for (const segment of segments) {
+      const latLngs = toLatLngs(segment.waypoints)
+      if (latLngs.length < 2) continue
+
+      allLatLngs.push(...latLngs)
+      const color = getTrackColor(segment.colorIndex)
+
+      L.polyline(latLngs, {
+        color,
+        weight: LINE_WEIGHT,
+        opacity: LINE_OPACITY,
+        lineCap: 'round',
+        lineJoin: 'round'
+      })
+        .addTo(trackGroup)
+        .bindPopup(t('stats.day_label', { day: segment.dayOfTravel }))
+
+      L.circleMarker(latLngs[0], {
+        radius: 7,
+        fillColor: color,
+        fillOpacity: 0.95,
+        color: '#ffffff',
+        weight: 2
+      })
+        .addTo(trackGroup)
+        .bindPopup(`${t('stats.day_label', { day: segment.dayOfTravel })} – ${t('logs.track_map_start')}`)
+    }
+
+    if (allLatLngs.length > 0) {
+      pendingFrames.push(
+        requestAnimationFrame(() => {
+          if (cancelled) return
+          map.invalidateSize({ animate: false })
+          pendingFrames.push(
+            requestAnimationFrame(() => {
+              if (cancelled) return
+              try {
+                const bounds = L.latLngBounds(allLatLngs.map(([lat, lng]) => L.latLng(lat, lng)))
+                if (bounds.isValid()) {
+                  map.fitBounds(bounds, { padding: [24, 24], maxZoom: 12, animate: false })
+                }
+              } catch {
+                map.setView(allLatLngs[0], 11, { animate: false })
+              }
+            })
+          )
+        })
+      )
+    }
+
+    return () => {
+      cancelled = true
+      pendingFrames.forEach((id) => cancelAnimationFrame(id))
+      map.remove()
+    }
+  }, [segmentsKey, segments, t])
+
+  if (segments.length === 0) return null
+
+  return (
+    <div className="track-map-wrapper">
+      <div
+        className="track-map-container stats-multi-track-map"
+        ref={containerRef}
+        aria-label={t('stats.route_map_title')}
+      />
+      <div className="stats-track-legend" aria-hidden="true">
+        {segments.map((seg) => (
+          <span key={seg.entryId} className="stats-track-legend-item">
+            <span
+              className="stats-track-legend-swatch"
+              style={{ backgroundColor: getTrackColor(seg.colorIndex) }}
+            />
+            {t('stats.day_label', { day: seg.dayOfTravel })}
+          </span>
+        ))}
+      </div>
+    </div>
+  )
+}
+
+class MultiTrackMapErrorBoundary extends Component<
+  { children: ReactNode; fallback: ReactNode },
+  { hasError: boolean }
+> {
+  state = { hasError: false }
+
+  static getDerivedStateFromError() {
+    return { hasError: true }
+  }
+
+  componentDidCatch(error: Error, info: ErrorInfo) {
+    console.error('MultiTrackMap render failed:', error, info)
+  }
+
+  render() {
+    if (this.state.hasError) return this.props.fallback
+    return this.props.children
+  }
+}
+
+export default function MultiTrackMap(props: MultiTrackMapProps) {
+  const { t } = useTranslation()
+
+  return (
+    <MultiTrackMapErrorBoundary
+      fallback={<div className="track-error-msg">{t('logs.track_map_error')}</div>}
+    >
+      <MultiTrackMapInner {...props} />
+    </MultiTrackMapErrorBoundary>
+  )
+}

client/src/components/PhotoCapture.tsx

@@ -5,6 +5,7 @@ import { getActiveMasterKey } from '../services/auth.js'
 import { getLogbookKey } from '../services/logbookKeys.js'
 import { encryptJson, decryptJson } from '../services/crypto.js'
 import { syncLogbook } from '../services/sync.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import { useLiveQuery } from 'dexie-react-hooks'
 import { useDialog } from './ModalDialog.tsx'
 import { Camera, Trash2 } from 'lucide-react'
@@ -159,7 +160,8 @@ export default function PhotoCapture({ entryId, logbookId, readOnly = false, pre
 
           setCaption('')
           if (fileInputRef.current) fileInputRef.current.value = ''
-          
+          trackPlausibleEvent(PlausibleEvents.PHOTO_UPLOADED, { context: 'logbook' })
+
           syncLogbook(logbookId).catch((err) => console.warn('Background sync failed:', err))
         } catch (err: any) {
           console.error('Failed to process image:', err)

client/src/components/PwaUpdatePrompt.tsx

@@ -5,11 +5,10 @@ import { usePwaUpdate } from '../hooks/usePwaUpdate.js'
 
 export default function PwaUpdatePrompt() {
   const { t } = useTranslation()
-  const { needRefresh, updateApp } = usePwaUpdate()
+  const { needRefresh, updateApp, dismissUpdate } = usePwaUpdate()
   const [updating, setUpdating] = useState(false)
-  const [dismissed, setDismissed] = useState(false)
 
-  if (!needRefresh || dismissed) return null
+  if (!needRefresh) return null
 
   const handleUpdate = async () => {
     setUpdating(true)
@@ -43,7 +42,7 @@ export default function PwaUpdatePrompt() {
         <button
           type="button"
           className="pwa-update-link"
-          onClick={() => setDismissed(true)}
+          onClick={dismissUpdate}
         >
           {t('pwa.later')}
         </button>
@@ -52,7 +51,7 @@ export default function PwaUpdatePrompt() {
       <button
         type="button"
         className="pwa-update-close"
-        onClick={() => setDismissed(true)}
+        onClick={dismissUpdate}
         aria-label={t('pwa.later')}
       >
         <X size={18} />

client/src/components/SettingsForm.tsx

@@ -2,15 +2,18 @@ import React, { useState, useEffect } from 'react'
 import { useTranslation } from 'react-i18next'
 import { Settings as SettingsIcon, Save, Check, Users, Trash2, Copy, Link as LinkIcon, Compass } from 'lucide-react'
 import { ensureLogbookKey } from '../services/logbookKeys.js'
+import LogbookBackupPanel from './LogbookBackupPanel.tsx'
 import AccountDangerZone from './AccountDangerZone.tsx'
 import PwaInstallPrompt from './PwaInstallPrompt.tsx'
 import { useDialog } from './ModalDialog.tsx'
 import { notifyAppearanceChanged } from '../services/appearance.js'
 import ThemedSelect from './ThemedSelect.tsx'
 import { useAppTour } from '../context/AppTourContext.tsx'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 
 interface SettingsFormProps {
   logbookId?: string | null
+  onLogbookRestored?: (logbookId: string, title: string) => void
 }
 
 interface Collaborator {
@@ -28,7 +31,7 @@ const bufferToHex = (buffer: ArrayBuffer): string => {
     .join('')
 }
 
-export default function SettingsForm({ logbookId }: SettingsFormProps) {
+export default function SettingsForm({ logbookId, onLogbookRestored }: SettingsFormProps) {
   const { t } = useTranslation()
   const { showConfirm, showAlert } = useDialog()
   const { restartTour } = useAppTour()
@@ -208,6 +211,7 @@ export default function SettingsForm({ logbookId }: SettingsFormProps) {
       const link = `${window.location.origin}/invite?token=${invite.token}#key=${hexKey}`
       
       setInviteLink(link)
+      trackPlausibleEvent(PlausibleEvents.INVITE_GENERATED)
     } catch (err: any) {
       console.error('Failed to generate invite:', err)
       showAlert(err.message || 'Failed to generate invite link.')
@@ -452,6 +456,11 @@ export default function SettingsForm({ logbookId }: SettingsFormProps) {
         </div>
       )}
 
+      {/* Backup & Restore (owner only) */}
+      {logbookId && isOwner && (
+        <LogbookBackupPanel logbookId={logbookId} onRestored={onLogbookRestored} />
+      )}
+
       {/* Crew Collaboration Card (Only visible to Logbook Owner) */}
       {logbookId && isOwner && (
         <div className="member-editor-card glass mt-6" style={{ borderTop: '1px solid rgba(255,255,255,0.05)', paddingTop: '24px' }}>

client/src/components/StatsDashboard.tsx

@@ -0,0 +1,417 @@
+import { useCallback, useEffect, useMemo, useState, type ReactNode } from 'react'
+import { useTranslation } from 'react-i18next'
+import { BarChart2, Anchor, Droplets, Fuel, Sailboat, Gauge } from 'lucide-react'
+import MultiTrackMap from './MultiTrackMap.tsx'
+import {
+  formatLiters,
+  formatNm,
+  loadAccountStats,
+  loadLogbookStats,
+  type LogbookStatsSummary,
+  type StatsTotals,
+  type TravelDayStats
+} from '../services/statsAggregation.js'
+import { compareTravelDaysChronological } from '../utils/logEntryTankLevels.js'
+
+interface StatsDashboardProps {
+  logbookId: string
+  logbookTitle: string
+}
+
+type StatsScope = 'logbook' | 'account'
+
+function maxBarValue(days: TravelDayStats[], pick: (d: TravelDayStats) => number): number {
+  if (days.length === 0) return 1
+  return Math.max(1, ...days.map(pick))
+}
+
+function KpiCard({
+  icon,
+  label,
+  value,
+  unit
+}: {
+  icon: ReactNode
+  label: string
+  value: string
+  unit?: string
+}) {
+  return (
+    <div className="stats-kpi-card glass">
+      <div className="stats-kpi-icon">{icon}</div>
+      <div className="stats-kpi-body">
+        <span className="stats-kpi-label">{label}</span>
+        <span className="stats-kpi-value">
+          {value}
+          {unit ? <span className="stats-kpi-unit">{unit}</span> : null}
+        </span>
+      </div>
+    </div>
+  )
+}
+
+function TotalsGrid({ totals }: { totals: StatsTotals }) {
+  const { t } = useTranslation()
+
+  return (
+    <div className="stats-kpi-grid">
+      <KpiCard
+        icon={<Gauge size={20} />}
+        label={t('stats.total_distance')}
+        value={formatNm(totals.totalDistanceNm)}
+        unit={t('stats.unit_nm')}
+      />
+      <KpiCard
+        icon={<Anchor size={20} />}
+        label={t('stats.travel_days')}
+        value={String(totals.travelDayCount)}
+      />
+      <KpiCard
+        icon={<Sailboat size={20} />}
+        label={t('stats.sail_distance')}
+        value={formatNm(totals.sailDistanceNm)}
+        unit={t('stats.unit_nm')}
+      />
+      <KpiCard
+        icon={<Gauge size={20} />}
+        label={t('stats.motor_distance')}
+        value={formatNm(totals.motorDistanceNm)}
+        unit={t('stats.unit_nm')}
+      />
+      <KpiCard
+        icon={<Fuel size={20} />}
+        label={t('stats.fuel_total')}
+        value={formatLiters(totals.totalFuelL)}
+        unit={t('stats.unit_l')}
+      />
+      <KpiCard
+        icon={<Droplets size={20} />}
+        label={t('stats.water_total')}
+        value={formatLiters(totals.totalFreshwaterL)}
+        unit={t('stats.unit_l')}
+      />
+    </div>
+  )
+}
+
+function DailyBarChart({
+  days,
+  valueFn,
+  barClass,
+  formatValue
+}: {
+  days: TravelDayStats[]
+  valueFn: (d: TravelDayStats) => number
+  barClass: string
+  formatValue: (v: number) => string
+}) {
+  const { t } = useTranslation()
+  const max = maxBarValue(days, valueFn)
+
+  return (
+    <div className="stats-bar-chart" role="img" aria-label={t('stats.daily_etmal')}>
+      {days.map((day) => {
+        const value = valueFn(day)
+        const heightPct = max > 0 ? Math.max(2, (value / max) * 100) : 0
+        const label = day.date
+          ? new Date(day.date).toLocaleDateString(undefined, { day: '2-digit', month: '2-digit' })
+          : t('stats.day_label', { day: day.dayOfTravel })
+
+        return (
+          <div key={day.entryId} className="stats-bar-column" title={`${label}: ${formatValue(value)}`}>
+            <span className="stats-bar-value">{value > 0 ? formatValue(value) : ''}</span>
+            <div className="stats-bar-track">
+              <div className={`stats-bar ${barClass}`} style={{ height: `${heightPct}%` }} />
+            </div>
+            <span className="stats-bar-label">{label}</span>
+            <span className="stats-bar-sublabel">{t('stats.day_label', { day: day.dayOfTravel })}</span>
+          </div>
+        )
+      })}
+    </div>
+  )
+}
+
+function ConsumptionChart({ days }: { days: TravelDayStats[] }) {
+  const { t } = useTranslation()
+  const max = maxBarValue(days, (d) => Math.max(d.fuelConsumptionL, d.freshwaterConsumptionL))
+
+  return (
+    <div className="stats-bar-chart stats-consumption-chart" role="img" aria-label={t('stats.daily_consumption')}>
+      {days.map((day) => {
+        const fuelH = max > 0 ? Math.max(2, (day.fuelConsumptionL / max) * 100) : 0
+        const waterH = max > 0 ? Math.max(2, (day.freshwaterConsumptionL / max) * 100) : 0
+        const label = day.date
+          ? new Date(day.date).toLocaleDateString(undefined, { day: '2-digit', month: '2-digit' })
+          : t('stats.day_label', { day: day.dayOfTravel })
+
+        return (
+          <div key={day.entryId} className="stats-bar-column stats-bar-column--grouped">
+            <div className="stats-bar-group">
+              <div className="stats-bar-track stats-bar-track--short">
+                <div className="stats-bar stats-bar--fuel" style={{ height: `${fuelH}%` }} />
+              </div>
+              <div className="stats-bar-track stats-bar-track--short">
+                <div className="stats-bar stats-bar--water" style={{ height: `${waterH}%` }} />
+              </div>
+            </div>
+            <span className="stats-bar-label">{label}</span>
+          </div>
+        )
+      })}
+      <div className="stats-consumption-legend">
+        <span><span className="stats-legend-swatch stats-bar--fuel" /> {t('stats.fuel_legend')}</span>
+        <span><span className="stats-legend-swatch stats-bar--water" /> {t('stats.water_legend')}</span>
+      </div>
+    </div>
+  )
+}
+
+function PropulsionBreakdown({ totals }: { totals: StatsTotals }) {
+  const { t } = useTranslation()
+  const total = totals.sailDistanceNm + totals.motorDistanceNm + totals.unknownPropulsionNm
+  if (total <= 0) return null
+
+  const sailPct = (totals.sailDistanceNm / total) * 100
+  const motorPct = (totals.motorDistanceNm / total) * 100
+  const unknownPct = (totals.unknownPropulsionNm / total) * 100
+
+  return (
+    <div className="stats-propulsion">
+      <div className="stats-propulsion-bar" role="img" aria-label={t('stats.propulsion_title')}>
+        {totals.sailDistanceNm > 0 && (
+          <div className="stats-propulsion-segment stats-propulsion-segment--sail" style={{ width: `${sailPct}%` }} />
+        )}
+        {totals.motorDistanceNm > 0 && (
+          <div className="stats-propulsion-segment stats-propulsion-segment--motor" style={{ width: `${motorPct}%` }} />
+        )}
+        {totals.unknownPropulsionNm > 0 && (
+          <div className="stats-propulsion-segment stats-propulsion-segment--unknown" style={{ width: `${unknownPct}%` }} />
+        )}
+      </div>
+      <div className="stats-propulsion-labels">
+        <span>{t('stats.sail_distance')}: {formatNm(totals.sailDistanceNm)} {t('stats.unit_nm')} ({sailPct.toFixed(0)}%)</span>
+        <span>{t('stats.motor_distance')}: {formatNm(totals.motorDistanceNm)} {t('stats.unit_nm')} ({motorPct.toFixed(0)}%)</span>
+        {totals.unknownPropulsionNm > 0 && (
+          <span>{t('stats.unknown_propulsion')}: {formatNm(totals.unknownPropulsionNm)} {t('stats.unit_nm')}</span>
+        )}
+      </div>
+      <p className="stats-hint">{t('stats.propulsion_hint')}</p>
+    </div>
+  )
+}
+
+function LogbookScopeView({ summary }: { summary: LogbookStatsSummary }) {
+  const { t } = useTranslation()
+  const { travelDays, routePorts, trackSegments, totals } = summary
+
+  if (travelDays.length === 0) {
+    return <div className="dashboard-status-msg">{t('stats.no_data')}</div>
+  }
+
+  return (
+    <>
+      <TotalsGrid totals={totals} />
+
+      {routePorts.length > 0 && (
+        <div className="member-editor-card glass mt-6">
+          <h3 className="stats-section-title">{t('stats.route_overview')}</h3>
+          <p className="stats-route-chain">
+            {routePorts.map((port, idx) => (
+              <span key={`${port}-${idx}`}>
+                {idx > 0 && <span className="stats-route-arrow"> → </span>}
+                {port}
+              </span>
+            ))}
+          </p>
+        </div>
+      )}
+
+      {trackSegments.length > 0 && (
+        <div className="member-editor-card glass mt-6">
+          <h3 className="stats-section-title">{t('stats.route_map_title')}</h3>
+          <MultiTrackMap segments={trackSegments} />
+        </div>
+      )}
+
+      <div className="member-editor-card glass mt-6">
+        <h3 className="stats-section-title">{t('stats.daily_etmal')}</h3>
+        <p className="stats-section-sub">
+          {t('stats.avg_distance')}: {formatNm(totals.avgDistancePerDayNm)} {t('stats.unit_nm')}
+        </p>
+        <DailyBarChart
+          days={travelDays}
+          valueFn={(d) => d.distanceNm}
+          barClass="stats-bar--distance"
+          formatValue={formatNm}
+        />
+      </div>
+
+      <div className="member-editor-card glass mt-6">
+        <h3 className="stats-section-title">{t('stats.daily_consumption')}</h3>
+        <p className="stats-section-sub">
+          {t('stats.avg_fuel')}: {formatLiters(totals.avgFuelPerDayL)} {t('stats.unit_l')}
+          {' · '}
+          {t('stats.avg_water')}: {formatLiters(totals.avgFreshwaterPerDayL)} {t('stats.unit_l')}
+          {totals.fuelPerNmL != null && (
+            <> · {t('stats.fuel_per_nm')}: {totals.fuelPerNmL} {t('stats.unit_l')}/{t('stats.unit_nm')}</>
+          )}
+        </p>
+        <ConsumptionChart days={travelDays} />
+      </div>
+
+      <div className="member-editor-card glass mt-6">
+        <h3 className="stats-section-title">{t('stats.propulsion_title')}</h3>
+        <PropulsionBreakdown totals={totals} />
+      </div>
+    </>
+  )
+}
+
+export default function StatsDashboard({ logbookId, logbookTitle }: StatsDashboardProps) {
+  const { t } = useTranslation()
+  const [scope, setScope] = useState<StatsScope>('logbook')
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState<string | null>(null)
+  const [logbookStats, setLogbookStats] = useState<LogbookStatsSummary | null>(null)
+  const [accountStats, setAccountStats] = useState<Awaited<ReturnType<typeof loadAccountStats>> | null>(null)
+
+  const loadData = useCallback(async () => {
+    setLoading(true)
+    setError(null)
+    try {
+      const [lb, acc] = await Promise.all([
+        loadLogbookStats(logbookId, logbookTitle, true),
+        loadAccountStats(false)
+      ])
+      setLogbookStats(lb)
+      setAccountStats(acc)
+    } catch (err: unknown) {
+      console.error('Failed to load statistics:', err)
+      setError(err instanceof Error ? err.message : 'Failed to load statistics.')
+    } finally {
+      setLoading(false)
+    }
+  }, [logbookId, logbookTitle])
+
+  useEffect(() => {
+    void loadData()
+  }, [loadData])
+
+  const accountLogbooksWithDays = useMemo(
+    () => accountStats?.logbooks.filter((lb) => lb.travelDays.length > 0) ?? [],
+    [accountStats]
+  )
+
+  const allAccountDays = useMemo(() => {
+    if (!accountStats) return []
+    const days = accountStats.logbooks.flatMap((lb) => lb.travelDays)
+    return [...days].sort(compareTravelDaysChronological)
+  }, [accountStats])
+
+  return (
+    <div className="form-card">
+      <div className="form-header">
+        <BarChart2 size={24} className="form-icon" />
+        <div>
+          <h2>{t('stats.title')}</h2>
+          <p className="stats-subtitle">{t('stats.subtitle')}</p>
+        </div>
+      </div>
+
+      <div className="stats-scope-toggle" role="tablist" aria-label={t('stats.scope_label')}>
+        <button
+          type="button"
+          role="tab"
+          aria-selected={scope === 'logbook'}
+          className={`btn ${scope === 'logbook' ? 'primary' : 'secondary'}`}
+          onClick={() => setScope('logbook')}
+        >
+          {t('stats.scope_logbook')}
+        </button>
+        <button
+          type="button"
+          role="tab"
+          aria-selected={scope === 'account'}
+          className={`btn ${scope === 'account' ? 'primary' : 'secondary'}`}
+          onClick={() => setScope('account')}
+        >
+          {t('stats.scope_account')}
+        </button>
+      </div>
+
+      {error && <div className="auth-error mt-4">{error}</div>}
+
+      {loading ? (
+        <div className="tab-placeholder mt-6">
+          <BarChart2 className="header-logo spin" size={48} />
+          <p>{t('stats.loading')}</p>
+        </div>
+      ) : scope === 'logbook' && logbookStats ? (
+        <LogbookScopeView summary={logbookStats} />
+      ) : scope === 'account' && accountStats ? (
+        <>
+          <TotalsGrid totals={accountStats.totals} />
+
+          {accountLogbooksWithDays.length === 0 ? (
+            <div className="dashboard-status-msg mt-6">{t('stats.no_data')}</div>
+          ) : (
+            <>
+              <div className="member-editor-card glass mt-6">
+                <h3 className="stats-section-title">{t('stats.account_logbooks')}</h3>
+                <div className="stats-account-table-wrap">
+                  <table className="stats-account-table">
+                    <thead>
+                      <tr>
+                        <th>{t('stats.col_logbook')}</th>
+                        <th>{t('stats.travel_days')}</th>
+                        <th>{t('stats.total_distance')}</th>
+                        <th>{t('stats.fuel_total')}</th>
+                        <th>{t('stats.water_total')}</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      {accountLogbooksWithDays.map((lb) => (
+                        <tr key={lb.logbookId}>
+                          <td>{lb.title}</td>
+                          <td>{lb.totals.travelDayCount}</td>
+                          <td>{formatNm(lb.totals.totalDistanceNm)} {t('stats.unit_nm')}</td>
+                          <td>{formatLiters(lb.totals.totalFuelL)} {t('stats.unit_l')}</td>
+                          <td>{formatLiters(lb.totals.totalFreshwaterL)} {t('stats.unit_l')}</td>
+                        </tr>
+                      ))}
+                    </tbody>
+                  </table>
+                </div>
+              </div>
+
+              {accountStats.totals.travelDayCount > 0 && (
+                <>
+                  <div className="member-editor-card glass mt-6">
+                    <h3 className="stats-section-title">{t('stats.daily_etmal')}</h3>
+                    <DailyBarChart
+                      days={allAccountDays}
+                      valueFn={(d) => d.distanceNm}
+                      barClass="stats-bar--distance"
+                      formatValue={formatNm}
+                    />
+                  </div>
+
+                  <div className="member-editor-card glass mt-6">
+                    <h3 className="stats-section-title">{t('stats.daily_consumption')}</h3>
+                    <ConsumptionChart days={allAccountDays} />
+                  </div>
+
+                  <div className="member-editor-card glass mt-6">
+                    <h3 className="stats-section-title">{t('stats.propulsion_title')}</h3>
+                    <PropulsionBreakdown totals={accountStats.totals} />
+                  </div>
+                </>
+              )}
+            </>
+          )}
+        </>
+      ) : null}
+    </div>
+  )
+}

client/src/components/VesselForm.tsx

@@ -5,6 +5,7 @@ import { getActiveMasterKey } from '../services/auth.js'
 import { getLogbookKey } from '../services/logbookKeys.js'
 import { encryptJson, decryptJson } from '../services/crypto.js'
 import { syncLogbook } from '../services/sync.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 import { Ship, Save, Check, Plus, X, Camera, Trash2 } from 'lucide-react'
 
 interface VesselFormProps {
@@ -251,6 +252,7 @@ export default function VesselForm({ logbookId, readOnly = false, preloadedData
       })
 
       setSuccess(true)
+      trackPlausibleEvent(PlausibleEvents.VESSEL_SAVED)
       setTimeout(() => setSuccess(false), 3000)
 
       // Trigger background sync task

client/src/components/icons/CaptainCap.tsx

@@ -0,0 +1,29 @@
+import type { SVGProps } from 'react'
+
+interface CaptainCapProps extends SVGProps<SVGSVGElement> {
+  size?: number | string
+}
+
+/** Skipper-/Kapitänsmütze im Lucide-Strichstil (nicht in lucide-react enthalten). */
+export default function CaptainCap({ size = 24, ...props }: CaptainCapProps) {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth={2}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      aria-hidden
+      {...props}
+    >
+      <path d="M5 11c0-3.5 3-6 7-6s7 2.5 7 6" />
+      <path d="M4 11h16" />
+      <path d="M4 11c0 2.5 3.2 4.5 8 4.5S20 13.5 20 11" />
+      <path d="M8 11h8" />
+    </svg>
+  )
+}

client/src/context/AppTourContext.tsx

@@ -11,11 +11,13 @@ import {
 import {
   clearTourCompleted,
   isTourCompleted,
-  markTourCompleted
+  markTourCompleted,
+  resolveTourUserId
 } from '../services/appTourStorage.js'
 import { getStoredDemoFirstEntryId } from '../services/demoLogbook.js'
+import { PlausibleEvents, trackPlausibleEvent } from '../services/analytics.js'
 
-export type AppTab = 'vessel' | 'crew' | 'logs' | 'settings'
+export type AppTab = 'vessel' | 'crew' | 'logs' | 'stats' | 'settings'
 
 export type TourStepId =
   | 'welcome'
@@ -32,18 +34,24 @@ interface TourNavigation {
   setSelectedEntryId: (entryId: string | null) => void
 }
 
+interface DemoTourContext {
+  firstEntryId: string
+}
+
 interface AppTourContextValue {
   isActive: boolean
+  isDemoTour: boolean
   currentStepId: TourStepId | null
   currentStepIndex: number
   totalSteps: number
-  startTour: (options?: { force?: boolean }) => void
+  startTour: (options?: { force?: boolean; demoMode?: boolean }) => void
   stopTour: () => void
   restartTour: () => void
   nextStep: () => void
   prevStep: () => void
   skipTour: () => void
   registerNavigation: (navigation: TourNavigation) => void
+  registerDemoTourContext: (context: DemoTourContext | null) => void
   requestStartAfterLogin: () => void
 }
 
@@ -73,10 +81,17 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
   const [isActive, setIsActive] = useState(false)
   const [stepIndex, setStepIndex] = useState(0)
   const [pendingAfterLogin, setPendingAfterLogin] = useState(false)
+  const [isDemoTour, setIsDemoTour] = useState(false)
   const navigationRef = useRef<TourNavigation | null>(null)
+  const demoContextRef = useRef<DemoTourContext | null>(null)
+  const tourModeRef = useRef<{ demoMode: boolean }>({ demoMode: false })
 
   const currentStepId = isActive ? STEP_ORDER[stepIndex] ?? null : null
 
+  const resolveFirstEntryId = useCallback((): string | null => {
+    return demoContextRef.current?.firstEntryId ?? getStoredDemoFirstEntryId()
+  }, [])
+
   const applyStepSideEffects = useCallback((stepId: TourStepId) => {
     const nav = navigationRef.current
     if (!nav) return
@@ -85,7 +100,7 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
       nav.setActiveTab('logs')
     }
     if (stepId === 'entry_open' || stepId === 'entry_track') {
-      const firstEntryId = getStoredDemoFirstEntryId()
+      const firstEntryId = resolveFirstEntryId()
       if (firstEntryId) nav.setSelectedEntryId(firstEntryId)
     }
     if (stepId === 'nav_vessel') {
@@ -96,7 +111,7 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
       nav.setSelectedEntryId(null)
       nav.setActiveTab('crew')
     }
-  }, [])
+  }, [resolveFirstEntryId])
 
   const scrollToCurrentTarget = useCallback((stepId: TourStepId | null) => {
     if (!stepId) return
@@ -108,34 +123,51 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
     })
   }, [])
 
-  const startTour = useCallback((options?: { force?: boolean }) => {
-    const userId = localStorage.getItem('active_userid')
+  const startTour = useCallback((options?: { force?: boolean; demoMode?: boolean }) => {
+    const demoMode = options?.demoMode === true
+    const userId = resolveTourUserId({ demoMode })
     if (!userId) return
     if (!options?.force && isTourCompleted(userId)) return
 
+    tourModeRef.current = { demoMode }
+    setIsDemoTour(demoMode)
     setStepIndex(0)
     setIsActive(true)
   }, [])
 
-  const finishTour = useCallback(() => {
-    const userId = localStorage.getItem('active_userid')
+  const dismissTour = useCallback((outcome: 'completed' | 'skipped', stepIndexAtDismiss: number) => {
+    const userId = resolveTourUserId({ demoMode: tourModeRef.current.demoMode })
     if (userId) markTourCompleted(userId)
+
+    const tourProps = tourModeRef.current.demoMode ? { mode: 'demo' } : undefined
+    if (outcome === 'completed') {
+      trackPlausibleEvent(PlausibleEvents.ONBOARDING_TOUR_COMPLETED, tourProps)
+    } else {
+      const step = STEP_ORDER[stepIndexAtDismiss] ?? 'welcome'
+      trackPlausibleEvent(PlausibleEvents.ONBOARDING_TOUR_SKIPPED, { step, ...tourProps })
+    }
+
+    tourModeRef.current = { demoMode: false }
+    setIsDemoTour(false)
     setIsActive(false)
     setStepIndex(0)
   }, [])
 
-  const stopTour = finishTour
-  const skipTour = finishTour
+  const stopTour = useCallback(() => {
+    dismissTour('skipped', stepIndex)
+  }, [dismissTour, stepIndex])
+
+  const skipTour = useCallback(() => {
+    dismissTour('skipped', stepIndex)
+  }, [dismissTour, stepIndex])
 
   const nextStep = useCallback(() => {
-    setStepIndex((current) => {
-      if (current + 1 >= STEP_ORDER.length) {
-        finishTour()
-        return current
-      }
-      return current + 1
-    })
-  }, [finishTour])
+    if (stepIndex + 1 >= STEP_ORDER.length) {
+      dismissTour('completed', stepIndex)
+      return
+    }
+    setStepIndex(stepIndex + 1)
+  }, [dismissTour, stepIndex])
 
   const prevStep = useCallback(() => {
     setStepIndex((current) => Math.max(0, current - 1))
@@ -160,6 +192,10 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
     navigationRef.current = navigation
   }, [])
 
+  const registerDemoTourContext = useCallback((context: DemoTourContext | null) => {
+    demoContextRef.current = context
+  }, [])
+
   const requestStartAfterLogin = useCallback(() => {
     setPendingAfterLogin(true)
   }, [])
@@ -181,6 +217,7 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
   const value = useMemo<AppTourContextValue>(
     () => ({
       isActive,
+      isDemoTour,
       currentStepId,
       currentStepIndex: stepIndex,
       totalSteps: STEP_ORDER.length,
@@ -191,13 +228,16 @@ export function AppTourProvider({ children }: { children: ReactNode }) {
       prevStep,
       skipTour,
       registerNavigation,
+      registerDemoTourContext,
       requestStartAfterLogin
     }),
     [
       currentStepId,
       isActive,
+      isDemoTour,
       nextStep,
       prevStep,
+      registerDemoTourContext,
       registerNavigation,
       requestStartAfterLogin,
       restartTour,
@@ -221,8 +261,15 @@ export function useAppTour(): AppTourContextValue {
 
 export function getTourStepCopy(
   stepId: TourStepId,
-  t: (key: string) => string
+  t: (key: string) => string,
+  options?: { demoMode?: boolean }
 ): { title: string; body: string } {
+  if (stepId === 'welcome' && options?.demoMode) {
+    return {
+      title: t('tour.steps.welcome_public.title'),
+      body: t('tour.steps.welcome_public.body')
+    }
+  }
   return {
     title: t(`tour.steps.${stepId}.title`),
     body: t(`tour.steps.${stepId}.body`)

client/src/hooks/usePwaUpdate.ts

@@ -2,9 +2,27 @@ import { useEffect, useRef } from 'react'
 import { useRegisterSW } from 'virtual:pwa-register/react'
 
 const UPDATE_CHECK_INTERVAL_MS = 60 * 60 * 1000
+const UPDATE_SUPPRESS_KEY = 'pwa_update_suppress_until'
+const UPDATE_SUPPRESS_MS = 30_000
+const UPDATE_DISMISS_SUPPRESS_MS = 60 * 60 * 1000
+const UPDATE_RELOAD_FALLBACK_MS = 2000
+
+function isUpdateSuppressed(): boolean {
+  const suppressUntil = Number(sessionStorage.getItem(UPDATE_SUPPRESS_KEY) || '0')
+  return Date.now() < suppressUntil
+}
+
+function suppressUpdatePrompt(durationMs = UPDATE_SUPPRESS_MS): void {
+  sessionStorage.setItem(UPDATE_SUPPRESS_KEY, String(Date.now() + durationMs))
+}
+
+function clearUpdateSuppression(): void {
+  sessionStorage.removeItem(UPDATE_SUPPRESS_KEY)
+}
 
 function scheduleUpdateChecks(registration: ServiceWorkerRegistration): () => void {
   const checkForUpdate = () => {
+    if (isUpdateSuppressed()) return
     registration.update().catch(() => {})
   }
 
@@ -27,28 +45,58 @@ export function usePwaUpdate() {
   const cleanupRef = useRef<(() => void) | null>(null)
 
   const {
-    needRefresh: [needRefresh],
+    needRefresh: [needRefresh, setNeedRefresh],
     updateServiceWorker
   } = useRegisterSW({
     immediate: true,
+    onNeedReload() {
+      clearUpdateSuppression()
+      setNeedRefresh(false)
+      window.location.reload()
+    },
+    onNeedRefresh() {
+      if (isUpdateSuppressed()) return
+      setNeedRefresh(true)
+    },
     onRegisteredSW(_swUrl: string, registration: ServiceWorkerRegistration | undefined) {
       if (!registration) return
 
+      if (isUpdateSuppressed() || !registration.waiting) {
+        setNeedRefresh(false)
+      }
+
       cleanupRef.current?.()
       cleanupRef.current = scheduleUpdateChecks(registration)
     }
   })
 
   useEffect(() => {
+    if (isUpdateSuppressed()) {
+      setNeedRefresh(false)
+    }
+
     return () => {
       cleanupRef.current?.()
       cleanupRef.current = null
     }
-  }, [])
+  }, [setNeedRefresh])
 
   const updateApp = async () => {
+    setNeedRefresh(false)
+    suppressUpdatePrompt()
+
     await updateServiceWorker(true)
+
+    // vite-plugin-pwa reloads via the "controlling" event; fallback if that does not fire.
+    window.setTimeout(() => {
+      window.location.reload()
+    }, UPDATE_RELOAD_FALLBACK_MS)
   }
 
-  return { needRefresh, updateApp }
+  const dismissUpdate = () => {
+    setNeedRefresh(false)
+    suppressUpdatePrompt(UPDATE_DISMISS_SUPPRESS_MS)
+  }
+
+  return { needRefresh, updateApp, dismissUpdate }
 }

client/src/i18n/locales/de.json

@@ -10,6 +10,7 @@
       "crew": "Crew-Liste",
       "deviation": "Ablenkungstabelle",
       "logs": "Logbucheinträge",
+      "stats": "Statistik",
       "settings": "Einstellungen"
     },
     "auth": {
@@ -37,6 +38,7 @@
       "error_incorrect_recovery": "Falscher Wiederherstellungsschlüssel. Entschlüsselung fehlgeschlagen.",
       "error_decryption_failed": "Entschlüsselung fehlgeschlagen. Bitte überprüfen Sie Ihren Wiederherstellungsschlüssel.",
       "or_register": "oder Registrieren",
+      "explore_demo": "Demo ohne Account erkunden",
       "username_placeholder": "Benutzername / Skippername",
       "processing": "Verarbeitung...",
       "help": "Hilfe",
@@ -113,6 +115,13 @@
       "new_entry": "Neuer Reisetag",
       "travel_details": "Reisedetails",
       "add_event": "Neuen Logbucheintrag hinzufügen",
+      "add_event_btn": "Ereignis hinzufügen",
+      "edit_event": "Ereignis bearbeiten",
+      "save_event_btn": "Änderung speichern",
+      "cancel_event_edit": "Abbrechen",
+      "delete_event": "Ereignis löschen",
+      "sign_cleared_skipper_re_sign_title": "Skipper-Unterschrift entfernt",
+      "sign_cleared_skipper_re_sign": "Das Ereignisprotokoll wurde geändert. Die Skipper-Unterschrift wurde entfernt. Bitte erneut freigeben.",
       "date": "Datum",
       "day_of_travel": "Tag der Reise / Reisetag",
       "departure": "Start-Hafen (Reise von)",
@@ -140,6 +149,10 @@
       "sign_passkey_failed": "Passkey-Freigabe fehlgeschlagen",
       "sign_passkey_cancelled": "Passkey-Freigabe abgebrochen",
       "sign_invalid": "Signatur ungültig — Inhalt wurde geändert",
+      "sign_badge_skipper": "Skipper",
+      "sign_badge_skipper_invalid": "Ungültig",
+      "sign_badge_skipper_title_valid": "Skipper hat freigegeben",
+      "sign_badge_skipper_title_invalid": "Skipper-Signatur ungültig — Inhalt wurde geändert",
       "sign_classic_or_passkey": "Optional: klassisch unterschreiben oder Passkey-Freigabe oben",
       "sign_crew_passkey_hint": "Crew-Mitglieder mit Schreibzugriff können per Passkey freigeben",
       "sign_offline_hint": "Passkey-Freigabe erfordert Internet — klassische Unterschrift offline möglich",
@@ -159,8 +172,8 @@
       "loading": "Journal wird geladen...",
       "delete_entry": "Tag löschen",
       "delete_confirm": "Sind Sie sicher, dass Sie diesen Reisetag unwiderruflich löschen möchten?",
-      "carry_over_tanks_title": "Tankstände übernehmen?",
-      "carry_over_tanks_confirm": "Morgenstände vom letzten Reisetag als Startwerte übernehmen?\n\nFrischwasser: {{fw}} L\nKraftstoff: {{fuel}} L",
+      "carry_over_tanks_title": "Daten vom Vortag übernehmen?",
+      "carry_over_tanks_confirm": "Start-Hafen, Frischwasser- und Kraftstoff-Morgenstände vom letzten Reisetag übernehmen?\n\nStart-Hafen: {{departure}}\nFrischwasser: {{fw}} L\nKraftstoff: {{fuel}} L",
       "carry_over_tanks_yes": "Übernehmen",
       "carry_over_tanks_no": "Mit 0 starten",
       "event_title": "Chronologisches Ereignisprotokoll",
@@ -230,12 +243,21 @@
       "create_btn": "Logbuch erstellen",
       "new_logbook_placeholder": "Name des Logbuchs oder der Yacht",
       "logout": "Abmelden",
-      "delete_confirm": "Sind Sie sicher, dass Sie dieses Logbuch unwiderruflich löschen möchten? Alle lokalen Daten und Server-Backups werden vernichtet.",
+      "delete_confirm": "Sind Sie sicher, dass Sie dieses Logbuch unwiderruflich löschen möchten? Alle lokalen Daten und Server-Kopien werden vernichtet.\n\nTipp: Erstellen Sie vorher unter Einstellungen → Backup & Wiederherstellung eine Sicherungskopie (.daagbok.json), falls Sie die Daten später behalten möchten.",
       "no_logbooks": "Keine Logbücher gefunden. Erstellen Sie Ihr erstes Logbuch, um zu beginnen!",
       "loading": "Logbücher werden geladen...",
       "status_synced": "Synchronisiert",
       "status_local": "Nur lokaler Cache",
-      "delete_btn": "Logbuch löschen"
+      "delete_btn": "Logbuch löschen",
+      "section_owned": "Meine Logbücher",
+      "section_shared": "Geteilte Logbücher",
+      "section_shared_hint": "Sie wurden als Crew-Mitglied eingeladen. Skipper-Profil und Einstellungen gehören dem Eigner.",
+      "role_owner": "Eigenes Logbuch",
+      "role_owner_hint": "Sie sind Eigner und Skipper dieses Logbuchs",
+      "role_crew": "Crew-Zugang",
+      "role_crew_hint": "Eingeladenes Logbuch — Sie können als Crew mitarbeiten und signieren",
+      "role_read": "Nur Lesen",
+      "role_read_hint": "Geteiltes Logbuch — nur Ansicht, keine Bearbeitung"
     },
     "crew": {
       "title": "Skipper- & Crew-Profile",
@@ -311,7 +333,41 @@
       "deleting_account": "Konto wird gelöscht…",
       "tour_title": "App-Tour",
       "tour_desc": "Lassen Sie sich erneut durch die wichtigsten Bereiche der App führen.",
-      "tour_restart": "Tour erneut starten"
+      "tour_restart": "Tour erneut starten",
+      "backup_title": "Backup & Wiederherstellung",
+      "backup_desc": "Vollständiges verschlüsseltes Backup dieses Logbuchs (Einträge, Fotos, GPS-Tracks, Crew, Schiff). Mit Backup-Passphrase geschützt — für Restore auf diesem oder einem neuen Account.",
+      "backup_export_title": "Backup erstellen",
+      "backup_export_desc": "Lädt alle lokalen Daten als .daagbok.json herunter. Bewahren Sie Datei und Passphrase getrennt und sicher auf.",
+      "backup_restore_title": "Backup wiederherstellen",
+      "backup_restore_desc": "Stellt ein Backup in Ihrem aktuellen Account wieder her — auch nach Registrierung eines neuen Accounts.",
+      "backup_passphrase": "Backup-Passphrase",
+      "backup_passphrase_placeholder": "Mindestens 8 Zeichen",
+      "backup_passphrase_confirm": "Passphrase bestätigen",
+      "backup_passphrase_short": "Die Backup-Passphrase muss mindestens 8 Zeichen lang sein.",
+      "backup_passphrase_mismatch": "Passphrasen stimmen nicht überein.",
+      "backup_wrong_passphrase": "Passphrase falsch oder Backup beschädigt.",
+      "backup_export_btn": "Backup herunterladen",
+      "backup_exporting": "Backup wird erstellt…",
+      "backup_export_success": "Backup erstellt ({{count}} Reisetage).",
+      "backup_file_label": "Backup-Datei (.daagbok.json)",
+      "backup_preview_btn": "Inhalt prüfen",
+      "backup_previewing": "Prüfe…",
+      "backup_restore_btn": "Wiederherstellen",
+      "backup_restoring": "Wird wiederhergestellt…",
+      "backup_restore_success": "Logbuch „{{title}}“ wurde wiederhergestellt.",
+      "backup_restore_cancelled": "Wiederherstellung abgebrochen.",
+      "backup_invalid_json": "Die Datei ist keine gültige JSON-Datei.",
+      "backup_invalid_format": "Unbekanntes oder veraltetes Backup-Format.",
+      "backup_not_owner": "Nur der Logbuch-Eigner kann Backups erstellen.",
+      "backup_not_authenticated": "Bitte melden Sie sich an, um ein Backup wiederherzustellen.",
+      "backup_id_conflict": "Ein Logbuch mit dieser ID existiert bereits.",
+      "backup_overwrite_confirm": "Das vorhandene Logbuch mit gleicher ID wird ersetzt. Fortfahren?",
+      "backup_new_id_confirm": "Das Backup als neues Logbuch mit neuer ID importieren?",
+      "backup_stat_entries": "{{count}} Reisetage",
+      "backup_stat_photos": "{{count}} Fotos",
+      "backup_stat_crew": "{{count}} Crew-Einträge",
+      "backup_stat_tracks": "{{count}} GPS-Tracks",
+      "backup_exported_at": "Exportiert: {{date}}"
     },
     "disclaimer": {
       "title": "Wichtige Hinweise",
@@ -335,7 +391,43 @@
     },
     "demo": {
       "logbook_title": "Demo-Logbuch Ostsee",
-      "badge": "Demo"
+      "badge": "Demo",
+      "public_banner": "Schreibgeschützte Demo-Ansicht",
+      "cta_register": "Account erstellen",
+      "back_to_login": "Zur Anmeldung"
+    },
+    "stats": {
+      "title": "Statistik",
+      "subtitle": "Strecken, Verbrauch und Antriebsart auf einen Blick",
+      "scope_label": "Auswertungsbereich",
+      "scope_logbook": "Dieses Logbuch",
+      "scope_account": "Alle Logbücher",
+      "loading": "Statistik wird berechnet…",
+      "no_data": "Noch keine Reisetage vorhanden.",
+      "total_distance": "Gesamtstrecke",
+      "travel_days": "Reisetage",
+      "sail_distance": "Unter Segel",
+      "motor_distance": "Maschinenfahrt",
+      "unknown_propulsion": "Unbekannt",
+      "fuel_total": "Kraftstoff gesamt",
+      "water_total": "Wasser gesamt",
+      "daily_etmal": "Tages-Etmale",
+      "daily_consumption": "Tagesverbrauch",
+      "route_overview": "Route",
+      "route_map_title": "Streckenübersicht",
+      "propulsion_title": "Segel vs. Maschine",
+      "propulsion_hint": "Die Aufteilung basiert auf den Logbuch-Events pro Reisetag, nicht auf GPS-Segmenten.",
+      "avg_distance": "Ø pro Reisetag",
+      "avg_fuel": "Ø Kraftstoff",
+      "avg_water": "Ø Wasser",
+      "fuel_per_nm": "Kraftstoff pro sm",
+      "fuel_legend": "Kraftstoff",
+      "water_legend": "Wasser",
+      "unit_nm": "sm",
+      "unit_l": "L",
+      "day_label": "Tag {{day}}",
+      "account_logbooks": "Logbücher im Überblick",
+      "col_logbook": "Logbuch"
     },
     "tour": {
       "skip": "Tour überspringen",
@@ -348,6 +440,10 @@
           "title": "Willkommen an Bord!",
           "body": "Wir haben ein Demo-Logbuch mit drei Reisetagen in der Kieler Förde für Sie angelegt. Diese kurze Tour zeigt Ihnen die wichtigsten Funktionen."
         },
+        "welcome_public": {
+          "title": "Willkommen an Bord!",
+          "body": "Erkunden Sie unser Demo-Logbuch mit drei Reisetagen in der Kieler Förde – ganz ohne Account. Diese kurze Tour zeigt Ihnen Schiffsdaten, Crew und Logbucheinträge."
+        },
         "nav_logs": {
           "title": "Logbucheinträge",
           "body": "Hier verwalten Sie Ihre Reisetage – Abfahrt, Ziel, Wetter, Tankstände und GPS-Tracks."

client/src/i18n/locales/en.json

@@ -10,6 +10,7 @@
       "crew": "Crew List",
       "deviation": "Deviation Table",
       "logs": "Logbook Entries",
+      "stats": "Statistics",
       "settings": "Settings"
     },
     "auth": {
@@ -37,6 +38,7 @@
       "error_incorrect_recovery": "Incorrect recovery phrase. Decryption failed.",
       "error_decryption_failed": "Decryption failed. Please check your recovery phrase.",
       "or_register": "or register",
+      "explore_demo": "Explore demo without account",
       "username_placeholder": "Username / Skipper Name",
       "processing": "Processing...",
       "help": "Help",
@@ -113,6 +115,13 @@
       "new_entry": "New Travel Day",
       "travel_details": "Travel Details",
       "add_event": "Add Event Log Record",
+      "add_event_btn": "Add Event Entry",
+      "edit_event": "Edit event",
+      "save_event_btn": "Save changes",
+      "cancel_event_edit": "Cancel",
+      "delete_event": "Delete event",
+      "sign_cleared_skipper_re_sign_title": "Skipper signature removed",
+      "sign_cleared_skipper_re_sign": "The event log was changed. The skipper signature was removed. Please sign again.",
       "date": "Date",
       "day_of_travel": "Day of Travel",
       "departure": "Departure Port (von)",
@@ -140,6 +149,10 @@
       "sign_passkey_failed": "Passkey signing failed",
       "sign_passkey_cancelled": "Passkey signing cancelled",
       "sign_invalid": "Signature invalid — entry content changed",
+      "sign_badge_skipper": "Skipper",
+      "sign_badge_skipper_invalid": "Invalid",
+      "sign_badge_skipper_title_valid": "Signed by skipper",
+      "sign_badge_skipper_title_invalid": "Skipper signature invalid — entry content changed",
       "sign_classic_or_passkey": "Optional: sign classically below or use Passkey above",
       "sign_crew_passkey_hint": "Write collaborators can sign with their Passkey",
       "sign_offline_hint": "Passkey signing requires internet — classic signature works offline",
@@ -159,8 +172,8 @@
       "loading": "Loading journal...",
       "delete_entry": "Delete Day",
       "delete_confirm": "Are you sure you want to permanently delete this travel day?",
-      "carry_over_tanks_title": "Carry over tank levels?",
-      "carry_over_tanks_confirm": "Use the previous travel day's closing levels as morning levels?\n\nFreshwater: {{fw}} L\nFuel: {{fuel}} L",
+      "carry_over_tanks_title": "Carry over from previous day?",
+      "carry_over_tanks_confirm": "Use the previous travel day's destination as departure port and closing tank levels as morning levels?\n\nDeparture port: {{departure}}\nFreshwater: {{fw}} L\nFuel: {{fuel}} L",
       "carry_over_tanks_yes": "Carry over",
       "carry_over_tanks_no": "Start at 0",
       "event_title": "Chronological Event Logbook",
@@ -230,12 +243,21 @@
       "create_btn": "Create Logbook",
       "new_logbook_placeholder": "Logbook or Yacht Name",
       "logout": "Logout",
-      "delete_confirm": "Are you sure you want to permanently delete this logbook? All local cache and server backups will be destroyed.",
+      "delete_confirm": "Are you sure you want to permanently delete this logbook? All local data and server copies will be destroyed.\n\nTip: Create a backup first under Settings → Backup & restore (.daagbok.json) if you may need the data later.",
       "no_logbooks": "No logbooks found. Create your first logbook to begin!",
       "loading": "Loading logbooks...",
       "status_synced": "Synced",
       "status_local": "Local Cache Only",
-      "delete_btn": "Delete logbook"
+      "delete_btn": "Delete logbook",
+      "section_owned": "My logbooks",
+      "section_shared": "Shared logbooks",
+      "section_shared_hint": "You were invited as crew. Skipper profile and settings belong to the owner.",
+      "role_owner": "Own logbook",
+      "role_owner_hint": "You own this logbook and act as skipper",
+      "role_crew": "Crew access",
+      "role_crew_hint": "Invited logbook — you can collaborate and sign as crew",
+      "role_read": "Read only",
+      "role_read_hint": "Shared logbook — view only, no editing"
     },
     "crew": {
       "title": "Skipper & Crew Profiles",
@@ -311,7 +333,41 @@
       "deleting_account": "Deleting account…",
       "tour_title": "App tour",
       "tour_desc": "Take a guided walkthrough of the main areas of the app again.",
-      "tour_restart": "Restart tour"
+      "tour_restart": "Restart tour",
+      "backup_title": "Backup & restore",
+      "backup_desc": "Full encrypted backup of this logbook (entries, photos, GPS tracks, crew, vessel). Protected with a backup passphrase — restore on this or a new account.",
+      "backup_export_title": "Create backup",
+      "backup_export_desc": "Downloads all local data as a .daagbok.json file. Keep the file and passphrase separate and secure.",
+      "backup_restore_title": "Restore backup",
+      "backup_restore_desc": "Restores a backup into your current account — including after registering a new account.",
+      "backup_passphrase": "Backup passphrase",
+      "backup_passphrase_placeholder": "At least 8 characters",
+      "backup_passphrase_confirm": "Confirm passphrase",
+      "backup_passphrase_short": "The backup passphrase must be at least 8 characters.",
+      "backup_passphrase_mismatch": "Passphrases do not match.",
+      "backup_wrong_passphrase": "Wrong passphrase or corrupted backup.",
+      "backup_export_btn": "Download backup",
+      "backup_exporting": "Creating backup…",
+      "backup_export_success": "Backup created ({{count}} travel days).",
+      "backup_file_label": "Backup file (.daagbok.json)",
+      "backup_preview_btn": "Verify contents",
+      "backup_previewing": "Verifying…",
+      "backup_restore_btn": "Restore",
+      "backup_restoring": "Restoring…",
+      "backup_restore_success": "Logbook “{{title}}” has been restored.",
+      "backup_restore_cancelled": "Restore cancelled.",
+      "backup_invalid_json": "The file is not valid JSON.",
+      "backup_invalid_format": "Unknown or outdated backup format.",
+      "backup_not_owner": "Only the logbook owner can create backups.",
+      "backup_not_authenticated": "Please sign in to restore a backup.",
+      "backup_id_conflict": "A logbook with this ID already exists.",
+      "backup_overwrite_confirm": "The existing logbook with the same ID will be replaced. Continue?",
+      "backup_new_id_confirm": "Import the backup as a new logbook with a new ID?",
+      "backup_stat_entries": "{{count}} travel days",
+      "backup_stat_photos": "{{count}} photos",
+      "backup_stat_crew": "{{count}} crew records",
+      "backup_stat_tracks": "{{count}} GPS tracks",
+      "backup_exported_at": "Exported: {{date}}"
     },
     "disclaimer": {
       "title": "Important notice",
@@ -335,7 +391,43 @@
     },
     "demo": {
       "logbook_title": "Baltic Sea Demo Logbook",
-      "badge": "Demo"
+      "badge": "Demo",
+      "public_banner": "Read-only demo view",
+      "cta_register": "Create account",
+      "back_to_login": "Back to login"
+    },
+    "stats": {
+      "title": "Statistics",
+      "subtitle": "Routes, consumption and propulsion at a glance",
+      "scope_label": "Scope",
+      "scope_logbook": "This logbook",
+      "scope_account": "All logbooks",
+      "loading": "Calculating statistics…",
+      "no_data": "No travel days yet.",
+      "total_distance": "Total distance",
+      "travel_days": "Travel days",
+      "sail_distance": "Under sail",
+      "motor_distance": "Engine",
+      "unknown_propulsion": "Unknown",
+      "fuel_total": "Total fuel",
+      "water_total": "Total water",
+      "daily_etmal": "Daily mileage",
+      "daily_consumption": "Daily consumption",
+      "route_overview": "Route",
+      "route_map_title": "Route overview",
+      "propulsion_title": "Sail vs. engine",
+      "propulsion_hint": "Split is based on logbook events per travel day, not GPS segments.",
+      "avg_distance": "Avg. per travel day",
+      "avg_fuel": "Avg. fuel",
+      "avg_water": "Avg. water",
+      "fuel_per_nm": "Fuel per nm",
+      "fuel_legend": "Fuel",
+      "water_legend": "Water",
+      "unit_nm": "nm",
+      "unit_l": "L",
+      "day_label": "Day {{day}}",
+      "account_logbooks": "Logbooks overview",
+      "col_logbook": "Logbook"
     },
     "tour": {
       "skip": "Skip tour",
@@ -348,6 +440,10 @@
           "title": "Welcome aboard!",
           "body": "We created a demo logbook with three travel days in Kiel Bay. This short tour shows you the key features."
         },
+        "welcome_public": {
+          "title": "Welcome aboard!",
+          "body": "Explore our demo logbook with three travel days in Kiel Bay — no account required. This short tour shows vessel data, crew, and log entries."
+        },
         "nav_logs": {
           "title": "Log entries",
           "body": "Manage your travel days here – departure, destination, weather, tank levels, and GPS tracks."

client/src/services/analytics.ts

@@ -0,0 +1,37 @@
+export const PlausibleEvents = {
+  ACCOUNT_CREATED: 'Account Created',
+  LOGGED_IN: 'Logged In',
+  LOGBOOK_CREATED: 'Logbook Created',
+  TRAVEL_DAY_CREATED: 'Travel Day Created',
+  TRAVEL_DAY_SAVED: 'Travel Day Saved',
+  ENTRY_SIGNED: 'Entry Signed',
+  LOGBOOK_DELETED: 'Logbook Deleted',
+  ACCOUNT_DELETED: 'Account Deleted',
+  GPS_TRACK_UPLOADED: 'GPS Track Uploaded',
+  VESSEL_SAVED: 'Vessel Saved',
+  CREW_SAVED: 'Crew Saved',
+  ONBOARDING_TOUR_COMPLETED: 'Onboarding Tour Completed',
+  ONBOARDING_TOUR_SKIPPED: 'Onboarding Tour Skipped',
+  INVITE_GENERATED: 'Invite Generated',
+  INVITE_ACCEPTED: 'Invite Accepted',
+  PDF_EXPORTED: 'PDF Exported',
+  CSV_EXPORTED: 'CSV Exported',
+  CSV_SHARED: 'CSV Shared',
+  PHOTO_UPLOADED: 'Photo Uploaded',
+  BACKUP_EXPORTED: 'Backup Exported',
+  BACKUP_RESTORED: 'Backup Restored',
+  DEMO_OPENED: 'Demo Opened'
+} as const
+
+export type PlausibleEventName = (typeof PlausibleEvents)[keyof typeof PlausibleEvents]
+
+export type PlausibleEventProps = Record<string, string | number | boolean>
+
+export function trackPlausibleEvent(name: PlausibleEventName, props?: PlausibleEventProps): void {
+  if (typeof window.plausible !== 'function') return
+  if (props && Object.keys(props).length > 0) {
+    window.plausible(name, { props })
+    return
+  }
+  window.plausible(name)
+}

client/src/services/appTourStorage.ts

@@ -1,3 +1,5 @@
+export const PUBLIC_DEMO_TOUR_USER_ID = '__public_demo__'
+
 export function getTourCompletedKey(userId: string): string {
   return `app_tour_completed_${userId}`
 }
@@ -14,3 +16,10 @@ export function markTourCompleted(userId: string): void {
 export function clearTourCompleted(userId: string): void {
   localStorage.removeItem(getTourCompletedKey(userId))
 }
+
+export function resolveTourUserId(options?: { demoMode?: boolean }): string | null {
+  const activeUserId = localStorage.getItem('active_userid')
+  if (activeUserId) return activeUserId
+  if (options?.demoMode) return PUBLIC_DEMO_TOUR_USER_ID
+  return null
+}

client/src/services/auth.ts

@@ -11,6 +11,7 @@ import {
   bufferToBase64
 } from './crypto.js'
 import { clearLogbookKeysCache } from './logbookKeys.js'
+import { PlausibleEvents, trackPlausibleEvent } from './analytics.js'
 import { db } from './db.js'
 
 const API_BASE = '/api/auth'
@@ -255,6 +256,7 @@ export async function registerUser(username: string): Promise<RegistrationResult
     localStorage.setItem('active_userid', result.userId)
     rememberUsername(username)
     sessionStorage.setItem('seed_demo_logbook', '1')
+    trackPlausibleEvent(PlausibleEvents.ACCOUNT_CREATED)
   }
 
   return {
@@ -545,6 +547,7 @@ export async function deleteAccount(): Promise<boolean> {
 
       // Wipe localStorage and session variables
       logoutUser()
+      trackPlausibleEvent(PlausibleEvents.ACCOUNT_DELETED)
       return true
     }
   } catch (err) {

client/src/services/db.ts

@@ -7,6 +7,7 @@ export interface LocalLogbook {
   isSynced: number // 1 = yes, 0 = pending local modifications
   isShared?: number // 1 = collaborator copy, 0 or unset = owned
   isDemo?: number // 1 = demo logbook seeded at registration
+  collaborationRole?: 'READ' | 'WRITE' // set when isShared = 1
 }
 
 export interface LocalYacht {

client/src/services/demoLogbook.ts

@@ -3,14 +3,13 @@ import { db } from './db.js'
 import { getActiveMasterKey } from './auth.js'
 import { getLogbookKey } from './logbookKeys.js'
 import { encryptJson } from './crypto.js'
-import { parseTrackFile } from './trackUpload.js'
 import { syncLogbook } from './sync.js'
-import { computeTrackStats } from '../utils/trackStats.js'
 import i18n from '../i18n/index.js'
-
-import kielLaboeGpx from '../assets/demo/kiel-laboe.gpx?raw'
-import laboeDampGpx from '../assets/demo/laboe-damp.gpx?raw'
-import dampSchleimuendeGpx from '../assets/demo/damp-schleimuende.gpx?raw'
+import {
+  buildDemoCrewRecords,
+  buildDemoEntryPayloads,
+  buildDemoYachtData
+} from './demoLogbookData.js'
 
 export const SEED_DEMO_FLAG = 'seed_demo_logbook'
 
@@ -22,120 +21,6 @@ export function getDemoFirstEntryStorageKey(userId: string): string {
   return `demo_first_entry_id_${userId}`
 }
 
-interface DemoDaySpec {
-  date: string
-  dayOfTravel: string
-  departure: string
-  destination: string
-  gpx: string
-  filename: string
-  freshwater: { morning: number; refilled: number; evening: number; consumption: number }
-  fuel: { morning: number; refilled: number; evening: number; consumption: number }
-  events: Array<Record<string, string>>
-}
-
-function buildDemoDays(): DemoDaySpec[] {
-  const isDe = i18n.language.startsWith('de')
-  return [
-    {
-      date: '2026-05-29',
-      dayOfTravel: '1',
-      departure: isDe ? 'Kiel' : 'Kiel',
-      destination: isDe ? 'Laboe' : 'Laboe',
-      gpx: kielLaboeGpx,
-      filename: 'kiel-laboe.gpx',
-      freshwater: { morning: 120, refilled: 0, evening: 105, consumption: 15 },
-      fuel: { morning: 85, refilled: 0, evening: 78, consumption: 7 },
-      events: [
-        {
-          time: '10:15',
-          mgk: '042',
-          rwk: '038',
-          windDirection: isDe ? 'NW' : 'NW',
-          windStrength: '4 Bft',
-          seaState: isDe ? 'leicht bewegt' : 'slight',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Abfahrt Kiellinie' : 'Departure Kiellinie'
-        },
-        {
-          time: '11:20',
-          mgk: '030',
-          rwk: '028',
-          windDirection: 'N',
-          windStrength: '3 Bft',
-          seaState: isDe ? 'ruhig' : 'calm',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Ankunft Laboe' : 'Arrival Laboe'
-        }
-      ]
-    },
-    {
-      date: '2026-05-30',
-      dayOfTravel: '2',
-      departure: 'Laboe',
-      destination: 'Damp',
-      gpx: laboeDampGpx,
-      filename: 'laboe-damp.gpx',
-      freshwater: { morning: 105, refilled: 25, evening: 110, consumption: 20 },
-      fuel: { morning: 78, refilled: 0, evening: 70, consumption: 8 },
-      events: [
-        {
-          time: '09:00',
-          mgk: '055',
-          rwk: '050',
-          windDirection: 'NE',
-          windStrength: '3 Bft',
-          seaState: isDe ? 'leicht bewegt' : 'slight',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Auslaufen aus Laboe' : 'Departing Laboe'
-        },
-        {
-          time: '12:30',
-          mgk: '075',
-          rwk: '068',
-          windDirection: 'E',
-          windStrength: '4 Bft',
-          seaState: isDe ? 'mäßig bewegt' : 'moderate',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Kurs entlang der Küste' : 'Coastal passage'
-        }
-      ]
-    },
-    {
-      date: '2026-05-31',
-      dayOfTravel: '3',
-      departure: 'Damp',
-      destination: isDe ? 'Schleimünde' : 'Schleimünde',
-      gpx: dampSchleimuendeGpx,
-      filename: 'damp-schleimuende.gpx',
-      freshwater: { morning: 110, refilled: 0, evening: 95, consumption: 15 },
-      fuel: { morning: 70, refilled: 15, evening: 80, consumption: 5 },
-      events: [
-        {
-          time: '08:30',
-          mgk: '290',
-          rwk: '285',
-          windDirection: 'W',
-          windStrength: '4 Bft',
-          seaState: isDe ? 'mäßig bewegt' : 'moderate',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Passage zur Schlei' : 'Passage toward Schlei'
-        },
-        {
-          time: '14:00',
-          mgk: '310',
-          rwk: '305',
-          windDirection: 'NW',
-          windStrength: '3 Bft',
-          seaState: isDe ? 'leicht bewegt' : 'slight',
-          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
-          remarks: isDe ? 'Ziel Schleimünde' : 'Destination Schleimünde'
-        }
-      ]
-    }
-  ]
-}
-
 async function putEncryptedRecord(
   logbookId: string,
   key: ArrayBuffer,
@@ -194,44 +79,12 @@ async function putEncryptedRecord(
 }
 
 async function seedYachtAndCrew(logbookId: string, key: ArrayBuffer, now: string): Promise<void> {
-  const isDe = i18n.language.startsWith('de')
-  const yachtData = {
-    name: isDe ? 'Seeadler' : 'Seeadler',
-    vesselType: isDe ? 'Segelyacht' : 'Sailing yacht',
-    lengthM: 12.5,
-    draftM: 1.9,
-    airDraftM: 18,
-    homePort: 'Kiel',
-    charterCompany: '',
-    owner: isDe ? 'Demo Skipper' : 'Demo Skipper',
-    registrationNumber: 'D-KI 1234',
-    callSign: 'DA1234',
-    atis: '',
-    mmsi: '',
-    sails: isDe
-      ? ['Großsegel', 'Genua', 'Spinnaker']
-      : ['Mainsail', 'Genoa', 'Spinnaker'],
-    photo: null
-  }
-
+  const yachtData = buildDemoYachtData()
   await putEncryptedRecord(logbookId, key, 'yacht', logbookId, yachtData, now)
 
-  const crewId = crypto.randomUUID()
-  const crewData = {
-    name: isDe ? 'Anna Müller' : 'Anna Müller',
-    address: isDe ? 'Hafenstraße 1, 24103 Kiel' : 'Harbour St 1, 24103 Kiel',
-    birthDate: '1988-04-12',
-    phone: '+49 431 123456',
-    nationality: isDe ? 'Deutsch' : 'German',
-    passportNumber: 'C01X00T47',
-    bloodType: 'A+',
-    allergies: '',
-    diseases: '',
-    role: 'crew',
-    photo: null
+  for (const crew of buildDemoCrewRecords()) {
+    await putEncryptedRecord(logbookId, key, 'crew', crew.payloadId, crew.data, now)
   }
-
-  await putEncryptedRecord(logbookId, key, 'crew', crewId, crewData, now)
 }
 
 export interface DemoSeedResult {
@@ -273,42 +126,12 @@ export async function seedDemoLogbookIfNeeded(): Promise<DemoSeedResult | null>
   const now = new Date().toISOString()
   await seedYachtAndCrew(logbookId, key, now)
 
-  const days = buildDemoDays()
+  const entryPayloads = buildDemoEntryPayloads()
   let firstEntryId = ''
 
-  for (const day of days) {
-    const entryId = crypto.randomUUID()
+  for (const { entryId, entryPayload, trackData } of entryPayloads) {
     if (!firstEntryId) firstEntryId = entryId
-
-    const { waypoints } = parseTrackFile(day.gpx, day.filename)
-    const stats = computeTrackStats(waypoints)
-
-    const entryPayload: Record<string, unknown> = {
-      date: day.date,
-      dayOfTravel: day.dayOfTravel,
-      departure: day.departure,
-      destination: day.destination,
-      freshwater: { ...day.freshwater },
-      fuel: { ...day.fuel },
-      signSkipper: '',
-      signCrew: '',
-      events: day.events
-    }
-
-    if (stats) {
-      entryPayload.trackDistanceNm = stats.distanceNm
-      entryPayload.trackSpeedMaxKn = stats.speedMaxKn
-      entryPayload.trackSpeedAvgKn = stats.speedAvgKn
-    }
-
     await putEncryptedRecord(logbookId, key, 'entry', entryId, entryPayload, now)
-
-    const trackData = {
-      waypoints,
-      gpxContent: day.gpx,
-      filename: day.filename,
-      fileType: 'gpx'
-    }
     await putEncryptedRecord(logbookId, key, 'gpsTrack', entryId, trackData, now)
   }
 

client/src/services/demoLogbookData.ts

@@ -0,0 +1,318 @@
+import { parseTrackFile } from './trackUpload.js'
+import { computeTrackStats } from '../utils/trackStats.js'
+import i18n from '../i18n/index.js'
+
+import kielLaboeGpx from '../assets/demo/kiel-laboe.gpx?raw'
+import laboeDampGpx from '../assets/demo/laboe-damp.gpx?raw'
+import dampSchleimuendeGpx from '../assets/demo/damp-schleimuende.gpx?raw'
+
+/** Stable ID for the first demo travel day (public demo tour highlight). */
+export const PUBLIC_DEMO_FIRST_ENTRY_ID = 'a0000001-0000-4000-8000-000000000001'
+
+const PUBLIC_DEMO_ENTRY_IDS = [
+  PUBLIC_DEMO_FIRST_ENTRY_ID,
+  'a0000001-0000-4000-8000-000000000002',
+  'a0000001-0000-4000-8000-000000000003'
+] as const
+
+const PUBLIC_DEMO_CREW_MEMBER_ID = 'a0000001-0000-4000-8000-000000000010'
+
+export interface DemoDaySpec {
+  date: string
+  dayOfTravel: string
+  departure: string
+  destination: string
+  gpx: string
+  filename: string
+  freshwater: { morning: number; refilled: number; evening: number; consumption: number }
+  fuel: { morning: number; refilled: number; evening: number; consumption: number }
+  events: Array<Record<string, string>>
+}
+
+export interface DemoCrewRecord {
+  payloadId: string
+  data: {
+    name: string
+    address: string
+    birthDate: string
+    phone: string
+    nationality: string
+    passportNumber: string
+    bloodType: string
+    allergies: string
+    diseases: string
+    role: 'skipper' | 'crew'
+    photo: string | null
+  }
+}
+
+export interface PublicDemoFixture {
+  title: string
+  yacht: Record<string, unknown>
+  crews: DemoCrewRecord[]
+  entries: Array<Record<string, unknown> & { payloadId: string }>
+  gpsTracks: Array<{ entryId: string; waypoints: unknown[]; filename: string; gpxContent?: string; fileType: string }>
+  photos: never[]
+  firstEntryId: string
+}
+
+export function buildDemoDays(): DemoDaySpec[] {
+  const isDe = i18n.language.startsWith('de')
+  return [
+    {
+      date: '2026-05-29',
+      dayOfTravel: '1',
+      departure: 'Kiel',
+      destination: 'Laboe',
+      gpx: kielLaboeGpx,
+      filename: 'kiel-laboe.gpx',
+      freshwater: { morning: 120, refilled: 0, evening: 105, consumption: 15 },
+      fuel: { morning: 85, refilled: 0, evening: 78, consumption: 7 },
+      events: [
+        {
+          time: '10:15',
+          mgk: '042',
+          rwk: '038',
+          windDirection: 'NW',
+          windStrength: '4 Bft',
+          seaState: isDe ? 'leicht bewegt' : 'slight',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Abfahrt Kiellinie' : 'Departure Kiellinie'
+        },
+        {
+          time: '11:20',
+          mgk: '030',
+          rwk: '028',
+          windDirection: 'N',
+          windStrength: '3 Bft',
+          seaState: isDe ? 'ruhig' : 'calm',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Ankunft Laboe' : 'Arrival Laboe'
+        }
+      ]
+    },
+    {
+      date: '2026-05-30',
+      dayOfTravel: '2',
+      departure: 'Laboe',
+      destination: 'Damp',
+      gpx: laboeDampGpx,
+      filename: 'laboe-damp.gpx',
+      freshwater: { morning: 105, refilled: 25, evening: 110, consumption: 20 },
+      fuel: { morning: 78, refilled: 0, evening: 70, consumption: 8 },
+      events: [
+        {
+          time: '09:00',
+          mgk: '055',
+          rwk: '050',
+          windDirection: 'NE',
+          windStrength: '3 Bft',
+          seaState: isDe ? 'leicht bewegt' : 'slight',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Auslaufen aus Laboe' : 'Departing Laboe'
+        },
+        {
+          time: '12:30',
+          mgk: '075',
+          rwk: '068',
+          windDirection: 'E',
+          windStrength: '4 Bft',
+          seaState: isDe ? 'mäßig bewegt' : 'moderate',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Kurs entlang der Küste' : 'Coastal passage'
+        }
+      ]
+    },
+    {
+      date: '2026-05-31',
+      dayOfTravel: '3',
+      departure: 'Damp',
+      destination: 'Schleimünde',
+      gpx: dampSchleimuendeGpx,
+      filename: 'damp-schleimuende.gpx',
+      freshwater: { morning: 110, refilled: 0, evening: 95, consumption: 15 },
+      fuel: { morning: 70, refilled: 15, evening: 80, consumption: 5 },
+      events: [
+        {
+          time: '08:30',
+          mgk: '290',
+          rwk: '285',
+          windDirection: 'W',
+          windStrength: '4 Bft',
+          seaState: isDe ? 'mäßig bewegt' : 'moderate',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Passage zur Schlei' : 'Passage toward Schlei'
+        },
+        {
+          time: '14:00',
+          mgk: '310',
+          rwk: '305',
+          windDirection: 'NW',
+          windStrength: '3 Bft',
+          seaState: isDe ? 'leicht bewegt' : 'slight',
+          sailsOrMotor: isDe ? 'Großsegel + Genua' : 'Mainsail + Genoa',
+          remarks: isDe ? 'Ziel Schleimünde' : 'Destination Schleimünde'
+        }
+      ]
+    }
+  ]
+}
+
+export function buildDemoYachtData(): Record<string, unknown> {
+  const isDe = i18n.language.startsWith('de')
+  return {
+    name: 'Seeadler',
+    vesselType: isDe ? 'Segelyacht' : 'Sailing yacht',
+    lengthM: 12.5,
+    draftM: 1.9,
+    airDraftM: 18,
+    homePort: 'Kiel',
+    charterCompany: '',
+    owner: 'Demo Skipper',
+    registrationNumber: 'D-KI 1234',
+    callSign: 'DA1234',
+    atis: '',
+    mmsi: '',
+    sails: isDe ? ['Großsegel', 'Genua', 'Spinnaker'] : ['Mainsail', 'Genoa', 'Spinnaker'],
+    photo: null
+  }
+}
+
+export function buildDemoCrewRecords(): DemoCrewRecord[] {
+  const isDe = i18n.language.startsWith('de')
+  return [
+    {
+      payloadId: 'skipper',
+      data: {
+        name: 'Demo Skipper',
+        address: isDe ? 'Am Hafen 12, 24103 Kiel' : 'Harbour Quay 12, 24103 Kiel',
+        birthDate: '1980-06-15',
+        phone: '+49 431 987654',
+        nationality: isDe ? 'Deutsch' : 'German',
+        passportNumber: 'C12X34Y56',
+        bloodType: '0+',
+        allergies: '',
+        diseases: '',
+        role: 'skipper',
+        photo: null
+      }
+    },
+    {
+      payloadId: PUBLIC_DEMO_CREW_MEMBER_ID,
+      data: {
+        name: 'Anna Müller',
+        address: isDe ? 'Hafenstraße 1, 24103 Kiel' : 'Harbour St 1, 24103 Kiel',
+        birthDate: '1988-04-12',
+        phone: '+49 431 123456',
+        nationality: isDe ? 'Deutsch' : 'German',
+        passportNumber: 'C01X00T47',
+        bloodType: 'A+',
+        allergies: '',
+        diseases: '',
+        role: 'crew',
+        photo: null
+      }
+    }
+  ]
+}
+
+export function buildPublicDemoFixture(): PublicDemoFixture {
+  const title = i18n.t('demo.logbook_title')
+  const yacht = buildDemoYachtData()
+  const crews = buildDemoCrewRecords()
+  const days = buildDemoDays()
+  const entries: PublicDemoFixture['entries'] = []
+  const gpsTracks: PublicDemoFixture['gpsTracks'] = []
+
+  days.forEach((day, index) => {
+    const entryId = PUBLIC_DEMO_ENTRY_IDS[index] ?? crypto.randomUUID()
+    const { waypoints } = parseTrackFile(day.gpx, day.filename)
+    const stats = computeTrackStats(waypoints)
+
+    const entryPayload: Record<string, unknown> = {
+      payloadId: entryId,
+      date: day.date,
+      dayOfTravel: day.dayOfTravel,
+      departure: day.departure,
+      destination: day.destination,
+      freshwater: { ...day.freshwater },
+      fuel: { ...day.fuel },
+      signSkipper: '',
+      signCrew: '',
+      events: day.events
+    }
+
+    if (stats) {
+      entryPayload.trackDistanceNm = stats.distanceNm
+      entryPayload.trackSpeedMaxKn = stats.speedMaxKn
+      entryPayload.trackSpeedAvgKn = stats.speedAvgKn
+    }
+
+    entries.push(entryPayload as PublicDemoFixture['entries'][number])
+
+    gpsTracks.push({
+      entryId,
+      waypoints,
+      filename: day.filename,
+      gpxContent: day.gpx,
+      fileType: 'gpx'
+    })
+  })
+
+  return {
+    title,
+    yacht,
+    crews,
+    entries,
+    gpsTracks,
+    photos: [],
+    firstEntryId: PUBLIC_DEMO_FIRST_ENTRY_ID
+  }
+}
+
+export function getPublicDemoFirstEntryId(): string {
+  return PUBLIC_DEMO_FIRST_ENTRY_ID
+}
+
+/** Payloads for encrypted seeding (without payloadId on entries). */
+export function buildDemoEntryPayloads(): Array<{
+  entryId: string
+  entryPayload: Record<string, unknown>
+  trackData: { waypoints: unknown[]; gpxContent: string; filename: string; fileType: string }
+}> {
+  const days = buildDemoDays()
+  return days.map((day) => {
+    const entryId = crypto.randomUUID()
+    const { waypoints } = parseTrackFile(day.gpx, day.filename)
+    const stats = computeTrackStats(waypoints)
+
+    const entryPayload: Record<string, unknown> = {
+      date: day.date,
+      dayOfTravel: day.dayOfTravel,
+      departure: day.departure,
+      destination: day.destination,
+      freshwater: { ...day.freshwater },
+      fuel: { ...day.fuel },
+      signSkipper: '',
+      signCrew: '',
+      events: day.events
+    }
+
+    if (stats) {
+      entryPayload.trackDistanceNm = stats.distanceNm
+      entryPayload.trackSpeedMaxKn = stats.speedMaxKn
+      entryPayload.trackSpeedAvgKn = stats.speedAvgKn
+    }
+
+    return {
+      entryId,
+      entryPayload,
+      trackData: {
+        waypoints,
+        gpxContent: day.gpx,
+        filename: day.filename,
+        fileType: 'gpx'
+      }
+    }
+  })
+}

client/src/services/logbook.ts

@@ -2,15 +2,35 @@ import { db, type LocalLogbook } from './db.js'
 import { getActiveMasterKey } from './auth.js'
 import { encryptJson, decryptJson, encryptBuffer, decryptBuffer } from './crypto.js'
 import { getLogbookKey, saveLogbookKey, generateLogbookKey } from './logbookKeys.js'
+import { PlausibleEvents, trackPlausibleEvent } from './analytics.js'
 
 const API_BASE = '/api/logbooks'
 
+export type LogbookAccessRole = 'OWNER' | 'READ' | 'WRITE'
+export type CollaborationRole = 'READ' | 'WRITE'
+
+/** Validates server/cached collaboration role; warns and falls back to WRITE if missing or invalid. */
+export function parseCollaborationRole(role: unknown, context: string): CollaborationRole {
+  if (role === 'READ' || role === 'WRITE') {
+    return role
+  }
+
+  if (role === undefined || role === null || role === '') {
+    console.warn(`[collaboration] Missing role in ${context}; defaulting to WRITE.`)
+  } else {
+    console.warn(`[collaboration] Unexpected role in ${context}:`, role, '— defaulting to WRITE.')
+  }
+
+  return 'WRITE'
+}
+
 export interface DecryptedLogbook {
   id: string
   title: string
   updatedAt: string
   isSynced: boolean
   isShared: boolean
+  accessRole: LogbookAccessRole
   isDemo?: boolean
 }
 
@@ -100,14 +120,20 @@ export async function fetchLogbooks(): Promise<DecryptedLogbook[]> {
 
         // Update Dexie database cache
         const localById = new Map(localLogbooksArray.map((lb) => [lb.id, lb]))
-        const localLogbooks: LocalLogbook[] = serverLogbooks.map((lb: any) => ({
-          id: lb.id,
-          encryptedTitle: lb.encryptedTitle,
-          updatedAt: lb.updatedAt || new Date().toISOString(),
-          isSynced: 1,
-          isShared: lb.userId !== userId ? 1 : 0,
-          isDemo: localById.get(lb.id)?.isDemo
-        }))
+        const localLogbooks: LocalLogbook[] = serverLogbooks.map((lb: any) => {
+          const isShared = lb.userId !== userId
+          return {
+            id: lb.id,
+            encryptedTitle: lb.encryptedTitle,
+            updatedAt: lb.updatedAt || new Date().toISOString(),
+            isSynced: 1,
+            isShared: isShared ? 1 : 0,
+            collaborationRole: isShared
+              ? parseCollaborationRole(lb.collaborators?.[0]?.role, `fetch logbook ${lb.id}`)
+              : undefined,
+            isDemo: localById.get(lb.id)?.isDemo
+          }
+        })
 
         // Clear existing cache for this user and insert new ones
         await db.logbooks.bulkPut(localLogbooks)
@@ -130,6 +156,9 @@ export async function fetchLogbooks(): Promise<DecryptedLogbook[]> {
       updatedAt: lb.updatedAt,
       isSynced: lb.isSynced === 1,
       isShared: lb.isShared === 1,
+      accessRole: lb.isShared === 1
+        ? parseCollaborationRole(lb.collaborationRole, `cached logbook ${lb.id}`)
+        : 'OWNER',
       isDemo: lb.isDemo === 1
     })
   }
@@ -206,7 +235,8 @@ export async function createLogbook(title: string): Promise<DecryptedLogbook> {
           title,
           updatedAt: serverLb.updatedAt,
           isSynced: true,
-          isShared: false
+          isShared: false,
+          accessRole: 'OWNER'
         }
       }
     } catch (error) {
@@ -237,7 +267,8 @@ export async function createLogbook(title: string): Promise<DecryptedLogbook> {
     title,
     updatedAt: now,
     isSynced: false,
-    isShared: false
+    isShared: false,
+    accessRole: 'OWNER'
   }
 }
 
@@ -303,4 +334,5 @@ export async function deleteLogbook(id: string): Promise<void> {
 
   // Perform local cascading cleanup
   await deleteLocalLogbookCache(id)
+  trackPlausibleEvent(PlausibleEvents.LOGBOOK_DELETED)
 }

client/src/services/logbookBackup.ts

@@ -0,0 +1,601 @@
+import { db } from './db.js'
+import { getActiveMasterKey } from './auth.js'
+import {
+  decryptJson,
+  encryptBuffer,
+  decryptBuffer
+} from './crypto.js'
+import { decryptLogbookTitle, deleteLocalLogbookCache } from './logbook.js'
+import { ensureLogbookKey, getLogbookKey, saveLogbookKey } from './logbookKeys.js'
+import { syncLogbook } from './sync.js'
+import type { SyncQueueItem } from './db.js'
+
+export const BACKUP_FORMAT = 'kapteins-daagbok-backup' as const
+export const BACKUP_VERSION = 1 as const
+
+export interface LogbookBackupFile {
+  format: typeof BACKUP_FORMAT
+  version: typeof BACKUP_VERSION
+  exportedAt: string
+  logbook: {
+    id: string
+    encryptedTitle: string
+    updatedAt: string
+    isDemo?: boolean
+  }
+  logbookKey: {
+    ciphertext: string
+    iv: string
+    tag: string
+  }
+  payloads: {
+    yacht: {
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    } | null
+    deviation: {
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    } | null
+    crews: Array<{
+      payloadId: string
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    }>
+    entries: Array<{
+      payloadId: string
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    }>
+    photos: Array<{
+      payloadId: string
+      entryId: string
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    }>
+    gpsTracks: Array<{
+      entryId: string
+      encryptedData: string
+      iv: string
+      tag: string
+      updatedAt: string
+    }>
+  }
+  counts: {
+    entries: number
+    photos: number
+    crews: number
+    gpsTracks: number
+    hasYacht: boolean
+    hasDeviation: boolean
+  }
+}
+
+export interface LogbookBackupPreview {
+  title: string
+  exportedAt: string
+  sourceLogbookId: string
+  counts: LogbookBackupFile['counts']
+}
+
+async function deriveBackupPassphraseKey(passphrase: string): Promise<CryptoKey> {
+  const encoder = new TextEncoder()
+  const passphraseBytes = encoder.encode(passphrase.trim())
+  const saltBytes = encoder.encode('KapteinsDaagbokBackupFileSalt_v1')
+
+  const baseKey = await window.crypto.subtle.importKey(
+    'raw',
+    passphraseBytes,
+    { name: 'PBKDF2' },
+    false,
+    ['deriveKey']
+  )
+
+  return window.crypto.subtle.deriveKey(
+    {
+      name: 'PBKDF2',
+      salt: saltBytes,
+      iterations: 100_000,
+      hash: 'SHA-256'
+    },
+    baseKey,
+    { name: 'AES-GCM', length: 256 },
+    false,
+    ['encrypt', 'decrypt']
+  )
+}
+
+async function wrapLogbookKey(logbookKey: ArrayBuffer, passphrase: string) {
+  const key = await deriveBackupPassphraseKey(passphrase)
+  return encryptBuffer(logbookKey, key)
+}
+
+async function unwrapLogbookKey(
+  wrapped: LogbookBackupFile['logbookKey'],
+  passphrase: string
+): Promise<ArrayBuffer> {
+  const key = await deriveBackupPassphraseKey(passphrase)
+  return decryptBuffer(wrapped.ciphertext, wrapped.iv, wrapped.tag, key)
+}
+
+function isBackupFile(value: unknown): value is LogbookBackupFile {
+  if (!value || typeof value !== 'object') return false
+  const obj = value as Partial<LogbookBackupFile>
+  return (
+    obj.format === BACKUP_FORMAT &&
+    obj.version === BACKUP_VERSION &&
+    typeof obj.exportedAt === 'string' &&
+    !!obj.logbook?.id &&
+    !!obj.logbook?.encryptedTitle &&
+    !!obj.logbookKey?.ciphertext &&
+    !!obj.payloads
+  )
+}
+
+function encryptedPayloadData(
+  encryptedData: string,
+  iv: string,
+  tag: string,
+  extra?: Record<string, string>
+): string {
+  return JSON.stringify({
+    ciphertext: encryptedData,
+    iv,
+    tag,
+    ...extra
+  })
+}
+
+async function collectLogbookPayloads(logbookId: string): Promise<LogbookBackupFile['payloads']> {
+  const [yacht, deviation, crews, entries, photos, gpsTracks] = await Promise.all([
+    db.yachts.get(logbookId),
+    db.deviations.get(logbookId),
+    db.crews.where({ logbookId }).toArray(),
+    db.entries.where({ logbookId }).toArray(),
+    db.photos.where({ logbookId }).toArray(),
+    db.gpsTracks.where({ logbookId }).toArray()
+  ])
+
+  return {
+    yacht: yacht
+      ? {
+          encryptedData: yacht.encryptedData,
+          iv: yacht.iv,
+          tag: yacht.tag,
+          updatedAt: yacht.updatedAt
+        }
+      : null,
+    deviation: deviation
+      ? {
+          encryptedData: deviation.encryptedData,
+          iv: deviation.iv,
+          tag: deviation.tag,
+          updatedAt: deviation.updatedAt
+        }
+      : null,
+    crews: crews.map((c) => ({
+      payloadId: c.payloadId,
+      encryptedData: c.encryptedData,
+      iv: c.iv,
+      tag: c.tag,
+      updatedAt: c.updatedAt
+    })),
+    entries: entries.map((e) => ({
+      payloadId: e.payloadId,
+      encryptedData: e.encryptedData,
+      iv: e.iv,
+      tag: e.tag,
+      updatedAt: e.updatedAt
+    })),
+    photos: photos.map((p) => ({
+      payloadId: p.payloadId,
+      entryId: p.entryId,
+      encryptedData: p.encryptedData,
+      iv: p.iv,
+      tag: p.tag,
+      updatedAt: p.updatedAt
+    })),
+    gpsTracks: gpsTracks.map((t) => ({
+      entryId: t.entryId,
+      encryptedData: t.encryptedData,
+      iv: t.iv,
+      tag: t.tag,
+      updatedAt: t.updatedAt
+    }))
+  }
+}
+
+function remapBackup(
+  backup: LogbookBackupFile,
+  newLogbookId: string
+): LogbookBackupFile {
+  return {
+    ...backup,
+    logbook: {
+      ...backup.logbook,
+      id: newLogbookId
+    },
+    payloads: {
+      ...backup.payloads,
+      yacht: backup.payloads.yacht
+        ? { ...backup.payloads.yacht, updatedAt: backup.payloads.yacht.updatedAt }
+        : null,
+      deviation: backup.payloads.deviation
+        ? { ...backup.payloads.deviation, updatedAt: backup.payloads.deviation.updatedAt }
+        : null,
+      crews: backup.payloads.crews.map((c) => ({ ...c })),
+      entries: backup.payloads.entries.map((e) => ({ ...e })),
+      photos: backup.payloads.photos.map((p) => ({ ...p })),
+      gpsTracks: backup.payloads.gpsTracks.map((t) => ({ ...t }))
+    }
+  }
+}
+
+async function queueRestoredLogbookForSync(
+  logbookId: string,
+  encryptedTitle: string,
+  logbookKey: ArrayBuffer,
+  payloads: LogbookBackupFile['payloads']
+): Promise<void> {
+  const masterKey = getActiveMasterKey()
+  if (!masterKey) throw new Error('Master key not found')
+
+  const aesMasterKey = await window.crypto.subtle.importKey(
+    'raw',
+    masterKey,
+    { name: 'AES-GCM' },
+    false,
+    ['encrypt']
+  )
+  const encryptedKey = await encryptBuffer(logbookKey, aesMasterKey)
+  const now = new Date().toISOString()
+
+  const items: Omit<SyncQueueItem, 'id'>[] = [
+    {
+      action: 'create',
+      type: 'logbook',
+      payloadId: logbookId,
+      logbookId,
+      data: JSON.stringify({
+        encryptedTitle,
+        encryptedKey: encryptedKey.ciphertext,
+        iv: encryptedKey.iv,
+        tag: encryptedKey.tag
+      }),
+      updatedAt: now
+    }
+  ]
+
+  if (payloads.yacht) {
+    items.push({
+      action: 'update',
+      type: 'yacht',
+      payloadId: logbookId,
+      logbookId,
+      data: encryptedPayloadData(
+        payloads.yacht.encryptedData,
+        payloads.yacht.iv,
+        payloads.yacht.tag
+      ),
+      updatedAt: payloads.yacht.updatedAt
+    })
+  }
+
+  if (payloads.deviation) {
+    items.push({
+      action: 'update',
+      type: 'deviation',
+      payloadId: logbookId,
+      logbookId,
+      data: encryptedPayloadData(
+        payloads.deviation.encryptedData,
+        payloads.deviation.iv,
+        payloads.deviation.tag
+      ),
+      updatedAt: payloads.deviation.updatedAt
+    })
+  }
+
+  for (const crew of payloads.crews) {
+    items.push({
+      action: 'create',
+      type: 'crew',
+      payloadId: crew.payloadId,
+      logbookId,
+      data: encryptedPayloadData(crew.encryptedData, crew.iv, crew.tag),
+      updatedAt: crew.updatedAt
+    })
+  }
+
+  for (const entry of payloads.entries) {
+    items.push({
+      action: 'create',
+      type: 'entry',
+      payloadId: entry.payloadId,
+      logbookId,
+      data: encryptedPayloadData(entry.encryptedData, entry.iv, entry.tag),
+      updatedAt: entry.updatedAt
+    })
+  }
+
+  for (const photo of payloads.photos) {
+    items.push({
+      action: 'create',
+      type: 'photo',
+      payloadId: photo.payloadId,
+      logbookId,
+      data: encryptedPayloadData(photo.encryptedData, photo.iv, photo.tag, {
+        entryId: photo.entryId
+      }),
+      updatedAt: photo.updatedAt
+    })
+  }
+
+  for (const track of payloads.gpsTracks) {
+    items.push({
+      action: 'create',
+      type: 'gpsTrack',
+      payloadId: track.entryId,
+      logbookId,
+      data: encryptedPayloadData(track.encryptedData, track.iv, track.tag),
+      updatedAt: track.updatedAt
+    })
+  }
+
+  await db.syncQueue.bulkPut(items)
+}
+
+async function writeBackupToDexie(
+  logbookId: string,
+  backup: LogbookBackupFile,
+  logbookKey: ArrayBuffer
+): Promise<void> {
+  const { logbook, payloads } = backup
+
+  await db.logbooks.put({
+    id: logbookId,
+    encryptedTitle: logbook.encryptedTitle,
+    updatedAt: logbook.updatedAt,
+    isSynced: 0,
+    isShared: 0,
+    isDemo: logbook.isDemo ? 1 : 0
+  })
+
+  await saveLogbookKey(logbookId, logbookKey)
+
+  if (payloads.yacht) {
+    await db.yachts.put({
+      logbookId,
+      encryptedData: payloads.yacht.encryptedData,
+      iv: payloads.yacht.iv,
+      tag: payloads.yacht.tag,
+      updatedAt: payloads.yacht.updatedAt
+    })
+  }
+
+  if (payloads.deviation) {
+    await db.deviations.put({
+      logbookId,
+      encryptedData: payloads.deviation.encryptedData,
+      iv: payloads.deviation.iv,
+      tag: payloads.deviation.tag,
+      updatedAt: payloads.deviation.updatedAt
+    })
+  }
+
+  if (payloads.crews.length > 0) {
+    await db.crews.bulkPut(
+      payloads.crews.map((c) => ({
+        payloadId: c.payloadId,
+        logbookId,
+        encryptedData: c.encryptedData,
+        iv: c.iv,
+        tag: c.tag,
+        updatedAt: c.updatedAt
+      }))
+    )
+  }
+
+  if (payloads.entries.length > 0) {
+    await db.entries.bulkPut(
+      payloads.entries.map((e) => ({
+        payloadId: e.payloadId,
+        logbookId,
+        encryptedData: e.encryptedData,
+        iv: e.iv,
+        tag: e.tag,
+        updatedAt: e.updatedAt
+      }))
+    )
+  }
+
+  if (payloads.photos.length > 0) {
+    await db.photos.bulkPut(
+      payloads.photos.map((p) => ({
+        payloadId: p.payloadId,
+        entryId: p.entryId,
+        logbookId,
+        encryptedData: p.encryptedData,
+        iv: p.iv,
+        tag: p.tag,
+        caption: '',
+        updatedAt: p.updatedAt
+      }))
+    )
+  }
+
+  if (payloads.gpsTracks.length > 0) {
+    await db.gpsTracks.bulkPut(
+      payloads.gpsTracks.map((t) => ({
+        entryId: t.entryId,
+        logbookId,
+        encryptedData: t.encryptedData,
+        iv: t.iv,
+        tag: t.tag,
+        updatedAt: t.updatedAt
+      }))
+    )
+  }
+}
+
+export async function exportLogbookBackup(
+  logbookId: string,
+  passphrase: string
+): Promise<{ blob: Blob; filename: string; backup: LogbookBackupFile }> {
+  if (!passphrase.trim() || passphrase.length < 8) {
+    throw new Error('BACKUP_PASSPHRASE_TOO_SHORT')
+  }
+
+  const logbook = await db.logbooks.get(logbookId)
+  if (!logbook || logbook.isShared === 1) {
+    throw new Error('BACKUP_NOT_OWNER')
+  }
+
+  if (navigator.onLine) {
+    await syncLogbook(logbookId).catch((err) => {
+      console.warn('Pre-backup sync failed, exporting local data:', err)
+    })
+  }
+
+  const logbookKey = (await getLogbookKey(logbookId)) ?? (await ensureLogbookKey(logbookId))
+  const payloads = await collectLogbookPayloads(logbookId)
+  const wrappedKey = await wrapLogbookKey(logbookKey, passphrase)
+
+  const backup: LogbookBackupFile = {
+    format: BACKUP_FORMAT,
+    version: BACKUP_VERSION,
+    exportedAt: new Date().toISOString(),
+    logbook: {
+      id: logbook.id,
+      encryptedTitle: logbook.encryptedTitle,
+      updatedAt: logbook.updatedAt,
+      isDemo: logbook.isDemo === 1
+    },
+    logbookKey: wrappedKey,
+    payloads,
+    counts: {
+      entries: payloads.entries.length,
+      photos: payloads.photos.length,
+      crews: payloads.crews.length,
+      gpsTracks: payloads.gpsTracks.length,
+      hasYacht: !!payloads.yacht,
+      hasDeviation: !!payloads.deviation
+    }
+  }
+
+  const title = await decryptLogbookTitle(logbookId, logbook.encryptedTitle)
+  const safeTitle = title.replace(/[^\w\s-]/g, '').trim().replace(/\s+/g, '-').slice(0, 40) || 'logbook'
+  const datePart = new Date().toISOString().slice(0, 10)
+  const filename = `${safeTitle}-${datePart}.daagbok.json`
+  const blob = new Blob([JSON.stringify(backup, null, 2)], { type: 'application/json' })
+
+  return { blob, filename, backup }
+}
+
+export async function parseLogbookBackupFile(file: File): Promise<LogbookBackupFile> {
+  const text = await file.text()
+  let parsed: unknown
+  try {
+    parsed = JSON.parse(text)
+  } catch {
+    throw new Error('BACKUP_INVALID_JSON')
+  }
+
+  if (!isBackupFile(parsed)) {
+    throw new Error('BACKUP_INVALID_FORMAT')
+  }
+
+  return parsed
+}
+
+export async function previewLogbookBackup(
+  backup: LogbookBackupFile,
+  passphrase: string
+): Promise<LogbookBackupPreview> {
+  const logbookKey = await unwrapLogbookKey(backup.logbookKey, passphrase)
+  const parsed = JSON.parse(backup.logbook.encryptedTitle)
+  const title = await decryptJson(parsed.ciphertext, parsed.iv, parsed.tag, logbookKey)
+
+  return {
+    title,
+    exportedAt: backup.exportedAt,
+    sourceLogbookId: backup.logbook.id,
+    counts: backup.counts
+  }
+}
+
+export interface RestoreLogbookOptions {
+  overwrite?: boolean
+  assignNewId?: boolean
+}
+
+export async function restoreLogbookBackup(
+  backup: LogbookBackupFile,
+  passphrase: string,
+  options: RestoreLogbookOptions = {}
+): Promise<{ logbookId: string; title: string }> {
+  if (!getActiveMasterKey()) {
+    throw new Error('BACKUP_NOT_AUTHENTICATED')
+  }
+
+  const logbookKey = await unwrapLogbookKey(backup.logbookKey, passphrase)
+  const parsedTitle = JSON.parse(backup.logbook.encryptedTitle)
+  const title = await decryptJson(
+    parsedTitle.ciphertext,
+    parsedTitle.iv,
+    parsedTitle.tag,
+    logbookKey
+  )
+
+  let targetId = backup.logbook.id
+  const existing = await db.logbooks.get(targetId)
+
+  if (existing && !options.overwrite && !options.assignNewId) {
+    throw new Error('BACKUP_ID_CONFLICT')
+  }
+
+  if (existing && options.overwrite) {
+    await deleteLocalLogbookCache(targetId)
+  }
+
+  if (options.assignNewId || (existing && !options.overwrite)) {
+    targetId = crypto.randomUUID()
+  }
+
+  const prepared = targetId === backup.logbook.id ? backup : remapBackup(backup, targetId)
+
+  await writeBackupToDexie(targetId, prepared, logbookKey)
+  await queueRestoredLogbookForSync(
+    targetId,
+    prepared.logbook.encryptedTitle,
+    logbookKey,
+    prepared.payloads
+  )
+
+  if (navigator.onLine) {
+    await syncLogbook(targetId).catch((err) => {
+      console.warn('Post-restore sync failed, data saved locally:', err)
+    })
+  }
+
+  return { logbookId: targetId, title }
+}
+
+export function downloadBackupBlob(blob: Blob, filename: string): void {
+  const url = URL.createObjectURL(blob)
+  const anchor = document.createElement('a')
+  anchor.href = url
+  anchor.download = filename
+  anchor.click()
+  URL.revokeObjectURL(url)
+}

client/src/services/statsAggregation.ts

@@ -0,0 +1,251 @@
+import { db } from './db.js'
+import { getActiveMasterKey } from './auth.js'
+import { getLogbookKey } from './logbookKeys.js'
+import { decryptJson } from './crypto.js'
+import { decryptLogbookTitle } from './logbook.js'
+import { getDecryptedTrack, type TrackWaypoint } from './trackUpload.js'
+import { compareTravelDaysChronological } from '../utils/logEntryTankLevels.js'
+import type { LogEntryPayloadInput } from '../utils/logEntryPayload.js'
+import {
+  parseEventDistanceNm,
+  splitDistanceByPropulsion
+} from '../utils/propulsionStats.js'
+
+export type DistanceSource = 'gps' | 'events' | 'none'
+
+export interface TravelDayStats {
+  entryId: string
+  logbookId: string
+  date: string
+  dayOfTravel: string
+  departure: string
+  destination: string
+  distanceNm: number
+  distanceSource: DistanceSource
+  fuelConsumptionL: number
+  freshwaterConsumptionL: number
+  sailDistanceNm: number
+  motorDistanceNm: number
+  unknownPropulsionNm: number
+  hasGpsTrack: boolean
+}
+
+export interface TrackSegment {
+  entryId: string
+  dayOfTravel: string
+  label: string
+  waypoints: TrackWaypoint[]
+  colorIndex: number
+}
+
+export interface LogbookStatsSummary {
+  logbookId: string
+  title: string
+  travelDays: TravelDayStats[]
+  routePorts: string[]
+  trackSegments: TrackSegment[]
+  totals: StatsTotals
+}
+
+export interface AccountStatsSummary {
+  logbooks: LogbookStatsSummary[]
+  totals: StatsTotals
+}
+
+export interface StatsTotals {
+  travelDayCount: number
+  daysWithGps: number
+  totalDistanceNm: number
+  sailDistanceNm: number
+  motorDistanceNm: number
+  unknownPropulsionNm: number
+  totalFuelL: number
+  totalFreshwaterL: number
+  avgDistancePerDayNm: number
+  avgFuelPerDayL: number
+  avgFreshwaterPerDayL: number
+  fuelPerNmL: number | null
+}
+
+const TRACK_COLORS = [
+  '#3b82f6',
+  '#10b981',
+  '#f59e0b',
+  '#8b5cf6',
+  '#ec4899',
+  '#06b6d4',
+  '#ef4444',
+  '#84cc16'
+]
+
+function resolveDistanceNm(payload: LogEntryPayloadInput): { distanceNm: number; distanceSource: DistanceSource } {
+  const gpsDistance = Number(payload.trackDistanceNm) || 0
+  if (gpsDistance > 0) {
+    return { distanceNm: gpsDistance, distanceSource: 'gps' }
+  }
+
+  const eventSum = (payload.events || []).reduce(
+    (sum, event) => sum + parseEventDistanceNm(event.distance),
+    0
+  )
+  if (eventSum > 0) {
+    return { distanceNm: Number(eventSum.toFixed(2)), distanceSource: 'events' }
+  }
+
+  return { distanceNm: 0, distanceSource: 'none' }
+}
+
+function buildTotals(days: TravelDayStats[]): StatsTotals {
+  const travelDayCount = days.length
+  const daysWithGps = days.filter((d) => d.hasGpsTrack).length
+  const totalDistanceNm = days.reduce((sum, d) => sum + d.distanceNm, 0)
+  const sailDistanceNm = days.reduce((sum, d) => sum + d.sailDistanceNm, 0)
+  const motorDistanceNm = days.reduce((sum, d) => sum + d.motorDistanceNm, 0)
+  const unknownPropulsionNm = days.reduce((sum, d) => sum + d.unknownPropulsionNm, 0)
+  const totalFuelL = days.reduce((sum, d) => sum + d.fuelConsumptionL, 0)
+  const totalFreshwaterL = days.reduce((sum, d) => sum + d.freshwaterConsumptionL, 0)
+
+  return {
+    travelDayCount,
+    daysWithGps,
+    totalDistanceNm: Number(totalDistanceNm.toFixed(2)),
+    sailDistanceNm: Number(sailDistanceNm.toFixed(2)),
+    motorDistanceNm: Number(motorDistanceNm.toFixed(2)),
+    unknownPropulsionNm: Number(unknownPropulsionNm.toFixed(2)),
+    totalFuelL: Number(totalFuelL.toFixed(1)),
+    totalFreshwaterL: Number(totalFreshwaterL.toFixed(1)),
+    avgDistancePerDayNm:
+      travelDayCount > 0 ? Number((totalDistanceNm / travelDayCount).toFixed(2)) : 0,
+    avgFuelPerDayL:
+      travelDayCount > 0 ? Number((totalFuelL / travelDayCount).toFixed(1)) : 0,
+    avgFreshwaterPerDayL:
+      travelDayCount > 0 ? Number((totalFreshwaterL / travelDayCount).toFixed(1)) : 0,
+    fuelPerNmL:
+      totalDistanceNm > 0 && totalFuelL > 0
+        ? Number((totalFuelL / totalDistanceNm).toFixed(2))
+        : null
+  }
+}
+
+export function buildRoutePorts(days: TravelDayStats[]): string[] {
+  const ports: string[] = []
+  for (const day of days) {
+    const dep = day.departure.trim()
+    const dest = day.destination.trim()
+    if (dep && (ports.length === 0 || ports[ports.length - 1] !== dep)) {
+      ports.push(dep)
+    }
+    if (dest && (ports.length === 0 || ports[ports.length - 1] !== dest)) {
+      ports.push(dest)
+    }
+  }
+  return ports
+}
+
+async function loadTravelDaysForLogbook(
+  logbookId: string,
+  includeTracks: boolean
+): Promise<{ days: TravelDayStats[]; trackSegments: TrackSegment[] }> {
+  const masterKey = (await getLogbookKey(logbookId)) || getActiveMasterKey()
+  if (!masterKey) {
+    throw new Error('Encryption key not found. Please log in.')
+  }
+
+  const localEntries = await db.entries.where({ logbookId }).toArray()
+  const days: TravelDayStats[] = []
+  const trackSegments: TrackSegment[] = []
+
+  for (const entry of localEntries) {
+    const decrypted = await decryptJson(entry.encryptedData, entry.iv, entry.tag, masterKey)
+    if (!decrypted) continue
+
+    const payload = decrypted as LogEntryPayloadInput
+    const { distanceNm, distanceSource } = resolveDistanceNm(payload)
+    const propulsion = splitDistanceByPropulsion(distanceNm, payload.events || [])
+
+    let hasGpsTrack = false
+    if (includeTracks) {
+      const track = await getDecryptedTrack(entry.payloadId)
+      if (track && track.waypoints.length >= 2) {
+        hasGpsTrack = true
+        trackSegments.push({
+          entryId: entry.payloadId,
+          dayOfTravel: payload.dayOfTravel || '',
+          label: payload.dayOfTravel || '?',
+          waypoints: track.waypoints,
+          colorIndex: trackSegments.length % TRACK_COLORS.length
+        })
+      }
+    } else {
+      hasGpsTrack = !!(await db.gpsTracks.get(entry.payloadId))
+    }
+
+    days.push({
+      entryId: entry.payloadId,
+      logbookId,
+      date: payload.date || '',
+      dayOfTravel: payload.dayOfTravel || '',
+      departure: payload.departure || '',
+      destination: payload.destination || '',
+      distanceNm,
+      distanceSource,
+      fuelConsumptionL: Number(payload.fuel?.consumption) || 0,
+      freshwaterConsumptionL: Number(payload.freshwater?.consumption) || 0,
+      sailDistanceNm: propulsion.sailDistanceNm,
+      motorDistanceNm: propulsion.motorDistanceNm,
+      unknownPropulsionNm: propulsion.unknownPropulsionNm,
+      hasGpsTrack
+    })
+  }
+
+  days.sort(compareTravelDaysChronological)
+  trackSegments.sort((a, b) => Number(a.dayOfTravel) - Number(b.dayOfTravel))
+
+  return { days, trackSegments }
+}
+
+export async function loadLogbookStats(
+  logbookId: string,
+  title: string,
+  includeTracks = true
+): Promise<LogbookStatsSummary> {
+  const { days, trackSegments } = await loadTravelDaysForLogbook(logbookId, includeTracks)
+  return {
+    logbookId,
+    title,
+    travelDays: days,
+    routePorts: buildRoutePorts(days),
+    trackSegments,
+    totals: buildTotals(days)
+  }
+}
+
+export async function loadAccountStats(includeTracks = false): Promise<AccountStatsSummary> {
+  const logbooks = await db.logbooks.toArray()
+  const summaries: LogbookStatsSummary[] = []
+
+  for (const lb of logbooks) {
+    const title = await decryptLogbookTitle(lb.id, lb.encryptedTitle)
+    summaries.push(await loadLogbookStats(lb.id, title, includeTracks))
+  }
+
+  summaries.sort((a, b) => a.title.localeCompare(b.title, undefined, { sensitivity: 'base' }))
+
+  const allDays = summaries.flatMap((s) => s.travelDays)
+  return {
+    logbooks: summaries,
+    totals: buildTotals(allDays)
+  }
+}
+
+export function getTrackColor(index: number): string {
+  return TRACK_COLORS[index % TRACK_COLORS.length]
+}
+
+export function formatNm(value: number): string {
+  return value.toFixed(2)
+}
+
+export function formatLiters(value: number): string {
+  return Number.isInteger(value) ? String(value) : value.toFixed(1)
+}

client/src/services/sync.ts

@@ -1,8 +1,9 @@
-import { db } from './db.js'
+import { db, type SyncQueueItem } from './db.js'
 import { getActiveMasterKey } from './auth.js'
 
 const API_BASE = '/api/sync'
 const syncingLogbooks = new Set<string>()
+const pendingResync = new Set<string>()
 
 let isSyncing = false
 const listeners = new Set<(syncing: boolean) => void>()
@@ -27,13 +28,108 @@ function isNewer(timeA: string | Date, timeB: string | Date): boolean {
   return new Date(timeA).getTime() > new Date(timeB).getTime()
 }
 
+function entityKey(item: SyncQueueItem): string {
+  return `${item.type}:${item.payloadId}`
+}
+
+function latestQueueItem(items: SyncQueueItem[]): SyncQueueItem {
+  return items.reduce((a, b) => ((a.id ?? 0) > (b.id ?? 0) ? a : b))
+}
+
+async function entityExistsLocally(item: SyncQueueItem): Promise<boolean> {
+  switch (item.type) {
+    case 'logbook':
+      return !!(await db.logbooks.get(item.payloadId))
+    case 'yacht':
+      return !!(await db.yachts.get(item.logbookId))
+    case 'deviation':
+      return !!(await db.deviations.get(item.logbookId))
+    case 'crew':
+      return !!(await db.crews.get(item.payloadId))
+    case 'entry':
+      return !!(await db.entries.get(item.payloadId))
+    case 'photo':
+      return !!(await db.photos.get(item.payloadId))
+    case 'gpsTrack':
+      return !!(await db.gpsTracks.get(item.payloadId))
+    default:
+      return false
+  }
+}
+
+// Pick one queue entry per entity. If the record still exists locally, the latest
+// action wins (supports recreate-after-delete). If it was removed locally, a delete
+// wins over stale upserts with higher IDs; orphaned upserts are dropped entirely.
+async function resolveCoalescedItem(group: SyncQueueItem[]): Promise<SyncQueueItem | null> {
+  const exists = await entityExistsLocally(group[0])
+  if (exists) {
+    return latestQueueItem(group)
+  }
+
+  const deletes = group.filter((item) => item.action === 'delete')
+  if (deletes.length > 0) {
+    return latestQueueItem(deletes)
+  }
+
+  return null
+}
+
+async function coalesceSyncQueue(logbookId: string): Promise<SyncQueueItem[]> {
+  const pending = await db.syncQueue.where({ logbookId }).toArray()
+  if (pending.length <= 1) return pending
+
+  const byEntity = new Map<string, SyncQueueItem[]>()
+  for (const item of pending) {
+    const key = entityKey(item)
+    const group = byEntity.get(key)
+    if (group) group.push(item)
+    else byEntity.set(key, [item])
+  }
+
+  const kept: SyncQueueItem[] = []
+  const staleIds: number[] = []
+
+  for (const group of byEntity.values()) {
+    const winner = await resolveCoalescedItem(group)
+
+    if (winner) {
+      kept.push(winner)
+      for (const item of group) {
+        if (item.id !== undefined && item.id !== winner.id) {
+          staleIds.push(item.id)
+        }
+      }
+    } else {
+      for (const item of group) {
+        if (item.id !== undefined) {
+          staleIds.push(item.id)
+        }
+      }
+    }
+  }
+
+  if (staleIds.length > 0) {
+    await db.syncQueue.bulkDelete(staleIds)
+  }
+
+  return kept.sort((a, b) => (a.id ?? 0) - (b.id ?? 0))
+}
+
+function scheduleResync(logbookId: string) {
+  if (pendingResync.has(logbookId)) return
+  pendingResync.add(logbookId)
+  queueMicrotask(() => {
+    pendingResync.delete(logbookId)
+    syncLogbook(logbookId).catch((err) => console.warn('Deferred sync failed:', err))
+  })
+}
+
 // Push local sync queue items to the server
 async function pushChanges(logbookId: string): Promise<boolean> {
   const userId = localStorage.getItem('active_userid')
   if (!userId) return false
 
-  // Fetch all pending queue items for this logbook
-  const pending = await db.syncQueue.where({ logbookId }).toArray()
+  const pending = await coalesceSyncQueue(logbookId)
   if (pending.length === 0) return true
 
   try {
@@ -53,13 +149,14 @@ async function pushChanges(logbookId: string): Promise<boolean> {
 
     const { results } = await response.json()
 
-    // Process results
-    for (const res of results) {
+    // Match results by index — payloadId alone is not unique in the queue
+    for (let i = 0; i < results.length; i++) {
+      const res = results[i]
+      const queueItem = pending[i]
+      if (!queueItem) continue
+
       if (res.status === 'success' || res.status === 'conflict') {
-        // Find matching queue item
-        const queueItem = pending.find((item) => item.payloadId === res.payloadId)
-        if (queueItem && queueItem.id !== undefined) {
-          // Delete from sync queue
+        if (queueItem.id !== undefined) {
           await db.syncQueue.delete(queueItem.id)
         }
       } else {
@@ -73,6 +170,21 @@ async function pushChanges(logbookId: string): Promise<boolean> {
   }
 }
 
+async function flushPushQueue(logbookId: string): Promise<boolean> {
+  let ok = true
+  for (let attempt = 0; attempt < 5; attempt++) {
+    const before = await db.syncQueue.where({ logbookId }).count()
+    if (before === 0) return ok
+
+    const pushed = await pushChanges(logbookId)
+    ok = ok && pushed
+
+    const after = await db.syncQueue.where({ logbookId }).count()
+    if (after === 0 || after === before) break
+  }
+  return ok
+}
+
 // Pull updates from the server and apply last-write-wins
 async function pullChanges(logbookId: string): Promise<boolean> {
   const userId = localStorage.getItem('active_userid')
@@ -266,14 +378,20 @@ export async function syncLogbook(logbookId: string): Promise<boolean> {
   const masterKey = getActiveMasterKey()
   if (!masterKey) return false
 
-  if (syncingLogbooks.has(logbookId)) return false
+  if (syncingLogbooks.has(logbookId)) {
+    scheduleResync(logbookId)
+    return false
+  }
+
   syncingLogbooks.add(logbookId)
   setSyncing(true)
 
   try {
-    const pushed = await pushChanges(logbookId)
+    const pushed = await flushPushQueue(logbookId)
     const pulled = await pullChanges(logbookId)
-    return pushed && pulled;
+    // Push again in case pull surfaced nothing but queue grew during pull
+    const pushedAfterPull = await flushPushQueue(logbookId)
+    return pushed && pulled && pushedAfterPull
   } finally {
     syncingLogbooks.delete(logbookId)
     setSyncing(syncingLogbooks.size > 0)
@@ -296,6 +414,19 @@ export async function syncAllLogbooks(): Promise<void> {
     for (const lb of logbooks) {
       await syncLogbook(lb.id)
     }
+
+    // 3. Clean up orphaned queue items for logbooks no longer in db.logbooks.
+    // Re-read logbooks so any logbooks created during step 2 are included.
+    const freshLogbooks = await db.logbooks.toArray()
+    const freshKnownIds = new Set(freshLogbooks.map((l) => l.id))
+    const currentQueue = await db.syncQueue.toArray()
+    const orphanedIds = currentQueue
+      .filter((i) => !freshKnownIds.has(i.logbookId))
+      .map((i) => i.id!)
+      .filter(Boolean)
+    if (orphanedIds.length > 0) {
+      await db.syncQueue.bulkDelete(orphanedIds)
+    }
   } catch (error) {
     console.error('Error synchronizing all logbooks:', error)
   } finally {
@@ -304,7 +435,7 @@ export async function syncAllLogbooks(): Promise<void> {
 }
 
 // Setup background sync intervals
-let syncIntervalId: any = null
+let syncIntervalId: ReturnType<typeof setInterval> | null = null
 
 export function startBackgroundSync(intervalMs = 30000) {
   if (syncIntervalId) clearInterval(syncIntervalId)

client/src/utils/logEntryTankLevels.ts

@@ -41,6 +41,13 @@ export function getClosingTankLevel(tank?: Partial<TankLevels> | null): number {
 export interface LogEntryTankSource {
   freshwater?: Partial<TankLevels>
   fuel?: Partial<TankLevels>
+  destination?: string
+}
+
+export interface CarryOverFromPreviousDay {
+  freshwater: TankLevels
+  fuel: TankLevels
+  departure: string
 }
 
 export function emptyTankLevels(morning = 0): TankLevels {
@@ -62,3 +69,14 @@ export function carryOverTankLevelsFromPreviousDay(previousEntry?: LogEntryTankS
     fuel: emptyTankLevels(getClosingTankLevel(previousEntry.fuel))
   }
 }
+
+export function carryOverFromPreviousDay(previousEntry?: LogEntryTankSource | null): CarryOverFromPreviousDay {
+  const { freshwater, fuel } = carryOverTankLevelsFromPreviousDay(previousEntry)
+  const departure = previousEntry?.destination?.trim() || ''
+
+  return { freshwater, fuel, departure }
+}
+
+export function hasCarryOverFromPreviousDay(carryOver: CarryOverFromPreviousDay): boolean {
+  return carryOver.freshwater.morning > 0 || carryOver.fuel.morning > 0 || carryOver.departure.length > 0
+}

client/src/utils/propulsionStats.ts

@@ -0,0 +1,58 @@
+import type { LogEventPayload } from './logEntryPayload.js'
+
+export type PropulsionMode = 'sail' | 'motor'
+
+const MOTOR_LABELS = ['Maschinenfahrt', 'Engine Propulsion']
+
+export function isMotorPropulsion(sailsOrMotor: string): boolean {
+  const normalized = sailsOrMotor.trim().toLowerCase()
+  if (!normalized) return false
+  return MOTOR_LABELS.some((label) => normalized.includes(label.toLowerCase()))
+}
+
+export function classifyEventPropulsion(event: Pick<LogEventPayload, 'sailsOrMotor'>): PropulsionMode {
+  return isMotorPropulsion(event.sailsOrMotor) ? 'motor' : 'sail'
+}
+
+export interface PropulsionDistanceSplit {
+  sailDistanceNm: number
+  motorDistanceNm: number
+  unknownPropulsionNm: number
+}
+
+export function splitDistanceByPropulsion(
+  distanceNm: number,
+  events: Pick<LogEventPayload, 'sailsOrMotor'>[]
+): PropulsionDistanceSplit {
+  if (distanceNm <= 0) {
+    return { sailDistanceNm: 0, motorDistanceNm: 0, unknownPropulsionNm: 0 }
+  }
+
+  const classified = events.filter((e) => e.sailsOrMotor.trim())
+  if (classified.length === 0) {
+    return { sailDistanceNm: 0, motorDistanceNm: 0, unknownPropulsionNm: distanceNm }
+  }
+
+  let motorCount = 0
+  let sailCount = 0
+  for (const event of classified) {
+    if (isMotorPropulsion(event.sailsOrMotor)) {
+      motorCount++
+    } else {
+      sailCount++
+    }
+  }
+
+  const total = motorCount + sailCount
+  const motorDistanceNm = Number(((distanceNm * motorCount) / total).toFixed(2))
+  const sailDistanceNm = Number((distanceNm - motorDistanceNm).toFixed(2))
+
+  return { sailDistanceNm, motorDistanceNm, unknownPropulsionNm: 0 }
+}
+
+export function parseEventDistanceNm(distance: string): number {
+  const match = distance.replace(',', '.').match(/(\d+(?:\.\d+)?)/)
+  if (!match) return 0
+  const value = Number(match[1])
+  return Number.isFinite(value) && value > 0 ? value : 0
+}

client/src/utils/signatures.ts

@@ -1,5 +1,8 @@
+import { hashEntryForSigning } from './entryCanonicalHash.js'
 import type { PasskeySignature, SignatureValue } from '../types/signatures.js'
 
+export type SkipperSignStatus = 'none' | 'valid' | 'invalid'
+
 export function isSignatureImage(value: string | undefined | null): boolean {
   return typeof value === 'string' && value.startsWith('data:image/')
 }
@@ -31,6 +34,16 @@ export function isSignatureValidForEntry(sig: PasskeySignature, entryHash: strin
   return sig.entryHash === entryHash
 }
 
+export async function getSkipperSignStatus(
+  entry: Record<string, unknown>
+): Promise<SkipperSignStatus> {
+  const signSkipper = normalizeSignature(entry.signSkipper)
+  if (!signSkipper) return 'none'
+  if (!isPasskeySignature(signSkipper)) return 'valid'
+  const hash = await hashEntryForSigning(entry)
+  return isSignatureValidForEntry(signSkipper, hash) ? 'valid' : 'invalid'
+}
+
 export interface SignatureExportLabels {
   imagePlaceholder: string
   passkeyLabel: (username: string, signedAt: string) => string

client/src/vite-env.d.ts

@@ -1,9 +1,17 @@
 /// <reference types="vite/client" />
 /// <reference types="vite-plugin-pwa/react" />
 
-declare const __APP_VERSION__: string
-
 declare module '*?raw' {
   const content: string
   export default content
 }
+
+declare global {
+  const __APP_VERSION__: string
+
+  interface Window {
+    plausible?: (event: string, options?: { props?: Record<string, string | number | boolean> }) => void
+  }
+}
+
+export {}

docs/plausible-events.md

@@ -0,0 +1,64 @@
+# Plausible Custom Events
+
+Kapteins Daagbok nutzt [Plausible Analytics](https://plausible.io/) mit dem Script `script.tagged-events.js` auf der Domain `kapteins-daagbok.eu`. Custom Events werden über `window.plausible()` ausgelöst (siehe `client/src/services/analytics.ts`).
+
+**Datenschutz:** Es werden keine personenbezogenen Daten in Event-Properties übermittelt (keine Nutzernamen, Hafennamen, Koordinaten o.ä.).
+
+## Setup
+
+1. Script in `client/index.html` (bereits eingebunden)
+2. Nach Deploy: Goals im Plausible-Dashboard anlegen — **Namen müssen exakt mit der Event-Spalte „Event name“ übereinstimmen** (Title Case, Leerzeichen)
+
+## Event-Übersicht
+
+| Event | Auslöser | Properties |
+|-------|----------|------------|
+| Account Created | Erfolgreiche Registrierung (`auth.ts`) | — |
+| Logged In | Login oder Einladungs-Flow abgeschlossen (`App.tsx`) | — |
+| Logbook Created | Neues Logbuch im Dashboard (`LogbookDashboard.tsx`) | — |
+| Logbook Deleted | Logbuch gelöscht (`logbook.ts`) | — |
+| Travel Day Created | Neuer Reisetag über „+“ in der Eintragsliste (`LogEntriesList.tsx`) | — |
+| Travel Day Saved | Reisetag gespeichert (`LogEntryEditor.tsx`) | — |
+| Entry Signed | Passkey-Signatur Skipper oder Crew (`LogEntryEditor.tsx`) | `role`: `skipper` \| `crew` |
+| GPS Track Uploaded | GPX/KML/GeoJSON hochgeladen (`LogEntryEditor.tsx`) | — |
+| Vessel Saved | Schiffsdaten gespeichert (`VesselForm.tsx`) | — |
+| Crew Saved | Skipper- oder Crew-Profil gespeichert (`CrewForm.tsx`) | `role`: `skipper` \| `crew`, `action`: `create` \| `update` |
+| Account Deleted | Konto erfolgreich gelöscht (`auth.ts`) | — |
+| Onboarding Tour Completed | Onboarding-Tour bis zum letzten Schritt durchlaufen (`AppTourContext.tsx`) | `mode`: `demo` (optional, bei Public-Demo) |
+| Onboarding Tour Skipped | Tour vorzeitig beendet (Skip, Escape, Backdrop, `stopTour`) | `step`: Tour-Schritt-ID (z.B. `welcome`, `entry_track`), optional `mode`: `demo` |
+| Demo Opened | Public-Demo unter `/demo` geöffnet (`DemoViewer.tsx`) | — |
+| Invite Generated | Einladungslink erzeugt (`SettingsForm.tsx`) | — |
+| Invite Accepted | Einladung angenommen und Logbuch beigetreten (`InvitationAcceptance.tsx`) | — |
+| PDF Exported | PDF-Export eines Reisetags (`LogEntryEditor.tsx`, `LogEntriesList.tsx`) | `scope`: `entry` |
+| CSV Exported | CSV-Download aus der Eintragsliste (`LogEntriesList.tsx`) | — |
+| CSV Shared | CSV über Web Share API geteilt (`LogEntriesList.tsx`) | — |
+| Photo Uploaded | Foto hochgeladen (`PhotoCapture.tsx`, `CrewForm.tsx`) | `context`: `logbook` \| `crew`, bei Crew zusätzlich `role`: `skipper` \| `crew` |
+| Backup Exported | Backup-Datei heruntergeladen (`LogbookBackupPanel.tsx`) | `entries`, `photos` (Anzahlen, keine Inhalte) |
+| Backup Restored | Backup wiederhergestellt (`LogbookBackupPanel.tsx`) | `entries`, `photos`, `mode`: `same_id` \| `overwrite` \| `new_id` |
+
+## Bewusst nicht getrackt
+
+- **Demo-Logbuch:** Beim automatischen Seed (`demoLogbook.ts`) werden keine Events ausgelöst — nur echte Nutzeraktionen zählen.
+- **Manuelle Signaturen:** Nur Passkey-Signaturen lösen `Entry Signed` aus.
+- **PII:** Keine Inhalte aus verschlüsselten Logbüchern in Properties.
+
+## Typische Funnels (Plausible Goals)
+
+Empfohlene Goal-Ketten für Auswertung:
+
+1. **Aktivierung:** Account Created → Logbook Created → Travel Day Created → Travel Day Saved
+2. **Onboarding:** Account Created → Onboarding Tour Completed (vs. Onboarding Tour Skipped)
+3. **Kollaboration:** Invite Generated → Invite Accepted
+4. **Export:** Travel Day Saved → PDF Exported / CSV Exported
+5. **Datensicherung:** Backup Exported → Backup Restored
+
+## Entwicklung
+
+```ts
+import { PlausibleEvents, trackPlausibleEvent } from './services/analytics.js'
+
+trackPlausibleEvent(PlausibleEvents.TRAVEL_DAY_SAVED)
+trackPlausibleEvent(PlausibleEvents.ENTRY_SIGNED, { role: 'skipper' })
+```
+
+Lokal ohne Plausible-Script ist `trackPlausibleEvent` ein No-Op. In Production im Browser-Netzwerk-Tab auf Requests an die Plausible-Instanz prüfen.

scripts/update-prod.sh

@@ -143,10 +143,26 @@ APP_VERSION="$6"
 
 cd "$REMOTE_DIR" || { echo "Error: Remote directory '$REMOTE_DIR' not found."; exit 1; }
 
-echo "Pulling latest changes from Git..."
-git pull --tags
+echo "Syncing repository from origin..."
+CURRENT_BRANCH="$(git branch --show-current)"
+if [ -z "$CURRENT_BRANCH" ]; then
+  echo "Error: Could not determine current Git branch."
+  exit 1
+fi
+
+if ! git diff-index --quiet HEAD -- || [ -n "$(git status --porcelain)" ]; then
+  echo "Warning: Local changes on deployment host will be discarded."
+fi
+
+git fetch --tags origin
 if [ $? -ne 0 ]; then
-  echo "Error: Git pull failed."
+  echo "Error: Git fetch failed."
+  exit 1
+fi
+
+git reset --hard "origin/${CURRENT_BRANCH}"
+if [ $? -ne 0 ]; then
+  echo "Error: Git reset to origin/${CURRENT_BRANCH} failed."
   exit 1
 fi
 

server/src/routes/sync.ts

@@ -103,15 +103,34 @@ router.post('/push', async (req: any, res) => {
           continue
         }
 
-        // Parse Payload parameters
+        if (action === 'delete') {
+          if (type === 'yacht') {
+            await prisma.yachtPayload.deleteMany({ where: { logbookId } })
+          } else if (type === 'deviation') {
+            await prisma.deviationPayload.deleteMany({ where: { logbookId } })
+          } else if (type === 'crew') {
+            await prisma.crewPayload.deleteMany({ where: { logbookId, payloadId } })
+          } else if (type === 'entry') {
+            await prisma.entryPayload.deleteMany({ where: { logbookId, payloadId } })
+          } else if (type === 'photo') {
+            await prisma.photoPayload.deleteMany({ where: { logbookId, payloadId } })
+          } else if (type === 'gpsTrack') {
+            await prisma.gpsTrackPayload.deleteMany({ where: { logbookId, entryId: payloadId } })
+          } else {
+            results.push({ payloadId, status: 'error', error: `Unsupported delete type: ${type}` })
+            continue
+          }
+          results.push({ payloadId, status: 'success' })
+          continue
+        }
+
+        // Parse payload for create/update operations
         const parsed = JSON.parse(data)
         const encryptedData = parsed.encryptedData || parsed.ciphertext
         const { iv, tag } = parsed
 
         if (type === 'yacht') {
-          if (action === 'delete') {
-            await prisma.yachtPayload.deleteMany({ where: { logbookId } })
-          } else {
+          {
             const existing = await prisma.yachtPayload.findUnique({ where: { logbookId } })
             if (existing && new Date(existing.updatedAt) > itemUpdatedAt) {
               results.push({ payloadId, status: 'conflict', reason: 'Server version is newer' })
@@ -124,9 +143,7 @@ router.post('/push', async (req: any, res) => {
             })
           }
         } else if (type === 'deviation') {
-          if (action === 'delete') {
-            await prisma.deviationPayload.deleteMany({ where: { logbookId } })
-          } else {
+          {
             const existing = await prisma.deviationPayload.findUnique({ where: { logbookId } })
             if (existing && new Date(existing.updatedAt) > itemUpdatedAt) {
               results.push({ payloadId, status: 'conflict', reason: 'Server version is newer' })
@@ -139,9 +156,7 @@ router.post('/push', async (req: any, res) => {
             })
           }
         } else if (type === 'crew') {
-          if (action === 'delete') {
-            await prisma.crewPayload.deleteMany({ where: { logbookId, payloadId } })
-          } else {
+          {
             const existing = await prisma.crewPayload.findUnique({
               where: { logbookId_payloadId: { logbookId, payloadId } }
             })
@@ -156,9 +171,7 @@ router.post('/push', async (req: any, res) => {
             })
           }
         } else if (type === 'entry') {
-          if (action === 'delete') {
-            await prisma.entryPayload.deleteMany({ where: { logbookId, payloadId } })
-          } else {
+          {
             const existing = await prisma.entryPayload.findUnique({
               where: { logbookId_payloadId: { logbookId, payloadId } }
             })
@@ -173,9 +186,7 @@ router.post('/push', async (req: any, res) => {
             })
           }
         } else if (type === 'photo') {
-          if (action === 'delete') {
-            await prisma.photoPayload.deleteMany({ where: { logbookId, payloadId } })
-          } else {
+          {
             const existing = await prisma.photoPayload.findUnique({
               where: { logbookId_payloadId: { logbookId, payloadId } }
             })
@@ -191,9 +202,7 @@ router.post('/push', async (req: any, res) => {
             })
           }
         } else if (type === 'gpsTrack') {
-          if (action === 'delete') {
-            await prisma.gpsTrackPayload.deleteMany({ where: { logbookId, entryId: payloadId } })
-          } else {
+          {
             const existing = await prisma.gpsTrackPayload.findUnique({
               where: { entryId: payloadId }
             })