create-pmos 0.130.0 → 0.132.0

package/workspace/public/pm/pm-work-view.js

@@ -5,26 +5,34 @@
  * (see pm/console3-lift.md). This file keeps the real data calls and draws what they return, nothing else.
  *
  * mountPmWork(host, ctx) draws once per host; disposePmWork(host) removes it.
+ * Views (initiative console3-work-page, planning/prd/console3-work-page-prd.md): Inbox, Today, Upcoming, Waiting, Someday and Review.
+ * The SERVER places every item and answers `work`, `review`, `focus` and `counts`; this file draws them and never copies an item from
+ * one view to another. Today opens with Focus (up to three jobs, each with the reason: Accept, Edit title, Not today). Upcoming groups
+ * the next 7 days by day, then Later. Review is a weekly pass, one item at a time (Keep, Change, Drop). An item done outside PMOS
+ * (`kind: offline`) shows the person and offers Done with an optional outcome, Not yet and Drop, and "Looks done?" with Confirm when
+ * it carries `evidence`; PMOS never closes it by itself.
  * Routes (lib/routes-pm-items.js). Every write is a page press through pmPost:
- *   GET /api/pm-items  POST /api/pm-items/{add,edit,remove,undo,done,reopen,park,unpark,move,steps/add,steps/who,steps/plan}
- *   POST /api/pm-jobs/{add,edit,delete}
+ *   GET /api/pm-items  POST /api/pm-items/{add,edit,remove,undo,done,reopen,unpark,flag,defer,someday,waiting,notyet,keep,steps/add,steps/who,steps/plan}
+ *   POST /api/pm-items/focus/{accept,dismiss,clear}  POST /api/pm-jobs/{add,edit,delete}
  * A row opens its CASE FILE in place (c3-expand.js + c3-case.js: the job sentence, evidence, options with a recommendation, a slide to
- * confirm); the editable fields sit inside it behind "Edit details". A row swipes (c3-swipe.js) and takes keys: right = the right-hand
- * action of its list (done, in Today, ...), left = the left-hand one (later, tomorrow, ...); e and n do the same, j and k move, and the
- * arrows do the swipes. Every action offers Undo through the reverse route (reopen, unpark, move back, edit back, undo). Anything that
- * would send something to a person is an outward option: its slide is drawn disabled ("no channel connected"); nothing is sent.
- * In demo mode (/c3.html?demo=1, window.__c3demo) the answers of the writes are laid over the fixtures in memory (`applyOv`); the
- * agent run of a row with a suggested move is a mock that only walks the steps and shows a labelled draft.
- * Drawn from the items: the lens ring (done of total). The deck is ctx.plan, a node the page builds. The
- * microphone is drawn disabled.
+ * confirm), then the shared actions (Flag, Not before, Someday, Waiting, Drop); the editable fields sit inside it behind "Edit details".
+ * A row swipes (c3-swipe.js) and takes keys: right = the right-hand action of its view (done, in Today, ...), left = the left-hand one
+ * (tomorrow, Someday, ...); j and k move, and the arrows do the swipes. Every action offers Undo through the reverse route (reopen,
+ * unpark, flag back, defer back, waiting back, undo). Anything that would send something to a person is an outward option: its slide is
+ * drawn disabled ("no channel connected"); nothing is sent.
+ * In demo mode (/c3.html?demo=1, window.__c3demo) the answers of the writes are laid over the fixtures in memory (`applyOv`) and placed
+ * with work-place.js, the server's rule; the agent run of a row with a suggested move is a mock that only walks the steps and shows a
+ * labelled draft. The deck is ctx.plan, a node the page builds. The microphone is drawn disabled.
  *
  * The helpers c3ic, c3ring, ensureC3Css and c3Phone are shared with briefing-deck.js and calendar-views.js. */
 import { el } from './dom.js';
+import { button } from './primitives.js';
 import { pmGet, pmPost } from './http.js';
 import { renderCase } from './c3-case.js';
 import { makeXp, attachExpand } from './c3-expand.js';
 import { attachSwipe } from './c3-swipe.js';
 import { toast } from './c3-toast.js';
+import { VIEWS, REVIEW_DAYS, workPlace, arrives, buildWork, addIso, daysBetween, untouchedDays } from './work-place.js';
 
 /* ── shared with the Briefing and Calendar views: the stylesheet, the icon sprite, the ring, the phone class ───────── */
 
@@ -96,11 +104,12 @@ export function c3ib(label, icon, attrs, cls) {
 
 const API = '/api/pm-items';
 const JOBS = '/api/pm-jobs';
-const LENSES = [['triage', 'Triage'], ['today', 'Today'], ['week', 'Week'], ['waiting', 'Waiting'], ['later', 'Later']];
-const WLI = { triage: 'inbox', today: 'sun', week: 'cal', waiting: 'wait', later: 'moon' };   // console3.html line 3207
+/* The six views (initiative console3-work-page, PRD R1): five places an open item can be, and the weekly Review pass. */
+const LENSES = [['inbox', 'Inbox'], ['today', 'Today'], ['upcoming', 'Upcoming'], ['waiting', 'Waiting'], ['someday', 'Someday'], ['review', 'Review']];
+const WLI = { inbox: 'inbox', today: 'sun', upcoming: 'cal', waiting: 'wait', someday: 'moon', review: 'eye' };
 const WHO = ['you', 'agent-drafts', 'agent-does'];
 const OUTWARD = /\b(send|sends|sending|email|emails|message|messages|tell|post|reply to)\b/i; // mirrors lib/item-steps.js
-const NEED = 'Needs the backend: no endpoint for this yet.';
+const RESOLVES_TIP = 'Your work. The team task is separate: close it in its initiative.';
 
 export const COPY = Object.freeze({
   addPlaceholder: 'Add work: type or speak',
@@ -110,23 +119,48 @@ export const COPY = Object.freeze({
   addJob: 'Add a job', addJobPlaceholder: 'when I plan a release, I want honest dates, so Dana can trust them',
   groupJob: 'Group by job to be done', groupTime: 'Group by time', loading: 'Reading…',
   micOff: 'Speak is off on this line: on-device dictation runs in Notes, in the main app. Type the item here.',
-  jobsNote: 'The count is every item in the job, across all lists. Tap a job to edit or delete it.',
+  jobsNote: 'The count is every item in the job, across all views. Tap a job to edit or delete it.',
   legend: ['open', 'done', 'migrated', 'scheduled'], readError: 'Your items could not be read.', saveError: 'Nothing was saved.',
-  removed: 'Removed.', undo: 'Undo', restored: 'Restored.', tooLate: 'Too late to undo.', drop: 'Drop it',
+  removed: 'Removed.', undo: 'Undo', restored: 'Restored.', tooLate: 'Too late to undo.', drop: 'Drop',
   reassigned: (n) => (n === 1 ? '1 item now has no job.' : `${n} items now have no job.`),
   progress: (d, t) => `${d} of ${t} done`,
   jobLine: (j) => `When ${j.when}, I want ${j.want}, so ${j.so}.`,
   lens: {
-    triage: (n) => `${n} to triage`, today: (n) => `${n} committed today`, week: (n) => `${n} land in the next 7 days`,
-    waiting: (n) => `${n} waiting on others`, later: (n) => `${n} for later`,
+    inbox: (n) => `${n} to decide`, today: (n) => `${n} for today`, upcoming: (n) => `${n} in the days ahead`,
+    waiting: (n) => `${n} waiting on others`, someday: (n) => `${n} parked in Someday`, review: (n) => `${n} to review this week`,
   },
   lensSub: {
-    triage: 'No date and nobody to wait on. Give each one a date, or park it.', today: 'Due today or overdue.',
-    week: 'Due in the next 7 days.', waiting: 'Someone else must act first.', later: 'Dated further out.',
+    inbox: 'Captured, not decided. Give each one a day, a Not before date, a person to wait on, or park it in Someday.',
+    today: 'Overdue, due today and flagged. Focus says which jobs matter most today.',
+    upcoming: 'The next 7 days by day, then Later. A Not before date keeps an item out of Today until that day.',
+    waiting: 'Someone else must act first.',
+    someday: 'Parked on purpose. Nothing here asks for attention until the weekly Review.',
+    review: 'Items in Inbox, Waiting or Someday that nobody touched for 7 days, most stale first. Keep, change or drop each one.',
   },
-  done: 'Done', park: 'Park', doneToast: 'Marked done.', parkToast: 'Parked in Later.', steps: 'Steps', noSteps: 'No steps yet.', addStep: 'Add a step',
+  emptyView: {
+    inbox: 'Inbox is empty. Capture anything that crosses your mind.', today: 'Nothing due, overdue or flagged. Pick from Upcoming when you are ready.',
+    upcoming: 'Nothing dated in the days ahead.', waiting: 'Nobody owes you anything right now.', someday: 'Nothing parked.',
+  },
+  done: 'Done', doneToast: 'Marked done.', steps: 'Steps', noSteps: 'No steps yet.', addStep: 'Add a step',
   who: { you: 'You', 'agent-drafts': 'Agent drafts', 'agent-does': 'Agent does' },
   whoOutward: 'Sends to a person: the agent drafts, you slide to send.', options: 'Options', plan: 'Plan the steps',
+  /* Focus (PRD R4) */
+  focus: 'Focus', focusSub: 'Up to three jobs for today, each with the reason.', focusNone: 'No focus suggested for today. Everything below still counts.',
+  focusPinned: 'Focus today', focusSuggested: 'Suggested', accept: 'Accept', editTitle: 'Edit title', notToday: 'Not today', unpin: 'Unpin', save: 'Save', cancel: 'Cancel',
+  why: (w) => 'Why: ' + w, focusAccepted: 'Pinned to Today.', focusDismissed: 'Not today. It does not come back today.', focusCleared: 'Unpinned.',
+  /* offline work and the shared actions (PRD R6) */
+  offline: 'outside PMOS', offlineNote: (p) => 'Happens outside PMOS' + (p ? ', with ' + p : '') + '. Tell PMOS how it went.',
+  outcome: 'What came out of it (optional)', notYet: 'Not yet:', laterToday: 'Later today', tomorrow: 'Tomorrow', nextWeek: 'Next week',
+  looksDone: 'Looks done?', confirm: 'Confirm done', flag: 'Flag', unflag: 'Unflag', notBefore: 'Not before', someday: 'Someday', bringBack: 'Bring back',
+  waitingField: 'Waiting on', waitingWho: 'Who?', stopWaiting: 'Stop waiting', flagged: 'Flagged',
+  notBeforeChip: (d) => 'Not before ' + d, advances: (t) => 'Advances: ' + t, moved: (n) => (n === 1 ? 'Moved once' : `Moved ${n} times`),
+  overdue: (n) => (n === 1 ? '1 day overdue' : `${n} days overdue`),
+  /* Review (PRD R7) */
+  reviewHead: 'Weekly review', keep: 'Keep', change: 'Change', next: 'Done changing, next', reviewDone: 'Review done',
+  reviewDoneText: (n) => `You looked at ${n} item${n === 1 ? '' : 's'}. Anything you changed or dropped has moved to its new view.`,
+  reviewNone: 'Nothing waits for review. Every item was touched in the last 7 days.', again: 'Start another pass',
+  untouched: (n) => `Untouched for ${n} days`, livesIn: (v) => 'Lives in ' + v, upNext: 'Up next: ',
+  kept: 'Kept. It comes back if nobody touches it for another week.',
 });
 const insts = new WeakMap();
 
@@ -135,37 +169,37 @@ const say = toast;
 
 /* ── the demo overlay ────────────────────────────────────────────────────────────────────────────────────────────── *
  * In /c3.html?demo=1 every write is answered { ok: true } and the fixtures never change, so the page keeps what the PM did in
- * memory (`inst.ov`) and lays it over each read. Real mode has no overlay: the server is the truth and every press re-reads. */
+ * memory (`inst.ov`) and lays it over each read, then places the items with the server's rule (work-place.js). Real mode has no
+ * overlay: the server places every item and every press re-reads. */
 const DEMO = () => typeof window !== 'undefined' && !!window.__c3demo;
-const newOv = () => ({ done: new Set(), gone: new Set(), lens: new Map(), edits: new Map(), added: [], steps: new Map(), who: new Map(), jobsAdded: [], jobEdits: new Map(), jobsGone: new Map(), seq: 0 });
-const LENS_IDS = LENSES.map((l) => l[0]);
+const newOv = () => ({ done: new Set(), gone: new Set(), edits: new Map(), added: [], steps: new Map(), who: new Map(), focus: new Map(), jobsAdded: [], jobEdits: new Map(), jobsGone: new Map(), seq: 0 });
 
 function applyOv(base, ov) {
   const d = JSON.parse(JSON.stringify(base));
-  const home = {};
-  LENS_IDS.forEach((l) => (d.lists[l] || []).forEach((i) => { home[i.id] = l; }));
-  const added = ov.added.map((a) => { home[a.item.id] = a.lens; return a.item; }).reverse();
   const jobOfItem = {};
-  let items = [...added, ...(d.items || [])].filter((i) => !ov.gone.has(i.id));
   const wasDone = new Set((d.items || []).filter((i) => i.done).map((i) => i.id));
-  items = items.map((i) => {
+  const items = [...ov.added.slice().reverse(), ...(d.items || [])].filter((i) => !ov.gone.has(i.id)).map((i) => {
     const m = { ...i, ...(ov.edits.get(i.id) || {}) };
     m.done = !!(i.done || ov.done.has(i.id));
     m.steps = [...(i.steps || []), ...(ov.steps.get(i.id) || [])].map((s) => (ov.who.has(s.id) ? { ...s, who: ov.who.get(s.id) } : s));
     jobOfItem[m.id] = m.job;
     return m;
   });
-  const lists = {}; LENS_IDS.forEach((l) => { lists[l] = []; });
-  items.forEach((i) => { const l = ov.lens.get(i.id) || home[i.id] || 'triage'; (lists[l] || lists.triage).push(i); });
-  /* The mockup's Today (console3.html wItems, line 3215) is the work set for today AND the inbox items due today: an item due today shows in both lenses. */
-  const dueToday = (i) => String(i.kind || '').toLowerCase() !== 'fyi' && ((i.due && i.due === d.today) || /^(\d\d:\d\d|today)$/.test(i.time || ''));
-  lists.triage.filter((i) => !i.done && dueToday(i) && !lists.today.includes(i)).forEach((i) => lists.today.push(i));
-  d.items = items; d.lists = lists;
-  if (d.noise) d.noise = d.noise.filter((n) => !ov.done.has(n.id || 'noise-' + String(n.title).toLowerCase().replace(/[^a-z0-9]+/g, '-')));
+  const placed = buildWork(items, d.today, d.review_days || REVIEW_DAYS);
+  d.items = items; d.work = placed.work; d.review = placed.review; d.counts = placed.counts;
+  /* Focus: an accept pins, a dismiss hides for the day, a clear undoes either; a suggestion whose items are all closed goes */
+  const F = d.focus || { suggestions: [], accepted: [] };
+  const open = new Set(items.filter((i) => !i.done).map((i) => i.id));
+  const live = (f) => !(f.item_ids || []).length || f.item_ids.some((id) => open.has(id));
+  const st = (k) => ov.focus.get(k);
+  d.focus = {
+    accepted: [...(F.accepted || []).filter((a) => !st(a.key)), ...[...ov.focus.values()].filter((x) => x.state === 'acc').map((x) => x.f)],
+    suggestions: (F.suggestions || []).filter((s) => (!st(s.key) || st(s.key).state === 'clear') && live(s)).slice(0, 3),
+  };
   const jobs = [...(d.jobs || []), ...ov.jobsAdded].filter((j) => !ov.jobsGone.has(j.id)).map((j) => ({ ...j, ...(ov.jobEdits.get(j.id) || {}) }));
   jobs.forEach((j) => {
     j.done = (j.done || 0) + [...ov.done].filter((id) => !wasDone.has(id) && jobOfItem[id] === j.id).length;
-    j.total = (j.total || 0) + ov.added.filter((a) => a.item.job === j.id).length;
+    j.total = (j.total || 0) + ov.added.filter((a) => a.job === j.id).length;
   });
   d.jobs = jobs;
   return d;
@@ -176,21 +210,30 @@ function applyLocal(inst, path, body, r) {
   const ov = inst.ov; const id = body && body.id;
   const today = (inst.base && inst.base.today) || iso(new Date());
   const cur = id && ((inst.data && inst.data.items) || []).find((i) => i.id === id);
+  const now = new Date().toISOString();
+  const edit = (f) => ov.edits.set(id, { ...(ov.edits.get(id) || {}), ...(f || {}), touched_at: now });   // the server stamps touched_at on every event
   switch (path.replace(API, '').replace(JOBS, '/job')) {
-    case '/done': ov.done.add(id); break;
-    case '/reopen': ov.done.delete(id); break;
-    case '/park': ov.lens.set(id, 'later'); break;
-    case '/unpark': ov.lens.delete(id); break;
-    case '/move': ov.lens.set(id, body.list); break;
-    case '/edit': {
-      ov.edits.set(id, { ...(ov.edits.get(id) || {}), ...body.fields });
-      if (cur && ('due' in body.fields || 'waiting_on' in body.fields)) ov.lens.set(id, lensOf({ ...cur, ...body.fields }, today));
+    case '/done': ov.done.add(id); edit(body.outcome ? { outcome: body.outcome } : {}); break;
+    case '/reopen': ov.done.delete(id); edit(); break;
+    case '/park': case '/someday': edit({ parked: true }); break;
+    case '/unpark': edit({ parked: false }); break;
+    case '/edit': edit(body.fields); break;
+    case '/flag': edit({ flagged: !!body.flagged }); break;
+    case '/defer': edit({ defer: body.until || null }); break;
+    case '/waiting': edit({ waiting_on: body.on || null }); break;
+    case '/notyet': {
+      const n = body.when === 'tomorrow' ? 1 : body.when === 'next-week' ? 7 : 0;
+      edit({ not_yet_count: ((cur && cur.not_yet_count) || 0) + 1, ...(n ? { defer: (r && r.defer) || addIso(today, n) } : {}) });
       break;
     }
+    case '/keep': edit(); break;
+    case '/focus/accept': ov.focus.set(body.key, { state: 'acc', f: { key: body.key, title: body.title, why: body.why, item_ids: body.item_ids || [], job: body.job || null } }); break;
+    case '/focus/dismiss': ov.focus.set(body.key, { state: 'no' }); break;
+    case '/focus/clear': ov.focus.set(body.key, { state: 'clear' }); break;
     case '/add': {
       const p = previewParse(body.line, today);
-      const item = { ...(r.item || {}), id: (r.item && r.item.id) || 'item-demo-add' + (++ov.seq), title: p.title || String(body.line), due: p.due, priority: p.priority, waiting_on: p.waiting_on, job: null, steps: [], created_at: today + 'T05:00:00.000Z' };
-      ov.added.push({ item, lens: lensOf(p, today) });
+      const item = { ...(r.item || {}), id: (r.item && r.item.id) || 'item-demo-add' + (++ov.seq), title: p.title || String(body.line), due: p.due, priority: p.priority, waiting_on: p.waiting_on, job: null, steps: [], created_at: now, touched_at: now };
+      ov.added.push(item);
       r.item = item;
       break;
     }
@@ -199,7 +242,6 @@ function applyLocal(inst, path, body, r) {
     case '/steps/add': { const l = ov.steps.get(id) || []; l.push({ id: 'step-demo' + (++ov.seq), text: body.text, who: 'you', done: false }); ov.steps.set(id, l); break; }
     case '/steps/who': ov.who.set(body.step_id, body.who); break;
     case '/steps/plan': {
-      const t = (cur && cur.title) || 'the item';
       const l = ov.steps.get(id) || [];
       [['Read the item and what it links to', 'agent-does'], ['Draft the first pass or the message', 'agent-drafts'], ['Check it and decide', 'you']].forEach(([text, who]) => l.push({ id: 'step-demo' + (++ov.seq), text, who, done: false }));
       ov.steps.set(id, l);
@@ -227,8 +269,9 @@ export function mountPmWork(host, ctx) {
   if (inst) return;
   if (ctx && ctx.FIXTURE) return;
   ensureC3Css();
-  inst = { host, ctx: ctx || {}, root: el('div', { class: 'c3 calwrap', 'data-pm-work': '' }), data: null, base: null, ov: newOv(), lens: 'triage', group: false,
-    opens: new Set(), picks: new Map(), editing: new Set(), planning: new Set(), runs: new Map(), trays: new Set(), cases: new Set(), timers: new Set(), hidden: new Set(), jobNew: null, jobForm: false };
+  inst = { host, ctx: ctx || {}, root: el('div', { class: 'c3 calwrap', 'data-pm-work': '' }), data: null, base: null, ov: newOv(), lens: 'today', group: false,
+    opens: new Set(), picks: new Map(), editing: new Set(), planning: new Set(), runs: new Map(), trays: new Set(), cases: new Set(), timers: new Set(), hidden: new Set(), jobNew: null, jobForm: false,
+    focEdit: new Set(), rv: { ids: null, handled: new Set(), changing: false } };
   inst.body = el('div', { class: 'calbody pmw-body' });
   inst.bar = el('div', { class: 'calbar' });
   inst.addBox = addLine(inst);
@@ -236,6 +279,7 @@ export function mountPmWork(host, ctx) {
   inst.stopPhone = c3Phone(inst.root);
   insts.set(host, inst);
   host.appendChild(inst.root);
+  if (inst.ctx.onLens) inst.ctx.onLens(inst.lens);   // the page's deck follows the view the page opens on
   load(inst);
 }
 
@@ -286,18 +330,34 @@ async function act(inst, rowEl, spec) {
 }
 
 const undoBy = (inst, route, body) => async () => !!(await press(inst, API + route, body, { quiet: true }));
+/* Does the change move the item out of the view on screen? Then its row leaves; otherwise it stays and redraws. */
+const leaves = (inst, item, patch) => inst.lens === 'review' || workPlace({ ...item, ...patch }, inst.data.today) !== inst.lens;
 
-const doneAct = (inst, item, row, text) => act(inst, row, { route: '/done', body: { id: item.id }, text: text || COPY.doneToast, undo: undoBy(inst, '/reopen', { id: item.id }) });
-const parkAct = (inst, item, row, text) => act(inst, row, { route: '/park', body: { id: item.id }, text: text || COPY.parkToast, undo: undoBy(inst, '/unpark', { id: item.id }) });
-const moveAct = (inst, item, row, list, text) => {
-  const back = lensOfItem(inst, item.id);
-  return act(inst, row, { route: '/move', body: { id: item.id, list }, text, undo: undoBy(inst, '/move', { id: item.id, list: back }) });
-};
-const dueAct = (inst, item, row, due, text) => act(inst, row, { route: '/edit', body: { id: item.id, fields: { due } }, text, undo: undoBy(inst, '/edit', { id: item.id, fields: { due: item.due || null } }) });
+const doneAct = (inst, item, row, text, outcome) => act(inst, row, { route: '/done', body: outcome ? { id: item.id, outcome } : { id: item.id }, text: text || COPY.doneToast, undo: undoBy(inst, '/reopen', { id: item.id }) });
 const dropAct = (inst, item, row) => act(inst, row, { route: '/remove', body: { id: item.id }, text: COPY.removed, undo: undoBy(inst, '/undo', { id: item.id }) });
+const todayAct = (inst, item, row) => act(inst, row, { route: '/edit', body: { id: item.id, fields: { due: inst.data.today, defer: null } }, text: 'In Today.',
+  undo: undoBy(inst, '/edit', { id: item.id, fields: { due: item.due || null, defer: item.defer || null } }), leave: leaves(inst, item, { due: inst.data.today, defer: null }) });
+const flagAct = (inst, item, row) => { const on = !item.flagged; return act(inst, row, { route: '/flag', body: { id: item.id, flagged: on }, text: on ? 'Flagged for today.' : 'Unflagged.', undo: undoBy(inst, '/flag', { id: item.id, flagged: !on }), leave: leaves(inst, item, { flagged: on }) }); };
+const deferAct = (inst, item, row, until) => act(inst, row, { route: '/defer', body: { id: item.id, until }, text: until ? COPY.notBeforeChip(dayLabel(until)) + '.' : 'Not before cleared.',
+  undo: undoBy(inst, '/defer', { id: item.id, until: item.defer || null }), leave: leaves(inst, item, { defer: until }) });
+const somedayAct = (inst, item, row) => act(inst, row, { route: '/someday', body: { id: item.id }, text: 'Parked in Someday.', undo: undoBy(inst, '/unpark', { id: item.id }), leave: leaves(inst, item, { parked: true }) });
+const unparkAct = (inst, item, row) => act(inst, row, { route: '/unpark', body: { id: item.id }, text: 'Back from Someday.', undo: undoBy(inst, '/someday', { id: item.id }), leave: leaves(inst, item, { parked: false }) });
+const waitAct = (inst, item, row, on) => act(inst, row, { route: '/waiting', body: { id: item.id, on }, text: on ? 'Waiting on ' + on + '.' : 'No longer waiting.',
+  undo: undoBy(inst, '/waiting', { id: item.id, on: item.waiting_on || null }), leave: leaves(inst, item, { waiting_on: on }) });
+function notYetAct(inst, item, row, when) {
+  const today = inst.data.today; const n = when === 'tomorrow' ? 1 : when === 'next-week' ? 7 : 0;
+  return act(inst, row, { route: '/notyet', body: { id: item.id, when }, text: n ? 'Not yet. Back in Today on ' + dayLabel(addIso(today, n)) + '.' : 'Not yet. It stays in Today for later.',
+    undo: undoBy(inst, '/defer', { id: item.id, until: item.defer || null }), leave: n ? leaves(inst, item, { defer: addIso(today, n) }) : false });
+}
+
+/* Focus (PRD R4): accept pins a job to Today, Not today hides it for the day, Unpin takes it back; each offers Undo. */
+const focusBody = (f) => ({ key: f.key, title: f.title, why: f.why, item_ids: f.item_ids || [], ...(f.job ? { job: f.job } : {}) });
+const focusAccept = (inst, f) => { inst.focEdit.delete(f.key); return act(inst, null, { route: '/focus/accept', body: focusBody(f), text: COPY.focusAccepted, undo: undoBy(inst, '/focus/clear', { key: f.key }), leave: false }); };
+const focusDismiss = (inst, f) => act(inst, null, { route: '/focus/dismiss', body: { key: f.key }, text: COPY.focusDismissed, undo: undoBy(inst, '/focus/clear', { key: f.key }), leave: false });
+const focusClear = (inst, f) => act(inst, null, { route: '/focus/clear', body: { key: f.key }, text: COPY.focusCleared, undo: undoBy(inst, '/focus/accept', focusBody(f)), leave: false });
 
 function lensOfItem(inst, id) {
-  for (const l of LENS_IDS) if ((lists(inst)[l] || []).some((i) => i.id === id)) return l;
+  for (const l of VIEWS) if ((views(inst)[l] || []).some((i) => i.id === id)) return l;
   return inst.lens;
 }
 
@@ -319,9 +379,8 @@ function planSteps(inst, item) {
 const DAYS = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
 const MON = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
 const iso = (d) => d.toISOString().slice(0, 10);
-const addIso = (s, n) => { const d = new Date(s + 'T00:00:00Z'); d.setUTCDate(d.getUTCDate() + n); return iso(d); };
 const nextMonday = (s) => { const d = new Date(s + 'T00:00:00Z'); return addIso(s, ((8 - d.getUTCDay()) % 7) || 7); };
-const dayLabel = (s) => { const d = new Date(s + 'T00:00:00Z'); return DAYS[d.getUTCDay()].slice(0, 1).toUpperCase() + DAYS[d.getUTCDay()].slice(1, 3) + ' ' + d.getUTCDate() + ' ' + MON[d.getUTCMonth()]; };
+const dayLabel = (s) => { const d = new Date(String(s).slice(0, 10) + 'T00:00:00Z'); return DAYS[d.getUTCDay()].slice(0, 1).toUpperCase() + DAYS[d.getUTCDay()].slice(1, 3) + ' ' + d.getUTCDate() + ' ' + MON[d.getUTCMonth()]; };
 
 function previewParse(text, todayIso) {
   let rest = String(text || '').trim();
@@ -346,24 +405,16 @@ function previewParse(text, todayIso) {
   return out;
 }
 
-function lensOf(o, todayIso) {
-  if (o.waiting_on) return 'waiting';
-  if (!o.due) return 'triage';
-  if (o.due <= todayIso) return 'today';
-  const w = new Date(todayIso + 'T00:00:00Z'); w.setUTCDate(w.getUTCDate() + 7);
-  return o.due <= iso(w) ? 'week' : 'later';
-}
-
 const labelOf = (id) => (LENSES.find((l) => l[0] === id) || [])[1] || id;
 const small = 'font-size:var(--fs-2)';
 
-/* The mockup's c3prev(): "adds to", a .tag, then .chip2 / .fl / .st chips (console3.html line 4573). */
+/* The mockup's c3prev(): "adds to", a .tag with the view the server will place the line in (PRD R2), then .chip2 / .fl / .st chips. */
 function previewChips(inst, text) {
   const today = (inst.data && inst.data.today) || iso(new Date());
   if (!text.trim()) return [el('span', { class: 'dim mono', style: small }, COPY.hint)];
   const o = previewParse(text, today);
   if (!o.title) return [el('span', { class: 'dim mono', style: small }, 'The line needs a title.')];
-  const out = [el('span', { class: 'dim mono', style: small }, COPY.addsTo), el('span', { class: 'tag' }, labelOf(lensOf(o, today)))];
+  const out = [el('span', { class: 'dim mono wk-sm' }, COPY.addsTo), el('span', { class: 'tag', 'data-pm-lands': workPlace(o, today) }, labelOf(workPlace(o, today)))];
   if (o.due) out.push(el('span', { class: 'chip2' }, c3ic('cal', 'sm'), o.due));
   if (o.priority) out.push(el('span', { class: 'fl ' + o.priority.toLowerCase() }, o.priority));
   if (o.waiting_on) out.push(el('span', { class: 'chip2' }, c3ic('wait', 'sm'), COPY.waitingOn(o.waiting_on)));
@@ -379,12 +430,12 @@ function addLine(inst) {
   const send = async () => {
     const line = input.value.trim();
     if (!line) return;
-    const before = inst.data && inst.data.today;
-    const o = previewParse(line, before || iso(new Date()));
+    const before = (inst.data && inst.data.today) || iso(new Date());
+    const o = previewParse(line, before);
     const r = await press(inst, API + '/add', { line }, { quiet: true });
     if (!r) return;
     input.value = ''; chips.replaceChildren(...previewChips(inst, ''));
-    inst.lens = lensOf(o, before || iso(new Date())); if (inst.ctx.onLens) inst.ctx.onLens(inst.lens); inst.group = false;
+    inst.lens = workPlace(o, before); if (inst.ctx.onLens) inst.ctx.onLens(inst.lens); inst.group = false;
     if (r.item) inst.opens.add(r.item.id);
     say({ text: 'Added to ' + labelOf(inst.lens), timeout: r.undo_ms || 6000, actionLabel: COPY.undo, onAction: async () => { if (r.item) await press(inst, API + '/remove', { id: r.item.id }, { quiet: true }); await load(inst); } });
     await load(inst);
@@ -402,11 +453,28 @@ function addLine(inst) {
 /* ── rows and the case file ──────────────────────────────────────────────────────────────────────────────────────── */
 
 const jobById = (inst, id) => (inst.data.jobs || []).find((j) => j.id === id);
-const lists = (inst) => inst.data.lists || {};
-const shown = (inst, id) => (lists(inst)[id] || []).filter((i) => !inst.hidden.has(i.id) && !i.done);
+/* The five places, as the server answers them (`work`). An older server that sends only `lists` is read through the same five names. */
+function views(inst) {
+  const d = inst.data || {};
+  if (d.work) return d.work;
+  const L = d.lists || {};
+  return { inbox: L.triage || [], today: L.today || [], upcoming: [...(L.week || []), ...(L.later || []).filter((i) => !i.parked)], waiting: L.waiting || [], someday: (L.later || []).filter((i) => i.parked) };
+}
+const shown = (inst, id) => ((id === 'review' ? (inst.data || {}).review : views(inst)[id]) || []).filter((i) => !inst.hidden.has(i.id) && !i.done);
+const countOf = (inst, id) => { const c = (inst.data || {}).counts; return c && typeof c[id] === 'number' ? c[id] : shown(inst, id).length; };
+const itemById = (inst, id) => ((inst.data && inst.data.items) || []).find((i) => i.id === id)
+  || [...VIEWS.map((v) => views(inst)[v] || []).flat(), ...((inst.data && inst.data.review) || [])].find((i) => i.id === id);
+/* The title of the team task a Work item advances (PRD R8): the item's own copy, then a map the answer may carry, else the id. */
+const resolvesTitle = (inst, item) => item.resolves_title || ((inst.data && inst.data.resolves_titles) || {})[item.resolves] || item.resolves;
 
 /* The mockup's .c3jf: a label (.dim.mono) and an input on one line (console3.html line 4651). */
 function field(label, input) { return el('label', null, el('span', { class: 'dim mono' }, label), input); }
+/* A text button of the Work page (the mockup's .pill). */
+function pill(label, icon, attrs) {
+  const b = button({ label, variant: 'ghost', attrs: { ...(attrs || {}), class: 'pill' } });
+  if (icon) b.prepend(c3ic(icon, 'sm'));
+  return b;
+}
 
 function editField(inst, item, label, shortLabel, kind, key, value) {
   const input = el(kind === 'select' ? 'select' : 'input', { 'aria-label': label, 'data-pm-edit': item.id + ':' + key, ...(kind === 'date' ? { type: 'date' } : kind === 'text' ? { type: 'text' } : {}) });
@@ -426,6 +494,15 @@ function editField(inst, item, label, shortLabel, kind, key, value) {
   return field(shortLabel, input);
 }
 
+/* The editable fields of an item (title, due, not before, priority, waiting on, job): in the case file behind "Edit details", and Review's Change. */
+const editForm = (inst, item) => el('div', { class: 'c3jf', 'data-pm-edit-form': item.id },
+  editField(inst, item, 'Title', 'Title', 'text', 'title', item.title),
+  editField(inst, item, 'Due', 'Due', 'date', 'due', item.due),
+  editField(inst, item, COPY.notBefore, COPY.notBefore, 'date', 'defer', item.defer),
+  editField(inst, item, 'Priority', 'Priority', 'select', 'priority', item.priority),
+  editField(inst, item, 'Waiting on', 'Waiting', 'text', 'waiting_on', item.waiting_on),
+  editField(inst, item, 'Job', 'Job', 'select', 'job', item.job));
+
 /* The mockup's c3stepsHtml(): .c3steps > .c3sh + ul > li (.c3sg, .c3stt, .chips2 with the who pill) + an add input (line 4595). */
 function stepsBlock(inst, item) {
   if (inst.planning.has(item.id)) return el('div', { class: 'fold a', 'data-pm-planning': item.id, role: 'status' }, c3ic('spark', 'sm'), 'The agent is reading the item and planning the steps');
@@ -452,48 +529,78 @@ function stepsBlock(inst, item) {
     el('div', { class: 'form' }, input));
 }
 
+/* ── the shared actions and offline work (PRD R6) ──────────────────────────────────────────────────────────────────── */
+
+const rowOf = (inst, item) => inst.root.querySelector('[data-pm-item="' + item.id + '"]');
+
+/** Flag, Not before, Someday, Waiting and Drop: every item has them in its case file. Each goes through act(), so each offers Undo. */
+function quickActs(inst, item, { noDrop } = {}) {
+  const today = inst.data.today;
+  const date = el('input', { type: 'date', 'aria-label': COPY.notBefore, 'data-pm-defer': item.id, min: addIso(today, 1) });
+  date.value = item.defer && item.defer > today ? item.defer : '';
+  date.addEventListener('change', () => { if (date.value && date.value !== item.defer) deferAct(inst, item, rowOf(inst, item), date.value); });
+  const who = el('input', { type: 'text', placeholder: COPY.waitingWho, 'aria-label': COPY.waitingField, 'data-pm-wait-on': item.id, autocomplete: 'off' });
+  who.addEventListener('keydown', (e) => { if (e.key === 'Enter' && !e.isComposing && who.value.trim()) waitAct(inst, item, rowOf(inst, item), who.value.trim()); });
+  return el('div', { class: 'wkq', 'data-pm-quick': item.id },
+    pill(item.flagged ? COPY.unflag : COPY.flag, 'flag', { 'data-pm-flag': item.id, 'aria-pressed': String(!!item.flagged), onclick: () => flagAct(inst, item, rowOf(inst, item)) }),
+    el('label', { class: 'wkq-f' }, el('span', { class: 'dim mono' }, COPY.notBefore), date),
+    item.parked ? pill(COPY.bringBack, 'sun', { 'data-pm-unpark': item.id, onclick: () => unparkAct(inst, item, rowOf(inst, item)) })
+      : pill(COPY.someday, 'moon', { 'data-pm-someday': item.id, onclick: () => somedayAct(inst, item, rowOf(inst, item)) }),
+    item.waiting_on ? pill(COPY.stopWaiting, 'wait', { 'data-pm-unwait': item.id, onclick: () => waitAct(inst, item, rowOf(inst, item), null) })
+      : el('label', { class: 'wkq-f' }, el('span', { class: 'dim mono' }, COPY.waitingField), who),
+    noDrop ? null : pill(COPY.drop, 'trash', { 'data-pm-drop': item.id, onclick: () => dropAct(inst, item, rowOf(inst, item)) }));
+}
+
+/** An item done outside PMOS: who it involves, Done with an optional outcome, Not yet, Drop, and "Looks done?" when there is proof.
+ *  PMOS never closes it by itself: Confirm is the PM's press. */
+function offlineBlock(inst, item) {
+  const out = el('input', { type: 'text', placeholder: COPY.outcome, 'aria-label': COPY.outcome, 'data-pm-outcome': item.id, autocomplete: 'off' });
+  const doneNow = () => { const v = out.value.trim(); return doneAct(inst, item, rowOf(inst, item), v ? 'Done. The outcome is saved.' : 'Done.', v || undefined); };
+  out.addEventListener('keydown', (e) => { if (e.key === 'Enter' && !e.isComposing) doneNow(); });
+  return el('div', { class: 'wkoff', 'data-pm-offline': item.id },
+    el('p', { class: 'wkoff-n' }, c3ic('user', 'sm'), COPY.offlineNote(item.person)),
+    item.evidence ? el('div', { class: 'wkev', 'data-pm-evidence': item.id }, c3ic('eye', 'sm'), el('span', { class: 'wk-min' }, el('b', null, COPY.looksDone + ' '), item.evidence),
+      pill(COPY.confirm, 'check', { class: 'pill pri', 'data-pm-confirm': item.id, onclick: () => doneAct(inst, item, rowOf(inst, item), 'Done. You confirmed it.') })) : null,
+    el('div', { class: 'wkq' }, el('span', { class: 'form wkoff-o' }, out), pill(COPY.done, 'check', { class: 'pill pri', 'data-pm-offline-done': item.id, onclick: doneNow })),
+    el('div', { class: 'wkq' }, el('span', { class: 'dim mono' }, COPY.notYet),
+      ...[['later-today', COPY.laterToday], ['tomorrow', COPY.tomorrow], ['next-week', COPY.nextWeek]].map(([w, l]) => pill(l, null, { 'data-pm-notyet': w, onclick: () => notYetAct(inst, item, rowOf(inst, item), w) })),
+      pill(COPY.drop, 'trash', { 'data-pm-drop': item.id, onclick: () => dropAct(inst, item, rowOf(inst, item)) })));
+}
+
 /* ── the case model of one item (console3.html genTask line 3216, agDecor line 5126) ─────────────────────────────────────────── */
 
 const OUT_REASON = 'No channel connected, so this stays a draft. Nothing is sent.';
 const fx = (...a) => a;
 
-/** The options of an item by its list. Each: { id, l, rec, fx, outward, run(inst, item, row) } where run does the work through a press route. */
+/** The options of an item by its view. Each: { id, l, rec, fx, outward, run(row) } where run does the work through a press route.
+ *  An offline item has none: it acts through its own block (Done, Not yet, Looks done). */
 function lensOptions(inst, item, lens) {
-  const mock = item.mock_row === true; const q = mock && item.mins <= 2; const who = item.waiting_on || 'them';
-  const today = inst.data.today; const mon = nextMonday(today);
+  const who = item.waiting_on || 'them';
+  const today = inst.data.today; const tom = addIso(today, 1); const mon = nextMonday(today);
   const o = (id, l, rec, f, run, extra) => ({ id, l, rec: !!rec, fx: f, run, ...(extra || {}) });
-  const nowO = (rec) => o('now', q ? 'Do it now: the agent drafts, you send' : (mock ? 'Do it now' : 'Mark it done'), rec, q ? [fx('bolt', 'Under 2 minutes', 'ok')] : [fx('clock', mock && item.mins ? 'Takes ' + item.mins + ' min' : 'Closes the item', mock ? 'warn' : 'ok')], (r) => doneAct(inst, item, r, q ? 'Done. Anything outward stays a draft for you to send.' : 'Done.'));
-  const todayO = (rec) => o('today', mock ? (q ? 'Put it in Today' : 'Put it in Today and block time') : 'Put it in Today', rec, mock && !q ? [fx('check', 'Gets a slot', 'ok')] : [fx('check', 'Moves to your Today list', 'ok')], (r) => moveAct(inst, item, r, 'today', 'In Today.'));
-  const schedO = () => o('sched', 'Schedule for ' + dayLabel(mon), 0, [fx('cal', 'Out of today', 'ok')], (r) => dueAct(inst, item, r, mon, 'Scheduled for ' + dayLabel(mon) + '.'));
+  if (item.kind === 'offline') return { conf: 0, cta: '', opts: [] };
+  const doneO = (rec) => o('done', 'Mark it done', rec, [fx('check', 'Closes the item', 'ok')], (r) => doneAct(inst, item, r, 'Done.'));
+  const todayO = (rec) => o('today', 'Do it today', rec, [fx('sun', 'Moves to Today', 'ok')], (r) => todayAct(inst, item, r));
+  const deferO = (d, rec) => o('defer-' + d, COPY.notBeforeChip(dayLabel(d)), rec, [fx('moon', 'Out of Today until then')], (r) => deferAct(inst, item, r, d));
+  const somedayO = () => o('someday', 'Park it in Someday', 0, [fx('moon', 'Back in the weekly Review')], (r) => somedayAct(inst, item, r));
   const dropO = () => o('drop', 'Drop it', 0, [fx('x', 'Gone, with Undo', 'warn')], (r) => dropAct(inst, item, r));
   if (lens === 'waiting') {
     return { conf: 80, cta: 'Slide to nudge', sit: 'Waiting on ' + who + '. ' + (item.why || 'No reply yet.'), opts: [
       o('nudge', 'Nudge ' + who + ' now (drafted)', 1, [fx('out', 'Goes to Review first', 'ok')], null, { outward: true }),
-      o('esc', 'Escalate to their lead', 0, [fx('alert', 'Stronger signal', 'warn')], null, { outward: true }),
+      o('unwait', 'Stop waiting: it is yours again', 0, [fx('check', 'Leaves Waiting', 'ok')], (r) => waitAct(inst, item, r, null)),
       o('wait', 'Keep waiting', 0, [fx('clock', 'Ages another day', 'warn')], () => say({ text: 'Still waiting.', timeout: 2500 })),
     ] };
   }
-  if (lens === 'later') return { conf: 66, cta: 'Slide to promote', sit: 'Parked for later. Nothing is due, so it only matters if it has a date.', opts: [
-    o('promo', 'Promote to this week', 1, [fx('check', 'Gets a date', 'ok')], (r) => moveAct(inst, item, r, 'week', 'Moved to Week.')), dropO()] };
-  if (lens === 'week') return { conf: 70, cta: 'Slide to keep the date', opts: [
-    o('today', 'Bring it into Today', 0, [fx('clock', 'Earlier than planned', 'warn')], (r) => moveAct(inst, item, r, 'today', 'In Today.')),
-    o('keep', 'Keep the date', 1, [fx('check', 'On plan', 'ok')], () => say({ text: 'Kept.', timeout: 2500 })),
-    o('later', 'Move to Later', 0, [fx('moon', 'No date')], (r) => moveAct(inst, item, r, 'later', 'Moved to Later.'))] };
-  if (lens === 'today') return { conf: 82, cta: 'Slide to finish', opts: [nowO(1),
-    o('mig', 'Migrate to tomorrow', 0, [fx('moon', 'Back tomorrow 09:00', 'warn')], (r) => dueAct(inst, item, r, addIso(today, 1), 'Migrated to tomorrow.')), schedO()] };
-  return { conf: q ? 90 : 78, cta: q ? 'Slide to do it now' : 'Slide to commit', opts: q ? [nowO(1), todayO(0), schedO(), dropO()] : [todayO(1), nowO(0), schedO(), dropO()] };
+  if (lens === 'someday') return { conf: 66, cta: 'Slide to bring it back', sit: 'Parked on purpose. It only matters again when you give it a date.', opts: [
+    o('back', 'Bring it back', 1, [fx('check', 'Placed by its dates again', 'ok')], (r) => unparkAct(inst, item, r)), dropO()] };
+  if (lens === 'upcoming') return { conf: 70, cta: 'Slide to keep the date', opts: [
+    o('keep', 'Keep the date', 1, [fx('check', 'On plan', 'ok')], () => say({ text: 'Kept.', timeout: 2500 })), todayO(0), somedayO()] };
+  if (lens === 'today') return { conf: 82, cta: 'Slide to finish', opts: [doneO(1), deferO(tom, 0), deferO(mon, 0)] };
+  return { conf: 78, cta: 'Slide to decide', opts: [todayO(1), deferO(mon, 0), somedayO(), dropO()] };
 }
 
 /** { model, run } for an item: the model goes to renderCase(), `run(id, row)` does what the picked option says. */
 function itemCase(inst, item, lens) {
-  if (item.noise) {   // the mockup's genTask() for an FYI item (line 3232): the agent read it and found nothing for the PM
-    const o = (id, l, rec, f, run) => ({ id, l, rec: !!rec, fx: f, run });
-    const L = [o('arch', 'Archive it', 1, [fx('check', 'Keeps the inbox clean', 'ok')], (r) => doneAct(inst, item, r, 'Archived.')), o('keep', 'Keep it', 0, [fx('moon', 'Stays in the inbox')], () => say({ text: 'Kept.', timeout: 2500 }))];
-    const model = { id: 'task:' + item.id, sit: 'Noise. Nothing in it needs you, and the agent has already read it.', chg: [['clock', 'About under 2 min', 'effort']], conf: 92, cta: 'Slide to archive', unsure: '', ign: '', outboxReason: OUT_REASON,
-      opts: L.map((x) => ({ id: x.id, l: x.l, rec: x.rec, fx: x.fx, outward: false })), why: '' };
-    const run = {}; L.forEach((x) => { run[x.id] = x.run; });
-    return { model, run };
-  }
   const ix = item.ix || {}; const mock = item.mock_row === true;
   const j = item.job && jobById(inst, item.job);
   const L = lensOptions(inst, item, lens);
@@ -503,14 +610,16 @@ function itemCase(inst, item, lens) {
     if (ix.why) c.push(['info', ix.why[0], ix.why[1] || '']);
     else if (item.why) c.push(['info', item.why, item.src || '']);
     if (j) c.push(['target', 'Job: ' + jm, 'JTBD']);
+    if (item.resolves) c.push(['init', COPY.advances(resolvesTitle(inst, item)), 'team task']);
     if (mock && item.mins) c.push(['clock', 'About ' + (item.mins <= 2 ? 'under 2' : item.mins) + ' min', 'effort']);
     if (item.due) c.push(['cal', 'Due ' + item.due, '']);
+    if (item.defer && item.defer > inst.data.today) c.push(['moon', COPY.notBeforeChip(dayLabel(item.defer)), '']);
     if (item.priority && !mock) c.push(['flag', 'Priority ' + item.priority, '']);
     if (item.waiting_on) c.push(['wait', 'Waiting on ' + item.waiting_on, '']);
     return c.slice(0, 3);
   })();
   const model = {
-    id: 'task:' + item.id, sit: ix.sit || (j ? COPY.jobLine(j) : (item.why || (mock ? item.title : 'No job to be done yet. File it under one below, or leave it.'))),
+    id: 'task:' + item.id, sit: ix.sit || L.sit || (j ? COPY.jobLine(j) : (item.why || (mock ? item.title : 'No job to be done yet. File it under one below, or leave it.'))),
     chg: evidence, conf: ix.conf || L.conf, cta: L.cta, unsure: ix.unsure || '', ign: ix.ign || '', outboxReason: OUT_REASON,
     opts: L.opts.map((x) => ({ id: x.id, l: x.l, rec: x.rec, fx: x.fx, outward: !!x.outward })), why: '',
   };
@@ -532,7 +641,7 @@ function itemCase(inst, item, lens) {
       run.accept = (r) => doneAct(inst, item, r, 'Accepted. Recorded as your press.');
       run.keep = () => say({ text: 'Kept.', timeout: 2500 });
     } else {
-      model.move = ix.move + ' \u00b7 swipe right, or slide below';
+      model.move = ix.move + ' · swipe right, or slide below';
       model.opts = [{ id: 'agmv', l: 'Let the agent act: ' + ix.move, rec: 1, fx: [fx('spark', 'The suggested move, taken by an agent', 'ok'), fx('shield', 'Inside the repo; outward only as a draft', 'ok')] }, ...model.opts.map((x) => ({ ...x, rec: 0 }))];
       model.cta = 'Slide to let the agent act';
       run.agmv = () => { say({ text: 'The agent is working on it. Anything outward stays a draft for your slide.', timeout: 4000 }); startRun(inst, item, 'res'); };   // the toast is the case's slide; a swipe starts the run without one, as the mockup does
@@ -558,16 +667,15 @@ function startRun(inst, item, intent) {
 }
 
 
-/** The case file element of an item: c3-case.js plus what is Work's own (the steps, the agent tray, the edit fields). */
+/** The case file element of an item: c3-case.js plus what is Work's own (offline work, the shared actions, the steps, the agent tray, the edit fields). */
 function caseFile(inst, item, lens) {
   const { model, run } = itemCase(inst, item, lens);
   const root = renderCase(model, {
     picked: inst.picks.get(item.id), outbox: false,
     onPick: (id) => inst.picks.set(item.id, id),
     onConfirm: ({ option }) => {
-      const row = inst.root.querySelector('[data-pm-item="' + item.id + '"]');
       const fn = run[option.id];
-      if (fn) fn(row);
+      if (fn) fn(rowOf(inst, item));
     },
   });
   root.setAttribute('data-pm-case', item.id);
@@ -578,6 +686,7 @@ function caseFile(inst, item, lens) {
   const extras = [];
   const rs = inst.runs.get(item.id);
   const agent = item.mock_row && item.agent_move && (item.ix || {}).move;
+  if (item.kind === 'offline') extras.push(offlineBlock(inst, item));
   if (rs && rs.phase === 'work') {
     extras.push(el('div', { class: 'c3ag', 'data-ag': item.id }, el('div', { class: 'fold a', role: 'status' }, el('span', { class: 'c3spin' }, c3ic('spark', 'sm')), rs.steps[Math.min(rs.i, rs.steps.length - 1)] + ' · ' + (Math.min(rs.i, rs.steps.length - 1) + 1) + ' of ' + rs.steps.length,
       el('button', { type: 'button', class: 'chip2 lk', 'data-pm-agent-stop': item.id, onclick: () => { inst.runs.delete(item.id); say({ text: 'Stopped. Nothing was kept.', timeout: 2500 }); draw(inst); } }, c3ic('stop', 'sm'), 'stop'))));
@@ -592,18 +701,13 @@ function caseFile(inst, item, lens) {
       c3ib('Speak is off on this line: nothing on this page records. Type the reply here.', 'mic', { 'data-off': '', onclick: () => say({ text: 'The microphone needs the app. Nothing was recorded: type the reply here.', timeout: 4200 }) }, 'sm'),
       c3ib('Close the reply', 'x', { onClick: () => { inst.trays.delete(item.id); draw(inst); } }, 'sm')));
   }
-  const showSteps = !(rs && rs.phase) && (inst.planning.has(item.id) || (item.steps || []).length || (!agent && (!item.mock_row || item.src === 'You')));
+  const showSteps = !(rs && rs.phase) && item.kind !== 'offline' && (inst.planning.has(item.id) || (item.steps || []).length || (!agent && (!item.mock_row || item.src === 'You')));
   if (showSteps) extras.push(stepsBlock(inst, item));
   const anchor = root.querySelector('.c3ag') || root.querySelector('.sit');
   if (anchor) anchor.after(...extras); else root.prepend(...extras);
-  if (item.noise) return root;   // the mockup's noise case has no edit form
-  /* the editable fields stay in the case file behind an Edit button (title, due, priority, waiting on, job) */
-  const form = el('div', { class: 'c3jf', 'data-pm-edit-form': item.id, hidden: !inst.editing.has(item.id) },
-    editField(inst, item, 'Title', 'Title', 'text', 'title', item.title),
-    editField(inst, item, 'Due', 'Due', 'date', 'due', item.due),
-    editField(inst, item, 'Priority', 'Priority', 'select', 'priority', item.priority),
-    editField(inst, item, 'Waiting on', 'Waiting', 'text', 'waiting_on', item.waiting_on),
-    editField(inst, item, 'Job', 'Job', 'select', 'job', item.job));
+  root.append(quickActs(inst, item, { noDrop: item.kind === 'offline' }));
+  /* the editable fields stay in the case file behind an Edit button (title, due, not before, priority, waiting on, job) */
+  const form = editForm(inst, item); form.hidden = !inst.editing.has(item.id);
   const edit = el('button', { type: 'button', class: 'chip2 lk', 'aria-expanded': String(inst.editing.has(item.id)), 'data-pm-edit-toggle': item.id,
     onclick: () => { const on = !inst.editing.has(item.id); if (on) inst.editing.add(item.id); else inst.editing.delete(item.id); form.hidden = !on; edit.setAttribute('aria-expanded', String(on)); } }, c3ic('edit', 'sm'), 'Edit details');
   const ft = root.querySelector('.cft');
@@ -615,7 +719,6 @@ function caseFile(inst, item, lens) {
 /* ── swipe: the mockup's workSwipe (console3.html line 3250) and the agent's swapped glyphs (line 5136) ─────────────────────── */
 
 function swipeSpec(inst, item, lens) {
-  if (item.noise) { const a = { label: 'Archive', icon: 'check', fn: (r) => doneAct(inst, item, r, 'Archived.') }; return { right: a, left: { ...a, icon: 'moon' } }; }   // the mockup archives a noise row either way
   const mock = item.mock_row === true; const today = inst.data.today;
   if (mock && item.agent_move && (item.ix || {}).move) {
     return {
@@ -623,16 +726,15 @@ function swipeSpec(inst, item, lens) {
       left: { label: 'Reply', icon: 'reply', fn: () => { if (inst.runs.get(item.id) && inst.runs.get(item.id).phase === 'work') { say({ text: 'A session is already working on this.', timeout: 2500 }); return; } inst.trays.add(item.id); inst.opens.add(item.id); draw(inst); later(inst, () => { const i = inst.root.querySelector('[data-pm-agent-reply="' + item.id + '"]'); if (i) i.focus(); }, 30); } },
     };
   }
-  const q = mock && item.mins <= 2;
-  if (lens === 'triage') return {
-    right: q ? { label: 'Done', icon: 'check', fn: (r) => doneAct(inst, item, r, 'Done.') } : { label: 'In Today', icon: 'sun', fn: (r) => moveAct(inst, item, r, 'today', 'In Today.') },
-    left: { label: 'Later', icon: 'moon', fn: (r) => parkAct(inst, item, r, 'Moved to Later.') } };
-  if (lens === 'today') return { right: { label: 'Done', icon: 'check', fn: (r) => doneAct(inst, item, r, 'Done.') }, left: { label: 'Tomorrow', icon: 'moon', fn: (r) => dueAct(inst, item, r, addIso(today, 1), 'Migrated to tomorrow.') } };
+  const someday = { label: 'Someday', icon: 'moon', fn: (r) => somedayAct(inst, item, r) };
+  const inToday = { label: 'In Today', icon: 'sun', fn: (r) => todayAct(inst, item, r) };
+  if (lens === 'inbox' || lens === 'upcoming') return { right: inToday, left: someday };
+  if (lens === 'today') return { right: { label: 'Done', icon: 'check', fn: (r) => doneAct(inst, item, r, 'Done.') },
+    left: item.kind === 'offline' ? { label: 'Not yet', icon: 'moon', fn: (r) => notYetAct(inst, item, r, 'tomorrow') } : { label: 'Tomorrow', icon: 'moon', fn: (r) => deferAct(inst, item, r, addIso(today, 1)) } };
   if (lens === 'waiting') return {
     right: { label: 'Nudge', icon: 'out', fn: () => say({ text: 'No channel connected: a nudge to ' + (item.waiting_on || 'them') + ' is not sent.', timeout: 4000 }) },
     left: { label: 'Keep waiting', icon: 'wait', fn: () => say({ text: 'Still waiting.', timeout: 2500 }) } };
-  if (lens === 'week') return { right: { label: 'In Today', icon: 'sun', fn: (r) => moveAct(inst, item, r, 'today', 'In Today.') }, left: { label: 'Later', icon: 'moon', fn: (r) => parkAct(inst, item, r, 'Moved to Later.') } };
-  return { right: { label: 'To Week', icon: 'cal', fn: (r) => moveAct(inst, item, r, 'week', 'Promoted to Week.') }, left: { label: 'Drop', icon: 'trash', fn: (r) => dropAct(inst, item, r) } };
+  return { right: { label: 'Bring back', icon: 'sun', fn: (r) => unparkAct(inst, item, r) }, left: { label: 'Drop', icon: 'trash', fn: (r) => dropAct(inst, item, r) } };
 }
 
 /* Open or close a case file in place with c3-expand.js, so the mockup's .xp height transition (grid-template-rows) plays. */
@@ -659,6 +761,19 @@ const KIND_ICON = { reply: 'reply', decide: 'scale', review: 'eye', do: 'check'
 /* The mockup's time-left bar (.fuse) with its text, for an item that carries `left` ({ text, pct, tone }). */
 const fuseBar = (l) => { const c = l.tone === 'warn' ? 'var(--warning)' : 'var(--acc)'; return el('div', { class: 'chips2', style: 'margin-top:6px;gap:8px' }, el('div', { class: 'fuse' }, el('i', { style: 'width:' + Math.round(l.pct * 100) + '%;background:' + c })), el('span', { class: 'mono', style: 'font-size:var(--fs-1);color:' + c }, l.text)); };
 
+/* The chips the Work page adds to a row: outside PMOS and the person, Not before, Flagged, how often it moved, Looks done, the team task it advances. */
+function workChips(inst, item) {
+  const today = inst.data.today; const c = [];
+  if (item.kind === 'offline') c.push(el('span', { class: 'tag wk-off', 'data-pm-offline-tag': item.id }, COPY.offline), el('span', { class: 'chip2' }, c3ic('user', 'sm'), item.person || 'someone'));
+  if (item.defer && item.defer > today) c.push(el('span', { class: 'tag wk-nb', 'data-pm-notbefore': item.id }, COPY.notBeforeChip(dayLabel(item.defer))));
+  if (item.flagged) c.push(el('span', { class: 'chip2 wk-fl', 'data-pm-flagged': item.id }, c3ic('flag', 'sm'), COPY.flagged));
+  if (item.due && String(item.due).slice(0, 10) < today) c.push(el('span', { class: 'st bad' }, c3ic('alert', 'sm'), COPY.overdue(daysBetween(item.due, today))));
+  if (item.not_yet_count) c.push(el('span', { class: 'tag' }, COPY.moved(item.not_yet_count)));
+  if (item.kind === 'offline' && item.evidence) c.push(el('span', { class: 'st warn', 'data-pm-looks-done': item.id }, c3ic('eye', 'sm'), COPY.looksDone));
+  if (item.resolves) c.push(el('span', { class: 'chip2', title: RESOLVES_TIP, 'data-pm-resolves': item.resolves }, c3ic('init', 'sm'), COPY.advances(resolvesTitle(inst, item))));
+  return c;
+}
+
 /* The mockup's workRow(): li.nrow.wrow > .rv.l, .rv.r (made by the swipe), .ki, .nb (.tt, .chips, .xp > .xi), and the .sg glyphs (line 3258). */
 function itemRow(inst, item, lens) {
   const j = item.job && jobById(inst, item.job);
@@ -673,9 +788,10 @@ function itemRow(inst, item, lens) {
   if (mock && item.agent_move && !(rs && rs.phase === 'done')) chips.push(el('span', { class: 'chip2', style: 'gap:4px', title: 'Swipe right to let the agent act' }, c3ic('spark', 'sm'), 'agent move'));
   if (mock && item.mins) chips.push(el('span', { class: 'chip2', title: 'Effort' }, c3ic('clock', 'sm'), item.mins <= 2 ? 'under 2 min' : item.mins + ' min'));
   if (mock && item.time) chips.push(el('span', { class: 'chip2' }, c3ic('cal', 'sm'), item.time));
-  if (item.due && !mock) chips.push(el('span', { class: 'chip2' }, c3ic('cal', 'sm'), item.due));
-  if (item.priority && !mock) chips.push(el('span', { class: 'fl ' + item.priority.toLowerCase() }, item.priority));
+  if (item.due) chips.push(el('span', { class: 'chip2' }, c3ic('cal', 'sm'), item.due));
+  if (item.priority) chips.push(el('span', { class: 'fl ' + item.priority.toLowerCase() }, item.priority));
   if (item.waiting_on) chips.push(el('span', { class: 'chip2' }, c3ic('wait', 'sm'), COPY.waitingOn(item.waiting_on)));
+  chips.push(...workChips(inst, item));
   if ((item.steps || []).length) { const dn = item.steps.filter((s) => s.done).length; const ag = item.steps.filter((s) => s.who !== 'you' && !s.done).length; chips.push(el('span', { class: 'chip2', title: 'Steps' }, c3ic('tree', 'sm'), dn + ' of ' + item.steps.length + ' steps' + (ag ? ' · agent can do ' + ag : ''))); }
   if (j) chips.push(el('span', { class: 'chip2 jc', title: j.want }, c3ic('target', 'sm'), mock && j.mock_name ? j.mock_name : j.want));
   if (mock && item.src) chips.push(el('span', { class: 'tag' }, item.src));
@@ -683,10 +799,10 @@ function itemRow(inst, item, lens) {
   const title = el('span', { class: 'tt', 'data-pm-title': item.id }, item.title);
   const spec = swipeSpec(inst, item, lens);
   const recL = itemCase(inst, item, lens).model.opts.find((o) => o.rec);
-  const recSide = agent ? 'r' : (recL && /^(drop|arch|later|mig|wait|keep)/.test(recL.id) ? 'l' : 'r');
+  const recSide = agent ? 'r' : (recL && /^(drop|keep|wait|defer|someday)/.test(recL.id) ? 'l' : 'r');
+  const icon = mock ? (KIND_ICON[item.kind] || 'check') : item.kind === 'offline' ? 'user' : item.flagged ? 'flag' : item.priority === 'P1' ? 'alert' : 'todo';
   const row = el('li', { class: 'nrow wrow', 'data-row': '', 'data-id': item.id, 'data-w': '1', 'data-pm-item': item.id, 'data-lens': lens },
-    el('span', { class: 'ki' + (item.priority === 'P1' ? ' hot' : ''), title: item.priority || item.kind || '', style: mock && item.mins <= 2 && item.kind !== 'fyi' ? 'background:var(--accw);color:var(--acc)' : null },
-      c3ic(mock ? (item.mins <= 2 && item.kind !== 'fyi' ? 'bolt' : (KIND_ICON[item.kind] || (item.kind === 'fyi' ? 'info' : 'check'))) : item.priority === 'P1' ? 'alert' : 'todo')),
+    el('span', { class: 'ki' + (item.priority === 'P1' || item.flagged ? ' hot' : ''), title: item.kind === 'offline' ? 'Happens outside PMOS' : item.priority || '' }, c3ic(icon)),
     el('div', { class: 'nb' }, title, mock && item.left ? fuseBar(item.left) : null, chips.length ? el('div', { class: 'chips' }, chips) : null),
     el('span', { class: 'sg', title: agent ? 'Drag right: the agent acts. Drag left: reply.' : 'Drag right: ' + spec.right.label + '. Drag left: ' + spec.left.label + '.' },
       el('span', { class: 'g l' + (recSide === 'l' ? ' y' : '') }, c3ic(spec.left.icon)), el('span', { class: 'g r' + (recSide === 'r' ? ' y' : '') }, c3ic(spec.right.icon))));
@@ -709,6 +825,87 @@ function itemRow(inst, item, lens) {
   return row;
 }
 
+/* ── Focus: up to three jobs for today, with the reason (PRD R4) ──────────────────────────────────────────────────── */
+
+function focusCard(inst) {
+  const F = inst.data.focus || { suggestions: [], accepted: [] };
+  const acc = F.accepted || []; const sug = (F.suggestions || []).slice(0, 3);
+  const one = (f, pinned) => {
+    const editing = inst.focEdit.has(f.key);
+    const input = editing ? el('input', { type: 'text', 'aria-label': COPY.editTitle, 'data-pm-focus-input': f.key, autocomplete: 'off' }) : null;
+    if (input) input.value = f.title;
+    const save = () => focusAccept(inst, { ...f, title: (input && input.value.trim()) || f.title });
+    const cancel = () => { inst.focEdit.delete(f.key); draw(inst); };
+    const edit = () => { inst.focEdit.add(f.key); draw(inst); later(inst, () => { const i = inst.root.querySelector('[data-pm-focus-input="' + f.key + '"]'); if (i) i.focus(); }, 30); };
+    if (input) input.addEventListener('keydown', (e) => { if (e.key === 'Enter' && !e.isComposing) save(); else if (e.key === 'Escape') cancel(); });
+    const job = f.job && jobById(inst, f.job);
+    const refs = (f.item_ids || []).map((id) => itemById(inst, id)).filter((i) => i && !i.done && i.title !== f.title);   // a one-item job does not list itself
+    const btns = editing ? [pill(COPY.save, 'check', { class: 'pill pri', 'data-pm-focus-save': f.key, onclick: save }), pill(COPY.cancel, null, { 'data-pm-focus-cancel': f.key, onclick: cancel })]
+      : pinned ? [pill(COPY.editTitle, 'edit', { 'data-pm-focus-edit': f.key, onclick: edit }), pill(COPY.unpin, 'x', { 'data-pm-focus-clear': f.key, onclick: () => focusClear(inst, f) })]
+        : [pill(COPY.accept, 'check', { class: 'pill pri', 'data-pm-focus-accept': f.key, onclick: () => focusAccept(inst, f) }), pill(COPY.editTitle, 'edit', { 'data-pm-focus-edit': f.key, onclick: edit }),
+          pill(COPY.notToday, 'moon', { 'data-pm-focus-dismiss': f.key, onclick: () => focusDismiss(inst, f) })];
+    return el('div', { class: 'wkfc' + (pinned ? ' on' : ''), 'data-pm-focus-card': f.key, 'data-pm-focus-state': pinned ? 'accepted' : 'suggested' },
+      el('div', { class: 'chips2' }, el('span', { class: 'tag' + (pinned ? ' wk-on' : '') }, pinned ? COPY.focusPinned : COPY.focusSuggested),
+        job ? el('span', { class: 'chip2' }, c3ic('target', 'sm'), job.mock_name || job.want) : null),
+      editing ? el('span', { class: 'form' }, input) : el('b', { class: 'wkfc-t', 'data-pm-focus-title': f.key }, f.title),
+      f.why ? el('p', { class: 'wkfc-why' }, COPY.why(f.why)) : null,
+      refs.length ? el('ul', { class: 'wkfc-r', role: 'list' }, refs.map((i) => el('li', null, c3ic('next', 'sm'), el('span', null, i.title)))) : null,
+      el('div', { class: 'wkq' }, btns));
+  };
+  return el('section', { class: 'card sect wkfoc', 'data-pm-focus': '' },
+    el('div', { class: 'sh2' }, el('h2', null, c3ic('target', 'sm'), COPY.focus), el('span', { class: 'dim wk-s' }, COPY.focusSub)),
+    acc.length || sug.length ? el('div', { class: 'wkfg' }, ...acc.map((f) => one(f, true)), ...sug.map((f) => one(f, false))) : el('div', { class: 'dim mono wk-s', 'data-pm-focus-none': '' }, COPY.focusNone));
+}
+
+/* ── Upcoming: the next 7 days by day, then Later (PRD R5) ─────────────────────────────────────────────────────────── */
+
+function upcomingMain(inst, list) {
+  const today = inst.data.today;
+  const block = (key, label, sub, its) => el('div', { class: 'wkday', 'data-pm-day': key },
+    el('h3', null, label, sub ? el('span', { class: 'dim' }, sub) : null, its.length ? el('span', { class: 'bdg g' }, String(its.length)) : null),
+    its.length ? el('ul', { class: 'list', role: 'list' }, its.map((i) => itemRow(inst, i, 'upcoming'))) : el('div', { class: 'wkday-none' }, 'Nothing'));
+  const at = (i) => { const a = arrives(i, today); return a ? Math.max(1, daysBetween(today, a)) : 99; };
+  const days = [];
+  for (let n = 1; n <= 7; n++) { const d = addIso(today, n); days.push(block(d, n === 1 ? 'Tomorrow' : dayLabel(d).slice(0, 3), n === 1 ? dayLabel(d).slice(4) : dayLabel(d).slice(4), list.filter((i) => at(i) === n))); }
+  days.push(block('later', 'Later', 'beyond 7 days', list.filter((i) => at(i) > 7)));
+  const sec = sect(el('div', { class: 'sh2' }, el('h2', null, c3ic('cal', 'sm'), labelOf('upcoming'), ' ', el('span', { class: 'bdg g' }, String(list.length)))), el('div', { class: 'wkdays' }, days));
+  sec.setAttribute('data-pm-list', 'upcoming');
+  return sec;
+}
+
+/* ── Review: a weekly pass, one item at a time (PRD R7) ────────────────────────────────────────────────────────────── */
+
+function reviewMain(inst) {
+  const today = inst.data.today; const q = shown(inst, 'review'); const R = inst.rv;
+  const inQ = new Set(q.map((i) => i.id));
+  if (!R.ids) { R.ids = q.map((i) => i.id); R.handled = new Set(); R.changing = false; }
+  q.forEach((i) => { if (!R.ids.includes(i.id)) R.ids.push(i.id); });
+  const curId = R.ids.find((id) => !R.handled.has(id) && inQ.has(id)) || null;
+  const total = R.ids.length; const doneN = R.ids.filter((id) => R.handled.has(id) || !inQ.has(id)).length;
+  const restart = () => { R.ids = null; draw(inst); };
+  if (!curId) {
+    return el('section', { class: 'card sect wkrv', 'data-pm-review-done': '' }, el('p', { class: 'wkrv-t' }, total ? COPY.reviewDone : labelOf('review')),
+      el('p', { class: 'wk-s' }, total ? COPY.reviewDoneText(total) : COPY.reviewNone),
+      q.length ? el('div', { class: 'wkq' }, pill(COPY.again, 'undo', { 'data-pm-review-again': '', onclick: restart })) : null);
+  }
+  const item = q.find((i) => i.id === curId);
+  const next = () => { R.handled.add(curId); R.changing = false; draw(inst); };
+  const place = workPlace(item, today);
+  const upNext = R.ids.filter((id) => id !== curId && !R.handled.has(id) && inQ.has(id)).slice(0, 2).map((id) => (q.find((i) => i.id === id) || {}).title).filter(Boolean);
+  return el('section', { class: 'card sect wkrv', 'data-pm-review': curId },
+    el('div', { class: 'wkrv-p' }, el('span', { 'data-pm-review-progress': '' }, (doneN + 1) + ' of ' + total), el('span', null, COPY.reviewHead)),
+    el('progress', { class: 'wk-bar', value: String(doneN), max: String(Math.max(1, total)), 'aria-label': doneN + ' of ' + total + ' reviewed' }),   // Review's progress bar
+    el('p', { class: 'wkrv-t', 'data-pm-title': curId }, item.title),
+    el('div', { class: 'chips' }, el('span', { class: 'tag' }, COPY.untouched(untouchedDays(item, today))), el('span', { class: 'tag' }, COPY.livesIn(labelOf(place))),
+      item.waiting_on ? el('span', { class: 'chip2' }, c3ic('wait', 'sm'), COPY.waitingOn(item.waiting_on)) : null, ...workChips(inst, item)),
+    R.changing ? el('div', { class: 'wkrv-x' }, editForm(inst, item), el('div', { class: 'wkq' }, pill(COPY.next, 'next', { class: 'pill pri', 'data-pm-review-next': curId, onclick: next })))
+      : el('div', { class: 'wkq' },
+        pill(COPY.keep, 'check', { class: 'pill pri', 'data-pm-review-keep': curId, onclick: async () => { if (await act(inst, null, { route: '/keep', body: { id: curId }, text: COPY.kept, leave: false })) { R.handled.add(curId); draw(inst); } } }),
+        pill(COPY.change, 'edit', { 'data-pm-review-change': curId, onclick: () => { R.changing = true; draw(inst); } }),
+        pill(COPY.drop, 'trash', { 'data-pm-review-drop': curId, onclick: async () => { if (await dropAct(inst, item, null)) { R.handled.add(curId); draw(inst); } } })),
+    upNext.length ? el('p', { class: 'dim wk-s' }, COPY.upNext + upNext.join(' · ')) : null);
+}
+
 /* ── jobs ────────────────────────────────────────────────────────────────────────────────────────────────────────── */
 
 function jobEditField(inst, job, key) {
@@ -724,44 +921,35 @@ function jobEditField(inst, job, key) {
   return field(lab, input);
 }
 
-/* The mockup's c3jall(): "All N items, across every list", grouped by list (line 4657). */
+/* The mockup's c3jall(): "All N items, across every view", grouped by view (line 4657). */
 function jobAll(inst, job) {
-  const fx2 = DEMO() && window.__c3work2 && window.__c3work2.jobAll && window.__c3work2.jobAll[job.id];   // demo: the mockup's own items of the job, grouped by list
-  if (fx2) {
-    const n = fx2.reduce((a, g) => a + g[1].length, 0);
-    return el('div', { class: 'c3all', 'data-pm-job-all': job.id }, el('div', { class: 'hd dim mono' }, 'All ' + n + ' items, across every list'),
-      ...fx2.map(([tag, titles, dn]) => el('div', null, el('span', { class: 'tag' }, tag), el('span', null, ...titles.map((t) => el('span', { class: dn ? 'dn' : '' }, t))))));
-  }
   const its = (inst.data.items || []).filter((i) => i.job === job.id);
   if (!its.length) return el('div', { class: 'dim mono', style: small }, 'No item uses this job yet.');
   const G = {};
   its.forEach((i) => { const l = i.done ? 'done' : lensOfItem(inst, i.id); (G[l] = G[l] || []).push(i); });
-  return el('div', { class: 'c3all', 'data-pm-job-all': job.id }, el('div', { class: 'hd dim mono' }, 'All ' + its.length + ' items, across every list'),
-    ...[...LENS_IDS, 'done'].filter((l) => G[l]).map((l) => el('div', null, el('span', { class: 'tag' }, l === 'done' ? 'Done' : labelOf(l)), el('span', null, ...G[l].map((i) => el('span', { class: i.done ? 'dn' : '' }, i.title))))));
+  return el('div', { class: 'c3all', 'data-pm-job-all': job.id }, el('div', { class: 'hd dim mono' }, 'All ' + its.length + ' items, across every view'),
+    ...[...VIEWS, 'done'].filter((l) => G[l]).map((l) => el('div', null, el('span', { class: 'tag' }, l === 'done' ? 'Done' : labelOf(l)), el('span', null, ...G[l].map((i) => el('span', { class: i.done ? 'dn' : '' }, i.title))))));
 }
 
 /* The job's case file (mockup C3.cases.job, line 4660): the words, the count, Keep / Delete and move / Delete and leave, slide to confirm. */
 function jobCase(inst, j) {
   const its = (inst.data.items || []).filter((i) => i.job === j.id);
   const done = its.filter((i) => i.done).length;
-  const mk = !!j.mock_name;   // demo: the mockup's own numbers, wording and Recommended badge
   const others = (inst.data.jobs || []).filter((q) => q.id !== j.id); const near = others[0];
   const nm = (q) => q.mock_name || q.want;
   const del = (reassign) => async () => { const r = await press(inst, JOBS + '/delete', { id: j.id, ...(reassign ? { reassign_to: reassign } : {}) }); if (r) say({ text: COPY.reassigned(r.reassigned || 0), timeout: 4000 }); };
-  const model = { id: 'job:' + j.id, sit: COPY.jobLine(j), conf: 90, cta: mk ? 'Slide to delete' : 'Slide to keep it',
-    chg: [['target', mk ? (j.done + ' of ' + j.total + ' done') : (done + ' of ' + its.length + ' done'), 'count across every list', 'ok'], ['info', 'Change the words below. They save at once and you can undo for 7 seconds.', '']],
+  const model = { id: 'job:' + j.id, sit: COPY.jobLine(j), conf: 90, cta: 'Slide to keep it',
+    chg: [['target', done + ' of ' + its.length + ' done', 'count across every view', 'ok'], ['info', 'Change the words below. They save at once and you can undo for 7 seconds.', '']],
     opts: [{ id: 'keep', l: 'Keep it', rec: 1, fx: [fx('check', 'Nothing changes', 'ok')] },
-      { id: 'mv', l: near ? 'Delete it and move its ' + (mk ? j.total : its.length) + ' item' + ((mk ? j.total : its.length) === 1 ? '' : 's') + ' to "' + nm(near) + '"' : 'Delete it', rec: 0, fx: [fx('trash', 'The job is gone', 'warn'), fx('target', (mk ? j.total : its.length) + ' items change job', 'warn')] },
-      { id: 'nj', l: 'Delete it and leave its items without a job', rec: 0, fx: [fx('trash', 'The job is gone', 'warn'), fx('alert', mk ? 'The agent will suggest a job again' : 'The items have no job', '')] }] };
+      { id: 'mv', l: near ? 'Delete it and move its ' + its.length + ' item' + (its.length === 1 ? '' : 's') + ' to "' + nm(near) + '"' : 'Delete it', rec: 0, fx: [fx('trash', 'The job is gone', 'warn'), fx('target', its.length + ' items change job', 'warn')] },
+      { id: 'nj', l: 'Delete it and leave its items without a job', rec: 0, fx: [fx('trash', 'The job is gone', 'warn'), fx('alert', 'The items have no job', '')] }] };
   const run = { keep: () => say({ text: 'Kept.', timeout: 2500 }), mv: del(near && near.id), nj: del(null) };
   const root = renderCase(model, { onConfirm: ({ option }) => { if (run[option.id]) run[option.id](); } });
   root.setAttribute('data-pm-case', j.id);
-  if (!mk) {   // a real job carries no confidence figure: never show a made-up percentage
-    root.querySelectorAll('.opt .rk').forEach((n) => { n.replaceChildren(c3ic('spark', 'sm'), 'Suggested'); n.removeAttribute('title'); });
-    root.querySelectorAll('.opt .conf').forEach((n) => n.remove());
-  }
+  root.querySelectorAll('.opt .rk').forEach((n) => { n.replaceChildren(c3ic('spark', 'sm'), 'Suggested'); n.removeAttribute('title'); });   // a job carries no confidence figure: never show a made-up percentage
+  root.querySelectorAll('.opt .conf').forEach((n) => n.remove());
   const sit = root.querySelector('.sit');
-  sit.after(el('div', { class: 'c3jf' }, mk ? jobEditField(inst, j, 'mock_name') : null, jobEditField(inst, j, 'when'), jobEditField(inst, j, 'want'), jobEditField(inst, j, 'so')), jobAll(inst, j));
+  sit.after(el('div', { class: 'c3jf' }, j.mock_name ? jobEditField(inst, j, 'mock_name') : null, jobEditField(inst, j, 'when'), jobEditField(inst, j, 'want'), jobEditField(inst, j, 'so')), jobAll(inst, j));
   return root;
 }
 
@@ -823,36 +1011,41 @@ function jobsCard(inst) {
 
 /* ── the page ────────────────────────────────────────────────────────────────────────────────────────────────────── */
 
-/* The mockup's workHead() calbar: the .seg lens bar with count badges, and the group toggle as an .ib (line 3281). */
+/* The mockup's workHead() calbar: the .seg view bar with a count on every view, and the group toggle as an .ib (line 3281). */
 function lensBar(inst) {
-  const seg = el('div', { class: 'seg', role: 'group', 'aria-label': 'Work lens', 'data-pm-lenses': '' },
+  const seg = el('div', { class: 'seg', role: 'group', 'aria-label': 'Work view', 'data-pm-lenses': '' },
     LENSES.map(([id, label]) => {
-      const n = inst.data ? shown(inst, id).length : 0;
+      const n = inst.data ? countOf(inst, id) : 0;
       const b = el('button', { type: 'button', 'aria-pressed': String(inst.lens === id), 'data-lens': id }, c3ic(WLI[id], 'sm'), label, n ? el('span', { class: 'bdg g' }, String(n)) : null);
       b.addEventListener('click', () => { inst.lens = id; if (inst.ctx.onLens) inst.ctx.onLens(id); draw(inst); });   // onLens: the page's deck follows the lens (demo)
+      /* every view shows its count, also 0 */
+      const badge = b.querySelector('.bdg') || b.appendChild(el('span', { class: 'bdg g' }, '0'));
+      badge.setAttribute('data-pm-count', id);
       return b;
     }));
-  const grp = c3ib(inst.group ? COPY.groupTime : COPY.groupJob, 'target', { 'aria-pressed': String(inst.group), 'data-pm-group': '' }, 'sm');
+  const grp = c3ib(inst.group ? COPY.groupTime : COPY.groupJob, 'target', { 'aria-pressed': String(inst.group), 'data-pm-group': '', disabled: inst.lens === 'review' }, 'sm');
   grp.addEventListener('click', () => { inst.group = !inst.group; draw(inst); });
   return [seg, el('div', { class: 'chips2' }, grp)];
 }
 
-/* The ring at the right of the lens header: done of total, over the items in the lens (the lists keep done items; the rows hide them). */
-function lensRing(inst) {
-  const all = lists(inst)[inst.lens] || [];
-  return c3ring(all.filter((i) => i.done).length, all.length, 44);
+/* The ring at the right of Today's header: done today of done today plus what is still in Today. */
+function todayRing(inst) {
+  const d = inst.data;
+  const doneToday = (d.items || []).filter((i) => i.done && String(i.done_at || '').slice(0, 10) === d.today).length;
+  return c3ring(doneToday, doneToday + shown(inst, 'today').length, 44);
 }
 
 /* A .card.sect with an .sh2 title row and a ul.list of rows (line 3262). */
 function sect(head, rows) { return el('section', { class: 'card sect' }, head, rows); }
 
-const FOCUS_ATTRS = ['data-pm-edit', 'data-pm-step-add', 'data-pm-job-edit', 'data-pm-agent-reply', 'data-pm-job-new', 'aria-label'];
+const FOCUS_ATTRS = ['data-pm-edit', 'data-pm-step-add', 'data-pm-job-edit', 'data-pm-agent-reply', 'data-pm-job-new', 'data-pm-outcome', 'data-pm-wait-on', 'data-pm-focus-input'];
 
 function draw(inst) {
+  if (inst.lens !== inst.prevLens) { if (inst.lens === 'review') inst.rv.ids = null; inst.prevLens = inst.lens; }   // a fresh Review pass each time the view is opened
   /* keep the focus: a field the PM is typing in, or the row they were on, is found again after the redraw */
   const a = document.activeElement; let keep = null;
   if (a && inst.root.contains(a) && a !== document.body) {
-    const at = FOCUS_ATTRS.slice(0, 5).find((k) => a.hasAttribute && a.hasAttribute(k));
+    const at = FOCUS_ATTRS.find((k) => a.hasAttribute && a.hasAttribute(k));
     if (at) keep = { sel: '[' + at + '="' + a.getAttribute(at) + '"]' };
     else if (a.matches && a.matches('.nrow[data-pm-item]')) keep = { sel: '[data-pm-item="' + a.getAttribute('data-pm-item') + '"]' };
   }
@@ -860,35 +1053,34 @@ function draw(inst) {
   inst.bar.replaceChildren(...lensBar(inst));
   const d = inst.data;
   if (!d) { inst.body.replaceChildren(el('p', { class: 'dim mono', style: small }, COPY.loading)); return; }
-  const list = shown(inst, inst.lens);
-  const lh = el('div', { class: 'lh' },
-    el('span', { class: 'ki' }, c3ic(WLI[inst.lens])),
-    el('div', { style: 'min-width:0' }, el('b', null, (d.lens_text && d.lens_text[inst.lens] ? d.lens_text[inst.lens][0] : COPY.lens[inst.lens](list.length))), el('div', { class: 'dim' }, (d.lens_text && d.lens_text[inst.lens] ? d.lens_text[inst.lens][1] : COPY.lensSub[inst.lens]))),
-    lensRing(inst));
-  const empty = el('li', { class: 'fold' }, c3ic('check', 'sm'), COPY.empty);
+  const lens = inst.lens;
+  const list = lens === 'review' ? [] : shown(inst, lens);
+  const lh = el('div', { class: 'lh', 'data-pm-lens-head': lens },
+    el('span', { class: 'ki' }, c3ic(WLI[lens])),
+    el('div', { class: 'wk-min' }, el('b', null, COPY.lens[lens](countOf(inst, lens))), el('div', { class: 'dim' }, COPY.lensSub[lens])),
+    lens === 'today' ? todayRing(inst) : null);
+  const empty = el('li', { class: 'fold' }, c3ic('check', 'sm'), COPY.emptyView[lens] || COPY.empty);
   let main;
-  if (inst.group) {
+  if (lens === 'review') main = [reviewMain(inst)];
+  else if (inst.group) {
     const groups = (d.jobs || []).map((j) => [j, list.filter((i) => i.job === j.id)])
       .concat([[null, list.filter((i) => !i.job || !jobById(inst, i.job))]]).filter((g) => g[1].length);
     main = groups.length ? groups.map(([j, its]) => {
       const sec = sect(el('div', { class: 'sh2' }, el('h2', null, c3ic('target', 'sm'), j ? (j.mock_name || j.want) : COPY.noJobGroup),
         j ? el('span', { class: 'chips2 dim mono', style: small }, COPY.progress(j.done, j.total)) : null),
-        el('ul', { class: 'list', role: 'list' }, its.map((i) => itemRow(inst, i, inst.lens))));
+        el('ul', { class: 'list', role: 'list' }, its.map((i) => itemRow(inst, i, lens))));
       sec.setAttribute('data-pm-group-card', j ? j.id : '');
       return sec;
-    }) : [sect(el('div', { class: 'sh2' }, el('h2', null, c3ic(WLI[inst.lens], 'sm'), labelOf(inst.lens))), el('ul', { class: 'list' }, empty))];
-  } else {
-    const sec = sect(el('div', { class: 'sh2' }, el('h2', null, c3ic(WLI[inst.lens], 'sm'), labelOf(inst.lens), ' ', el('span', { class: 'bdg g' }, String(list.length))),
+    }) : [sect(el('div', { class: 'sh2' }, el('h2', null, c3ic(WLI[lens], 'sm'), labelOf(lens))), el('ul', { class: 'list' }, empty))];
+  } else if (lens === 'upcoming') main = [upcomingMain(inst, list)];
+  else {
+    const sec = sect(el('div', { class: 'sh2' }, el('h2', null, c3ic(WLI[lens], 'sm'), labelOf(lens), ' ', el('span', { class: 'bdg g' }, String(list.length))),
       el('span', { class: 'fl2', 'data-pm-legend': '' }, COPY.legend.map((w, k) => el('span', null, ['• ', '× ', '> ', '< '][k] + w)))),
-      el('ul', { class: 'list', role: 'list' }, list.length ? list.map((i) => itemRow(inst, i, inst.lens)) : empty));
-    sec.setAttribute('data-pm-list', inst.lens);
+      el('ul', { class: 'list', role: 'list' }, list.length ? list.map((i) => itemRow(inst, i, lens)) : empty));
+    sec.setAttribute('data-pm-list', lens);
     main = [sec];
   }
-  if (inst.lens === 'triage' && Array.isArray(d.noise) && d.noise.length) {   // optional (demo): the mockup's "Noise: kept out of your list". Each row is a work row whose case says why the agent filtered it out (console3.html line 3270)
-    const nz = d.noise.map((n, i) => ({ id: n.id || 'noise-' + (n.title || i).toLowerCase().replace(/[^a-z0-9]+/g, '-'), title: n.title, src: n.src, kind: 'fyi', mins: 0, mock_row: true, noise: true, steps: [] }));
-    main.push(el('section', { class: 'card sect', 'data-pm-noise': '' }, el('div', { class: 'sh2' }, el('h2', null, c3ic('info', 'sm'), 'Noise ', el('span', { class: 'bdg g' }, String(nz.length))), el('span', { class: 'dim', style: small }, 'kept out of your list')),
-      el('ul', { class: 'list', role: 'list' }, nz.map((n) => itemRow(inst, n, 'triage')))));
-  }
+  if (lens === 'today') main.unshift(focusCard(inst));
   /* The mockup's vWork() body: .calbody > .lh + .brief.sbb > .bcols > .bcol.l (the list) and .bcol.r (the jobs card). */
   inst.body.replaceChildren(lh, el('div', { class: 'brief sbb' }, el('div', { class: 'bcols' }, el('div', { class: 'bcol l' }, inst.ctx.plan || null, ...main), el('div', { class: 'bcol r' }, jobsCard(inst)))));
   if (keep) { const n = inst.root.querySelector(keep.sel); if (n && n.focus) { try { n.focus({ preventScroll: true }); } catch { /* not focusable */ } } }