create-pmos 0.62.0 → 0.63.0

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

@@ -0,0 +1,723 @@
+/* pm/view-notes.js — the Notes view tab: one meeting on one screen (meeting-notes, Runs 1 and 2).
+ *
+ * The screen follows the simplified mockup the PM reviewed (prototype/meeting-notes):
+ *   header      the title and the date, and one action: Listen; while listening a red dot, the time, the sources and Stop;
+ *               when the meeting is over, Copy as Markdown and New meeting.
+ *   left        the PM's own notes, then what was caught: Decisions, Actions and Questions as they are said, each checked
+ *               against the repository; after Stop a Summary at the top and Facts mentioned at the end.
+ *   right       a quiet transcript: who (click to name), when, and the line's label.
+ * All notes and Settings are one press away and stay out of the way.
+ *
+ * LISTENING (Run 2, D91). Listen asks what to listen to: the microphone, the meeting (a tab or window the PM shares, with its
+ * audio), or both. Each source goes to the server on the loopback address as 16 kHz mono samples, one second at a time, and
+ * the server transcribes it with the PM's own whisper.cpp. No audio leaves the machine. When Whisper is not set up, the
+ * microphone falls back to the browser's on-device recognition (processLocally, D85) and the meeting cannot be heard;
+ * Settings opens a terminal with the setup commands typed in.
+ *
+ * LABELS AND CHECKS. The server labels each line locally; behind the D91 gates Jev labels it and compares a captured line
+ * with the closest repository passage. The page shows the result in words and reads it by polling the note.
+ *
+ * Reads and writes (lib/routes-notes.js). Notes live in the per-user runtime directory, never in a repository:
+ *   GET  /api/notes · /api/notes/one?id=… · /api/notes/engine?ws=…
+ *   POST /api/notes/new · save · dictate · record · transcript · audio · label · speaker · switch · whisper-setup · private
+ *        · summarize · summarize-agent · delete
+ */
+import { el } from './dom.js';
+import { askConfirm, askText } from './dialogs.js';
+import { pmGet, pmPost } from './http.js';
+import { mdRender } from './markdown.js';
+import { icon } from './icons.js';
+import { button, iconButton, field, row, sheet, empty, ensureComponentsCss } from './primitives.js';
+
+const SAVE_MS = 700;          // a pause this long in typing saves the note
+const POLL_MS = 1500;         // while listening, and until the last line is labelled, the note is read this often
+const AGENT_POLL_MS = 3000;
+const CHUNK_SAMPLES = 16000;  // one second at 16 kHz
+const RATE = 16000;
+const SECTIONS = [['decision', 'Decisions'], ['action', 'Actions'], ['question', 'Questions']];
+
+/* ── module state: survives the redraw every setState causes ─────────────────────────────── */
+let list = null;              // { state, notes, error }
+let currentId = null;
+const cache = new Map();      // id -> note, as last read or written
+let editor = null;            // { id, title, body, … } — the inputs, kept across redraws so typing is not lost
+let saveTimer = null; let saving = false; let savedAt = null; let saveError = null; let dirty = false;
+let banner = null;            // { tone, text }
+let speech = null;            // the browser recogniser: { mode: 'dictate'|'record', id, state, rec, interim, lang, msg, last }
+let audio = null;             // local Whisper capture: { id, state, sources, ctx, streams, started, clock, msg }
+let engine = null;            // { ws, whisper, jev, at }
+let showList = false;
+let pollTimer = null; let agentTimer = null;
+let busy = '';
+
+const nowClock = (iso) => { try { return new Date(iso).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' }); } catch { return ''; } };
+const dayOf = (iso) => { try { return new Date(iso).toLocaleDateString([], { weekday: 'short', day: 'numeric', month: 'short' }); } catch { return ''; } };
+export const fmtTime = (ms) => {
+  if (ms == null || !Number.isFinite(ms)) return '';
+  const s = Math.floor(ms / 1000); const h = Math.floor(s / 3600); const m = Math.floor((s % 3600) / 60); const r = s % 60;
+  const p = (n) => String(n).padStart(2, '0');
+  return h ? h + ':' + p(m) + ':' + p(r) : p(m) + ':' + p(r);
+};
+const wsOf = (ctx) => (ctx.state && ctx.state.wsId) || null;
+const SPEAKER = { mic: 'You', meeting: 'Meeting', speech: 'You' };
+export const speakerOf = (n, source) => ((n.speakers && n.speakers[source]) || SPEAKER[source] || 'You');
+const baseName = (p) => String(p || '').split('/').pop();
+
+/** Insert one dictated piece at [start, end] of `value`. Returns { value, start, end } of the inserted text. Pure, for the suite. */
+export function insertAt(value, start, end, text) {
+  const before = value.slice(0, start); const after = value.slice(end);
+  const tail = before.replace(/[ \t]+$/, '');
+  const sentenceStart = !tail || /[.?!]$/.test(tail) || /\n$/.test(before);
+  let t = text;
+  // a phrase dictated into the middle of a sentence continues it: no capital, unless it is "I" or an acronym
+  if (!sentenceStart && /^[A-Z][a-z]/.test(t) && !/^I\b/.test(t)) t = t[0].toLowerCase() + t.slice(1);
+  const lead = !before || /\s$/.test(before) || /^[,.;:?!]/.test(t) ? '' : ' ';
+  const trail = after && !/^\s/.test(after) && !/^[,.;:?!]/.test(after) ? ' ' : '';
+  const ins = lead + t + trail;
+  return { value: before + ins + after, start: before.length + lead.length, end: before.length + lead.length + t.length };
+}
+/** Apply one dictated phrase's operations at the cursor. `last` is the range the previous phrase inserted, so a "scratch that"
+ * at the start of this phrase removes it; the range this phrase inserted comes back as `last`. Pure, for the suite. */
+export function applyOps(value, sel, ops, last) {
+  if (!ops.length) return { value, sel, last };
+  let v = value; let [s, e] = sel; let from = null;
+  for (const o of ops) {
+    if (o.op === 'text') { const r = insertAt(v, s, e, o.text); v = r.value; if (from == null) from = r.start; s = e = r.end; }
+    else if (o.op === 'newline' || o.op === 'paragraph') {
+      const nl = o.op === 'paragraph' ? '\n\n' : '\n';
+      const before = v.slice(0, s).replace(/[ \t]+$/, '');
+      v = before + nl + v.slice(e); if (from == null) from = before.length; s = e = before.length + nl.length;
+    } else if (o.op === 'scratch' && last) {
+      const [a, b] = last;
+      const left = v.slice(0, a).replace(/[ \t]+$/, ''); const right = v.slice(b).replace(/^[ \t]+/, '');
+      v = left + (left && right && !/\n$/.test(left) && !/^\n/.test(right) ? ' ' : '') + right; s = e = left.length; last = null; from = null;
+    }
+  }
+  return { value: v, sel: [s, e], last: from == null ? null : [from, s] };
+}
+
+/** The captured items of a note, by section. A statement is a fact when it has a number or a repository check. Pure. */
+export function caught(n) {
+  const out = { decision: [], action: [], question: [], fact: [] };
+  (n.transcript || []).forEach((x, index) => {
+    if (!x || !x.text || x.dropped) return;
+    if (out[x.cat]) out[x.cat].push({ ...x, index });
+    else if (x.cat === 'statement' && (/\d|\b(?:percent|half|double|twice)\b/i.test(x.text) || (x.check && x.check.doc))) out.fact.push({ ...x, index });
+  });
+  return out;
+}
+const checkWords = (c) => (!c ? '' : c.verdict === 'differs' ? 'differs from ' + c.doc : c.verdict === 'agrees' ? 'consistent with ' + c.doc : 'see ' + c.doc);
+/** The whole note as Markdown, for "Copy as Markdown". Pure, for the suite. */
+export function noteMarkdown(n) {
+  const out = ['# ' + (n.title || 'Untitled note'), ''];
+  if (n.created_at) out.push('_' + dayOf(n.created_at) + ', ' + nowClock(n.created_at) + '_', '');
+  if (n.agent && n.agent.markdown) out.push('## Summary', '', n.agent.markdown.trim(), '');
+  else if (n.summary && n.summary.sections && n.summary.sections.overview && n.summary.sections.overview.length) out.push('## Summary', '', ...n.summary.sections.overview.map((x) => '- ' + x.text), '');
+  if (String(n.body || '').trim()) out.push('## Notes', '', n.body.trim(), '');
+  const c = caught(n);
+  for (const [k, title] of [...SECTIONS, ['fact', 'Facts mentioned']]) {
+    if (!c[k].length) continue;
+    out.push('## ' + title, '', ...c[k].map((x) => '- ' + (k === 'action' && x.source && x.source !== 'speech' ? speakerOf(n, x.source) + ': ' : '') + x.text
+      + (x.check && x.check.verdict !== 'related' ? ' (' + checkWords(x.check) + ')' : '') + ' [' + fmtTime(x.t) + ']'), '');
+  }
+  if ((n.transcript || []).length) out.push('## Transcript', '', ...n.transcript.map((x) => '[' + fmtTime(x.t) + '] ' + speakerOf(n, x.source) + ': ' + x.text), '');
+  return out.join('\n');
+}
+/** Float samples at `inRate` as 16 kHz 16-bit samples. Each output sample averages the input samples it covers. Pure. */
+export function toInt16(input, inRate) {
+  const ratio = inRate / RATE;
+  const n = Math.floor(input.length / ratio);
+  const out = new Int16Array(n);
+  for (let i = 0; i < n; i++) {
+    const a = Math.floor(i * ratio); const b = Math.max(a + 1, Math.floor((i + 1) * ratio));
+    let s = 0; for (let k = a; k < b && k < input.length; k++) s += input[k];
+    const v = Math.max(-1, Math.min(1, s / (b - a)));
+    out[i] = v < 0 ? v * 0x8000 : v * 0x7fff;
+  }
+  return out;
+}
+function b64(int16) {
+  const u = new Uint8Array(int16.buffer, int16.byteOffset, int16.byteLength);
+  let s = '';
+  for (let i = 0; i < u.length; i += 0x8000) s += String.fromCharCode.apply(null, u.subarray(i, i + 0x8000));
+  return btoa(s);
+}
+
+/* ── reads ────────────────────────────────────────────────────────────────────────────────────── */
+async function loadList(ctx) {
+  list = { ...(list || {}), state: list ? list.state : 'loading' };
+  const r = await pmGet('/api/notes');
+  list = r && r.ok ? { state: 'ok', notes: r.notes } : { state: 'error', notes: (list && list.notes) || [], error: (r && r.error) || 'the notes could not be read' };
+  if (!currentId && list.notes.length) currentId = list.notes[0].id;
+  ctx.setState({});
+}
+const sig = (n) => JSON.stringify([n.transcript, n.summary && n.summary.at, n.agent && n.agent.markdown, n.private, n.speakers, n.title]);
+async function loadNote(ctx, id) {
+  const r = await pmGet('/api/notes/one?id=' + encodeURIComponent(id));
+  if (r && r.ok) {
+    const had = cache.get(id);
+    // what the PM is typing wins over what the server last saved
+    if (editor && editor.id === id && dirty) { r.note.title = editor.title.value; r.note.body = editor.body.value; }
+    r.note.__audio = r.audio || null;
+    cache.set(id, r.note);
+    if (!had || sig(had) !== sig(r.note)) ctx.setState({});
+  } else if (r && r.status === 404) { cache.delete(id); if (currentId === id) currentId = null; loadList(ctx); }
+  return r;
+}
+async function loadEngine(ctx) {
+  const ws = wsOf(ctx);
+  engine = { ...(engine || {}), ws, loading: true };
+  const r = await pmGet('/api/notes/engine' + (ws ? '?ws=' + encodeURIComponent(ws) : ''));
+  engine = r && r.ok ? { ws, whisper: r.whisper, jev: r.jev, at: Date.now() } : { ws, whisper: null, jev: null, error: (r && r.error) || 'not read', at: Date.now() };
+  ctx.setState({});
+  return engine;
+}
+const rowOf = (n) => ({ id: n.id, title: n.title || 'Untitled note', updated_at: n.updated_at, private: !!n.private, segments: (n.transcript || []).length });
+function touchRow(n) {
+  if (!list || !list.notes) return;
+  list.notes = [rowOf(n), ...list.notes.filter((x) => x.id !== n.id)];
+}
+/** Read the note again while it is listening or a line still waits for its answer. */
+function poll(ctx, id, quietRounds = 0) {
+  clearTimeout(pollTimer);
+  pollTimer = setTimeout(async () => {
+    pollTimer = null;
+    if (currentId !== id) return;
+    const before = cache.get(id); const was = before ? sig(before) : '';
+    const r = await loadNote(ctx, id);
+    const n = cache.get(id);
+    const live = (audio && audio.id === id) || (speech && speech.id === id && speech.mode === 'record' && speech.state === 'on');
+    const pending = n && n.__audio && n.__audio.pending > 0;
+    const same = n && sig(n) === was;
+    // a failed read while listening is tried again; a note that is gone (404) ends the loop in loadNote
+    if (live && !(r && r.status === 404)) poll(ctx, id, 0);
+    else if (r && r.ok && (pending || !same || quietRounds < 3)) poll(ctx, id, pending || !same ? 0 : quietRounds + 1);
+  }, POLL_MS);
+}
+
+/* ── writes ───────────────────────────────────────────────────────────────────────────────────── */
+let inflight = null;          // the save in flight, so a flush waits for it and then saves what was typed since
+async function flushSave(ctx) {
+  clearTimeout(saveTimer); saveTimer = null;
+  if (inflight) await inflight;
+  if (!editor || !dirty) return;
+  const ed = editor;
+  const id = ed.id; const title = ed.title.value; const body = ed.body.value;
+  saving = true; dirty = false;
+  let done; inflight = new Promise((r) => { done = r; });
+  const r = await pmPost('/api/notes/save', { id, title, body });
+  saving = false; inflight = null; done();
+  if (r && r.ok) {
+    savedAt = r.updated_at; saveError = null;
+    const n = cache.get(id); if (n) { n.title = title; n.body = body; n.updated_at = r.updated_at; touchRow(n); }
+  } else { dirty = true; saveError = (r && r.error) || 'not saved'; }
+  if (dirty && !saveError) scheduleSave(ctx);     // typed while the save was in flight
+  paintSaveState();
+}
+function scheduleSave(ctx) { dirty = true; clearTimeout(saveTimer); saveTimer = setTimeout(() => flushSave(ctx), SAVE_MS); paintSaveState(); }
+function saveWords() {
+  if (saveError) return 'Not saved: ' + saveError;
+  if (saving || (dirty && saveTimer)) return 'Saving …';
+  return savedAt ? 'Saved ' + nowClock(savedAt) : '';
+}
+function paintSaveState() { const n = typeof document !== 'undefined' && document.querySelector('[data-nt-saved]'); if (n) n.textContent = saveWords(); }
+
+async function stopAll(ctx, opts) { stopSpeech(); await stopAudio(ctx, opts); }
+async function newNote(ctx) {
+  await stopAll(ctx); await flushSave(ctx);
+  busy = 'new'; ctx.setState({});
+  const r = await pmPost('/api/notes/new', {});
+  busy = '';
+  if (r && r.ok) { cache.set(r.note.id, r.note); currentId = r.note.id; editor = null; savedAt = null; showList = false; if (list) list.notes = [rowOf(r.note), ...(list.notes || [])]; banner = null; }
+  else banner = { tone: 'bad', text: (r && r.error) || 'the note was not created' };
+  ctx.setState({});
+  requestAnimationFrame(() => { if (editor && editor.title) editor.title.focus(); });
+}
+async function selectNote(ctx, id) {
+  showList = false;
+  if (id === currentId) { ctx.setState({}); return; }
+  await stopAll(ctx); await flushSave(ctx);
+  currentId = id; editor = null; savedAt = null; saveError = null; banner = null;
+  ctx.setState({});
+  loadNote(ctx, id);
+}
+async function deleteNote(ctx, n) {
+  const sure = await askConfirm({ title: 'Delete this note?', body: '"' + (n.title || 'Untitled note') + '" and its transcript and summaries are deleted from this machine. This cannot be undone.', confirmLabel: 'Delete note', danger: true });
+  if (!sure) return;
+  await stopAll(ctx, { discard: true }); clearTimeout(saveTimer); dirty = false;
+  const r = await pmPost('/api/notes/delete', { id: n.id });
+  if (r && r.ok) { cache.delete(n.id); currentId = null; editor = null; if (list) list.notes = (list.notes || []).filter((x) => x.id !== n.id); if (list && list.notes.length) currentId = list.notes[0].id; banner = { tone: 'ok', text: 'The note was deleted.' }; }
+  else banner = { tone: 'bad', text: (r && r.error) || 'the note was not deleted' };
+  ctx.setState({});
+}
+async function setPrivate(ctx, n, priv) {
+  // a private press drops what is still buffered: nothing more is sent, transcribed or summarized
+  if (priv) await stopAll(ctx, { discard: true });
+  const r = await pmPost('/api/notes/private', { id: n.id, private: priv });
+  if (r && r.ok) { n.private = r.private; touchRow(n); banner = priv ? { tone: 'ok', text: 'Marked private. Listening stopped, and nothing from this note goes to Jev or to any agent.' } : null; }
+  else banner = { tone: 'bad', text: (r && r.error) || 'not changed' };
+  ctx.setState({});
+}
+async function summarize(ctx, n, quiet = false) {
+  await flushSave(ctx);
+  busy = 'summary'; ctx.setState({});
+  const r = await pmPost('/api/notes/summarize', { id: n.id });
+  busy = '';
+  if (r && r.ok) { n.summary = r.summary; banner = null; } else if (!quiet) banner = { tone: 'bad', text: (r && r.error) || 'no summary was made' };
+  ctx.setState({});
+}
+async function summarizeAgent(ctx, n) {
+  await flushSave(ctx);
+  busy = 'agent'; ctx.setState({});
+  const ws = wsOf(ctx) || undefined;
+  const r = await pmPost('/api/notes/summarize-agent', ws ? { id: n.id, ws } : { id: n.id });
+  busy = '';
+  if (r && r.ok) {
+    n.agent = { requested_at: new Date().toISOString(), started: r.started, reason: r.reason, session: r.session, withheld: r.withheld, markdown: null, out: r.out };
+    banner = r.started
+      ? { tone: 'ok', text: 'An agent session started to write the summary' + (r.withheld ? ' (' + r.withheld + ' secret-shaped line' + (r.withheld === 1 ? ' was' : 's were') + ' withheld from it)' : '') + '. It appears here when the session writes it.' }
+      : { tone: 'bad', text: 'No agent session started: ' + (r.reason || 'the workspace gave no reason') + '. The local summary still works.' };
+    pollAgent(ctx, n.id);
+  } else banner = { tone: 'bad', text: (r && r.error) || 'the agent summary was not started' };
+  ctx.setState({});
+}
+function pollAgent(ctx, id) {
+  clearTimeout(agentTimer);
+  agentTimer = setTimeout(async () => {
+    agentTimer = null;
+    const n = cache.get(id);
+    if (!n || !n.agent || n.agent.markdown || currentId !== id) return;
+    const r = await loadNote(ctx, id);
+    if (r && r.ok && !(r.note.agent && r.note.agent.markdown)) pollAgent(ctx, id);
+  }, AGENT_POLL_MS);
+}
+async function copyMarkdown(ctx, n) {
+  const text = noteMarkdown({ ...n, title: editor ? editor.title.value : n.title, body: editor ? editor.body.value : n.body });
+  try { await navigator.clipboard.writeText(text); banner = { tone: 'ok', text: 'The note is on the clipboard as Markdown.' }; }
+  catch { banner = { tone: 'bad', text: 'The clipboard was not available. Select the text and copy it instead.' }; }
+  ctx.setState({});
+}
+async function unpick(ctx, n, x) {
+  const r = await pmPost('/api/notes/label', { id: n.id, index: x.index, cat: x.cat, drop: true });
+  if (r && r.ok) { n.transcript[x.index] = r.segment; } else banner = { tone: 'bad', text: (r && r.error) || 'not changed' };
+  ctx.setState({});
+}
+async function renameSpeaker(ctx, n, source) {
+  const name = await askText({ title: 'Name this speaker', label: 'Name', value: n.speakers && n.speakers[source] ? n.speakers[source] : '', placeholder: SPEAKER[source], confirmLabel: 'Save' });
+  if (name == null) return;
+  const r = await pmPost('/api/notes/speaker', { id: n.id, source, name });
+  if (r && r.ok) n.speakers = r.speakers; else banner = { tone: 'bad', text: (r && r.error) || 'not renamed' };
+  ctx.setState({});
+}
+
+/* ── listening with local Whisper ─────────────────────────────────────────────────────────────── */
+async function openSource(kind) {
+  const md = navigator.mediaDevices;
+  if (kind === 'mic') return md.getUserMedia({ audio: { echoCancellation: true, noiseSuppression: true, channelCount: 1 } });
+  const s = await md.getDisplayMedia({ video: true, audio: { echoCancellation: false, noiseSuppression: false, autoGainControl: false }, systemAudio: 'include' });
+  const tracks = s.getAudioTracks();
+  for (const t of s.getVideoTracks()) t.stop();           // only the sound is used
+  if (!tracks.length) throw Object.assign(new Error('The shared tab or window has no audio. Share it again and tick "Share tab audio".'), { noAudio: true });
+  return new MediaStream(tracks);
+}
+async function startAudio(ctx, n, want) {
+  const a = { id: n.id, state: 'starting', sources: [], streams: [], ctx: null, started: Date.now(), clock: null, msg: null, queue: {}, buf: {}, ended: 0 };
+  const opened = [];
+  // the meeting first, straight from the press: the browser lets a page share a screen only right after a click
+  for (const kind of want.slice().sort((x, y) => (x === 'meeting' ? -1 : y === 'meeting' ? 1 : 0))) {
+    try { opened.push([kind, await openSource(kind)]); }
+    catch (e) { a.msg = (a.msg ? a.msg + ' ' : '') + (kind === 'mic' ? 'The microphone was not opened' : 'The meeting audio was not opened') + ': ' + ((e && e.noAudio) ? e.message : ((e && e.message) || 'permission was refused') + '.'); }
+  }
+  await stopAll(ctx); await flushSave(ctx);
+  audio = a; ctx.setState({});
+  if (!opened.length) { audio = null; banner = { tone: 'bad', text: a.msg || 'Nothing to listen to.' }; ctx.setState({}); return; }
+  const r = await pmPost('/api/notes/record', wsOf(ctx) ? { id: n.id, ws: wsOf(ctx) } : { id: n.id });
+  if (!r || !r.ok) { for (const [, s] of opened) for (const t of s.getTracks()) t.stop(); audio = null; banner = { tone: 'bad', text: (r && r.error) || 'listening did not start' }; ctx.setState({}); return; }
+  n.recorded_from = r.recorded_from;
+  // the clock counts from the note's first Listen, as the line times do
+  a.started = Date.parse(r.recorded_from) || a.started;
+  let ac;
+  try { ac = new AudioContext({ sampleRate: RATE }); } catch { ac = new AudioContext(); }
+  a.ctx = ac;
+  const sink = ac.createGain(); sink.gain.value = 0; sink.connect(ac.destination);
+  for (const [kind, stream] of opened) {
+    a.streams.push(stream); a.sources.push(kind); a.buf[kind] = []; a.queue[kind] = Promise.resolve();
+    const src = ac.createMediaStreamSource(stream);
+    const proc = ac.createScriptProcessor(4096, 1, 1);
+    proc.onaudioprocess = (e) => {
+      if (audio !== a) return;
+      const s = toInt16(e.inputBuffer.getChannelData(0), ac.sampleRate);
+      const b = a.buf[kind]; for (let i = 0; i < s.length; i++) b.push(s[i]);
+      if (b.length >= CHUNK_SAMPLES) sendChunk(ctx, a, kind, false);
+    };
+    src.connect(proc); proc.connect(sink);
+    for (const t of stream.getTracks()) t.addEventListener('ended', () => { if (audio !== a) return; a.ended++; if (a.ended >= a.streams.length) stopAudio(ctx); });
+  }
+  a.state = 'on';
+  a.clock = setInterval(() => { const c = typeof document !== 'undefined' && document.querySelector('[data-nt-clock]'); if (c) c.textContent = fmtTime(Date.now() - a.started); }, 1000);
+  ctx.setState({});
+  poll(ctx, n.id);
+}
+function sendChunk(ctx, a, kind, final) {
+  const b = a.buf[kind] || []; a.buf[kind] = [];
+  const pcm = b64(Int16Array.from(b));
+  a.queue[kind] = a.queue[kind].then(async () => {
+    const r = await pmPost('/api/notes/audio', { id: a.id, source: kind, pcm, final });
+    if (r && !r.ok && (r.status === 409 || r.status === 404) && audio === a) { banner = { tone: 'bad', text: 'Listening stopped: ' + r.error + '.' }; stopAudio(ctx); }
+  }).catch(() => {});
+  return a.queue[kind];
+}
+async function stopAudio(ctx, { discard = false } = {}) {
+  const a = audio;
+  if (!a) return;
+  audio = null;
+  clearInterval(a.clock);
+  for (const s of a.streams) for (const t of s.getTracks()) { try { t.stop(); } catch { /* stopped */ } }
+  try { if (a.ctx) await a.ctx.close(); } catch { /* closed */ }
+  if (discard) { ctx.setState({}); return; }
+  // the rest of what was said, then the summary once the last line is transcribed
+  await Promise.all(a.sources.map((k) => sendChunk(ctx, a, k, true)));
+  ctx.setState({});
+  const n = cache.get(a.id);
+  if (!n || n.private) return;
+  const t0 = Date.now();
+  for (;;) {
+    const r = await loadNote(ctx, a.id);
+    if (!r || !r.ok || !r.audio || !r.audio.pending || Date.now() - t0 > 60000) break;
+    await new Promise((res) => setTimeout(res, 800));
+  }
+  const fresh = cache.get(a.id);
+  if (fresh && (fresh.transcript || []).length) await summarize(ctx, fresh, true);
+  poll(ctx, a.id);
+}
+
+/* ── listening with the browser's on-device recognition: the microphone only, when Whisper is not set up ─────────── */
+const SRClass = () => (typeof window !== 'undefined' ? window.SpeechRecognition || window.webkitSpeechRecognition : null);
+function stopSpeech() {
+  if (!speech) return;
+  const s = speech; speech = null;
+  clearInterval(s.clock);
+  if (s.rec) { s.rec.onend = null; try { s.rec.stop(); } catch { /* already stopped */ } }
+}
+async function onFinal(ctx, s, text) {
+  if (s.mode === 'record') {
+    const r = await pmPost('/api/notes/transcript', { id: s.id, text });
+    const n = cache.get(s.id);
+    if (r && r.ok && n) { n.transcript = (n.transcript || []).concat((r.added || []).map(({ index, ...x }) => x)); touchRow(n); poll(ctx, s.id); }
+    else if (r && !r.ok) { banner = { tone: 'bad', text: 'A phrase was not added to the transcript: ' + r.error }; if (r.status === 409) stopSpeech(); }
+    ctx.setState({});
+    return;
+  }
+  // dictation: the server cleans the phrase and resolves the spoken commands; the page applies them at the cursor
+  const r = await pmPost('/api/notes/dictate', { text });
+  if (!r || !r.ok || !editor || editor.id !== s.id) return;
+  const ta = editor.body;
+  const focused = document.activeElement === ta;
+  const sel = focused ? [ta.selectionStart, ta.selectionEnd] : (editor.sel || [ta.value.length, ta.value.length]);
+  const out = applyOps(ta.value, sel, r.ops, s.last);
+  ta.value = out.value; editor.sel = out.sel; s.last = out.last; fitBody();
+  if (focused) { try { ta.setSelectionRange(out.sel[0], out.sel[1]); } catch { /* detached */ } }
+  scheduleSave(ctx);
+}
+async function startSpeech(ctx, n, mode, install = false) {
+  await stopAll(ctx);
+  await flushSave(ctx);
+  const C = SRClass();
+  const lang = (typeof navigator !== 'undefined' && navigator.language) || 'en-US';
+  const s = { mode, id: n.id, state: 'checking', rec: null, interim: '', lang, msg: null, last: null, queue: Promise.resolve(), started: Date.now() };
+  speech = s; ctx.setState({});
+  if (!C || typeof C.available !== 'function') {
+    s.state = 'unsupported';
+    s.msg = 'This browser cannot recognise speech on this device, and notes never send audio away. Set up local transcription in Settings, or type.';
+    ctx.setState({}); return;
+  }
+  try {
+    if (install) { s.state = 'installing'; ctx.setState({}); await C.install({ langs: [lang], processLocally: true }); }
+    const av = await C.available({ langs: [lang], processLocally: true });
+    if (speech !== s) return;
+    if (av === 'downloadable' || av === 'downloading') { s.state = 'needs-install'; s.msg = 'Recognising ' + lang + ' on this device needs a one-time download by the browser.'; ctx.setState({}); return; }
+    if (av !== 'available') { s.state = 'unsupported'; s.msg = 'This browser cannot recognise ' + lang + ' on this device, and notes never send audio away. Set up local transcription in Settings, or type.'; ctx.setState({}); return; }
+  } catch (e) { s.state = 'error'; s.msg = 'Speech recognition did not start: ' + ((e && e.message) || e); ctx.setState({}); return; }
+  if (mode === 'record') {
+    const r = await pmPost('/api/notes/record', wsOf(ctx) ? { id: n.id, ws: wsOf(ctx) } : { id: n.id });
+    if (!r || !r.ok) { s.state = 'error'; s.msg = (r && r.error) || 'listening did not start'; ctx.setState({}); return; }
+    n.recorded_from = r.recorded_from;
+    s.started = Date.parse(r.recorded_from) || s.started;
+  }
+  if (speech !== s) return;
+  const rec = new C();
+  rec.lang = lang; rec.continuous = true; rec.interimResults = true; rec.processLocally = true;
+  rec.onresult = (e) => {
+    if (speech !== s) return;      // a result after Stop or Private is dropped, never stored
+    let interim = '';
+    for (let i = e.resultIndex; i < e.results.length; i++) {
+      const res = e.results[i]; const t = String((res[0] && res[0].transcript) || '').trim();
+      if (!t) continue;
+      // one phrase at a time, in the order spoken, so "scratch that" removes the phrase before it
+      if (res.isFinal) s.queue = s.queue.then(() => onFinal(ctx, s, t)).catch(() => {}); else interim += (interim ? ' ' : '') + t;
+    }
+    s.interim = interim;
+    const live = typeof document !== 'undefined' && document.querySelector('[data-nt-interim]');
+    if (live) live.textContent = interim; else ctx.setState({});
+  };
+  rec.onerror = (e) => {
+    if (e && (e.error === 'no-speech' || e.error === 'aborted')) return;
+    s.state = 'error'; s.msg = 'Listening stopped: ' + ((e && (e.message || e.error)) || 'the browser gave no reason') + '.'; ctx.setState({});
+  };
+  // the browser ends a recognition after a silence; while the PM has not pressed Stop, it starts again
+  rec.onend = () => { if (speech === s && s.state === 'on') { try { rec.start(); } catch { /* it is starting */ } } };
+  s.rec = rec;
+  try { rec.start(); s.state = 'on'; } catch (e) { s.state = 'error'; s.msg = 'Listening did not start: ' + ((e && e.message) || e); }
+  if (mode === 'record') { s.clock = setInterval(() => { const c = typeof document !== 'undefined' && document.querySelector('[data-nt-clock]'); if (c) c.textContent = fmtTime(Date.now() - s.started); }, 1000); poll(ctx, n.id); }
+  ctx.setState({});
+}
+async function stopRecording(ctx) {
+  const s = speech;
+  if (s && s.mode === 'record') {
+    clearInterval(s.clock); stopSpeech();
+    await s.queue;
+    const n = cache.get(s.id);
+    if (n && !n.private && (n.transcript || []).length) await summarize(ctx, n, true);
+  }
+  await stopAudio(ctx);
+  ctx.setState({});
+}
+
+/* ── the two sheets: what to listen to, and settings ─────────────────────────────────────────── */
+async function chooseSources(ctx, n) {
+  const eng = engine && engine.ws === wsOf(ctx) && engine.whisper ? engine : await loadEngine(ctx);
+  const local = !!(eng.whisper && eng.whisper.ready);
+  const mic = field({ label: 'My microphone', kind: 'check', value: true, attrs: { 'data-nt-src-mic': '' } });
+  const meet = field({ label: 'The meeting', kind: 'check', value: local, attrs: { 'data-nt-src-meeting': '', disabled: !local } });
+  const body = [mic, meet,
+    el('p', { class: 'nt-hint' }, local ? 'Pick the meeting\'s tab or window next, and tick "Share tab audio".' : 'The meeting can be heard once local transcription is set up in Settings. Until then the microphone is recognised by the browser on this device.'),
+    el('p', { class: 'nt-consent', 'data-nt-consent': '' }, 'Speech is transcribed on this ' + (local ? 'machine' : 'device') + '. Let people know you\'re taking notes.')];
+  let h = null;
+  const go = () => {
+    const want = [mic.control.checked && 'mic', local && meet.control.checked && 'meeting'].filter(Boolean);
+    h.close();
+    if (!want.length) return;
+    if (local) startAudio(ctx, n, want); else startSpeech(ctx, n, 'record');
+  };
+  h = sheet({ title: 'Listen to', body, attrs: { 'data-nt-chooser': '' },
+    actions: [button({ label: 'Cancel', variant: 'ghost', onClick: () => h.close() }), button({ label: 'Start', variant: 'primary', onClick: go, attrs: { 'data-nt-start': '' } })] });
+}
+async function setSwitch(ctx, patch) {
+  const ws = wsOf(ctx);
+  if (!ws) return;
+  const r = await pmPost('/api/notes/switch', { ws, ...patch });
+  if (r && r.ok) engine = { ws, whisper: r.whisper, jev: r.jev, at: Date.now() };
+  ctx.setState({});
+  return r;
+}
+async function whisperSetup(ctx) {
+  const ws = wsOf(ctx);
+  const r = await pmPost('/api/notes/whisper-setup', ws ? { ws } : {});
+  banner = r && r.ok && r.started
+    ? { tone: 'ok', text: 'A terminal opened with the setup commands typed in. Read them and press Enter there. The model is ' + ((engine && engine.whisper && engine.whisper.model_size) || 'about 1.6 GB') + '. Then open Settings again.' }
+    : { tone: 'bad', text: 'No terminal opened' + (r && r.reason ? ': ' + r.reason : '') + '. Run this in a terminal: ' + ((r && r.command) || '') };
+  ctx.setState({});
+}
+function openSettings(ctx, n) {
+  const draw = (h) => {
+    const eng = engine || {};
+    const w = eng.whisper; const j = eng.jev;
+    const parts = [];
+    parts.push(el('div', { class: 'nt-set', 'data-nt-whisper': w ? (w.ready ? 'ready' : 'missing') : 'unknown' },
+      el('div', { class: 'nt-set__head' }, 'Local transcription'),
+      el('p', { class: 'nt-hint' }, !w ? 'Reading …' : w.ready ? 'Whisper is set up. The microphone and the meeting are transcribed on this machine.'
+        : 'Whisper is not set up (' + w.missing.map((m) => (m === 'program' ? 'the program' : 'the model, ' + w.model_size)).join(' and ') + ' missing). The setup installs whisper.cpp with Homebrew and downloads the model.'),
+      w && !w.ready ? button({ label: 'Set up in a terminal', onClick: () => { h.close(); whisperSetup(ctx); }, attrs: { 'data-nt-whisper-setup': '' } }) : null));
+    if (!wsOf(ctx)) parts.push(el('p', { class: 'nt-hint' }, 'Choose a repository to check notes against it.'));
+    else {
+      const jsw = field({ label: 'Label lines with Jev', kind: 'check', value: !!(j && j.jev), onCommit: (v) => setSwitch(ctx, { jev: v }).then(() => { h.close(); openSettings(ctx, n); }), attrs: { 'data-nt-sw-jev': '' } });
+      const csw = field({ label: 'Check notes against this repository with Jev', kind: 'check', value: !!(j && j.check), onCommit: (v) => setSwitch(ctx, { check: v }).then(() => { h.close(); openSettings(ctx, n); }), attrs: { 'data-nt-sw-check': '' } });
+      parts.push(el('div', { class: 'nt-set' }, el('div', { class: 'nt-set__head' }, 'Jev'), jsw, csw,
+        el('p', { class: 'nt-hint', 'data-nt-gates': '' }, j && j.paused ? j.paused : j && j.sentence ? j.sentence + ' Lines get the local label and the local repository match.'
+          : j && j.check_open ? 'Each line and, for a captured line, one repository passage go to TypeSafe. Audio, names and private notes never do.'
+            : j && j.label_open ? 'Each line goes to TypeSafe for its label. Audio, names and private notes never do.' : 'Off. Lines get the local label and the local repository match.')));
+    }
+    parts.push(el('div', { class: 'nt-set' }, el('div', { class: 'nt-set__head' }, 'This note'),
+      n.private ? el('p', { class: 'nt-hint' }, 'Private: it is not recorded and nothing from it goes to Jev or to any agent.') : null,
+      el('div', { class: 'nt-row' },
+        button({ label: n.private ? 'Mark not private' : 'Mark private', onClick: () => { h.close(); setPrivate(ctx, n, !n.private); }, attrs: { [n.private ? 'data-nt-unprivate' : 'data-nt-mark-private']: '' } }),
+        button({ label: busy === 'agent' ? 'Starting …' : 'Summary by agent', disabled: n.private || busy === 'agent', onClick: () => { h.close(); summarizeAgent(ctx, n); }, attrs: { 'data-nt-summarize-agent': '' } }),
+        button({ label: 'Delete', variant: 'ghost', onClick: () => { h.close(); deleteNote(ctx, n); }, attrs: { 'data-nt-delete': '' } }))));
+    return parts;
+  };
+  const h = sheet({ title: 'Settings', sub: 'Notes stay on this machine, outside every repository.', body: [], attrs: { 'data-nt-settings-sheet': '' } });
+  const paint = () => { h.body.replaceChildren(...draw(h).filter(Boolean)); };
+  paint();
+  loadEngine(ctx).then(() => { if (h.open) paint(); });
+}
+
+/* ── drawing ──────────────────────────────────────────────────────────────────────────────────── */
+function fitBody() {
+  if (!editor || !editor.body) return;
+  const t = editor.body;
+  t.style.setProperty('--nt-h', 'auto');
+  t.style.setProperty('--nt-h', Math.max(96, t.scrollHeight + 2) + 'px');
+}
+function editorFor(ctx, n) {
+  if (editor && editor.id === n.id) return editor;
+  const tf = field({ label: 'Title', kind: 'title', hideLabel: true, value: n.title || '', placeholder: 'Untitled meeting', attrs: { 'data-nt-title': '', class: 'nt-titlein' } });
+  const bf = field({ label: 'Your notes', kind: 'textarea', hideLabel: true, value: n.body || '', placeholder: 'Type your own notes. They steer the summary.',
+    attrs: { 'data-nt-body': '', class: 'nt-text', rows: 3 } });
+  const title = tf.control; const body = bf.control;
+  editor = { id: n.id, title, body, titleWrap: tf, bodyWrap: bf, sel: null };
+  const remember = () => { editor.sel = [body.selectionStart, body.selectionEnd]; };
+  title.addEventListener('input', () => scheduleSave(ctx));
+  body.addEventListener('input', () => { remember(); fitBody(); if (speech) speech.last = null; scheduleSave(ctx); });
+  for (const ev of ['keyup', 'mouseup', 'select', 'blur']) body.addEventListener(ev, remember);
+  title.addEventListener('blur', () => flushSave(ctx));
+  return editor;
+}
+function listening(n) {
+  if (audio && audio.id === n.id) return { kind: 'local', state: audio.state, sources: audio.sources, started: audio.started };
+  if (speech && speech.id === n.id && speech.mode === 'record' && (speech.state === 'on' || speech.state === 'checking')) return { kind: 'browser', state: speech.state, sources: ['mic'], started: speech.started };
+  return null;
+}
+function header(ctx, n, ed) {
+  const live = listening(n);
+  const when = el('span', { class: 'nt-when' }, dayOf(n.created_at) + ', ' + nowClock(n.created_at));
+  const left = el('div', { class: 'nt-headl' }, ed.titleWrap, when, el('span', { class: 'nt-saved', 'data-nt-saved': '' }, saveWords()));
+  const acts = [];
+  if (live) {
+    acts.push(el('span', { class: 'nt-live', 'data-nt-listening': live.kind, role: 'status' },
+      el('span', { class: 'nt-live-dot', 'aria-hidden': 'true' }),
+      el('span', { 'data-nt-clock': '' }, fmtTime(Date.now() - live.started)),
+      el('span', { 'data-nt-sources': '' }, ' · ' + (live.state === 'starting' || live.state === 'checking' ? 'starting' : ['mic', 'meeting'].filter((s) => live.sources.includes(s)).join(' + '))),
+      el('span', { class: 'nt-sr' }, ' Notes are being taken.')));
+    acts.push(button({ label: 'Stop', variant: 'danger', onClick: () => stopRecording(ctx), attrs: { 'data-nt-stop': '' } }));
+  } else if ((n.transcript || []).length) {
+    acts.push(button({ label: 'Copy as Markdown', variant: 'ghost', onClick: () => copyMarkdown(ctx, n), attrs: { 'data-nt-copy': '' } }));
+    if (!n.private) acts.push(button({ label: 'Listen again', variant: 'ghost', onClick: () => chooseSources(ctx, n), attrs: { 'data-nt-listen': 'again' } }));
+    acts.push(button({ label: busy === 'new' ? 'Creating …' : 'New meeting', disabled: busy === 'new', onClick: () => newNote(ctx), attrs: { 'data-nt-new': '' } }));
+  } else if (!n.private) {
+    acts.push(button({ label: 'Listen', variant: 'primary', onClick: () => chooseSources(ctx, n), attrs: { 'data-nt-listen': '' } }));
+  }
+  acts.push(button({ label: 'All notes', variant: 'ghost', onClick: () => { showList = !showList; ctx.setState({}); if (showList) loadList(ctx); }, attrs: { 'data-nt-all': '', 'aria-expanded': showList ? 'true' : 'false' } }));
+  acts.push(iconButton({ icon: 'settings', ariaLabel: 'Settings', onClick: () => openSettings(ctx, n), attrs: { 'data-nt-settings': '' } }));
+  return el('header', { class: 'nt-header', 'data-nt-part': 'header' }, left, el('div', { class: 'nt-acts' }, acts));
+}
+function listPane(ctx) {
+  const rows = (list && list.notes) || [];
+  return el('div', { class: 'nt-list', 'data-nt-part': 'list' },
+    button({ label: busy === 'new' ? 'Creating …' : 'New note', variant: 'primary', disabled: busy === 'new', onClick: () => newNote(ctx), attrs: { 'data-nt-new-list': '' } }),
+    rows.length ? el('div', { class: 'nt-rows' }, rows.map((r) => row({ title: r.title || 'Untitled note',
+      meta: [dayOf(r.updated_at) + ' ' + nowClock(r.updated_at), r.segments ? 'listened' : null, r.private ? 'private' : null],
+      onOpen: () => selectNote(ctx, r.id), openLabel: 'Open ' + (r.title || 'Untitled note'),
+      attrs: { 'data-nt-row': r.id, 'aria-current': r.id === currentId ? 'true' : 'false', class: r.id === currentId ? 'nt-row--current' : '' } })))
+      : empty({ text: list && list.state === 'loading' ? 'reading …' : 'No notes yet.' }));
+}
+function checkMark(x) {
+  const c = x.check;
+  if (!c || !c.doc) return null;
+  const where = c.doc + (c.line ? ' line ' + c.line : '');
+  if (c.verdict === 'differs') return el('span', { class: 'nt-flag', 'data-nt-check': 'differs', title: 'Jev rates it ' + (c.words || 'likely') + ' that this differs from ' + where }, '≠ ' + baseName(c.doc));
+  if (c.verdict === 'agrees') return el('span', { class: 'nt-ok', 'data-nt-check': 'agrees', title: 'Jev rates it ' + (c.words || 'likely') + ' that ' + where + ' already says this', role: 'img', 'aria-label': 'consistent with ' + baseName(c.doc) }, icon('check'));
+  return el('span', { class: 'nt-rel', 'data-nt-check': 'related', title: 'The closest passage in this repository: ' + where }, 'see ' + baseName(c.doc));
+}
+function sectionOf(ctx, n, key, title, items) {
+  if (!items.length) return null;
+  return el('section', { class: 'nt-sec', 'data-nt-sec': key },
+    el('h3', { class: 'nt-sec__h' }, title),
+    el('ul', { class: 'nt-items' }, items.map((x) => el('li', { class: 'nt-item', 'data-nt-item': String(x.index) },
+      el('span', { class: 'nt-item__text' },
+        key === 'action' && x.source && x.source !== 'speech' ? el('span', { class: 'nt-who' }, speakerOf(n, x.source) + ': ') : null,
+        x.text, ' ', checkMark(x)),
+      el('span', { class: 'nt-at' }, fmtTime(x.t)),
+      key === 'fact' ? null : iconButton({ icon: 'x', ariaLabel: 'Remove from ' + title, onClick: () => unpick(ctx, n, x), size: 'sm', attrs: { 'data-nt-unpick': String(x.index) } })))));
+}
+function summarySection(ctx, n) {
+  const a = n.agent;
+  if (a && a.markdown) {
+    let blocks = [];
+    try { blocks = mdRender(a.markdown).blocks || []; } catch { blocks = [el('div', { class: 'nt-pre' }, a.markdown)]; }
+    return el('section', { class: 'nt-sec', 'data-nt-summary': 'agent' }, el('h3', { class: 'nt-sec__h' }, 'Summary'), el('div', { class: 'nt-md' }, blocks), el('p', { class: 'nt-hint' }, 'Written by your agent session.'));
+  }
+  const ov = n.summary && n.summary.sections && n.summary.sections.overview;
+  const out = [];
+  if (a && a.started && !a.markdown) out.push(el('p', { class: 'nt-hint', 'data-nt-agent-wait': '' }, 'Waiting for your agent session to write the summary.'));
+  else if (a && a.started === false && a.reason) out.push(el('p', { class: 'nt-hint', 'data-nt-agent-failed': '' }, 'No agent session started: ' + a.reason + '.'));
+  if (!ov || !ov.length) return out.length ? el('section', { class: 'nt-sec' }, out) : null;
+  return el('section', { class: 'nt-sec', 'data-nt-summary': 'local' }, el('h3', { class: 'nt-sec__h' }, 'Summary'),
+    el('ul', { class: 'nt-items' }, ov.map((x) => el('li', { class: 'nt-item nt-item--plain' }, el('span', { class: 'nt-item__text' }, x.text)))),
+    el('p', { class: 'nt-hint' }, 'Picked from what was said, on this machine.'), ...out);
+}
+function noteColumn(ctx, n, ed) {
+  const live = listening(n);
+  const c = caught(n);
+  const parts = [summarySection(ctx, n), ed.bodyWrap];
+  const sp = speech && speech.id === n.id ? speech : null;
+  const bar = [];
+  if (sp && sp.mode === 'dictate' && sp.state === 'on') bar.push(el('span', { class: 'nt-hint', 'data-nt-listening': 'dictate', role: 'status' }, 'Dictating into your notes.'), button({ label: 'Stop dictating', variant: 'ghost', onClick: () => { stopSpeech(); ctx.setState({}); }, attrs: { 'data-nt-stop-dictate': '' } }));
+  else if (!live) bar.push(button({ label: sp && sp.mode === 'dictate' && (sp.state === 'checking' || sp.state === 'installing') ? 'Starting …' : 'Dictate', variant: 'ghost', onClick: () => startSpeech(ctx, n, 'dictate'), attrs: { 'data-nt-dictate': '' } }));
+  if (sp && sp.state === 'needs-install') bar.push(button({ label: 'Download for ' + sp.lang, onClick: () => startSpeech(ctx, n, sp.mode, true), attrs: { 'data-nt-install': '' } }));
+  parts.push(el('div', { class: 'nt-row' }, bar));
+  if (sp && sp.msg && sp.state !== 'on') parts.push(el('p', { class: 'nt-hint', 'data-nt-listen-msg': sp.state }, sp.msg));
+  if (n.__audio && n.__audio.error && live) parts.push(el('p', { class: 'nt-hint nt-hint--bad', 'data-nt-audio-error': '' }, n.__audio.error));
+  const secs = SECTIONS.map(([k, t]) => sectionOf(ctx, n, k, t, c[k])).filter(Boolean);
+  if (!live && (n.transcript || []).length) { const f = sectionOf(ctx, n, 'fact', 'Facts mentioned', c.fact); if (f) secs.push(f); }
+  if (secs.length) parts.push(...secs);
+  else parts.push(el('p', { class: 'nt-hint', 'data-nt-caught-hint': '' }, live ? 'Listening …' : (n.transcript || []).length ? 'Nothing was caught as a decision, action or question.'
+    : 'Decisions, actions and questions appear here as they are said, each checked against this repository.'));
+  return el('section', { class: 'nt-notecol', 'data-nt-part': 'notes' }, parts.filter(Boolean));
+}
+function transcriptColumn(ctx, n) {
+  const tr = n.transcript || [];
+  const live = listening(n);
+  const lines = tr.map((x, i) => {
+    const lab = x.cat && x.cat !== 'small talk' ? el('span', { class: 'nt-lab', 'data-nt-cat': x.cat }, x.cat) : null;
+    const who = speakerOf(n, x.source);
+    const spk = x.source === 'meeting'
+      ? button({ label: who, variant: 'ghost', size: 'sm', onClick: () => renameSpeaker(ctx, n, 'meeting'), attrs: { 'data-nt-spk': 'meeting', title: 'Name this speaker' } })
+      : el('span', { class: 'nt-spk', 'data-nt-spk': x.source || 'speech' }, who);
+    return el('div', { class: 'nt-ln' + (['decision', 'action', 'question'].includes(x.cat) ? ' nt-ln--picked' : ''), 'data-nt-seg': String(i) },
+      el('div', { class: 'nt-ln__meta' }, spk, el('span', { class: 'nt-at' }, fmtTime(x.t)), lab), el('div', null, x.text));
+  });
+  const sp = speech && speech.id === n.id && speech.mode === 'record' && speech.state === 'on' ? speech : null;
+  if (sp) lines.push(el('div', { class: 'nt-ln nt-ln--interim', 'data-nt-interim': '', 'aria-live': 'polite' }, sp.interim || ''));
+  const pending = n.__audio && n.__audio.pending;
+  if (!lines.length) lines.push(el('p', { class: 'nt-hint' }, live ? 'Waiting for speech …' : 'The transcript runs here.'));
+  else if (live && pending) lines.push(el('p', { class: 'nt-hint', 'data-nt-pending': '' }, 'Transcribing …'));
+  const box = el('div', { class: 'nt-lines', 'data-nt-transcript': '' }, lines);
+  if (live) requestAnimationFrame(() => { box.scrollTop = box.scrollHeight; });
+  return el('aside', { class: 'nt-trans', 'data-nt-part': 'transcript' }, el('h3', { class: 'nt-sec__h' }, 'Transcript'), box);
+}
+
+export function renderBoard(inner, ctx) {
+  const { FIXTURE } = ctx;
+  ensureComponentsCss();
+  if (FIXTURE) { inner.appendChild(el('p', { class: 'nt-hint' }, 'The fixture keeps no notes.')); return; }
+  if (!list) loadList(ctx);
+  if (!engine || engine.ws !== wsOf(ctx)) { if (!engine || !engine.loading || engine.ws !== wsOf(ctx)) loadEngine(ctx); }
+
+  const focus = typeof document !== 'undefined' && editor && (document.activeElement === editor.body ? 'body' : document.activeElement === editor.title ? 'title' : null);
+  const caret = focus ? [editor[focus].selectionStart, editor[focus].selectionEnd] : null;
+
+  const wrap = el('div', { class: 'nt-wrap', 'data-nt-part': 'view' });
+  if (list && list.state === 'error') wrap.appendChild(el('div', { class: 'nt-banner nt-banner--bad', role: 'alert' }, list.error));
+  if (banner) wrap.appendChild(el('div', { class: 'nt-banner' + (banner.tone === 'bad' ? ' nt-banner--bad' : ''), 'data-nt-banner': banner.tone, role: banner.tone === 'bad' ? 'alert' : 'status' }, banner.text));
+  const n = currentId ? cache.get(currentId) : null;
+  if (currentId && !n) { loadNote(ctx, currentId); wrap.appendChild(el('p', { class: 'nt-hint' }, 'reading the note …')); }
+  else if (!n) {
+    wrap.appendChild(el('div', { class: 'nt-start' },
+      el('h2', { class: 'nt-h' }, 'Notes'),
+      el('p', { class: 'nt-hint', 'data-nt-about': '' }, 'Take notes in a meeting. PMOS listens on this machine, catches the decisions, actions and questions, and checks them against your repository. No audio leaves this machine, and notes are kept outside every repository.'),
+      list && list.state === 'loading' ? el('p', { class: 'nt-hint' }, 'reading …')
+        : button({ label: busy === 'new' ? 'Creating …' : 'New meeting', variant: 'primary', disabled: busy === 'new', onClick: () => newNote(ctx), attrs: { 'data-nt-new': '' } })));
+  } else {
+    const ed = editorFor(ctx, n);
+    wrap.appendChild(header(ctx, n, ed));
+    if (showList) wrap.appendChild(listPane(ctx));
+    if (n.private) wrap.appendChild(el('p', { class: 'nt-hint', 'data-nt-private': '' }, 'This note is private: it is not recorded, and nothing from it goes to Jev or to any agent.'));
+    wrap.appendChild(el('div', { class: 'nt-body2' }, noteColumn(ctx, n, ed), transcriptColumn(ctx, n)));
+    if (n.agent && n.agent.started && !n.agent.markdown && !agentTimer) pollAgent(ctx, n.id);
+    requestAnimationFrame(fitBody);
+  }
+  inner.appendChild(wrap);
+  // the redraw moves the fields, which blurs them; focus comes back in a microtask, after the frame is attached and before the
+  // next key event, so no keystroke lands while the field is detached
+  if (caret) queueMicrotask(() => { try { const t = editor[focus]; if (t.isConnected) { t.focus(); t.setSelectionRange(caret[0], caret[1]); } } catch { /* the field is gone */ } });
+}