Reading activity grid in Settings: months, weeks, days, hours with drill-down

Active reader time is now kept per user in small UTC buckets (6 minutes for 120 days, then hours, dropped after three years), seeded once from the visits the clock still remembers. Settings -> Reading activity shows them as a grid whose cells glow with their total and carry a start-to-end strip; month/week cells open their days, days open their hours. Finished chapters come from progress and work without the clock. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Continue row: a run of more than N chapters in order also marks a reread
2026-11-03 12:41:44 +01:00 · 2026-11-01 11:47:45 +01:00 · 2026-11-01 11:27:02 +01:00 · 2026-10-31 12:21:24 +01:00 · 2026-10-31 11:49:52 +01:00
23 changed files with 1033 additions and 36 deletions
@@ -12,6 +12,7 @@
 !reading-access.js
 !moments.js
 !reader-sessions.js
+!reading-activity.js
 !public/
 !public/**
 !greatest/
@@ -3,7 +3,7 @@ RUN apk add --no-cache tzdata openssl
 WORKDIR /app
 ARG VCS_REF=development
 LABEL org.opencontainers.image.title="MangaCircus" org.opencontainers.image.revision=$VCS_REF
-COPY package.json server.js library.js reading-direction.js chapter-identity.js chapter-dates.js reading-analytics.js reading-access.js catalog.js backup.js moments.js reader-sessions.js ./
+COPY package.json server.js library.js reading-direction.js chapter-identity.js chapter-dates.js reading-analytics.js reading-access.js catalog.js backup.js moments.js reader-sessions.js reading-activity.js ./
 COPY public ./public
 COPY greatest ./greatest
 COPY discovery ./discovery
@@ -148,7 +148,7 @@ completeness.
 - **Flow page gap:** Settings → Reading lets each user keep the normal separator between Flow pages or remove it for continuous webtoon artwork and text that crosses image edges.
 - **Page tone:** the reader's **Tone** button cycles Original → Inverted → Sepia → Dim → Extra dim in Flow, Page and Book. It changes only the artwork, never the controls or site theme. The choice is saved per user; it can also be selected in Settings → User → Reading.
 - **Active Reading Clock:** opt in under Settings → User → Reading time & privacy. No scrolling-speed limit; a visit counts at 60% viewed-page coverage and saves on exit. Pauses in the background or after 30 seconds without reader activity. Tap the clock for this visit's time, coverage, qualification and loading wait.
- **Continue where you left off:** the first line of the library content (below the search, filters and tags) is one row of the five manga you read most recently and have not finished (same tiles as the grid; they stay in the grid too). It hides while a search is typed, a status filter is set, or the library is sorted by *Recently read*; tags and collection grouping do not affect it. Turn it off under Settings → User → Reading → *Library page*.
+- **Continue where you left off:** the first line of the library content (below the search, filters and tags) is one row of the five manga you read most recently that still have something left after the last chapter you read (same tiles as the grid; they stay in the grid too). Left means an unfinished last chapter, an unread later chapter, or — when you are rereading — a later chapter you finished in an earlier pass: more than *N days* before your current position (default 7), or before a run of more than *M chapters* you have since read in order up to it (default 5). Both are set under Settings → User → Reading → *Library page*; 0 turns a rule off. A manga you have caught up on drops out until a new chapter arrives. It hides while a search is typed, a status filter is set, or the library is sorted by *Recently read*; tags and collection grouping do not affect it. Turn it off under Settings → User → Reading → *Library page*.
 - **Your Reading Story:** private active-time summaries appear on the library and manga pages when history exists. Chapter rows show the last timed read (60%-coverage visit), rereads remain visible as lifetime time, and Settings lets each user hide, export, or delete their own history. No leaderboards or speed ranking are used.
 - **Tap / click zones:**
  - Tapping **beside the pages** always shows or hides the controls.
@@ -129,6 +129,8 @@ This keeps ids human-readable and derivable without a database. The price: renam
        "readingClock": false,           // opt in to credible per-chapter active-time tracking
        "readingStory": true,            // show private retrospective summaries when history exists
        "continueRow": true,             // library: "Continue where you left off" row at the top
+        "rereadDays": 7,                 // continue row: a later chapter finished this long before the head is left again (0 = off)
+        "rereadChapters": 5,             // ... or one finished before a run of more than this many in-order chapters (0 = off)
        "zoom": { "flow": 1, "page": 1.5, "book": 1, "strip": 0.8 },   // page zoom per mode
        "webhook": "",
        "readerPerSession": true        // reader settings per login session (section 6.7)
@@ -201,12 +203,14 @@ All requests and responses are JSON. POSTs require `Content-Type: application/js
 | `GET /api/reader-sessions` | user | `{ enabled, current, latestFrom, latest, sessions: [{ id, device, created, seen, current, locked, reader }] }` |
 | `POST /api/reader-sessions` `{id, action}` | user | `follow`: the session drops its own reader settings and follows the latest; `latest`: its settings become the latest |
 | `POST /api/password` `{old, new}` | user | Change password |
-| `GET /api/library` | user | Manga list with covers, counts, the user's read count, unread notifications, last read, and optional personal Reading Story aggregates |
+| `GET /api/library` | user | Manga list with covers, counts, the user's read count, unread notifications, last read, `left` (chapters after the newest saved position that are unfinished, unread, or finished in an earlier pass — over `rereadDays` before it, or before a run of more than `rereadChapters` chapters read in order up to it; 0 = caught up), and optional personal Reading Story aggregates |
 | `GET /api/manga?m=` | user | Manga details, books, chapters with ranked versions, progress, optional chapter-time summaries, and `continue` target |
-| `GET /api/chapter?m=&c=[&v=]` | user | Pages (`u, w, h, t, r`), direction, versions, prev/next, progress, optional Active Reading Clock summary, plus all books and chapters of the manga (with the user's read state) for the chapter picker. Also marks that chapter's notifications read |
-| `POST /api/progress` `{m, c, v, p, n, done, shift}` | user | Save the reading position |
+| `GET /api/chapter?m=&c=[&v=]` | user | Pages (`u, w, h, t, r`), direction, versions, prev/next, progress, `latest` (as in `/api/progress/latest`), optional Active Reading Clock summary, plus all books and chapters of the manga (with the user's read state) for the chapter picker. Also marks that chapter's notifications read |
+| `POST /api/progress` `{m, c, v, p, n, done, shift[, tab, seen]}` | user | Save the reading position. With `seen`, a save is refused (`{ok:false, stale:true, latest}`) when another tab saved a newer position of this manga since; otherwise `{ok:true, t}` |
+| `GET /api/progress/latest?m=` | user | The manga's newest saved position (`latest`: `t, w, c, label, v, p, n, done, continue`) or `null` |
 | `POST /api/reading/pulse` `{m, c, v, session, seq, …deltas}` | user | When opted in, idempotently merge a clamped active-time pulse, verified page coverage and input totals under a single-reader lease |
 | `GET /api/reading/export` | user | Export the user's private derived reading-time summary without raw input or page-exposure diagnostics |
+| `GET /api/reading/activity` | user | The user's reading activity for the Settings grid: active reader time in UTC buckets `[start, size, ms, [[mangaIndex, ms]...]]` (6 minutes for the last 120 days, hours up to three years), chapter completions `[doneAt, mangaIndex, label]`, manga titles and whether the clock is on. The browser groups them into local months, weeks, days and hours (`public/activity-core.js`) |
 | `POST /api/reading/delete` `{m}` or `{all:true,password}` | user | Delete one manga's reading history, or all history after password confirmation, without changing normal reading progress |
 | `POST /api/unread` `{m, c}` | user | Forget progress for a chapter |
 | `POST /api/vote` `{m, c, v, value: 1\|-1\|0}` | user | Vote a version; returns the re-ranked versions |
@@ -373,6 +377,7 @@ mode       = adapt && intended ∉ compatible ? compatible[0] : intended
 - Saved 700 ms after the position settles, and on `pagehide` (a `fetch` with `keepalive`).
 - Stores the page index in the full page list, so skipping extras doesn't corrupt it.
 - On open, the saved page is used for the same version, and mapped proportionally for another version. A finished chapter reopens at the start.
+- **Stale reading sessions.** A tab left open on one device (or restored by the browser) must not move "Continue" back after the user read on elsewhere. Each browser tab has an id (`sessionStorage`) that its saves store as `w`; reader links carry `at`, the newest progress time the linking page knew (`continue.at`), and the reader keeps `at` current in its address bar so a reload or restored tab still knows it. A link without `at` (bookmark, notification) counts as a deliberate open. When the manga's newest position is later than `at` and came from another tab, the reader saves nothing and asks: jump to the newest position, or keep reading here, which makes this chapter the head again. It checks on open, when the tab becomes visible again, and with every save (the server refuses the stale save). The comparison is by save time, not chapter order; the question names no device.

 **Active Reading Clock (opt-in):**
 - Runs only while the reader is visible and focused, a sufficiently exposed page is decoded, a server lease is held, and accepted reader input occurred in the last 50 seconds.
@@ -144,6 +144,16 @@ history from which those values can be reconstructed.

 ## 5. Later: Reading Journal

+Update 2026-11-03: the activity calendar exists as **Settings → Reading activity**
+(`reading-activity.js`, `db.activity`). It stores active reader time per user in UTC
+buckets: 6 minutes for the last 120 days, then folded into hours, dropped after three
+years. Each bucket keeps only its total and the time per manga. All active reader time
+counts there, including visits below the 60% threshold, because it answers "when did I
+read", not "how long did a chapter take". The first use seeds the buckets from the last
+eight visits per chapter the clock still remembers; older history cannot be recovered.
+Finished chapters come from the existing progress `doneAt` and need no clock.
+Deleting reading-time history (all, or one manga) deletes the matching activity.
+
 If readers enjoy Reading Story, add bounded daily aggregates rather than raw activity
 events:

@@ -27,7 +27,7 @@ heading when switching within Settings.

 ## Routes and ownership

-Personal routes: `settings.html#user/reading`, `#user/reading-time`,
+Personal routes: `settings.html#user/reading`, `#user/reading-time`, `#user/activity`,
 `#user/notifications`, `#user/account`.

 Admin routes: `settings.html#admin/scraper`, `#admin/library`, `#admin/users`.
@@ -63,6 +63,8 @@ Service health also holds the **Backups** card: built-in backup status (last run
 size, duration, error), **Back up now**, and the daily schedule and retention form,
 whose draft survives the page's polling. See [backup.md](backup.md).

+Reading activity is a grid of months, weeks, days or hours (`public/activity.js`). Each cell glows with its total and holds a strip from the period's start (left) to its end (right): days in a month, quarter days in a week, hours in a day, 6 minutes in an hour. Clicking a month or week opens its days (the week is marked), a day opens its hours; hover, keyboard focus or a first tap shows details. It measures reading time (needs the Active Reading Clock) or finished chapters (from progress, always available).
+
 Reading-time collection controls, export and deletion live under Reading time &
 privacy; reader layout controls stay under Reading. Rescan controls and user
 administration are separate. Server & library describes existing maintenance,
@@ -0,0 +1,167 @@
+'use strict';
+/* Reading activity grid: periods, layouts and sums in the browser's local time.
+   Pure functions, so the node tests can run them. The server only sends UTC buckets. */
+
+const ACTIVITY_VIEWS = ['month', 'week', 'day', 'hour'];
+const ACTIVITY_DAY_NAMES = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
+const ACTIVITY_MONTHS = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
+const ACTIVITY_QUARTERS = ['night', 'morning', 'afternoon', 'evening'];
+const ACTIVITY_HOUR_MS = 3600000, ACTIVITY_SLICES = 10;
+
+// Start of the local month, Monday-based week, day or hour containing t.
+function periodStart(level, t) {
+  const d = new Date(t);
+  if (level === 'hour') { d.setMinutes(0, 0, 0); return d.getTime(); }
+  d.setHours(0, 0, 0, 0);
+  if (level === 'week') d.setDate(d.getDate() - (d.getDay() + 6) % 7);
+  if (level === 'month') d.setDate(1);
+  return d.getTime();
+}
+
+// n periods after a period start; calendar arithmetic keeps midnight across DST changes.
+function periodShift(level, start, n) {
+  if (level === 'hour') return start + n * ACTIVITY_HOUR_MS;
+  const d = new Date(start);
+  if (level === 'month') d.setMonth(d.getMonth() + n);
+  else d.setDate(d.getDate() + n * (level === 'week' ? 7 : 1));
+  return d.getTime();
+}
+
+function isoWeek(t) {
+  const d = new Date(t); d.setHours(0, 0, 0, 0);
+  d.setDate(d.getDate() + 3 - (d.getDay() + 6) % 7); // Thursday of this week decides the year
+  const jan4 = new Date(d.getFullYear(), 0, 4);
+  return 1 + Math.round(((d - jan4) / 864e5 - 3 + (jan4.getDay() + 6) % 7) / 7);
+}
+
+const dayText = t => { const d = new Date(t); return `${d.getDate()} ${ACTIVITY_MONTHS[d.getMonth()]}`; };
+const clockText = t => { const d = new Date(t); return `${String(d.getHours()).padStart(2, '0')}:${String(d.getMinutes()).padStart(2, '0')}`; };
+
+// Inside a cell: month → its days, week → quarter days, day → hours, hour → ten 6-minute slices.
+function segmentBounds(level, start) {
+  const end = periodShift(level, start, 1), bounds = [start];
+  if (level === 'month') for (let t = periodShift('day', start, 1); t < end; t = periodShift('day', t, 1)) bounds.push(t);
+  else if (level === 'week') {
+    for (let day = start; day < end; day = periodShift('day', day, 1)) {
+      for (const hour of [6, 12, 18]) { const d = new Date(day); d.setHours(hour, 0, 0, 0); bounds.push(d.getTime()); }
+      if (periodShift('day', day, 1) < end) bounds.push(periodShift('day', day, 1));
+    }
+  } else if (level === 'day') {
+    for (let hour = 1; hour < 24; hour++) { const d = new Date(start); d.setHours(hour, 0, 0, 0); if (d.getTime() > bounds[bounds.length - 1] && d.getTime() < end) bounds.push(d.getTime()); }
+  } else for (let i = 1; i < ACTIVITY_SLICES; i++) bounds.push(start + i * ACTIVITY_HOUR_MS / ACTIVITY_SLICES);
+  bounds.push(end);
+  return bounds;
+}
+
+function segmentText(level, from, to) {
+  if (level === 'month') return dayText(from);
+  if (level === 'week') return `${ACTIVITY_DAY_NAMES[(new Date(from).getDay() + 6) % 7]} ${ACTIVITY_QUARTERS[Math.floor(new Date(from).getHours() / 6)]}`;
+  return `${clockText(from)}–${clockText(to)}`;
+}
+
+function cellFor(level, start, extra = {}) {
+  const d = new Date(start), end = periodShift(level, start, 1);
+  const label = level === 'month' ? ACTIVITY_MONTHS[d.getMonth()] : level === 'week' ? `W${isoWeek(start)}`
+    : level === 'day' ? String(d.getDate()) : String(d.getHours()).padStart(2, '0');
+  const title = level === 'month' ? `${ACTIVITY_MONTHS[d.getMonth()]} ${d.getFullYear()}`
+    : level === 'week' ? `Week ${isoWeek(start)} · ${dayText(start)} – ${dayText(periodShift('day', end, -1))} ${new Date(end - 1).getFullYear()}`
+      : level === 'day' ? `${ACTIVITY_DAY_NAMES[(d.getDay() + 6) % 7]} ${dayText(start)} ${d.getFullYear()}`
+        : `${dayText(start)} · ${clockText(start)}–${clockText(end)}`;
+  return { level, start, end, label, title, sub: level === 'week' ? dayText(start) : '', ...extra };
+}
+
+// The grid for one view around `anchor`: rows of cells, plus where the arrows lead.
+function activityLayout(view, anchor) {
+  const rows = [];
+  if (view === 'month') {
+    const year = new Date(anchor).getFullYear();
+    for (const y of [year - 1, year]) {
+      rows.push({ label: String(y), cells: ACTIVITY_MONTHS.map((_, m) => cellFor('month', new Date(y, m, 1).getTime())) });
+    }
+    return { view, rows, columns: 12, title: `${year - 1} – ${year}`, step: ['month', 12], from: rows[0].cells[0].start, to: rows[1].cells[11].end };
+  }
+  if (view === 'week') {
+    const last = periodStart('month', anchor);
+    for (let i = 5; i >= 0; i--) {
+      const month = periodShift('month', last, -i), next = periodShift('month', month, 1), cells = [];
+      // A week belongs to the month of its Thursday, so every week shows exactly once.
+      for (let week = periodStart('week', month); week < next; week = periodShift('week', week, 1)) {
+        const thursday = periodShift('day', week, 3);
+        if (thursday >= month && thursday < next) cells.push(cellFor('week', week));
+      }
+      const d = new Date(month);
+      rows.push({ label: `${ACTIVITY_MONTHS[d.getMonth()]} ${d.getFullYear()}`, cells });
+    }
+    const first = new Date(periodShift('month', last, -5)), end = new Date(last);
+    return { view, rows, columns: 5, title: `${ACTIVITY_MONTHS[first.getMonth()]} ${first.getFullYear()} – ${ACTIVITY_MONTHS[end.getMonth()]} ${end.getFullYear()}`,
+      step: ['month', 6], from: rows[0].cells[0].start, to: rows[5].cells[rows[5].cells.length - 1].end };
+  }
+  if (view === 'day') {
+    const month = periodStart('month', anchor), next = periodShift('month', month, 1), d = new Date(month);
+    for (let week = periodStart('week', month); week < next; week = periodShift('week', week, 1)) {
+      const cells = [];
+      for (let i = 0; i < 7; i++) { const day = periodShift('day', week, i); cells.push(cellFor('day', day, { outside: day < month || day >= next })); }
+      rows.push({ label: `W${isoWeek(week)}`, week, cells });
+    }
+    return { view, rows, columns: 7, header: ACTIVITY_DAY_NAMES, title: `${['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'][d.getMonth()]} ${d.getFullYear()}`,
+      step: ['month', 1], from: rows[0].cells[0].start, to: rows[rows.length - 1].cells[6].end };
+  }
+  const day = periodStart('day', anchor), d = new Date(day);
+  for (let q = 0; q < 4; q++) {
+    const cells = [];
+    for (let i = 0; i < 6; i++) { const t = new Date(day); t.setHours(q * 6 + i, 0, 0, 0); cells.push(cellFor('hour', t.getTime())); }
+    rows.push({ label: ACTIVITY_QUARTERS[q][0].toUpperCase() + ACTIVITY_QUARTERS[q].slice(1), cells });
+  }
+  return { view, rows, columns: 6, title: `${ACTIVITY_DAY_NAMES[(d.getDay() + 6) % 7]} ${dayText(day)} ${d.getFullYear()}`,
+    step: ['day', 1], from: day, to: periodShift('day', day, 1) };
+}
+
+// Sums the server's buckets ([start, size, ms, [[manga, ms]…]]) and completions ([t, manga, label])
+// into each cell's segments. A bucket split across segments is shared by overlap.
+function activitySums(data, cells) {
+  const segs = [];
+  for (const cell of cells) {
+    cell.bounds = segmentBounds(cell.level, cell.start);
+    const n = cell.bounds.length - 1;
+    cell.time = new Array(n).fill(0); cell.chapters = new Array(n).fill(0);
+    cell.manga = new Map(); cell.done = [];
+    for (let i = 0; i < n; i++) segs.push({ s: cell.bounds[i], e: cell.bounds[i + 1], cell, i });
+  }
+  segs.sort((a, b) => a.s - b.s);
+  const firstEndingAfter = t => { let lo = 0, hi = segs.length; while (lo < hi) { const mid = (lo + hi) >> 1; if (segs[mid].e > t) hi = mid; else lo = mid + 1; } return lo; };
+  for (const [start, size, ms, mangas] of (data && data.buckets) || []) {
+    const end = start + size;
+    for (let k = firstEndingAfter(start); k < segs.length && segs[k].s < end; k++) {
+      const seg = segs[k], share = (Math.min(seg.e, end) - Math.max(seg.s, start)) / size;
+      if (share <= 0) continue;
+      seg.cell.time[seg.i] += ms * share;
+      for (const [manga, mangaMs] of mangas || []) seg.cell.manga.set(manga, (seg.cell.manga.get(manga) || 0) + mangaMs * share);
+    }
+  }
+  for (const item of (data && data.done) || []) {
+    const k = firstEndingAfter(item[0]), seg = segs[k];
+    if (!seg || seg.s > item[0]) continue;
+    seg.cell.chapters[seg.i]++;
+    seg.cell.done.push(item);
+  }
+  for (const cell of cells) {
+    cell.totalTime = cell.time.reduce((a, b) => a + b, 0);
+    cell.totalChapters = cell.chapters.reduce((a, b) => a + b, 0);
+  }
+  return cells;
+}
+
+// 0…1 glow, square-root scaled so one long evening does not flatten everything else.
+const activityGlow = (value, max) => (value > 0 && max > 0 ? Math.min(1, Math.sqrt(value / max)) : 0);
+
+// Where a click on a cell leads: month → its days, week → the days of its month (week marked), day → hours.
+function activityDrill(cell) {
+  if (cell.level === 'month') return { view: 'day', anchor: cell.start };
+  if (cell.level === 'week') return { view: 'day', anchor: periodShift('day', cell.start, 3), mark: cell.start };
+  if (cell.level === 'day') return { view: 'hour', anchor: cell.start };
+  return null;
+}
+
+if (typeof module !== 'undefined') module.exports = {
+  ACTIVITY_VIEWS, periodStart, periodShift, isoWeek, segmentBounds, segmentText, activityLayout, activitySums, activityGlow, activityDrill,
+};
@@ -0,0 +1,172 @@
+'use strict';
+/* Settings → Reading activity: a grid of months, weeks, days or hours. Each cell glows with its total
+   and carries a strip from its start to its end, so you can see *when* inside the period you read.
+   Click drills down (month/week → days → hours); hover, focus or a first tap shows the details. */
+
+function activityCard() {
+  const VIEWS = { month: 'Months', week: 'Weeks', day: 'Days', hour: 'Hours' };
+  const UNIT = { month: 'days', week: 'quarter days', day: 'hours', hour: '6 minutes' };
+  const saved = (() => { try { return JSON.parse(store.get('activity') || '{}'); } catch (e) { return {}; } })();
+  const state = { view: VIEWS[saved.view] ? saved.view : 'week', metric: saved.metric === 'chapters' ? 'chapters' : 'time', anchor: Date.now(), mark: null };
+  let data = null, armed = null, lastPointer = 'mouse';
+
+  const remember = () => store.set('activity', JSON.stringify({ view: state.view, metric: state.metric }));
+  const card = h('section', { class: 'card activity-card' });
+  const notice = h('p', { class: 'muted small', hidden: true });
+  const summary = h('p', { class: 'activity-summary' });
+  const grid = h('div', { class: 'activity-grid', role: 'grid' });
+  const tip = h('div', { class: 'activity-tip', role: 'tooltip', hidden: true });
+  const viewSeg = h('div', { class: 'seg', role: 'group', 'aria-label': 'Grid' });
+  const metricSeg = h('div', { class: 'seg', role: 'group', 'aria-label': 'Measure' });
+  const title = h('b', { class: 'activity-title' });
+  const legend = h('p', { class: 'muted small activity-legend' });
+  card.append(
+    h('div', { class: 'activity-toolbar' }, viewSeg, metricSeg),
+    h('div', { class: 'activity-nav' },
+      h('button', { class: 'btn small', 'aria-label': 'Earlier', onclick: () => move(-1) }, '‹'),
+      title,
+      h('button', { class: 'btn small', 'aria-label': 'Later', onclick: () => move(1) }, '›'),
+      h('button', { class: 'btn small', onclick: () => { state.anchor = Date.now(); state.mark = null; draw(); } }, 'Today')),
+    notice, summary, grid, legend, tip);
+
+  const duration = ms => readingDuration(ms, true);
+  const valueText = (metric, value) => metric === 'time' ? duration(value) : `${value} chapter${value === 1 ? '' : 's'}`;
+  const mangaTitle = index => data.mangas[index]?.title || '?';
+
+  function move(direction) {
+    const layout = activityLayout(state.view, state.anchor);
+    state.anchor = periodShift(layout.step[0], periodStart(layout.step[0], state.anchor), direction * layout.step[1]);
+    state.mark = null;
+    draw();
+  }
+
+  function setView(view, anchor = state.anchor, mark = null) {
+    state.view = view; state.anchor = anchor; state.mark = mark;
+    remember(); draw();
+  }
+
+  function drawControls() {
+    viewSeg.replaceChildren(...Object.entries(VIEWS).map(([key, label]) =>
+      h('button', { class: key === state.view ? 'on' : '', 'aria-pressed': String(key === state.view), onclick: () => setView(key) }, label)));
+    metricSeg.replaceChildren(...[['time', 'Reading time'], ['chapters', 'Chapters finished']].map(([key, label]) =>
+      h('button', { class: key === state.metric ? 'on' : '', 'aria-pressed': String(key === state.metric), onclick: () => { state.metric = key; remember(); draw(); } }, label)));
+  }
+
+  function details(cell) {
+    const time = cell.totalTime, chapters = cell.totalChapters;
+    const lines = [h('b', {}, cell.title)];
+    if (cell.start > Date.now()) { lines.push(h('div', { class: 'muted' }, 'Still ahead')); return lines; }
+    lines.push(h('div', {}, time >= 30000 ? duration(time) + ' reading' : 'No reading time', ' · ', valueText('chapters', chapters) + ' finished'));
+    const values = state.metric === 'time' ? cell.time : cell.chapters, active = values.filter(v => v > 0).length;
+    if (active) {
+      const peak = values.indexOf(Math.max(...values));
+      lines.push(h('div', { class: 'muted' }, `Active in ${active} of ${values.length} ${UNIT[cell.level]} · busiest ${segmentText(cell.level, cell.bounds[peak], cell.bounds[peak + 1])}`));
+    }
+    const top = [...cell.manga].filter(([, ms]) => ms >= 30000).sort((a, b) => b[1] - a[1]).slice(0, 3);
+    if (top.length) lines.push(h('ul', {}, top.map(([index, ms]) => h('li', {}, mangaTitle(index), h('span', { class: 'muted' }, ' · ' + duration(ms))))));
+    if (cell.level === 'hour' && cell.done.length) {
+      lines.push(h('ul', {}, cell.done.slice(0, 6).map(([t, index, label]) => h('li', {}, `✓ ${mangaTitle(index)} · ${label}`,
+        h('span', { class: 'muted' }, ' · ' + new Date(t).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }))))));
+    } else if (!top.length && cell.done.length) {
+      const counts = new Map();
+      for (const [, index] of cell.done) counts.set(index, (counts.get(index) || 0) + 1);
+      lines.push(h('ul', {}, [...counts].sort((a, b) => b[1] - a[1]).slice(0, 3).map(([index, n]) => h('li', {}, mangaTitle(index), h('span', { class: 'muted' }, ` · ${n} ✓`)))));
+    }
+    if (activityDrill(cell)) lines.push(h('div', { class: 'muted small' }, lastPointer === 'touch' ? 'Tap again to open' : 'Click to open'));
+    return lines;
+  }
+
+  function showTip(cell, el) {
+    tip.replaceChildren(...details(cell));
+    tip.hidden = false;
+    const box = el.getBoundingClientRect(), width = tip.offsetWidth, height = tip.offsetHeight;
+    const left = Math.max(8, Math.min(window.innerWidth - width - 8, box.left + box.width / 2 - width / 2));
+    const top = box.top - height - 8 > 8 ? box.top - height - 8 : box.bottom + 8;
+    tip.style.left = left + 'px'; tip.style.top = top + 'px';
+  }
+  const hideTip = () => { tip.hidden = true; armed = null; };
+
+  function cellNode(cell, maxCell, maxSeg) {
+    const values = state.metric === 'time' ? cell.time : cell.chapters, total = state.metric === 'time' ? cell.totalTime : cell.totalChapters;
+    const now = Date.now(), future = cell.start > now;
+    const glow = activityGlow(total, maxCell);
+    const strip = h('span', { class: 'activity-strip', 'aria-hidden': 'true' }, values.map((v, i) =>
+      h('i', { class: cell.bounds[i] > now ? 'ahead' : '', style: `--a:${activityGlow(v, maxSeg).toFixed(3)}` })));
+    const node = h('button', {
+      type: 'button', role: 'gridcell',
+      class: 'activity-cell' + (cell.outside ? ' outside' : '') + (future ? ' future' : '') + (glow >= 0.85 ? ' hot' : '')
+        + (state.mark != null && cell.level === 'day' && periodStart('week', cell.start) === state.mark ? ' marked' : '')
+        + (cell.start <= now && now < cell.end ? ' now' : ''),
+      style: `--g:${glow.toFixed(3)}`,
+      'aria-label': `${cell.title}: ${future ? 'still ahead' : valueText(state.metric, total)}`,
+      onmouseenter: e => { if (lastPointer !== 'touch') showTip(cell, e.currentTarget); },
+      onmouseleave: () => { if (lastPointer !== 'touch') hideTip(); },
+      onfocus: e => showTip(cell, e.currentTarget),
+      onblur: hideTip,
+      onpointerdown: e => { lastPointer = e.pointerType || 'mouse'; },
+      onclick: e => {
+        // On touch the first tap shows the details; the second opens the next level.
+        if (lastPointer === 'touch' && armed !== cell) { armed = cell; showTip(cell, e.currentTarget); return; }
+        const next = activityDrill(cell);
+        if (next && !future) { hideTip(); setView(next.view, next.anchor, next.mark ?? null); }
+      },
+    },
+    h('span', { class: 'activity-label' }, cell.label, cell.sub ? h('small', {}, cell.sub) : null),
+    !future && total && (state.metric === 'chapters' || total >= 30000)
+      ? h('span', { class: 'activity-value' }, state.metric === 'chapters' ? String(total)
+        // Month cells are narrow; whole hours are enough there, the tooltip has the minutes.
+        : cell.level === 'month' && total >= 36e5 ? Math.round(total / 36e5) + ' h' : duration(total)) : null,
+    strip);
+    return node;
+  }
+
+  function draw() {
+    drawControls();
+    hideTip();
+    const layout = activityLayout(state.view, state.anchor);
+    title.textContent = layout.title;
+    if (!data) { grid.replaceChildren(h('p', { class: 'muted' }, 'Loading your activity…')); return; }
+    const cells = layout.rows.flatMap(row => row.cells);
+    activitySums(data, cells);
+    const counted = cells.filter(cell => !cell.outside);
+    const key = state.metric === 'time' ? 'totalTime' : 'totalChapters', seg = state.metric === 'time' ? 'time' : 'chapters';
+    const maxCell = Math.max(0, ...counted.map(cell => cell[key]));
+    const maxSeg = Math.max(0, ...counted.flatMap(cell => cell[seg]));
+
+    grid.style.setProperty('--cols', layout.columns);
+    grid.className = 'activity-grid view-' + state.view;
+    grid.replaceChildren(
+      ...(layout.header ? [h('div', { class: 'activity-row head', role: 'row' }, h('span', { class: 'activity-row-label' }),
+        h('div', { class: 'activity-cells' }, layout.header.map(name => h('span', { class: 'activity-head' }, name))))] : []),
+      ...layout.rows.map(row => h('div', { class: 'activity-row' + (state.mark != null && row.week === state.mark ? ' marked' : ''), role: 'row' },
+        h('span', { class: 'activity-row-label' }, row.label),
+        h('div', { class: 'activity-cells' }, row.cells.map(cell => cellNode(cell, maxCell, maxSeg))))));
+
+    const time = counted.reduce((sum, cell) => sum + cell.totalTime, 0), chapters = counted.reduce((sum, cell) => sum + cell.totalChapters, 0);
+    const manga = new Map();
+    for (const cell of counted) for (const [index, ms] of cell.manga) manga.set(index, (manga.get(index) || 0) + ms);
+    const top = [...manga].sort((a, b) => b[1] - a[1])[0];
+    summary.replaceChildren(
+      h('b', {}, time >= 30000 ? duration(time) : 'No reading time'), ' · ', valueText('chapters', chapters), ' finished',
+      ...(top && top[1] >= 30000 ? [' · most time with ', h('b', {}, mangaTitle(top[0]))] : []));
+    const coarse = layout.from < Date.now() - data.fineDays * 864e5 && state.view === 'hour';
+    legend.textContent = `Each cell runs from left (its start) to right (its end) in ${UNIT[layout.rows[0].cells[0].level]}; brighter means more ${state.metric === 'time' ? 'reading time' : 'finished chapters'}.`
+      + (state.view === 'hour' ? '' : ' Click a cell to look closer.')
+      + (coarse ? ` Time older than ${data.fineDays} days is kept per hour, so it is spread evenly inside the hour.` : '');
+  }
+
+  async function load() {
+    try {
+      data = await api('api/reading/activity');
+      notice.hidden = data.readingClock;
+      notice.replaceChildren('The Active Reading Clock is off, so no new reading time is recorded; finished chapters still show. Turn it on under ',
+        h('a', { href: 'settings.html#user/reading-time' }, 'Reading time & privacy'), '.');
+      if (!data.buckets.length && saved.metric == null) state.metric = 'chapters';
+      draw();
+    } catch (error) { grid.replaceChildren(h('p', { class: 'error', role: 'alert' }, `Could not load your activity: ${error.message}`)); }
+  }
+
+  window.addEventListener('scroll', () => { if (!tip.hidden) hideTip(); }, { passive: true });
+  draw();
+  return { element: card, activate: load, deactivate: hideTip };
+}
@@ -431,6 +431,14 @@ body.reader { position: fixed; top: 0; left: 0; right: 0; bottom: 0; overflow: h
 .reading-gate-message[data-tone="retry"] { border-color: #9b7233; background: #382b1a; color: #ffdaa0; }
 .reading-gate-message[data-tone="error"] { border-color: #944c55; background: #3c2025; color: #ffc0c6; }
@media (max-width: 660px) { .reading-gate { margin: 28px 12px 100px; padding: 18px; } }
+/* Stale reading session: a newer position was saved elsewhere since this page was opened. */
+.stale-session { position: fixed; inset: 0; z-index: 60; display: flex; align-items: center; justify-content: center;
+  padding: 16px; background: rgba(0, 0, 0, .6); }
+.stale-box { box-sizing: border-box; width: min(440px, 100%); padding: 20px; border-radius: 12px; background: var(--card);
+  border: 1px solid var(--line); box-shadow: 0 12px 40px rgba(0, 0, 0, .6); }
+.stale-box h2 { margin: 0 0 8px; font-size: 18px; }
+.stale-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 10px; }
+.stale-actions .btn { flex: 1 1 auto; justify-content: center; text-align: center; }
 .pg { position: absolute; overflow: hidden; background: #19191c; }
 .pg img { display: block; width: 100%; height: 100%; -webkit-user-drag: none; }
 #canvas[data-page-tone="inverted"] .pg img { filter: invert(1); }
@@ -567,3 +575,47 @@ kbd { display: inline-block; min-width: 24px; padding: 1px 7px; border: 1px soli
  background: var(--card2); font: 13px/1.5 ui-monospace, monospace; text-align: center; }
@media (max-width: 480px) { .moment-dialog { padding: 12px; } .moment-actions .moment-hint { flex-basis: 100%; } .moment-actions .moment-hint:empty { display: none; } }
 .moment-extend { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 8px; }
+
+/* Reading activity grid (Settings → Reading activity). --g: cell glow 0…1, --a: strip segment glow 0…1. */
+.activity-toolbar { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; }
+.activity-nav { display: flex; align-items: center; gap: 8px; margin: 12px 0 4px; }
+.activity-title { min-width: 11em; text-align: center; }
+.activity-summary { margin: 6px 0 12px; }
+.activity-grid { display: flex; flex-direction: column; gap: 6px; }
+.activity-row { display: grid; grid-template-columns: 5.5em 1fr; gap: 8px; align-items: stretch; border-radius: 10px; }
+.activity-row.marked { background: color-mix(in srgb, var(--accent) 12%, transparent); outline: 1px solid color-mix(in srgb, var(--accent) 45%, transparent); }
+.activity-row-label { color: var(--muted); font-size: 13px; align-self: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.activity-cells { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: 6px; }
+.activity-head { color: var(--muted); font-size: 12px; text-align: center; }
+.activity-cell { position: relative; display: flex; flex-direction: column; justify-content: space-between; gap: 6px; min-height: 58px; padding: 6px 7px 7px;
+  border: 1px solid var(--line); border-radius: 8px; color: var(--fg); font: inherit; text-align: left; cursor: pointer;
+  background: color-mix(in srgb, var(--accent) calc(var(--g) * 42%), var(--card2));
+  box-shadow: 0 0 calc(var(--g) * 12px) color-mix(in srgb, var(--accent) calc(var(--g) * 55%), transparent);
+  transition: transform .12s, border-color .12s; }
+.activity-cell:hover, .activity-cell:focus-visible { border-color: var(--accent); transform: translateY(-1px); outline: none; }
+.activity-cell.hot { border-color: color-mix(in srgb, var(--accent) 70%, #fff); }
+.activity-cell.now { border-color: var(--fg); }
+.activity-cell.outside { opacity: .38; }
+.activity-cell.future { cursor: default; background: transparent; border-style: dashed; box-shadow: none; transform: none; }
+.view-hour .activity-cell { cursor: default; }
+.activity-label { font-size: 13px; font-weight: 600; line-height: 1.1; display: flex; flex-direction: column; }
+.activity-label small { font-weight: 400; color: var(--muted); font-size: 11px; }
+.activity-value { position: absolute; top: 6px; right: 7px; font-size: 11px; color: color-mix(in srgb, var(--fg) 80%, transparent); }
+.view-day .activity-value, .view-month .activity-value { position: static; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.activity-strip { display: flex; height: 9px; border-radius: 3px; overflow: hidden; background: color-mix(in srgb, var(--bg) 70%, transparent); }
+.activity-strip i { flex: 1; background: var(--accent); opacity: var(--a); }
+.activity-strip i.ahead { background: transparent; }
+.activity-strip i + i { box-shadow: inset 1px 0 0 color-mix(in srgb, var(--bg) 35%, transparent); }
+.view-month .activity-strip i + i, .view-week .activity-strip i + i { box-shadow: none; }
+.activity-tip { position: fixed; z-index: 50; max-width: 300px; padding: 10px 12px; border-radius: 10px; pointer-events: none;
+  background: var(--card); border: 1px solid var(--line); box-shadow: 0 8px 24px rgba(0, 0, 0, .45); font-size: 13px; line-height: 1.45; }
+.activity-tip ul { margin: 4px 0 0; padding-left: 16px; }
+.activity-legend { margin-top: 12px; }
+@media (max-width: 760px) {
+  .activity-row { grid-template-columns: 1fr; gap: 3px; }
+  .activity-row.head .activity-row-label { display: none; }
+  .view-month .activity-cells { grid-template-columns: repeat(6, minmax(0, 1fr)); }
+  .activity-cell { min-height: 48px; padding: 5px; }
+  .activity-value { display: none; }
+  .activity-cells { gap: 4px; }
+}
@@ -8,7 +8,7 @@
      h('div', { class: 'info' }, h('h1', {}, c.title), h('p', { class: 'muted' }, `${c.members.length} manga · ${c.read}/${c.chapters} chapters read · ${c.unread} new`),
        c.description ? h('p', {}, c.description) : null,
        c.reading.activeMs ? h('p', {}, `${readingDuration(c.reading.activeMs)} together`) : null,
-        h('div', { class: 'actions' }, h('a', { class: 'btn primary', href: readUrl(c.continue.m, c.continue.c, c.continue.v) }, c.continue.text),
+        h('div', { class: 'actions' }, h('a', { class: 'btn primary', href: readUrl(c.continue.m, c.continue.c, c.continue.v, c.continue.at) }, c.continue.text),
          me.admin ? h('a', { class: 'btn', href: 'collections.html?' + qsa({ id: c.id }) }, 'Edit collection') : null))));
    main.append(h('h2', {}, 'Reading order'), h('div', { class: 'collection-members' }, c.members.map(m =>
      h('a', { class: 'collection-member', href: mangaUrl(m.id) }, m.cover ? h('img', { src: m.cover, alt: '', loading: 'lazy' }) : null,
@@ -39,6 +39,20 @@ const store = {
  get(k) { try { return localStorage.getItem('mc.' + k); } catch (e) { return null; } },
  set(k, v) { try { localStorage.setItem('mc.' + k, v); } catch (e) { /* private mode */ } },
 };
+// One id per browser tab (it survives navigation and reloads in that tab): progress saves carry it, so
+// a reader can tell its own saves from those of another tab or device.
+const tabId = (() => {
+  let id = null;
+  return () => {
+    if (id) return id;
+    try { id = sessionStorage.getItem('mc.tab'); } catch (e) { /* storage blocked */ }
+    if (!/^[a-zA-Z0-9_-]{8,40}$/.test(id || '')) {
+      id = Array.from(crypto.getRandomValues(new Uint8Array(12)), b => b.toString(16).padStart(2, '0')).join('');
+      try { sessionStorage.setItem('mc.tab', id); } catch (e) { /* this page keeps it in memory */ }
+    }
+    return id;
+  };
+})();

 function ago(t) {
  const s = (Date.now() - t) / 1000;
@@ -60,7 +74,8 @@ function readingDuration(ms, compact = false) {
 }

 const qsa = obj => { const p = new URLSearchParams(); for (const k in obj) if (obj[k] != null && obj[k] !== '') p.set(k, obj[k]); return p.toString(); };
-const readUrl = (m, c, v) => 'read.html?' + qsa({ m, c, v });
+// `at`: the manga's latest progress time the linking page knew, so the reader can tell it opened from a stale page.
+const readUrl = (m, c, v, at) => 'read.html?' + qsa({ m, c, v, at: at || null });
 const mangaUrl = m => 'manga.html?' + qsa({ m });
 const libraryUrlForTags = tags => {
  const p = new URLSearchParams();
@@ -55,8 +55,9 @@
    h('option', { value: 'grouped' }, 'Group collections'), h('option', { value: 'expanded' }, 'Expand collections'), h('option', { value: 'individual' }, 'Individual manga'));
  grouping.value = ['grouped', 'expanded', 'individual'].includes(store.get('grouping')) ? store.get('grouping') : 'grouped';
  grouping.onchange = render;
-  // Started but unfinished manga, most recently read first; the same manga still appear in the grid.
-  const continueItems = data.mangas.filter(m => m.lastRead && m.read < m.chapters)
+  // Started manga with chapters left after the last one read (first read or reread, server `left`),
+  // most recently read first; the same manga still appear in the grid.
+  const continueItems = data.mangas.filter(m => m.lastRead && m.left > 0)
    .sort((a, b) => b.lastRead - a.lastRead).slice(0, 5);
  const continueRow = h('section', { class: 'continue-row', 'aria-label': 'Continue where you left off', hidden: true },
    h('div', { class: 'continue-banner' }, h('span', { 'aria-hidden': 'true' }, '▶'), 'Continue where you left off'),
@@ -72,7 +73,7 @@
        data.reading.rereads ? h('span', { class: 'story-pill' }, `${data.reading.rereads} reread${data.reading.rereads === 1 ? '' : 's'}`) : null),
      h('div', { class: 'reading-summary-links' },
        most ? h('a', { href: mangaUrl(most.id) }, `Most time with ${most.title}`) : null,
-        latest && data.reading.lastChapterId ? h('a', { href: readUrl(latest.id, data.reading.lastChapterId) }, `Continue ${latest.title} →`) : null)));
+        latest && data.reading.lastChapterId ? h('a', { href: readUrl(latest.id, data.reading.lastChapterId, null, latest.lastRead) }, `Continue ${latest.title} →`) : null)));
  }
  main.append(
    h('div', { class: 'library-controls' },
@@ -48,7 +48,7 @@
      h('div', { class: 'chips' }, tags.map(tag => h('a', { class: 'chip chip-link', href: libraryUrlForTags([tag]), title: `Show manga tagged ${tag}` }, tag))),
      meta.description ? h('p', { class: 'desc' }, meta.description) : null,
      h('div', { class: 'actions' },
-        M.continue ? h('a', { class: 'btn primary', href: readUrl(M.id, M.continue.c, M.continue.v) }, M.continue.text) : null,
+        M.continue ? h('a', { class: 'btn primary', href: readUrl(M.id, M.continue.c, M.continue.v, M.continue.at) }, M.continue.text) : null,
        follow))));

  let storyRhythm = null;
@@ -73,7 +73,7 @@
        storyStat(M.reading.typicalChapterMs ? readingDuration(M.reading.typicalChapterMs) : '—', 'typical chapter'),
        storyStat(M.reading.rereads, `reread${M.reading.rereads === 1 ? '' : 's'}`)),
      lastChapter ? h('p', { class: 'story-last muted' }, 'Last timed ',
-        h('a', { href: readUrl(M.id, lastChapter.id) }, `${lastChapter.label}${lastChapter.title ? ' · ' + lastChapter.title : ''}`),
+        h('a', { href: readUrl(M.id, lastChapter.id, null, M.continue?.at) }, `${lastChapter.label}${lastChapter.title ? ' · ' + lastChapter.title : ''}`),
        ` · ${ago(M.reading.updatedAt)}`) : null,
      h('div', { class: 'story-rhythm-head' }, h('b', {}, 'Reading rhythm'), h('span', { class: 'muted small' }, 'Completed chapters · active time')),
      storyRhythm,
@@ -110,7 +110,7 @@
      const passes = chapter.reading.completedPasses;
      const title = `${label} · ${readingDuration(value)}${passes > 1 ? ` · ${passes} timed reads · ${readingDuration(chapter.reading.totalActiveMs)} total` : ''}`;
      storyRhythm.append(h('a', {
-        class: 'rhythm-bar', role: 'listitem', href: readUrl(M.id, chapter.id), title,
+        class: 'rhythm-bar', role: 'listitem', href: readUrl(M.id, chapter.id, null, M.continue?.at), title,
        'aria-label': title, style: `height:${height}px`,
      }));
    }
@@ -221,7 +221,7 @@
        if (done) { await api('api/unread', { m: M.id, c: ch.id }); ch.progress = null; ch.readAt = null; }
        else {
          const version = ch.versions[0];
-          await api('api/progress', { m: M.id, c: ch.id, v: version.id, p: version.pages - 1, n: version.pages, done: true });
+          await api('api/progress', { m: M.id, c: ch.id, v: version.id, p: version.pages - 1, n: version.pages, done: true, tab: tabId() });
          ch.progress = { v: version.id, p: version.pages - 1, n: version.pages, done: true };
          ch.readAt = { at: Date.now(), approx: false };
        }
@@ -234,7 +234,7 @@
      const timing = chapterTiming(ch), released = chapterRelease(ch.dates);
      wrap.textContent = '';
      wrap.append(h('div', { class: 'ch' + (done ? ' read' : '') },
-        h('a', { class: 'ch-main' + (timing ? ' has-time' : '') + (M.chapterDates?.release ? ' has-date' : ''), href: readUrl(M.id, ch.id) },
+        h('a', { class: 'ch-main' + (timing ? ' has-time' : '') + (M.chapterDates?.release ? ' has-date' : ''), href: readUrl(M.id, ch.id, null, M.continue?.at) },
          h('span', { class: 'ch-label' }, ch.label),
          h('span', { class: 'ch-pages' }, `${pages} p.`),
          M.chapterDates?.release ? h('span', { class: 'ch-date' + (released ? ' tier-' + released.tier : ''), title: released ? released.title : 'No date known', 'aria-label': released ? released.title : 'No date known' },
@@ -259,7 +259,7 @@
            h('button', { class: version.my > 0 ? 'on' : '', title: 'Better', onclick: () => vote(1) }, '▲'),
            h('b', {}, version.score),
            h('button', { class: version.my < 0 ? 'on' : '', title: 'Worse', onclick: () => vote(-1) }, '▼')),
-          h('a', { class: 'btn small', href: readUrl(M.id, ch.id, version.id) }, 'Read')));
+          h('a', { class: 'btn small', href: readUrl(M.id, ch.id, version.id, M.continue?.at) }, 'Read')));
      });
    }
    draw();
@@ -155,6 +155,55 @@
  // A link to a page (e.g. "Open in reader" from a moment) wins over the saved position.
  if (P.get('p') != null) { const k = list.findIndex(x => x.i >= +P.get('p')); if (k >= 0) cur = k; }

+  // Stale reading sessions: a tab left open (or restored by the browser) on another device must not move
+  // the "Continue" point back. `seen` is the newest progress time this tab knows: the link's `at`, kept
+  // current in the address bar, so a reload or restored tab still knows it. Without `at` the open was a
+  // deliberate one (bookmark, notification) and starts from the current head.
+  const tab = tabId();
+  let seen = Number(P.get('at')) || (D.latest ? D.latest.t : 0), stale = null, staleCard = null;
+  const chapterUrl = (c, v) => readUrl(D.manga.id, c, v, seen);
+  const newer = latest => !!latest && latest.t > seen && latest.w !== tab;
+  function markSeen(t) {
+    seen = Math.max(seen, t || 0);
+    const q = new URLSearchParams(location.search);
+    q.set('at', seen);
+    history.replaceState(history.state, '', '?' + q);
+  }
+  // Another tab or device saved a newer position. The same place is no conflict; anything else asks.
+  function checkLatest(latest) {
+    if (!newer(latest)) return;
+    if (latest.c === D.chapter.id && list[cur] && latest.p === list[cur].i) { markSeen(latest.t); return; }
+    showStale(latest);
+  }
+  function showStale(latest) {
+    stale = latest;
+    clearTimeout(saveTimer);
+    if (staleCard) staleCard.remove();
+    const where = latest.done ? `${latest.label} (finished)` : `${latest.label} · page ${latest.p + 1}`;
+    const go = h('a', { class: 'btn primary', href: readUrl(D.manga.id, latest.continue.c, latest.continue.v, latest.t) }, latest.continue.text);
+    const stay = h('button', { class: 'btn', type: 'button' }, 'Keep reading here');
+    stay.onclick = () => {
+      staleCard.remove(); staleCard = null; stale = null;
+      markSeen(latest.t);
+      saveProgress();
+      stage.focus({ preventScroll: true });
+    };
+    staleCard = h('div', { class: 'stale-session', role: 'dialog', 'aria-modal': 'true', 'aria-labelledby': 'stale-title' },
+      h('div', { class: 'stale-box' },
+        h('h2', { id: 'stale-title' }, 'You have read further since'),
+        h('p', {}, 'This page is an older reading session. Your newest reading position is ', h('b', {}, where), ` (${ago(latest.t)}).`),
+        h('div', { class: 'stale-actions' }, go, stay),
+        h('p', { class: 'muted small' }, `Keeping ${D.chapter.label} makes it your “Continue” point again.`)));
+    document.body.append(staleCard);
+    go.focus();
+  }
+  async function recheck() {
+    if (stale || document.hidden) return;
+    try { checkLatest((await api('api/progress/latest?' + qsa({ m: D.manga.id }))).latest); } catch { /* offline: the next save checks again */ }
+  }
+  document.addEventListener('visibilitychange', recheck);
+  window.addEventListener('pageshow', e => { if (e.persisted) recheck(); });
+
  // Book mode: pages pair up inside each run of single pages. Runs restart after every double page / cover,
  // so one missing pair never shifts the rest of the chapter. "Shift" makes a run start with a lone page.
  function computeSpreads() {
@@ -240,7 +289,7 @@
    const n = D.next;
    return h('div', { class: 'end' }, h('div', { class: 'endbox' },
      h('div', { class: 'muted' }, 'End of ' + D.chapter.label + (D.chapter.title ? ' · ' + D.chapter.title : '')),
-      n ? h('a', { class: 'btn primary', href: readUrl(D.manga.id, n.id), onclick: () => saveProgress(true) }, `Next: ${n.label}${n.title ? ' · ' + n.title : ''} ›`)
+      n ? h('a', { class: 'btn primary', href: chapterUrl(n.id), onclick: e => { e.currentTarget.href = chapterUrl(n.id); saveProgress(true); } }, `Next: ${n.label}${n.title ? ' · ' + n.title : ''} ›`)
        : h('div', {}, 'You are up to date.'),
      h('a', { class: 'btn', href: mangaUrl(D.manga.id) }, 'Back to ' + D.manga.title)));
  }
@@ -589,7 +638,7 @@
  function goChapter(c) {
    if (!c) return toast('You are up to date');
    saveProgress(true);
-    location.href = readUrl(D.manga.id, c.id);
+    location.href = chapterUrl(c.id);
  }
  // Flow: jump to the top of the next page, but never further than ~one screen.
  function flowStep(dir) {
@@ -701,8 +750,13 @@
  }
  function saveProgress(keepalive) {
    clearTimeout(saveTimer);
-    const body = JSON.stringify({ m: D.manga.id, c: D.chapter.id, v: D.version, p: list[cur].i, n: all.length, done, shift: [...shift] });
-    fetch('api/progress', { method: 'POST', keepalive: !!keepalive, headers: { 'Content-Type': 'application/json' }, body }).catch(() => {});
+    if (stale) return; // nothing is saved until the reader chose where to go on
+    const body = JSON.stringify({ m: D.manga.id, c: D.chapter.id, v: D.version, p: list[cur].i, n: all.length, done, shift: [...shift], tab, seen });
+    fetch('api/progress', { method: 'POST', keepalive: !!keepalive, headers: { 'Content-Type': 'application/json' }, body })
+      .then(r => r.json()).then(r => {
+        if (r.stale) checkLatest(r.latest);
+        else if (r.ok && r.t) markSeen(r.t);
+      }).catch(() => {});
  }
  addEventListener('pagehide', () => saveProgress(true));

@@ -717,17 +771,17 @@
    groups[c.book].append(h('option', { value: c.id }, `${c.label}${c.title ? ' · ' + c.title : ''}${c.extra ? ' (extra)' : ''}${c.done ? ' ✓' : ''}`));
  }
  chsel.value = D.chapter.id;
-  chsel.onchange = () => { saveProgress(true); location.href = readUrl(D.manga.id, chsel.value); };
+  chsel.onchange = () => { saveProgress(true); location.href = chapterUrl(chsel.value); };
  $('#back').href = mangaUrl(D.manga.id);
  for (const [id, c] of [['#prevch', D.prev], ['#nextch', D.next]]) {
    const a = $(id);
-    if (c) { a.href = readUrl(D.manga.id, c.id); a.title = c.label + (c.title ? ' · ' + c.title : ''); a.onclick = () => saveProgress(true); }
+    if (c) { a.href = chapterUrl(c.id); a.title = c.label + (c.title ? ' · ' + c.title : ''); a.onclick = () => { a.href = chapterUrl(c.id); saveProgress(true); }; }
    else a.classList.add('disabled');
  }
  for (const v of D.versions) ver.append(h('option', { value: v.id }, (v.source || v.id) + (v.score ? ` (${v.score > 0 ? '+' : ''}${v.score})` : '')));
  ver.value = D.version;
  ver.hidden = D.versions.length < 2;
-  ver.onchange = () => { saveProgress(true); location.href = readUrl(D.manga.id, D.chapter.id, ver.value); };
+  ver.onchange = () => { saveProgress(true); location.href = chapterUrl(D.chapter.id, ver.value); };
  for (const b of modeBtns) b.onclick = () => { if (b.dataset.mode !== mode) setMode(b.dataset.mode, true); };
  toneButton.onclick = cycleTone;
  $('#moment').onclick = saveMoment;
@@ -748,6 +802,7 @@
  for (const bar of [$('#top'), $('#bot')]) bar.addEventListener('click', e => { if (e.target.closest('button')) stage.focus({ preventScroll: true }); });

  setMode(mode, false);
+  if (newer(D.latest)) checkLatest(D.latest); else markSeen(seen);
  if (S.readingClock) readingClock = createReadingClock({
    button: $('#readclock'),
    panel: $('#clockpanel'),
@@ -5,6 +5,7 @@ const SETTINGS_SECTIONS = [
  { id: 'user/reading', group: 'User', title: 'Reading', hint: 'Reader modes, page spacing and zoom.' },
  { id: 'user/reading-hours', group: 'User', title: 'Reading hours', hint: 'When this server allows chapter reading.' },
  { id: 'user/reading-time', group: 'User', title: 'Reading time & privacy', hint: 'Your clock, Reading Story and personal data.' },
+  { id: 'user/activity', group: 'User', title: 'Reading activity', hint: 'When you read: by month, week, day or hour. Private to your account.' },
  { id: 'user/shortcuts', group: 'User', title: 'Keyboard shortcuts', hint: 'Every key the reader understands. Press ? in the reader for the same list.' },
  { id: 'user/notifications', group: 'User', title: 'Notifications', hint: 'Chapter alerts and your optional webhook.' },
  { id: 'user/account', group: 'User', title: 'Account', hint: 'Your account and password.' },
@@ -11,6 +11,8 @@
 <script src="common.js" defer></script>
 <script src="keys.js" defer></script>
 <script src="settings-nav.js" defer></script>
+<script src="activity-core.js" defer></script>
+<script src="activity.js" defer></script>
 <script src="settings.js" defer></script>
 </head>
 <body>
@@ -74,6 +74,9 @@
  const check = (key, text, hint) => h('label', { class: 'check' },
    h('input', { type: 'checkbox', checked: !!S[key], onchange: e => save({ [key]: e.target.checked }) }),
    h('span', {}, text, hint ? h('div', { class: 'muted small' }, hint) : null));
+  const number = (key, text, max) => h('label', { class: 'field' }, h('span', {}, text),
+    h('input', { type: 'number', min: 0, max, step: 1, value: S[key], style: 'width:6em',
+      onchange: e => { const n = Math.round(+e.target.value); if (n >= 0 && n <= max) save({ [key]: n }); else e.target.value = S[key]; } }));

  const startMode = h('select', { onchange: e => save({ startMode: e.target.value }) },
    h('option', { value: 'last' }, 'The mode I used last'),
@@ -145,7 +148,10 @@
  section('user/reading').append(h('section', { class: 'card' },
    h('h2', {}, 'Library page'),
    check('continueRow', 'Show "Continue where you left off" at the top',
-      'One row with the five manga you read most recently and have not finished. It hides itself while you search, filter by status, or sort by "Recently read".')));
+      'One row with the five manga you read most recently that still have chapters left after the last one you read. It hides itself while you search, filter by status, or sort by "Recently read".'),
+    h('p', { class: 'muted small' }, 'Rereading: later chapters you finished in an earlier pass count as left again when either rule applies. 0 turns a rule off.'),
+    number('rereadDays', 'Finished more than this many days before my last read', 3650),
+    number('rereadChapters', 'Or I have since read more than this many chapters in a row', 1000)));

  section('user/reading').append(h('section', { class: 'card' },
    h('h2', {}, 'Chapter list dates'),
@@ -178,6 +184,10 @@
      'Shows your private chapter times and personal summaries on manga and library pages. Hiding it does not delete existing history.'),
    readingData));

+  const activity = activityCard();
+  section('user/activity').append(activity.element);
+  controllers.set('user/activity', activity);
+
  const hook = h('input', { type: 'url', placeholder: 'https://ntfy.sh/my-manga-topic', value: S.webhook || '', style: 'width:100%' });
  const hookMsg = h('div', { class: 'small' });
  section('user/notifications').append(h('section', { class: 'card' },
@@ -0,0 +1,114 @@
+'use strict';
+// Reading activity: active reader time in small UTC time buckets, for the activity grid in Settings.
+// Buckets hold time and which manga it went to, never pages, input events or a raw event log.
+// Recent time keeps 6-minute buckets (a tenth of an hour); older time folds into hours.
+
+const FINE_MS = 6 * 60 * 1000, HOUR_MS = 60 * 60 * 1000, DAY_MS = 24 * HOUR_MS;
+const FINE_DAYS = 120, KEEP_DAYS = 3 * 366;
+
+const whole = value => Math.max(0, Math.round(Number(value) || 0));
+
+function emptyActivity() { return { schema: 1, fine: {}, hourly: {}, backfilled: false }; }
+
+function normalizeActivity(activity) {
+  const out = activity && typeof activity === 'object' ? activity : emptyActivity();
+  if (!out.fine || typeof out.fine !== 'object') out.fine = {};
+  if (!out.hourly || typeof out.hourly !== 'object') out.hourly = {};
+  out.schema = 1;
+  return out;
+}
+
+function credit(map, key, mangaId, ms) {
+  const bucket = (map[key] = map[key] || { a: 0, m: {} });
+  bucket.a += ms;
+  bucket.m[mangaId] = (bucket.m[mangaId] || 0) + ms;
+}
+
+// Active time `ms` that ended at `end`, spread over the buckets it covers.
+function addActive(activity, mangaId, ms, end) {
+  const act = normalizeActivity(activity);
+  let left = whole(ms), at = whole(end);
+  if (!left || !mangaId) return act;
+  while (left > 0) {
+    const key = Math.floor((at - 1) / FINE_MS), share = Math.min(left, at - key * FINE_MS);
+    credit(act.fine, key, mangaId, share);
+    left -= share; at -= share;
+  }
+  return act;
+}
+
+// Fine buckets older than FINE_DAYS become hourly; anything older than KEEP_DAYS is dropped.
+function fold(activity, now = Date.now()) {
+  const act = normalizeActivity(activity);
+  const fineLimit = Math.floor((now - FINE_DAYS * DAY_MS) / FINE_MS), keepLimit = Math.floor((now - KEEP_DAYS * DAY_MS) / HOUR_MS);
+  for (const [key, bucket] of Object.entries(act.fine)) {
+    if (+key >= fineLimit) continue;
+    const hour = Math.floor(+key * FINE_MS / HOUR_MS);
+    for (const [mangaId, ms] of Object.entries(bucket.m)) credit(act.hourly, hour, mangaId, ms);
+    delete act.fine[key];
+  }
+  for (const key of Object.keys(act.hourly)) if (+key < keepLimit) delete act.hourly[key];
+  return act;
+}
+
+// One-time seed from the visits the Reading Clock still remembers (the last eight per chapter).
+// A visit's active time is placed just before its last save; older visits are gone and stay gone.
+function backfill(activity, readingByManga, now = Date.now()) {
+  const act = normalizeActivity(activity);
+  if (act.backfilled) return act;
+  for (const [mangaId, chapters] of Object.entries(readingByManga || {})) {
+    for (const record of Object.values(chapters || {})) {
+      for (const receipt of record?.recentSessions || []) {
+        const pass = receipt?.pass, ms = whole(pass?.activeMs), end = whole(receipt?.at);
+        if (!ms || !end || end > now) continue;
+        const start = Math.max(whole(pass.startedAt) || end - ms, end - ms);
+        addActive(act, mangaId, Math.min(ms, end - start), end);
+      }
+    }
+  }
+  act.backfilled = true;
+  return fold(act, now);
+}
+
+function forgetManga(activity, mangaId) {
+  const act = normalizeActivity(activity);
+  for (const map of [act.fine, act.hourly]) {
+    for (const [key, bucket] of Object.entries(map)) {
+      const ms = bucket.m[mangaId];
+      if (!ms) continue;
+      delete bucket.m[mangaId];
+      bucket.a = Math.max(0, bucket.a - ms);
+      if (!bucket.a) delete map[key];
+    }
+  }
+  return act;
+}
+
+// Compact payload for the grid: [startMs, sizeMs, activeMs, [[mangaIndex, ms], …]] per bucket,
+// chapter completions as [doneAt, mangaIndex, chapterLabel]. The browser groups them in local time.
+function activitySeries(activity, progressByManga, { titleOf = id => id, labelOf = (m, c) => c } = {}) {
+  const act = normalizeActivity(activity);
+  const mangas = [], index = new Map();
+  const ref = id => {
+    if (!index.has(id)) { index.set(id, mangas.length); mangas.push({ id, title: titleOf(id) || id }); }
+    return index.get(id);
+  };
+  const buckets = [];
+  for (const [map, size] of [[act.hourly, HOUR_MS], [act.fine, FINE_MS]]) {
+    for (const [key, bucket] of Object.entries(map)) {
+      if (!bucket.a) continue;
+      buckets.push([+key * size, size, whole(bucket.a), Object.entries(bucket.m).map(([id, ms]) => [ref(id), whole(ms)])]);
+    }
+  }
+  buckets.sort((a, b) => a[0] - b[0]);
+  const done = [];
+  for (const [mangaId, chapters] of Object.entries(progressByManga || {})) {
+    for (const [chapterId, p] of Object.entries(chapters || {})) {
+      if (p && p.done && whole(p.doneAt)) done.push([whole(p.doneAt), ref(mangaId), labelOf(mangaId, chapterId)]);
+    }
+  }
+  done.sort((a, b) => a[0] - b[0]);
+  return { schema: 1, fineMs: FINE_MS, fineDays: FINE_DAYS, mangas, buckets, done };
+}
+
+module.exports = { FINE_MS, HOUR_MS, FINE_DAYS, KEEP_DAYS, emptyActivity, addActive, fold, backfill, forgetManga, activitySeries };
@@ -34,6 +34,7 @@ const { shouldRunNightly, Harvester } = require('./discovery/harvest');
 const {
  applyPulse, applyVisit, chapterInsight, earliestCompletion, eligiblePages, emptyRecord, libraryInsight, mangaInsight, publicSummary,
 } = require('./reading-analytics');
+const readingActivity = require('./reading-activity');
 const { chapterDates } = require('./chapter-dates');
 const { parseSchedule, publicSchedule, loadQuestionBank, createReadingAccess } = require('./reading-access');
 const { BackupService, BackupError } = require('./backup');
@@ -80,7 +81,7 @@ const greatestCovers = new GreatestCovers(path.join(DATA, 'greatest-covers'));
 const greatestCoverUrl = entry => entry.cover
  ? `api/greatest-cover?id=${encodeURIComponent(entry.id)}&v=${greatestCovers.version(entry.cover)}` : null;
 const DB_FILE = path.join(DATA, 'db.json'), CACHE_FILE = path.join(DATA, 'scan-cache.json'), INDEX_FILE = path.join(DATA, 'library-index.json');
-const db = { users: {}, sessions: {}, progress: {}, reading: {}, readingAccess: {}, follows: {}, notes: {}, votes: {}, greatestRatings: {}, discoveryFeedback: {}, moments: {}, known: {} };
+const db = { users: {}, sessions: {}, progress: {}, reading: {}, activity: {}, readingAccess: {}, follows: {}, notes: {}, votes: {}, greatestRatings: {}, discoveryFeedback: {}, moments: {}, known: {} };
 // A corrupt db.json stops the server instead of silently starting empty and overwriting it.
 if (fs.existsSync(DB_FILE)) Object.assign(db, JSON.parse(fs.readFileSync(DB_FILE, 'utf8')));
 function writeAtomic(file, text) { fs.writeFileSync(file + '.tmp', text); fs.renameSync(file + '.tmp', file); }
@@ -89,6 +90,7 @@ function save() { saveTimer = saveTimer || setTimeout(flush, 500); }
 function flush() { clearTimeout(saveTimer); saveTimer = null; writeAtomic(DB_FILE, JSON.stringify(db)); }
 for (const sig of ['SIGINT', 'SIGTERM']) process.on(sig, () => { flush(); process.exit(0); });
 db.readingAccess ||= {};
+db.activity ||= {};
 // The reader owns backups: it alone mounts all of DATA and holds db.json in memory.
 const backup = new BackupService({ dataRoot: DATA, backupRoot: process.env.BACKUP || '', snapshotDb: () => JSON.stringify(db),
  scraper: { state: () => scraperRequest('/api/state'), control: action => scraperRequest('/api/control', { action }) } }).start();
@@ -120,7 +122,7 @@ function checkPw(pw, stored) {
 }
 const DUMMY_HASH = hashPw('x');
 const DEFAULTS = { startMode: 'last', lastMode: 'page', adapt: true, skipExtras: false, skipCovers: false, flowPageGap: true, pageTone: 'original', readingClock: false, readingStory: true,
-  continueRow: true, readDate: 'hour', releaseDate: true, discoveryEnabled: false, discoveryReadingActivity: false, discoveryMature: false, zoom: {}, webhook: '', readerPerSession: true };
+  continueRow: true, rereadDays: 7, rereadChapters: 5, readDate: 'hour', releaseDate: true, discoveryEnabled: false, discoveryReadingActivity: false, discoveryMature: false, zoom: {}, webhook: '', readerPerSession: true };
 const userSettingsOf = u => ({ ...DEFAULTS, ...u.settings, zoom: { ...(u.settings && u.settings.zoom) } });
 // With a login session, its locked reader settings (reader-sessions.js) win over the user's latest set.
 const settingsOf = (u, sess) => readerSessions.effective(userSettingsOf(u), sess);
@@ -251,6 +253,18 @@ const chapterOf = (m, id) => m.chapterById.get(String(id)) || bad(404, 'Chapter
 const progressOf = (u, m) => (db.progress[u.name] && db.progress[u.name][m.id]) || {};
 const mangaReadingOf = (u, m) => (db.reading[u.name] && db.reading[u.name][m.id]) || {};
 const readingOf = (u, m, ch) => (db.reading[u.name] && db.reading[u.name][m.id] && db.reading[u.name][m.id][ch.id]) || null;
+const activityPayload = u => readingActivity.activitySeries(activityOf(u), db.progress[u.name], {
+  titleOf: id => lib.byId.get(id)?.title,
+  labelOf: (mangaId, chapterId) => lib.byId.get(mangaId)?.chapterById.get(chapterId)?.label || chapterId,
+});
+// The activity grid's buckets; the first use seeds them from the visits the clock still remembers.
+function activityOf(u, now = Date.now()) {
+  if (!db.activity[u.name]) { db.activity[u.name] = readingActivity.backfill(readingActivity.emptyActivity(), db.reading[u.name], now); save(); }
+  const act = db.activity[u.name];
+  // Folding old buckets into hours is cheap, but there is no need to do it on every pulse.
+  if (Math.floor(now / readingActivity.HOUR_MS) !== act.foldedHour) { readingActivity.fold(act, now); act.foldedHour = Math.floor(now / readingActivity.HOUR_MS); }
+  return act;
+}
 const unreadOf = u => (db.notes[u.name] || []).filter(n => !n.read).length;
 const momentsOf = u => (db.moments[u.name] ||= []);
 const momentOf = (u, id) => momentsOf(u).find(x => x.id === String(id || '')) || bad(404, 'Moment not found');
@@ -449,14 +463,47 @@ function readAtOf(progress, record) {
  if (progress.doneAt) return { at: progress.doneAt, approx: false };
  return earliestCompletion(record);
 }
-function continueOf(m, prog, s) {
-  const ok = c => !(s.skipExtras && c.extra);
+// The most recently saved chapter position of a manga: the head that "Continue" follows.
+function lastOf(m, prog) {
  let last = null;
  for (const ch of m.chapters) { const p = prog[ch.id]; if (p && (!last || p.t > last.p.t)) last = { ch, p }; }
-  if (!last) { const first = m.chapters.find(ok) || m.chapters[0]; return { c: first.id, text: 'Start reading · ' + first.label }; }
-  if (!last.p.done) return { c: last.ch.id, v: last.p.v, text: `Continue · ${last.ch.label} · page ${last.p.p + 1}` };
+  return last;
+}
+// `at` is the head's time; reader links carry it so a reader opened from a stale page notices a newer head.
+function continueOf(m, prog, s) {
+  const ok = c => !(s.skipExtras && c.extra);
+  const last = lastOf(m, prog);
+  if (!last) { const first = m.chapters.find(ok) || m.chapters[0]; return { c: first.id, at: 0, text: 'Start reading · ' + first.label }; }
+  const at = last.p.t;
+  if (!last.p.done) return { c: last.ch.id, v: last.p.v, at, text: `Continue · ${last.ch.label} · page ${last.p.p + 1}` };
  const next = m.chapters.slice(m.chapters.indexOf(last.ch) + 1).find(ok);
-  return next ? { c: next.id, text: 'Read next · ' + next.label } : { c: last.ch.id, v: last.p.v, text: 'Read again · ' + last.ch.label };
+  return next ? { c: next.id, at, text: 'Read next · ' + next.label } : { c: last.ch.id, v: last.p.v, at, text: 'Read again · ' + last.ch.label };
+}
+// Chapters still ahead of the head: never finished, or last read in an earlier pass. 0 = caught up.
+// A done chapter after the head belongs to an earlier pass (the head is a reread) when it was saved
+// more than `rereadDays` before the head, or before a run of more than `rereadChapters` chapters read
+// in order up to the head. 0 turns either rule off.
+function leftOf(m, prog, s) {
+  const last = lastOf(m, prog);
+  if (!last) return 0;
+  const chapters = m.chapters.filter(c => c === last.ch || !(s.skipExtras && c.extra)), at = chapters.indexOf(last.ch);
+  let runStart = last.p.t, run = 1;
+  for (let i = at - 1; i >= 0; i--) {
+    const p = prog[chapters[i].id];
+    if (!p || !p.done || p.t > runStart) break;
+    runStart = p.t; run++;
+  }
+  const gap = s.rereadDays > 0 ? s.rereadDays * 24 * 3600 * 1000 : Infinity;
+  const passStart = s.rereadChapters > 0 && run > s.rereadChapters ? runStart : -Infinity;
+  return chapters.slice(at + 1).filter(c => { const p = prog[c.id]; return !p || !p.done || last.p.t - p.t > gap || p.t < passStart; }).length
+    + (last.p.done ? 0 : 1);
+}
+// What a reader tab compares itself with (stale reading sessions, docs/architecture.md).
+function latestOf(m, prog, s) {
+  const last = lastOf(m, prog);
+  if (!last) return null;
+  const { t, w, v, p, n, done } = last.p;
+  return { t, w: w || '', c: last.ch.id, label: last.ch.label, v, p, n, done, continue: continueOf(m, prog, s) };
 }
 // From the saved page on, then the pages before it; afterwards the next chapter's preferred version.
 function warmChapter(u, m, ch, v, progress, s) {
@@ -587,6 +634,8 @@ const routes = {
    if (['flow', 'page', 'book'].includes(b.lastMode)) s.lastMode = b.lastMode;
    if (['original', 'inverted', 'sepia', 'dim', 'extra-dim'].includes(b.pageTone)) s.pageTone = b.pageTone;
    if (['off', 'date', 'hour'].includes(b.readDate)) s.readDate = b.readDate;
+    if (Number.isInteger(b.rereadDays) && b.rereadDays >= 0 && b.rereadDays <= 3650) s.rereadDays = b.rereadDays;
+    if (Number.isInteger(b.rereadChapters) && b.rereadChapters >= 0 && b.rereadChapters <= 1000) s.rereadChapters = b.rereadChapters;
    for (const k of ['adapt', 'skipExtras', 'skipCovers', 'flowPageGap', 'readingClock', 'readingStory', 'releaseDate', 'continueRow',
      'discoveryEnabled', 'discoveryReadingActivity', 'discoveryMature', 'readerPerSession']) if (typeof b[k] === 'boolean') s[k] = b[k];
    if (b.zoom && typeof b.zoom === 'object') {
@@ -606,7 +655,7 @@ const routes = {

  'GET /api/library': ({ u }) => {
    const prog = db.progress[u.name] || {}, fol = db.follows[u.name] || {}, notes = (db.notes[u.name] || []).filter(n => !n.read);
-    const showStory = settingsOf(u).readingStory;
+    const s = settingsOf(u), showStory = s.readingStory;
    const mangas = lib.mangas.map(m => {
      const p = prog[m.id] || {}, meta = m.meta || {}, release = firstReleaseOf(meta);
      return {
@@ -616,7 +665,7 @@ const routes = {
        tags: Array.isArray(meta.tags) ? meta.tags : (meta.tags ? [String(meta.tags)] : []), status: meta.status || '', year: meta.year || '',
        firstRelease: release.label, firstReleaseAt: release.time,
        read: m.chapters.filter(c => p[c.id] && p[c.id].done).length,
-        lastRead: Object.values(p).reduce((t, x) => Math.max(t, x.t || 0), 0),
+        lastRead: Object.values(p).reduce((t, x) => Math.max(t, x.t || 0), 0), left: leftOf(m, p, s),
        following: !!fol[m.id], unread: notes.filter(n => n.m === m.id).length,
        reading: showStory ? mangaInsight(mangaReadingOf(u, m), m.chapters.map(ch => ch.id)) : null,
      };
@@ -766,19 +815,24 @@ const routes = {
      user: u.name,
      reading: libraryInsight(mangas),
      mangas,
+      activity: activityPayload(u),
    };
  },

+  'GET /api/reading/activity': ({ u }) => ({ readingClock: !!settingsOf(u).readingClock, ...activityPayload(u) }),
+
  'POST /api/reading/delete': ({ u, b }) => {
    if (b.all) {
      if (!checkPw(String(b.password || ''), u.hash)) bad(403, 'The current password is wrong.');
      delete db.reading[u.name];
+      delete db.activity[u.name];
      readingLeases.delete(u.name);
      save();
      return { ok: true, deleted: 'all' };
    }
    const m = mangaOf(b.m), all = db.reading[u.name];
    if (all) delete all[m.id];
+    if (db.activity[u.name]) readingActivity.forgetManga(db.activity[u.name], m.id);
    save();
    return { ok: true, deleted: m.id };
  },
@@ -800,6 +854,7 @@ const routes = {
      pages: v.pages.map(p => ({ u: url(v.rel + '/' + p.f), w: p.w, h: p.h, t: p.t, r: p.r })),
      prev: neighbour(m, ch, -1, s), next: neighbour(m, ch, 1, s),
      progress: prog[ch.id] || null,
+      latest: latestOf(m, prog, s),
      reading: s.readingClock ? publicSummary(readingOf(u, m, ch), v.id, eligiblePages(v, s)) : null,
      // the user's moments on this version, so the reader can mark pages that already have one
      moments: momentsOf(u).filter(x => x.m === m.id && x.c === ch.id && x.v === v.id)
@@ -810,18 +865,30 @@ const routes = {
    };
  },

+  'GET /api/progress/latest': ({ u, q }) => {
+    const m = mangaOf(q.get('m'));
+    return { latest: latestOf(m, progressOf(u, m), settingsOf(u)) };
+  },
  'POST /api/progress': ({ u, b }) => {
    const m = mangaOf(b.m), ch = chapterOf(m, b.c);
    const all = (db.progress[u.name] = db.progress[u.name] || {}), mp = (all[m.id] = all[m.id] || {}), old = mp[ch.id] || {};
+    const tab = /^[a-zA-Z0-9_-]{8,40}$/.test(String(b.tab || '')) ? String(b.tab) : '';
+    // A reader tab sends the head time it knows (`seen`). When another tab or device saved a newer
+    // position since, this tab is stale: it must not become the head until the reader chooses to stay.
+    if (Number.isFinite(b.seen)) {
+      const last = lastOf(m, mp);
+      if (last && last.p.t > b.seen && (!tab || last.p.w !== tab)) return { ok: false, stale: true, latest: latestOf(m, mp, settingsOf(u)) };
+    }
    const now = Date.now(), done = !!(old.done || b.done);
    // doneAt: when the chapter was first completed; kept until it is marked unread.
    const doneAt = old.done ? old.doneAt : done ? now : undefined;
    mp[ch.id] = {
      v: String(b.v || ''), p: Math.max(0, b.p | 0), n: Math.max(0, b.n | 0), t: now, done, ...(doneAt ? { doneAt } : {}),
      shift: Array.isArray(b.shift) ? b.shift.filter(Number.isInteger).slice(0, 1000) : old.shift || [],
+      ...(tab ? { w: tab } : {}),
    };
    save();
-    return { ok: true };
+    return { ok: true, t: now };
  },
  // Separate endpoint: an older server on rollback cannot misread cumulative
  // visit totals as legacy deltas. Old open tabs retain their original protocol.
@@ -858,7 +925,15 @@ const routes = {
    const byUser = (db.reading[u.name] = db.reading[u.name] || {});
    const byManga = (byUser[m.id] = byUser[m.id] || {});
    const record = (byManga[ch.id] = readingOf(u, m, ch) || emptyRecord());
+    // Seed the activity buckets from remembered visits before this visit changes them.
+    const activity = activityOf(u, now);
+    const visitMs = () => record.recentSessions.find(item => item.id === session)?.pass?.activeMs || 0, before = visitMs();
    const result = (cumulative ? applyVisit : applyPulse)(record, b, { version: v.id, pageCount: v.pages.length, eligible, now });
+    // The activity grid counts all active reader time, including visits below the 60% threshold.
+    if (!result.duplicate) {
+      const added = cumulative ? visitMs() - before : result.activeMs;
+      if (added > 0) readingActivity.addActive(activity, m.id, added, now);
+    }
    if (b.release && readingLeases.get(u.name)?.session === session) readingLeases.delete(u.name);
    if (!result.duplicate) save();
    return {
@@ -981,7 +1056,7 @@ const routes = {
    admin(u);
    const name = String(b.name || '');
    if (name === u.name) bad(400, "You can't delete your own account.");
-    delete db.users[name]; delete db.progress[name]; delete db.reading[name]; delete db.follows[name]; delete db.notes[name]; delete db.moments[name];
+    delete db.users[name]; delete db.progress[name]; delete db.reading[name]; delete db.activity[name]; delete db.follows[name]; delete db.notes[name]; delete db.moments[name];
    if (db.discoveryFeedback) delete db.discoveryFeedback[name];
    if (db.greatestRatings) delete db.greatestRatings[name];
    for (const [k, s] of Object.entries(db.sessions)) if (s.u === name) delete db.sessions[k];
@@ -0,0 +1,110 @@
+'use strict';
+// "Continue where you left off" only lists manga with something left after the last chapter read:
+// unread chapters, or chapters last read in an earlier pass (a reread).
+const test = require('node:test'), assert = require('node:assert/strict');
+const fs = require('fs'), os = require('os'), path = require('path'), net = require('net');
+const { spawn } = require('child_process');
+const { Canvas } = require('../tools/png');
+
+async function freePort() {
+  const listener = net.createServer();
+  await new Promise(resolve => listener.listen(0, '127.0.0.1', resolve));
+  const port = listener.address().port;
+  await new Promise(resolve => listener.close(resolve));
+  return port;
+}
+
+async function start(library, data) {
+  const port = await freePort(), output = [];
+  const child = spawn(process.execPath, ['server.js'], { cwd: path.resolve(__dirname, '..'), windowsHide: true,
+    env: { ...process.env, LIBRARY: library, DATA: data, PORT: String(port), SCAN_INTERVAL: '0', FULL_SCAN_INTERVAL: '0',
+      SCRAPER_URL: 'http://127.0.0.1:9', SCRAPER_TOKEN: 'fixture-token', SCRAPER_TOKEN_FILE: '', BACKUP: '', GREATEST_COVER_WARM: '0' } });
+  child.stdout.on('data', d => output.push(String(d)));
+  child.stderr.on('data', d => output.push(String(d)));
+  const base = `http://127.0.0.1:${port}`;
+  let ready = false;
+  for (let n = 0; n < 100 && !ready; n++) {
+    ready = await fetch(base + '/health').then(r => r.ok).catch(() => false);
+    if (!ready) await new Promise(resolve => setTimeout(resolve, 50));
+  }
+  assert.ok(ready, output.join(''));
+  return { child, base };
+}
+async function stop(child) {
+  if (child && child.exitCode === null) { child.kill(); await new Promise(resolve => child.once('exit', resolve)); }
+}
+
+test('the continue row counts chapters left after the head, rereads included', { timeout: 30000 }, async () => {
+  const root = fs.mkdtempSync(path.join(os.tmpdir(), 'mc-left-'));
+  let server;
+  try {
+    const library = path.join(root, 'library'), data = path.join(root, 'data');
+    for (const [title, count] of [['Moon Garden', 4], ['Sun Field', 4], ['Star Path', 8]])
+      for (let n = 1; n <= count; n++) {
+        const dir = path.join(library, title, 'v01', `c00${n}`);
+        fs.mkdirSync(dir, { recursive: true });
+        fs.writeFileSync(path.join(dir, '001.png'), new Canvas(60, 90, [40, 60, 120]).png());
+      }
+    fs.mkdirSync(data);
+    server = await start(library, data);
+    let { base } = server;
+    const post = (cookie, url, body) => fetch(base + url, { method: 'POST',
+      headers: { 'content-type': 'application/json', cookie }, body: JSON.stringify(body) }).then(r => r.json());
+    const get = (cookie, url) => fetch(base + url, { headers: { cookie } }).then(r => r.json());
+    const signup = await fetch(base + '/api/signup', { method: 'POST', headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({ name: 'alice', password: 'alice-password' }) });
+    const alice = signup.headers.get('set-cookie').split(';')[0];
+    await post(alice, '/api/admin/rescan', { full: true });
+    const ids = async m => (await get(alice, '/api/manga?m=' + encodeURIComponent(m))).chapters.map(c => ({ c: c.id, v: c.versions[0].id }));
+    const moon = await ids('Moon Garden'), sun = await ids('Sun Field');
+    const done = (m, ch) => post(alice, '/api/progress', { m, ...ch, p: 0, n: 1, done: true });
+    const left = async () => Object.fromEntries((await get(alice, '/api/library')).mangas.map(m => [m.id, m.left]));
+
+    // First read stopped after chapter 2: two chapters left. Finished: nothing left.
+    for (const ch of moon.slice(0, 2)) await done('Moon Garden', ch);
+    for (const ch of sun) await done('Sun Field', ch);
+    assert.deepEqual(await left(), { 'Moon Garden': 2, 'Sun Field': 0, 'Star Path': 0 });
+
+    // Read all 8 chapters of Star Path, then reread 1-6 right away: more than 5 in a row is a reread
+    // even within the time limit; with a longer run setting, or the run rule off, it is not.
+    const star = await ids('Star Path');
+    for (const ch of star) await done('Star Path', ch);
+    await new Promise(resolve => setTimeout(resolve, 5));
+    for (const ch of star.slice(0, 5)) await done('Star Path', ch);
+    assert.equal((await left())['Star Path'], 0, 'five in a row is not yet a reread');
+    await done('Star Path', star[5]);
+    assert.equal((await left())['Star Path'], 2);
+    await post(alice, '/api/settings', { rereadChapters: 6 });
+    assert.equal((await left())['Star Path'], 0);
+    await post(alice, '/api/settings', { rereadChapters: 0 });
+    assert.equal((await left())['Star Path'], 0);
+    await post(alice, '/api/settings', { rereadChapters: 5, rereadDays: -1 });
+    const settings = (await get(alice, '/api/me')).settings;
+    assert.equal(settings.rereadDays, 7, 'invalid values are ignored');
+    assert.equal((await left())['Star Path'], 2);
+
+    // Unfinished head: the rest of that chapter is still left.
+    await post(alice, '/api/progress', { m: 'Moon Garden', ...moon[2], p: 0, n: 1 });
+    assert.equal((await left())['Moon Garden'], 2);
+
+    // Glancing back at chapter 1 right after finishing is not a reread.
+    await done('Sun Field', sun[0]);
+    assert.equal((await left())['Sun Field'], 0);
+
+    // The finish was a month ago: rereading chapters 1-2 now leaves 3-4 from the earlier pass.
+    await new Promise(resolve => setTimeout(resolve, 700));
+    await stop(server.child);
+    const dbFile = path.join(data, 'db.json'), db = JSON.parse(fs.readFileSync(dbFile, 'utf8'));
+    const month = 30 * 24 * 3600 * 1000, sunProgress = db.progress.alice['Sun Field'];
+    for (const p of Object.values(sunProgress)) { p.t -= month; p.doneAt -= month; }
+    sunProgress[sun[0].c].t += month;
+    fs.writeFileSync(dbFile, JSON.stringify(db));
+    server = await start(library, data);
+    base = server.base;
+    await done('Sun Field', sun[1]);
+    assert.equal((await left())['Sun Field'], 2);
+  } finally {
+    await stop(server && server.child);
+    fs.rmSync(root, { recursive: true, force: true });
+  }
+});
@@ -0,0 +1,99 @@
+'use strict';
+const test = require('node:test'), assert = require('node:assert/strict');
+const act = require('../reading-activity');
+const core = require('../public/activity-core');
+
+const MIN = 60000, HOUR = 60 * MIN, DAY = 24 * HOUR;
+const sum = a => Object.values(a.fine).concat(Object.values(a.hourly)).reduce((s, b) => s + b.a, 0);
+
+test('active time ending at a moment is spread over the 6-minute buckets it covers', () => {
+  const a = act.emptyActivity(), end = 1000 * act.FINE_MS + 2 * MIN;
+  act.addActive(a, 'alpha', 5 * MIN, end);
+  assert.deepEqual(Object.keys(a.fine).map(Number), [999, 1000]);
+  assert.equal(a.fine[1000].a, 2 * MIN); assert.equal(a.fine[999].a, 3 * MIN);
+  act.addActive(a, 'beta', MIN, end);
+  assert.deepEqual(a.fine[1000].m, { alpha: 2 * MIN, beta: MIN });
+});
+
+test('old buckets fold into hours, very old ones are dropped, totals stay', () => {
+  const now = 2000 * DAY, a = act.emptyActivity();
+  act.addActive(a, 'alpha', 10 * MIN, now - 200 * DAY);
+  act.addActive(a, 'alpha', 10 * MIN, now - 2 * DAY);
+  act.addActive(a, 'alpha', 10 * MIN, now - 1200 * DAY);
+  act.fold(a, now);
+  assert.equal(Object.keys(a.hourly).length, 1);
+  assert.equal(sum(a), 20 * MIN);
+});
+
+test('backfill places remembered visits before their last save, once', () => {
+  const now = 100 * DAY, at = now - DAY;
+  const reading = { alpha: { c1: { recentSessions: [
+    { id: 'v1', at, pass: { activeMs: 20 * MIN, startedAt: at - 30 * MIN } },
+    { id: 'legacy', at, counted: true },
+  ] } } };
+  const a = act.backfill(act.emptyActivity(), reading, now);
+  assert.equal(sum(a), 20 * MIN); assert.equal(a.backfilled, true);
+  act.backfill(a, reading, now);
+  assert.equal(sum(a), 20 * MIN);
+});
+
+test('forgetting a manga removes only its share', () => {
+  const a = act.emptyActivity();
+  act.addActive(a, 'alpha', MIN, 10 * act.FINE_MS);
+  act.addActive(a, 'beta', 2 * MIN, 10 * act.FINE_MS);
+  act.forgetManga(a, 'beta');
+  assert.equal(sum(a), MIN); assert.deepEqual(a.fine[9].m, { alpha: MIN });
+});
+
+test('series lists buckets in time order and chapter completions with labels', () => {
+  const a = act.emptyActivity();
+  act.addActive(a, 'alpha', MIN, 20 * act.FINE_MS);
+  a.hourly[1] = { a: MIN, m: { beta: MIN } };
+  const s = act.activitySeries(a, { alpha: { c1: { done: true, doneAt: 5 }, c2: { done: false } } },
+    { titleOf: id => id.toUpperCase(), labelOf: (m, c) => 'Ch. ' + c });
+  assert.deepEqual(s.buckets.map(b => b[0]), [act.HOUR_MS, 19 * act.FINE_MS]);
+  assert.deepEqual(s.done, [[5, s.mangas.findIndex(m => m.id === 'alpha'), 'Ch. c1']]);
+  assert.equal(s.mangas.find(m => m.id === 'beta').title, 'BETA');
+});
+
+test('periods are local and Monday based; cells carry their natural segments', () => {
+  const tue = new Date(2026, 10, 3, 15, 30).getTime();
+  assert.equal(core.periodStart('week', tue), new Date(2026, 10, 2).getTime());
+  assert.equal(core.periodStart('month', tue), new Date(2026, 10, 1).getTime());
+  assert.equal(core.isoWeek(tue), 45);
+  assert.equal(core.segmentBounds('month', new Date(2026, 1, 1).getTime()).length, 29);
+  assert.equal(core.segmentBounds('week', new Date(2026, 10, 2).getTime()).length, 29);
+  assert.equal(core.segmentBounds('hour', new Date(2026, 10, 3, 15).getTime()).length, 11);
+});
+
+test('layouts: two years of months, six months of weeks without repeats, a month calendar, a day of hours', () => {
+  const t = new Date(2026, 10, 3, 15).getTime();
+  const months = core.activityLayout('month', t);
+  assert.deepEqual(months.rows.map(r => r.cells.length), [12, 12]);
+  const weeks = core.activityLayout('week', t).rows.flatMap(r => r.cells);
+  assert.equal(new Set(weeks.map(c => c.start)).size, weeks.length);
+  for (let i = 1; i < weeks.length; i++) assert.equal(weeks[i].start, core.periodShift('week', weeks[i - 1].start, 1));
+  const days = core.activityLayout('day', t);
+  assert.equal(days.rows.flatMap(r => r.cells).filter(c => !c.outside).length, 30);
+  assert.equal(core.activityLayout('hour', t).rows.flatMap(r => r.cells).length, 24);
+});
+
+test('sums split buckets by overlap and count completions in their segment', () => {
+  const day = new Date(2026, 10, 3).getTime();
+  const cells = core.activityLayout('hour', day).rows.flatMap(r => r.cells);
+  const nine = day + 9 * HOUR;
+  core.activitySums({ buckets: [[nine - 30 * MIN, HOUR, 60 * MIN, [[0, 60 * MIN]]]], done: [[nine + 7 * MIN, 0, 'Ch. 1']] }, cells);
+  assert.equal(Math.round(cells[8].totalTime), 30 * MIN); assert.equal(Math.round(cells[9].totalTime), 30 * MIN);
+  assert.deepEqual(cells[9].time.slice(0, 6).map(Math.round), [6 * MIN, 6 * MIN, 6 * MIN, 6 * MIN, 6 * MIN, 0]);
+  assert.equal(cells[9].chapters[1], 1); assert.equal(cells[9].done.length, 1);
+});
+
+test('drilling: month and week open days (week marked), day opens hours, hour is the end', () => {
+  const week = new Date(2026, 10, 30).getTime();
+  const next = core.activityDrill({ level: 'week', start: week });
+  assert.equal(next.view, 'day'); assert.equal(next.mark, week);
+  assert.equal(new Date(next.anchor).getMonth(), 11);
+  assert.equal(core.activityDrill({ level: 'day', start: week }).view, 'hour');
+  assert.equal(core.activityDrill({ level: 'hour', start: week }), null);
+  assert.equal(core.activityGlow(0, 10), 0); assert.equal(core.activityGlow(10, 10), 1);
+});
@@ -148,6 +148,15 @@ test('three services integrate collections, auth, custom covers and private heal
    assert.equal((await send(visit(first, 'beacon-first', 2, { activeMs: 500, seen: [0], final: true, release: true }))).accepted, true);
    assert.equal((await send(visit(second, 'third-visit', 1))).accepted, false);
    await send(visit(second, 'second-visit', 2, { release: true }));
+    // The activity grid gets every credited millisecond once, duplicates and stale pulses excluded.
+    assert.equal((await request('/api/progress', { m: first.manga.id, c: first.chapter.id, v: first.version, p: 0, n: 1, done: true })).status, 200);
+    const activity = await (await request('/api/reading/activity')).json();
+    assert.equal(activity.readingClock, true);
+    assert.equal(activity.buckets.reduce((sum, b) => sum + b[2], 0), 2000);
+    assert.deepEqual(activity.mangas.map(m => m.id), [first.manga.id]);
+    assert.equal(activity.done.length, 1); assert.equal(activity.done[0][2], first.chapter.label);
+    assert.equal((await request('/api/reading/delete', { m: first.manga.id })).status, 200);
+    assert.equal((await (await request('/api/reading/activity')).json()).buckets.length, 0);
    assert.equal((await fetch(base + '/api/reading/visit', { method: 'POST', headers: { 'content-type': 'application/json' }, body: JSON.stringify(visit(first, 'unauth-visit', 1)) })).status, 401);
    await request('/api/settings', { readingClock: false });
    assert.equal((await request('/api/reading/visit', visit(first, 'disabled-visit', 1))).status, 403);
@@ -0,0 +1,97 @@
+'use strict';
+// Stale reading sessions: a reader tab left open on another device must not move "Continue" back.
+const test = require('node:test'), assert = require('node:assert/strict');
+const fs = require('fs'), os = require('os'), path = require('path'), net = require('net');
+const { spawn } = require('child_process');
+const { Canvas } = require('../tools/png');
+
+async function freePort() {
+  const listener = net.createServer();
+  await new Promise(resolve => listener.listen(0, '127.0.0.1', resolve));
+  const port = listener.address().port;
+  await new Promise(resolve => listener.close(resolve));
+  return port;
+}
+
+test('a save from a tab that missed a newer position is refused until the reader stays', { timeout: 30000 }, async () => {
+  const root = fs.mkdtempSync(path.join(os.tmpdir(), 'mc-stale-'));
+  let child;
+  try {
+    const library = path.join(root, 'library'), data = path.join(root, 'data');
+    for (const ch of ['c001 One', 'c002 Two', 'c003 Three']) {
+      const dir = path.join(library, 'Moon Garden', 'v01', ch);
+      fs.mkdirSync(dir, { recursive: true });
+      for (const n of [1, 2, 3]) fs.writeFileSync(path.join(dir, `00${n}.png`), new Canvas(60, 90, [40 * n, 60, 120]).png());
+    }
+    fs.mkdirSync(data);
+    const port = await freePort(), output = [];
+    child = spawn(process.execPath, ['server.js'], { cwd: path.resolve(__dirname, '..'), windowsHide: true,
+      env: { ...process.env, LIBRARY: library, DATA: data, PORT: String(port), SCAN_INTERVAL: '0', FULL_SCAN_INTERVAL: '0',
+        SCRAPER_URL: 'http://127.0.0.1:9', SCRAPER_TOKEN: 'fixture-token', SCRAPER_TOKEN_FILE: '', BACKUP: '', GREATEST_COVER_WARM: '0' } });
+    child.stdout.on('data', d => output.push(String(d)));
+    child.stderr.on('data', d => output.push(String(d)));
+    const base = `http://127.0.0.1:${port}`;
+    let ready = false;
+    for (let n = 0; n < 100 && !ready; n++) {
+      ready = await fetch(base + '/health').then(r => r.ok).catch(() => false);
+      if (!ready) await new Promise(resolve => setTimeout(resolve, 50));
+    }
+    assert.ok(ready, output.join(''));
+    const post = (cookie, url, body) => fetch(base + url, { method: 'POST',
+      headers: { 'content-type': 'application/json', cookie }, body: JSON.stringify(body) }).then(r => r.json());
+    const get = (cookie, url) => fetch(base + url, { headers: { cookie } }).then(r => r.json());
+    const signup = await fetch(base + '/api/signup', { method: 'POST', headers: { 'content-type': 'application/json' },
+      body: JSON.stringify({ name: 'alice', password: 'alice-password' }) });
+    const alice = signup.headers.get('set-cookie').split(';')[0];
+    await post(alice, '/api/admin/rescan', { full: true });
+
+    const manga = await get(alice, '/api/manga?m=Moon%20Garden');
+    const [one, two, three] = manga.chapters.map(c => ({ c: c.id, v: c.versions[0].id }));
+    const save = (ch, extra) => post(alice, '/api/progress', { m: 'Moon Garden', ...ch, p: 1, n: 3, ...extra });
+    const latest = () => get(alice, '/api/progress/latest?m=Moon%20Garden').then(r => r.latest);
+
+    // Phone reads chapter 1, the tablet then reads on in chapter 3.
+    const first = await save(one, { tab: 'phone-tab-1', seen: 0 });
+    assert.equal(first.ok, true);
+    const phoneSeen = first.t;
+    await new Promise(resolve => setTimeout(resolve, 5));
+    const tablet = await save(three, { tab: 'tablet-tab-1', seen: phoneSeen });
+    assert.equal(tablet.ok, true);
+    assert.equal((await latest()).c, three.c);
+
+    // The phone's old tab wakes up and saves chapter 1 again: refused, the head stays on chapter 3.
+    const refused = await save(one, { tab: 'phone-tab-1', seen: phoneSeen, p: 2 });
+    assert.equal(refused.ok, false);
+    assert.equal(refused.stale, true);
+    assert.equal(refused.latest.c, three.c);
+    assert.equal(refused.latest.w, 'tablet-tab-1');
+    assert.equal(refused.latest.continue.c, three.c);
+    assert.match(refused.latest.continue.text, /Continue/);
+    const after = await get(alice, '/api/manga?m=Moon%20Garden');
+    assert.equal(after.continue.c, three.c);
+    assert.equal(after.continue.at, tablet.t);
+    assert.equal(after.chapters[0].progress.p, 1, 'the stale save changed nothing');
+
+    // The chapter view tells a reader which head it is compared with.
+    const view = await get(alice, `/api/chapter?m=Moon%20Garden&c=${encodeURIComponent(one.c)}`);
+    assert.equal(view.latest.c, three.c);
+    assert.equal(view.latest.t, tablet.t);
+
+    // The tablet's own saves never conflict with themselves, even with an older `seen` still in flight.
+    assert.equal((await save(three, { tab: 'tablet-tab-1', seen: phoneSeen, p: 2 })).ok, true);
+
+    // "Keep reading here": the phone now knows the newest time and its save becomes the head.
+    const head = await latest();
+    const stayed = await save(one, { tab: 'phone-tab-1', seen: head.t, p: 2 });
+    assert.equal(stayed.ok, true);
+    assert.equal((await latest()).c, one.c);
+    assert.equal((await get(alice, '/api/manga?m=Moon%20Garden')).continue.c, one.c);
+
+    // Saves without `seen` (mark as read on the manga page, older clients) behave as before.
+    assert.equal((await save(two, { done: true })).ok, true);
+    assert.equal((await latest()).c, two.c);
+  } finally {
+    if (child && child.exitCode === null) { child.kill(); await new Promise(resolve => child.once('exit', resolve)); }
+    fs.rmSync(root, { recursive: true, force: true });
+  }
+});
Author	SHA1	Message	Date
MaashkinoozheandClaude Opus 5.5	fe8956087e	Reading activity grid in Settings: months, weeks, days, hours with drill-down Active reader time is now kept per user in small UTC buckets (6 minutes for 120 days, then hours, dropped after three years), seeded once from the visits the clock still remembers. Settings -> Reading activity shows them as a grid whose cells glow with their total and carry a start-to-end strip; month/week cells open their days, days open their hours. Finished chapters come from progress and work without the clock. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>	2026-11-03 12:41:44 +01:00
MaashkinoozheandClaude Opus 5.5	c760141636	Continue row: a run of more than N chapters in order also marks a reread A done chapter after the head now counts as left again when it was finished more than rereadDays before the head (default 7) or before a run of more than rereadChapters chapters read in order up to the head (default 5). Both are user settings under Library page; 0 turns a rule off. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>	2026-11-01 11:47:45 +01:00
MaashkinoozheandClaude Opus 5.5	9b529d7709	Continue row: only manga with something left after the last chapter read GET /api/library returns `left` per manga: chapters after the newest saved position that are unfinished, unread, or were last read more than 7 days before it (a reread from the start). The continue row lists manga with left > 0, so caught-up series drop out until a new chapter arrives. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>	2026-11-01 11:27:02 +01:00
Maashkinoozhe	dddf9bb4ac	Merge remote-tracking branch 'origin/main' into feature/stale-reading-session	2026-10-31 12:21:24 +01:00
MaashkinoozheandClaude Opus 5.5	618992ec14	Reader: stale reading sessions never move "Continue" back A reader tab left open on one device (or restored by the browser) used to save its old chapter as the newest position as soon as it was shown again. Progress saves now carry the tab id and the newest progress time the tab knows (`seen`); the server refuses a save when another tab or device saved a newer position since. The reader then asks: jump to the newest position, or keep reading here (which makes this chapter the head again). It checks on open, when the tab becomes visible, and on every save. Reader links carry `at` and the reader keeps it in the address bar, so reloads and restored tabs still know what they had seen. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>	2026-10-31 11:49:52 +01:00