create-pmos 0.252.0 → 0.254.0

package/workspace/public/pm/premium.js

@@ -0,0 +1,272 @@
+/* pm/premium.js — the premium Briefing page (initiative briefing-premium, slice 1). Reads GET /api/briefing-premium and draws the model
+ * lib/briefing-premium.js builds: the hero, "What you need to do", Today, the dock and the standard dialog. The read is one GET; the only writes are the PM's own presses (slice 2, below). A row clears when the repository's record changes, so there is nothing to press to clear it.
+ * Slice 2 (initiative briefing-premium-writes): the buttons that record the PM's own calls post to /api/briefing-premium/{decide,put-off,return}.
+ * Slice 3: the reply box asks a read-only agent. A control with nothing honest to write stays disabled and says why. */
+import { pmPost } from './http.js';
+import { $, $$, esc, store, THEME_KEY, RM, AI, S, theme, toast, kv, H, openDlg, closeDlg, setTab, setMode, CHECK, CHEV, ptx, turnA, turnU, H1, H2, P1, UL, logHtml, loadThread, onScroll, wireRail } from './premium-shell.js';
+const ICON = {
+  meeting: '<rect x="4" y="5" width="16" height="15" rx="3"/><path d="M4 10h16M9 3v4M15 3v4"/>',
+  merge: '<circle cx="6" cy="6" r="2"/><circle cx="6" cy="18" r="2"/><circle cx="18" cy="9" r="2"/><path d="M6 8v8M18 11c0 4-6 3-12 5"/>',
+  run: '<path d="M13 3 5 14h6l-1 7 8-11h-6z"/>',
+};
+const SRC = { meeting: 'Calendar', merge: 'Merges', run: 'Agent runs' };
+let M = null;            // the model
+const on = new Set(Object.keys(SRC));
+const pinned = new Set();
+
+wireRail('brief');
+
+/* ── a day's baseline, kept on this device, so "N of M done" counts rows that cleared since the page first read today ────── */
+const dayKey = () => { const d = new Date(); return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0'); };
+function baseline(keys) {
+  const k = 'pmos.premium.base.' + dayKey();
+  let seen = [];
+  try { seen = JSON.parse(store.get(k) || '[]'); } catch { seen = []; }
+  const all = [...new Set([...seen, ...keys])];
+  store.set(k, JSON.stringify(all));
+  return all;
+}
+
+/* ── hero ───────────────────────────────────────────────────────────────────────────────────────────────── */
+function drawHero() {
+  $('#date').textContent = M.date;
+  $('#brief').innerHTML = M.hero.map((s) => s.parts.map((p) => (p.s ? `<span class="k">${esc(p.t)}</span>` : esc(p.t))).join('')).join(' ');
+  $('#snap').textContent = M.header.text;
+  $('#snap').title = M.header.missing.length ? 'A source that cannot be read adds nothing. It is named here, and the page does not guess.' : 'Every figure on this page comes from a record in the repository.';
+}
+
+/* ── rows ───────────────────────────────────────────────────────────────────────────────────────────────── */
+const STAMP = (n) => String(n).padStart(2, '0');
+function drawRows() {
+  const rows = M.list.rows, L = $('#rank');
+  const keys = rows.map((r) => r.key), off = (M.list.putOff || []).map((x) => x.key);   // a row put off is not done: it leaves both counts and is named below the list
+  const base = (M.pending ? keys : baseline(keys)).filter((k) => !off.includes(k)), done = base.filter((k) => !keys.includes(k)).length, total = base.length;
+  const order = rows.slice().sort((a, b) => (pinned.has(b.key) - pinned.has(a.key)) || (a.n - b.n));
+  L.innerHTML = order.map((r, i) => `<div class="rr${i < 3 ? ' lead' : ''}${i === 0 ? ' first' : ''}" data-key="${esc(r.key)}"${linkOf(r) ? ` data-link="${esc(linkOf(r))}"` : ''}><button class="rhd" aria-haspopup="dialog"><span class="rn">${STAMP(i + 1)}</span><span><span class="rt">${esc(r.title)}${i === 0 ? '<em class="tgf">Do this first</em>' : ''}</span><span class="rs">${r.product ? `<b class="pn">${esc(r.product)}</b>` : ''}${esc(r.subject)}</span><span class="sug"><span>${esc(r.prepared)}</span></span><span class="skip">${esc(r.skip)}</span></span></button><button class="rpin" data-pin="${esc(r.key)}" aria-pressed="${pinned.has(r.key)}" aria-label="Pin ${esc(r.title)} to the top" title="Pin to the top"><svg class="i" viewBox="0 0 24 24"><path d="M9 4h6l-1 6 3 3H7l3-3zM12 13v7"/></svg></button></div>`).join('')
+    + (M.list.more ? `<p class="note">${M.list.more} more ${M.list.more === 1 ? 'row is' : 'rows are'} not shown here.</p>` : '');
+  const n = M.list.count;
+  $('#movesCap').innerHTML = M.pending ? `${n} ${n === 1 ? 'row' : 'rows'} so far · still reading` : n ? `<b>${done} of ${total}</b> done · ${n} ${n === 1 ? 'row' : 'rows'} left` : 'All clear';
+  $('#movesCap').title = 'Counts rows that cleared since this page first read today. A row clears when its record changes.';
+  const p = $('#mprog'); p.hidden = !total || !!M.pending; p.setAttribute('aria-valuemax', total); p.setAttribute('aria-valuenow', done); $('b', p).style.width = (total ? done / total * 100 : 0) + '%';
+  $('#calm').hidden = n > 0 || !!M.pending; $('#calmNext').textContent = '';
+  $('#order').textContent = M.pending ? M.list.pendingNote : n ? M.list.order : '';
+  $('#order').hidden = !n && !M.pending;
+  const po = M.list.putOff || [];
+  $('#putoff').textContent = po.length ? 'Put off by you: ' + po.map((x) => x.text).join('; ') + '. Not counted as done.' : '';
+  $('#putoff').hidden = !po.length;
+}
+$('#rank').addEventListener('click', (e) => {
+  const pin = e.target.closest('.rpin');
+  if (pin) { const k = pin.dataset.pin; pinned.has(k) ? pinned.delete(k) : pinned.add(k); drawRows(); toast(pinned.has(k) ? 'Pinned to the top for this session.' : 'Unpinned.'); return; }
+  const h = e.target.closest('.rhd');
+  if (h) openRow(M.list.rows.find((r) => r.key === h.closest('.rr').dataset.key));
+});
+
+/* ── today ──────────────────────────────────────────────────────────────────────────────────────────────── */
+const linkOf = (r) => ((r.from || []).find((x) => /^meeting:/.test(x)) || '').replace(/^meeting:/, '');
+function evHtml(e, i) {
+  const lnk = e.kind === 'meeting' && (M.list.rows || []).some((r) => linkOf(r) === e.title) ? e.title : '';
+  return `<button class="ev src-${e.kind}"${lnk ? ` data-link="${esc(lnk)}"` : ''} data-i="${i}" style="animation:rise .6s var(--ease) both"><time>${esc(e.t)}</time><span class="gl-t"><svg class="i" viewBox="0 0 24 24">${ICON[e.kind]}</svg></span><span><b>${esc(e.title)}</b><span class="d">${esc(e.sub)}${e.product ? ' · ' + esc(e.product) : ''}</span></span></button>`;
+}
+const ALL = () => M.today.ahead.concat(M.today.earlier);
+function drawChips() {
+  $('#srcChips').innerHTML = Object.entries(SRC).map(([k, n]) => `<button class="fchip" data-k="${k}" aria-pressed="${on.has(k)}">${n}<em>${M.today.counts[k] || 0}</em></button>`).join('');
+}
+function drawTl() {
+  const T = M.today, all = ALL(), ahead = T.ahead.filter((e) => on.has(e.kind)), early = T.earlier.filter((e) => on.has(e.kind));
+  $('#todayCap').textContent = `${early.length} earlier · ${ahead.length} ahead`;
+  $('#tl').innerHTML = `<div class="grp">Ahead</div>${ahead.length ? ahead.map((e) => evHtml(e, all.indexOf(e))).join('') : '<div class="empty">Nothing ahead in these sources.</div>'}<div class="nowl">${esc(T.now.t)} · ${esc(T.now.label)}</div><div class="grp" style="padding-top:6px">Earlier today</div><div class="early">${early.length ? early.map((e) => evHtml(e, all.indexOf(e))).join('') : `<div class="empty">${esc(T.note || 'Nothing yet in these sources.')}</div>`}</div>`;
+  $$('#tl .ev').forEach((x, i) => { x.tabIndex = i ? -1 : 0; });
+  const next = ahead[0];
+  $('#dNext').innerHTML = next ? `<i></i>Next <b>${esc(next.t)}</b> ${esc(next.title)}` : (M.header.missing.includes('calendar') ? 'Calendar not read' : 'Nothing more today');
+}
+$('#srcChips').addEventListener('click', (e) => { const b = e.target.closest('button'); if (!b) return; const k = b.dataset.k; on.has(k) ? on.delete(k) : on.add(k); b.setAttribute('aria-pressed', on.has(k)); drawTl(); });
+$('#tl').addEventListener('keydown', (e) => {
+  if (!/^(ArrowUp|ArrowDown|Home|End)$/.test(e.key)) return;
+  const L = $$('#tl .ev'), i = L.indexOf(document.activeElement); if (i < 0) return;
+  e.preventDefault();
+  const j = e.key === 'ArrowDown' ? Math.min(L.length - 1, i + 1) : e.key === 'ArrowUp' ? Math.max(0, i - 1) : e.key === 'Home' ? 0 : L.length - 1;
+  L.forEach((x) => { x.tabIndex = -1; }); L[j].tabIndex = 0; L[j].focus();
+});
+$('#tl').addEventListener('click', (e) => { const b = e.target.closest('.ev'); if (b) openEvent(ALL()[+b.dataset.i]); });
+document.addEventListener('click', (e) => {
+  const fb = e.target.closest('.fbtn');
+  if (fb) { const o = $('#' + fb.dataset.opts), v = !o.classList.contains('on'); o.classList.toggle('on', v); o.inert = !v; fb.setAttribute('aria-expanded', v); }
+});
+
+/* ── dock ───────────────────────────────────────────────────────────────────────────────────────────────── */
+function drawDock() { $('#dN').textContent = M.dock.needs == null ? '·' : M.dock.needs; $('#dLab').textContent = M.dock.needs == null ? 'still reading' : M.dock.needs === 0 ? 'need you' : M.dock.label; }
+
+const SEL = {};   // the option chosen on each row, for this session
+const RET = {};   // the reason chosen for returning a run, by row key
+const WHY = {};   // what the PM typed in the reason box, by row key (kept across a redraw and across a refused press)
+const RET_REASONS = ['wrong facts', 'wrong scope', 'not now', 'too long'];
+const holdNote = (t) => `<p class="nodef" id="holdWhy">${esc(t)}</p>`;
+const whyBox = (r, label) => `<label class="whyl" for="why">${esc(label)}</label><textarea id="why" class="why" rows="3" maxlength="1200" aria-describedby="cardErr">${esc(WHY[r.key] || '')}</textarea>`;
+function ctaState(r) {
+  const d = r.dialog, w = d.write, b = $('#recBtn');
+  if (!b || !w) return;
+  const why = ($('#why') || {}).value || '';
+  if (w.kind === 'decision') b.disabled = !(SEL[r.key] || d.sel) || why.trim().length < 3;
+  else if (w.kind === 'return') b.disabled = !RET[r.key];
+}
+function cardHtml(r) {
+  const d = r.dialog, sel = SEL[r.key] || d.sel, w = d.write;
+  if (d.items) return `<div class="acard" id="card"><p class="ct">${esc(d.head)}</p>${d.items.map((x) => `<div class="tri"><span><b>${esc(x.t)}</b><small>${esc(x.m)}</small><em>${esc(x.s)}${x.lead ? ' · ' + esc(x.lead) : ''}</em></span></div>`).join('')}</div>`;
+  const o = d.opts.find((x) => x.k === sel);
+  const err = '<p class="nodef err" id="cardErr" role="alert" hidden></p>';
+  const facts = d.facts.length ? `<div class="kv">${d.facts.map(([a, b]) => `<span>${esc(a)}</span><span>${esc(b)}</span>`).join('')}</div>` : '';
+  const opts = d.opts.length ? `<div class="opts2">${d.opts.map((x) => `<button class="op" data-op="${esc(x.k)}" aria-pressed="${x.k === sel}"><i></i><span><b>${esc(x.t)}</b><small>${esc(x.d)}</small></span></button>`).join('')}</div>` : '';
+  const head = `<div class="acard" id="card"><p class="ct">${esc(d.head)}</p>${facts}`;
+  if (w && w.kind === 'decision') {
+    const label = o ? d.prim[o.k].replace(/^Hold to record: /, 'Record: ') : 'Your call: choose one';
+    return `${head}${opts}${d.nodef ? `<p class="nodef">${esc(d.nodef)}</p>` : ''}${whyBox(r, 'Why (required, kept in the journal)')}${err}<div class="cact" id="cardAct"><button class="cta" id="recBtn" data-rec="decision" disabled>${CHECK}<span>${esc(label)}</span></button></div><div class="mv2">Not yet <span class="seg2">${[['later', 'Later today'], ['tomorrow', 'Tomorrow'], ['nextweek', 'Next week']].map(([k, t]) => `<button data-until="${k}">${t}</button>`).join('')}</span></div></div>`;
+  }
+  if (w && w.kind === 'return') {
+    return `${head}<p class="ct">Return this run: why</p><div class="seg2" id="retWhy">${RET_REASONS.map((x) => `<button data-ret="${esc(x)}" aria-pressed="${RET[r.key] === x}">${esc(x)}</button>`).join('')}</div>${err}<div class="cact"><button class="cta" id="recBtn" data-rec="return" disabled>${CHECK}<span>${esc(d.action)}</span></button></div></div>`;
+  }
+  if (d.opts.length) return `${head}${opts}${d.nodef ? `<p class="nodef">${esc(d.nodef)}</p>` : ''}<div class="cact" id="cardAct"><button class="cta" disabled title="${esc(d.hold || 'Nothing here can be recorded yet.')}">${o ? esc(d.prim[o.k]) : 'Your call: choose one'}</button></div>${d.hold ? holdNote(d.hold) : ''}</div>`;
+  return `${head}${d.nodef ? `<p class="nodef">${esc(d.nodef)}</p>` : ''}${d.action ? `<div class="cact"><button class="cta" disabled title="${esc(d.hold || 'Nothing here can be recorded.')}">${CHECK}${esc(d.action)}</button></div>${d.hold ? holdNote(d.hold) : ''}` : ''}</div>`;
+}
+function paneHtml(r) {
+  // the dialog heading above already names the row and what it is about, so the pane starts with the record itself, as a grid (no repeated title or intro)
+  const p = r.dialog.pane, sel = SEL[r.key] || r.dialog.sel, o = (r.dialog.opts || []).find((x) => x.k === sel);
+  let h = `<p class="dpath">${esc(p.file || '')}</p>`;
+  if (p.list) h = `<p class="dpath">planning/runs/evals.jsonl</p><ol class="stp">${r.dialog.items.map((x, k) => `<li><i>${k + 1}</i><span><b>${esc(x.t)}</b><small>${esc(x.m + ' · ' + x.s)}${x.lead ? '. ' + esc(x.lead) : ''}</small></span></li>`).join('')}</ol>`;
+  else if (p.optsDraft) h += H2('Evidence') + kv(p.evidence) + H2('Decision') + P1(o ? o.t + '. ' + o.draft : 'Choose an option to draft the entry.') + `<p class="xn">A draft. Nothing is written to the journal until you press Record.</p>`;
+  else h += (p.rows && p.rows.length ? kv(p.rows) : '') + (p.paras && p.paras.length ? (p.parasTitle ? H2(p.parasTitle) : '') + p.paras.map(P1).join('') : '') + `<p class="xn">The record as it stands. Nothing is drafted here.</p>`;
+  return `<article class="paper doc">${h}</article>`;
+}
+let openR = null;
+/* A record whose dialog could not be built still opens something true: what the row itself says. */
+function plainDialog(r) {
+  return { eye: 'Detail', logTitle: 'Read from the repository', log: ['Read the record'], say: [r.prepared, r.skip].filter(Boolean).join(' '), head: 'What is known', facts: [['Subject', r.subject], ['Next', r.prepared], ['If you skip', r.skip && r.skip.replace(/^If you skip: /, '')]].filter((x) => x[1]), opts: [], sel: null, nodef: '', pane: { label: 'Detail', file: '', h: r.title, intro: r.subject || '', rows: [], paras: [] } };
+}
+function openRow(r) {
+  if (!r) return;
+  if (!r.dialog) r = { ...r, dialog: plainDialog(r) };
+  openR = r; const d = r.dialog;
+  openDlg({ eye: d.eye + ' · real data', title: d.title || r.title, sub: d.sub || r.subject, say: d.say, stream: turnA(logHtml(d)) + turnA(ptx(d.say)) + cardHtml(r), noteKey: r.key, pane: paneHtml(r), label: d.pane.label });
+  ctaState(r);
+  loadThread(r.key);
+  setTimeout(() => { const b = $('#dBody'); b.scrollTop = b.scrollHeight; }, 120);
+}
+function showErr(msg) { const e = $('#cardErr'); if (!e) { toast(msg); return; } e.textContent = msg; e.hidden = false; }
+/* A press that records. The page waits for the server's answer: a refusal shows its reason and keeps what the PM typed. */
+async function write(path, body, done) {
+  const ws = new URLSearchParams(location.search).get('ws');
+  const btns = $$('#card button, #askF button'); btns.forEach((b) => { b.disabled = true; });
+  const res = await pmPost('/api/briefing-premium/' + path + (ws ? '?ws=' + encodeURIComponent(ws) : ''), body);
+  if (!res || res.ok !== true) {
+    btns.forEach((b) => { b.disabled = false; }); if (openR) ctaState(openR);
+    const m = (res && res.error) || 'The record was not written.';
+    showErr(m); return false;
+  }
+  $$('#askF button').forEach((b) => { b.disabled = false; });
+  done(res); return true;
+}
+$('#dBody').addEventListener('click', (e) => {
+  const lt = e.target.closest('#logT');
+  if (lt) { const c = $('#alog').classList.toggle('col'); lt.setAttribute('aria-expanded', !c); return; }
+  if (!openR) return;
+  const op = e.target.closest('[data-op]');
+  if (op) { WHY[openR.key] = ($('#why') || {}).value || ''; SEL[openR.key] = op.dataset.op; $('#card').outerHTML = cardHtml(openR); $('#oMain').innerHTML = paneHtml(openR); ctaState(openR); return; }
+  const rt = e.target.closest('[data-ret]');
+  if (rt) { WHY[openR.key] = ($('#why') || {}).value || ''; RET[openR.key] = rt.dataset.ret; $('#card').outerHTML = cardHtml(openR); ctaState(openR); return; }
+  const un = e.target.closest('[data-until]');
+  if (un) { write('put-off', { key: openR.key, until: un.dataset.until }, async () => { toast('Put off. It comes back by itself, and it is not counted as done.'); closeDlg(); await load(); }); return; }
+  const rec = e.target.closest('#recBtn');
+  if (rec && !rec.disabled) {
+    const w = openR.dialog.write, why = ($('#why') || {}).value || '', key = openR.key;
+    WHY[key] = why;
+    if (w.kind === 'decision') write('decide', { key, choice: SEL[key] || openR.dialog.sel, why }, async (res) => { delete WHY[key]; toast('Recorded in pm-decisions.md.'); closeDlg(); await load(); });
+    else write('return', { run: w.run, reason: RET[key], ...(w.ws ? { ws: w.ws } : {}) }, async () => { toast('Returned to the agent. It counts as a correction.'); closeDlg(); await load(); });
+  }
+});
+$('#dBody').addEventListener('input', (e) => { if (e.target.id === 'why' && openR) { WHY[openR.key] = e.target.value; ctaState(openR); } });
+function openEvent(e) {
+  if (!e) return;
+  openRow({ key: 'ev:' + e.kind + ':' + e.at, title: e.title, subject: e.sub, prepared: e.sub, dialog: e.dialog });
+}
+
+
+/* ── a decision and the meeting that needs it are one thing, shown twice ─────────────────────────────────── */
+{
+  const lk = (el, v) => { const id = el.dataset.link; if (!id) return; $$(`[data-link="${CSS.escape(id)}"]`).forEach((x) => x.classList.toggle('hl-k', v)); };
+  ['pointerenter', 'focusin'].forEach((ev) => document.addEventListener(ev, (e) => { const t = e.target.closest && e.target.closest('[data-link]'); if (t) lk(t, true); }, true));
+  ['pointerleave', 'focusout'].forEach((ev) => document.addEventListener(ev, (e) => { const t = e.target.closest && e.target.closest('[data-link]'); if (t) lk(t, false); }, true));
+}
+
+
+/* ── the products the Briefing reads (initiative briefing-premium-products) ──────────────────────────────────────────────────────────── */
+const wsParam = () => new URLSearchParams(location.search).get('ws');
+function drawPick() {
+  const w = $('#pkw'), P = M.products, one = wsParam();
+  if (!w) return;
+  if (one) { w.hidden = false; $('#pick').hidden = true; $('#pickMenu').hidden = true; let a = $('#pickAll'); if (!a) { a = document.createElement('a'); a.id = 'pickAll'; a.className = 'fchip'; a.href = '/premium.html'; a.textContent = 'All picked products'; w.appendChild(a); } return; }
+  if ($('#pickAll')) $('#pickAll').remove();
+  $('#pick').hidden = false;
+  if (!P) { w.hidden = true; return; }
+  w.hidden = false;
+  const n = P.available.filter((x) => x.on).length;
+  $('#pickN').textContent = n + ' of ' + P.available.length;
+  $('#pickMenu').innerHTML = P.available.length
+    ? P.available.map((x) => `<button role="menuitemcheckbox" aria-checked="${x.on}" data-ws="${esc(x.ws)}"><i class="bx"></i><span>${esc(x.name)}</span>${x.home ? '<em>home</em>' : ''}</button>`).join('') + '<button role="menuitem" data-reset="1" class="pkreset"><span>Back to the default</span><em>all but home</em></button>'
+    : '<p class="note pkempty">No product workspace is registered.</p>';
+}
+function closePick() { $('#pickMenu').hidden = true; $('#pick').setAttribute('aria-expanded', 'false'); }
+$('#pick').addEventListener('click', (e) => {
+  e.stopPropagation();
+  const m = $('#pickMenu'), open = m.hidden;
+  m.hidden = !open; $('#pick').setAttribute('aria-expanded', open);
+  if (open) { const f = $('button', m); if (f) f.focus(); }
+});
+document.addEventListener('click', (e) => { if (!e.target.closest('#pkw')) closePick(); });
+$('#pkw').addEventListener('keydown', (e) => {
+  if (e.key === 'Escape') { closePick(); $('#pick').focus(); return; }
+  if (e.key !== 'ArrowDown' && e.key !== 'ArrowUp') return;
+  const L = $$('#pickMenu button'), i = L.indexOf(document.activeElement); if (i < 0) return;
+  e.preventDefault(); L[(i + (e.key === 'ArrowDown' ? 1 : L.length - 1)) % L.length].focus();
+});
+$('#pickMenu').addEventListener('click', async (e) => {
+  const b = e.target.closest('button'); if (!b || !M || !M.products) return;
+  const on = M.products.available.filter((x) => x.on).map((x) => x.ws);
+  let body;
+  if (b.dataset.reset) body = { key: 'ws.briefing.include', reset: true };
+  else { const ws = b.dataset.ws, next = on.includes(ws) ? on.filter((x) => x !== ws) : on.concat(ws); body = { key: 'ws.briefing.include', value: next }; }
+  const res = await pmPost('/api/settings', body);
+  if (!res || res.ok !== true) { toast((res && res.error) || 'The choice was not saved.'); return; }
+  toast(b.dataset.reset ? 'Back to the default: every product except the home one.' : 'Saved. The Briefing now reads the products you ticked.');
+  await load();
+  const again = b.dataset.ws ? $(`#pickMenu [data-ws="${CSS.escape(b.dataset.ws)}"]`) : null; if (again) again.focus();
+});
+
+/* ── load ───────────────────────────────────────────────────────────────────────────────────────────────── */
+let readTimer = null;
+const ago = (ms) => { const m = Math.round(ms / 60000); return m < 1 ? 'just now' : m < 90 ? m + ' min ago' : Math.round(m / 60) + ' h ago'; };
+async function load() {
+  let r = null, status = 0;
+  const ws = new URLSearchParams(location.search).get('ws');
+  try { const res = await fetch('/api/briefing-premium' + (ws ? '?ws=' + encodeURIComponent(ws) : ''), { credentials: 'same-origin' }); status = res.status; r = await res.json(); } catch { r = null; }
+  clearInterval(readTimer);
+  if (r && r.state === 'reading') {
+    // the first read has no end I can promise: say how long it has run, and ask again
+    const t0 = Date.now() - (r.elapsed_ms || 0), tick = () => { $('#brief').textContent = 'Reading the products for the first time. ' + Math.round((Date.now() - t0) / 1000) + ' s so far. This page shows nothing until it has read, rather than guess.'; };
+    tick(); readTimer = setInterval(tick, 1000); setTimeout(load, 3000);
+    return;
+  }
+  if (!r || !r.ok) {
+    $('#snap').textContent = 'The repository could not be read';
+    $('#brief').textContent = 'The Briefing could not read the repository, so it shows nothing rather than guess.' + (r && r.error ? ' The reason: ' + r.error : status ? ' (the server answered ' + status + ')' : ' The server did not answer.');
+    return;
+  }
+  M = r.model; drawHero(); drawRows(); drawChips(); drawTl(); drawDock(); drawPick(); onScroll();
+  const age = Date.now() - r.as_of;
+  if (age > 5 * 60000) $('#snap').textContent += ' · read ' + ago(age) + (r.refreshing ? ', refreshing' : '');
+  if (r.error) $('#snap').textContent += ' · the latest read failed: ' + r.error.slice(0, 120);
+  if (r.error && !r.pending) setTimeout(load, 150000);
+  else if (r.pending) setTimeout(load, 3000);
+  else if (r.refreshing) setTimeout(load, 10000);
+}
+$('#brief').textContent = 'Reading the repository.';
+load();

package/workspace/public/premium-board.html

@@ -0,0 +1,73 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="pmos-nonce" content="" />
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+<title>PMOS · Board</title>
+<!-- The premium Board (initiative briefing-premium-board, slice 5). The third place on the rail, in the Briefing's shell. It reads GET /api/board-premium, built from the routes the production Initiatives page reads. The only press is Draft it on a core document, through the existing /api/core-docs/draft route. -->
+<link rel="preload" href="/vendor/geist-var.woff2" as="font" type="font/woff2" crossorigin />
+<link rel="stylesheet" href="/pm/premium.css" />
+</head>
+<body>
+<div class="sky"><i class="a"></i><i class="b"></i><i class="c"></i></div>
+<nav class="rail glass" aria-label="Places">
+ <i class="ind"></i>
+ <button class="pl" data-go="brief"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>Briefing</button>
+ <button class="pl" data-go="work"><svg class="i" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.5 12 2.5 2.5 4.5-5"/></svg>My work</button>
+ <button class="pl" data-go="init" aria-current="page"><svg class="i" viewBox="0 0 24 24"><path d="M12 3 3 8l9 5 9-5z"/><path d="m3 13 9 5 9-5"/></svg>Board</button>
+ <button class="pl" data-go="rep"><svg class="i" viewBox="0 0 24 24"><path d="M4 20V10M10 20V4M16 20v-8M22 20H2"/></svg>Insights</button>
+</nav>
+
+<div class="dock glass" id="dock" inert><span class="nm">Board</span><span class="sep"></span><span class="cnt"><b id="dN">·</b><span id="dLab">need a look</span></span><span class="sep hide-s"></span><span class="pl2 hide-s" id="dNext"></span><span class="sp"></span><button class="round" id="theme2" aria-label="Switch light or dark" style="width:44px;height:44px"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+<div class="veil" id="veil"></div>
+<div class="dlg" id="dlg" role="dialog" aria-modal="true" aria-labelledby="dTitle" tabindex="-1" data-mode="split" inert>
+ <div class="grab"></div>
+ <div class="dhead"><div class="dht"><p class="label" id="dEye"></p><h2 id="dTitle"></h2><p class="dsub" id="dSub"></p></div>
+  <div class="dtools"><button class="round dx2" id="dPane" aria-label="Hide the conversation" aria-pressed="true" title="Hide the conversation"><svg class="i" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M9 4v16"/></svg></button><button class="round dx2" id="dExpand" aria-label="Full screen" aria-pressed="false" title="Full screen"><svg class="i" viewBox="0 0 24 24"><path id="dExpP" d="M14 4h6v6M10 20H4v-6M20 4l-7 7M4 20l7-7"/></svg></button><button class="round dx2" id="dClose" aria-label="Close"><svg class="i" viewBox="0 0 24 24"><path d="M6 6l12 12M18 6 6 18"/></svg></button></div></div>
+ <div class="dtabs" id="dTabs"><div class="seg" role="group" aria-label="Sections"><i class="pill"></i><button data-t="out" aria-pressed="true">Detail</button><button data-t="chat" aria-pressed="false">Conversation</button></div></div>
+ <div class="dgrid" id="dGrid" data-tab="out"><section class="pane p-work" id="dBody" aria-label="Conversation"></section>
+  <section class="pane p-out" id="dOut" aria-label="Detail"><div class="otop"><span class="ol" id="oLab">Detail</span></div><div class="obody" id="oMain"></div></section></div>
+</div>
+<div class="toast glass" id="toast" role="status"></div>
+<main class="stage" id="stage">
+ <header class="top rise" style="--d:0">
+  <h1 class="vh">Board</h1><div id="crumbHost"></div>
+  <div class="tools tools-top"><span class="snap" id="snap">Reading the board</span>
+   <span class="seg modeseg" id="modeSeg" role="group" aria-label="How an initiative opens"><i class="pill"></i><button data-m="page" aria-pressed="true">Page</button><button data-m="popup" aria-pressed="false">Popup</button></span>
+   <button class="glass round" id="theme" aria-label="Switch light or dark"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+ </header>
+ <section class="hero hero-slim"><p class="brief rise" style="--d:2" id="brief" aria-live="polite"></p></section>
+ <div class="bcols">
+  <div>
+   <section class="card rise" style="--d:5" id="cIni" aria-labelledby="hIni">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M12 3 3 8l9 5 9-5z"/><path d="m3 13 9 5 9-5"/></svg></span><h2 id="hIni">Initiatives</h2><small id="iniCap"></small></div>
+    <div class="mprog" id="iniBar" role="progressbar" aria-label="Open initiatives on track" aria-valuemin="0" hidden><b></b></div>
+    <div class="seg" id="ibTabs" role="group" aria-label="Initiatives view"><i class="pill"></i><button data-v="list" aria-pressed="true">List</button><button data-v="stages" aria-pressed="false">By stage</button><button data-v="time" aria-pressed="false">Timeline</button></div>
+    <div id="ibBody"></div>
+    <p class="note" id="iniNote" style="margin-top:12px"></p>
+   </section>
+  </div>
+  <div>
+   <section class="card rise" style="--d:6" id="cSpr" aria-labelledby="hSpr">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg></span><h2 id="hSpr">Sprint</h2><small id="sprCap"></small></div>
+    <div id="sprBody"></div>
+   </section>
+   <section class="card rise" style="--d:7" id="cRel" aria-labelledby="hRel">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><rect x="3" y="5" width="18" height="16" rx="3"/><path d="M3 10h18M8 3v4M16 3v4"/></svg></span><h2 id="hRel">Coming up</h2><small id="relCap"></small></div>
+    <div id="relBody"></div>
+   </section>
+  </div>
+ </div>
+ <section class="card rise" style="--d:8;margin-top:24px" id="cDocs" aria-labelledby="hDocs">
+  <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M6 3h9l4 4v14H6z"/><path d="M14 3v5h5M9 13h6M9 17h4"/></svg></span><h2 id="hDocs">Core documents</h2><small id="docCap"></small></div>
+  <div id="docTop"></div>
+  <div class="dmg two" id="docBody" role="list"></div>
+  <p class="note" id="docNote" style="margin-top:12px"></p>
+ </section>
+ <p class="foot" id="foot">This page reads the board's own records, the same ones the Initiatives page reads. Its one press is Draft it on a core document, which starts the existing read-only run that writes a draft and sends nothing. Issue, Drop and moving an initiative are not built here. The Metrics charts are not drawn, because PMOS holds no metric series for a board. A sprint appears only when a session has read Jira.</p>
+</main>
+<noscript>This page needs JavaScript.</noscript>
+<script type="module" src="/pm/premium-board.js"></script>
+</body>
+</html>

package/workspace/public/premium-initiative.html

@@ -0,0 +1,46 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="pmos-nonce" content="" />
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+<title>PMOS · Initiative</title>
+<!-- The premium initiative page (initiative briefing-premium-initiative, slice 6). Opened from a Board click. It reads GET /api/initiative-premium, built from the routes the production Initiatives sheet reads. The only press is Draft it on a core document; a document row opens the read-only document sheet. -->
+<link rel="preload" href="/vendor/geist-var.woff2" as="font" type="font/woff2" crossorigin />
+<link rel="stylesheet" href="/pm/premium.css" />
+</head>
+<body>
+<div class="sky"><i class="a"></i><i class="b"></i><i class="c"></i></div>
+<nav class="rail glass" aria-label="Places">
+ <i class="ind"></i>
+ <button class="pl" data-go="brief"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>Briefing</button>
+ <button class="pl" data-go="work"><svg class="i" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.5 12 2.5 2.5 4.5-5"/></svg>My work</button>
+ <button class="pl" data-go="init" aria-current="page"><svg class="i" viewBox="0 0 24 24"><path d="M12 3 3 8l9 5 9-5z"/><path d="m3 13 9 5 9-5"/></svg>Board</button>
+ <button class="pl" data-go="rep"><svg class="i" viewBox="0 0 24 24"><path d="M4 20V10M10 20V4M16 20v-8M22 20H2"/></svg>Insights</button>
+</nav>
+
+<div class="dock glass" id="dock" inert><span class="nm">Initiative</span><span class="sep"></span><span class="cnt"><b id="dN">·</b><span id="dLab">need a look</span></span><span class="sep hide-s"></span><span class="pl2 hide-s" id="dNext"></span><span class="sp"></span><button class="round" id="theme2" aria-label="Switch light or dark" style="width:44px;height:44px"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+<div class="veil" id="veil"></div>
+<div class="dlg" id="dlg" role="dialog" aria-modal="true" aria-labelledby="dTitle" tabindex="-1" data-mode="split" inert>
+ <div class="grab"></div>
+ <div class="dhead"><div class="dht"><p class="label" id="dEye"></p><h2 id="dTitle"></h2><p class="dsub" id="dSub"></p></div>
+  <div class="dtools"><button class="round dx2" id="dPane" aria-label="Hide the conversation" aria-pressed="true" title="Hide the conversation"><svg class="i" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M9 4v16"/></svg></button><button class="round dx2" id="dExpand" aria-label="Full screen" aria-pressed="false" title="Full screen"><svg class="i" viewBox="0 0 24 24"><path id="dExpP" d="M14 4h6v6M10 20H4v-6M20 4l-7 7M4 20l7-7"/></svg></button><button class="round dx2" id="dClose" aria-label="Close"><svg class="i" viewBox="0 0 24 24"><path d="M6 6l12 12M18 6 6 18"/></svg></button></div></div>
+ <div class="dtabs" id="dTabs"><div class="seg" role="group" aria-label="Sections"><i class="pill"></i><button data-t="out" aria-pressed="true">Detail</button><button data-t="chat" aria-pressed="false">Conversation</button></div></div>
+ <div class="dgrid" id="dGrid" data-tab="out"><section class="pane p-work" id="dBody" aria-label="Conversation"></section>
+  <section class="pane p-out" id="dOut" aria-label="Detail"><div class="otop"><span class="ol" id="oLab">Detail</span></div><div class="obody" id="oMain"></div></section></div>
+</div>
+<div class="toast glass" id="toast" role="status"></div>
+<main class="stage" id="stage">
+ <header class="top rise" style="--d:0">
+  <h1 class="vh" id="iH1">Initiative</h1><div id="crumbHost"></div>
+  <div class="tools tools-top"><span class="snap" id="snap">Reading the initiative</span>
+   <button class="glass round" id="theme" aria-label="Switch light or dark"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+ </header>
+ <section class="hero hero-slim"><p class="brief rise" style="--d:2" id="brief" aria-live="polite"></p></section>
+ <div id="iMain"><p class="empty3 plain" id="iRead">The initiative is read from its records. This page shows nothing until it has read, rather than guess.</p></div>
+ <p class="foot" id="foot">This page reads the initiative's own records, the same ones the Initiatives sheet reads. Its one press is Draft it on a core document, which starts the existing read-only run that writes a draft and sends nothing. Opening a document only reads it. Editing, Issue, Drop and adding a task are not built on this page.</p>
+</main>
+<noscript>This page needs JavaScript.</noscript>
+<script type="module" src="/pm/premium-initiative.js"></script>
+</body>
+</html>

package/workspace/public/premium-work.html

@@ -0,0 +1,84 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="pmos-nonce" content="" />
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+<title>PMOS · My work</title>
+<!-- The premium My work (initiative briefing-premium-work, slice 4). The second place on the rail, in the Briefing's shell. It reads GET /api/my-work-premium, built from the list the Work page reads, and presses through the existing /api/pm-items routes. -->
+<link rel="preload" href="/vendor/geist-var.woff2" as="font" type="font/woff2" crossorigin />
+<link rel="stylesheet" href="/pm/premium.css" />
+</head>
+<body>
+<div class="sky"><i class="a"></i><i class="b"></i><i class="c"></i></div>
+<nav class="rail glass" aria-label="Places">
+ <i class="ind"></i>
+ <button class="pl" data-go="brief"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>Briefing</button>
+ <button class="pl" data-go="work" aria-current="page"><svg class="i" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.5 12 2.5 2.5 4.5-5"/></svg>My work</button>
+ <button class="pl" data-go="init"><svg class="i" viewBox="0 0 24 24"><path d="M12 3 3 8l9 5 9-5z"/><path d="m3 13 9 5 9-5"/></svg>Board</button>
+ <button class="pl" data-go="rep"><svg class="i" viewBox="0 0 24 24"><path d="M4 20V10M10 20V4M16 20v-8M22 20H2"/></svg>Insights</button>
+</nav>
+
+<div class="dock glass" id="dock" inert><span class="nm">My work</span><span class="sep"></span><span class="cnt"><b id="dN">·</b><span id="dLab">to clear</span></span><span class="sep hide-s"></span><span class="pl2 hide-s" id="dNext"></span><span class="sp"></span><button class="round" id="theme2" aria-label="Switch light or dark" style="width:44px;height:44px"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+<div class="veil" id="veil"></div>
+<div class="dlg" id="dlg" role="dialog" aria-modal="true" aria-labelledby="dTitle" tabindex="-1" data-mode="split" inert>
+ <div class="grab"></div>
+ <div class="dhead"><div class="dht"><p class="label" id="dEye"></p><h2 id="dTitle"></h2><p class="dsub" id="dSub"></p></div>
+  <div class="dtools"><button class="round dx2" id="dPane" aria-label="Hide the conversation" aria-pressed="true" title="Hide the conversation"><svg class="i" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M9 4v16"/></svg></button><button class="round dx2" id="dExpand" aria-label="Full screen" aria-pressed="false" title="Full screen"><svg class="i" viewBox="0 0 24 24"><path id="dExpP" d="M14 4h6v6M10 20H4v-6M20 4l-7 7M4 20l7-7"/></svg></button><button class="round dx2" id="dClose" aria-label="Close"><svg class="i" viewBox="0 0 24 24"><path d="M6 6l12 12M18 6 6 18"/></svg></button></div></div>
+ <div class="dtabs" id="dTabs"><div class="seg" role="group" aria-label="Sections"><i class="pill"></i><button data-t="out" aria-pressed="true">Detail</button><button data-t="chat" aria-pressed="false">Conversation</button></div></div>
+ <div class="dgrid" id="dGrid" data-tab="out"><section class="pane p-work" id="dBody" aria-label="Conversation"></section>
+  <section class="pane p-out" id="dOut" aria-label="Detail"><div class="otop"><span class="ol" id="oLab">Detail</span></div><div class="obody" id="oMain"></div></section></div>
+</div>
+<div class="toast glass" id="toast" role="status"></div>
+<main class="stage" id="stage">
+ <header class="top rise" style="--d:0">
+  <h1 class="vh">My work</h1><span class="glass name" aria-hidden="true">My work</span>
+  <div class="tools tools-top"><span class="snap" id="snap">Reading your list</span>
+   <button class="glass round" id="theme" aria-label="Switch light or dark"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+ </header>
+ <section class="hero">
+  <p class="date rise" style="--d:1" id="date"></p>
+  <p class="brief rise" style="--d:2" id="brief" aria-live="polite"></p>
+ </section>
+ <form class="cap glass rise" style="--d:3" id="cap" autocomplete="off">
+  <svg class="i" viewBox="0 0 24 24"><path d="M12 5v14M5 12h14"/></svg>
+  <input id="capIn" placeholder="Add anything to your list" aria-label="Add an item to your list" maxlength="300">
+  <button class="capb" type="submit" aria-label="Add it to your list" title="Add it to your list"><svg class="i" viewBox="0 0 24 24"><path d="M5 12h14M13 6l6 6-6 6"/></svg></button>
+ </form>
+ <div class="tx rise" style="--d:4" id="tx"><span class="hint" id="capHint" aria-live="polite">One line. The date and priority are read from it, for example "Reply to Rina about SSO by Friday".</span></div>
+ <div class="cols2" style="margin-top:24px">
+  <div>
+   <section class="card rise" style="--d:5" id="plate" aria-labelledby="hPlate">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.5 12 2.5 2.5 4.5-5"/></svg></span><h2 id="hPlate">On your plate</h2><small id="plateCap"></small></div>
+    <div id="plateBody"></div>
+    <p class="note" id="plateNote" style="margin-top:14px"></p>
+   </section>
+  </div>
+  <div>
+   <section class="card rise" style="--d:7" id="agCard" aria-labelledby="hAg">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M12 3l1.8 4.7L18.5 9.5l-4.7 1.8L12 16l-1.8-4.7L5.5 9.5l4.7-1.8z"/></svg></span><h2 id="hAg">With agents</h2><small id="agCap"></small></div>
+    <div class="pipe" id="pipe"></div>
+    <div class="agl" id="agl"></div>
+    <p class="note" id="agHold" style="margin-top:12px"></p>
+   </section>
+   <section class="card rise" style="--d:8" id="waitCard" aria-labelledby="hWait">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg></span><h2 id="hWait">Waiting on others</h2><small id="waitCap"></small></div>
+    <div id="waitBody"></div>
+   </section>
+   <section class="card rise" style="--d:9" id="revCard" aria-labelledby="hRev" hidden>
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M4 12a8 8 0 0 1 14-5.3M20 12a8 8 0 0 1-14 5.3"/><path d="M18 3v4h-4M6 21v-4h4"/></svg></span><h2 id="hRev">Untouched</h2><small id="revCap"></small></div>
+    <div class="revc"><p id="revTxt"></p><button id="revBtn" type="button">Look at them</button></div>
+   </section>
+  </div>
+ </div>
+ <section class="card rise" style="--d:5;margin-top:24px" id="trayCard" aria-labelledby="hTray">
+  <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M4 8h16l-1.5 11a2 2 0 0 1-2 1.7H7.5a2 2 0 0 1-2-1.7z"/><path d="M8 8V6a4 4 0 0 1 8 0v2"/></svg></span><h2 id="hTray">Your tray</h2><small id="trayCap"></small></div>
+  <div class="tgrid" id="trayBody"></div>
+  <p class="note" id="trayNote" style="margin-top:14px"></p>
+ </section>
+ <p class="foot" id="foot">This page reads your list, the same one the Work page reads. It writes only when you press a button that says what it does, and each press uses the Work page's own route. The shelf, the capacity bars and starting an agent are not built here. Jira and Slack items appear only when an agent session has read them.</p>
+</main>
+<noscript>This page needs JavaScript.</noscript>
+<script type="module" src="/pm/premium-work.js"></script>
+</body>
+</html>

package/workspace/public/premium.html

@@ -0,0 +1,69 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8" />
+<meta name="pmos-nonce" content="" />
+<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover" />
+<title>PMOS · Briefing</title>
+<!-- The premium Briefing (initiative briefing-premium, slice 1). A page of its own beside the console: the console stays the default page.
+     The rail's other three places open the matching console tab until their slices land. Slice 2 adds the PM's own presses (record a decision, put a row off, return a run, save a note); the page never writes on its own. -->
+<link rel="preload" href="/vendor/geist-var.woff2" as="font" type="font/woff2" crossorigin />
+<link rel="stylesheet" href="/pm/premium.css" />
+</head>
+<body>
+<div class="sky"><i class="a"></i><i class="b"></i><i class="c"></i></div>
+<nav class="rail glass" aria-label="Places">
+ <i class="ind"></i>
+ <button class="pl" data-go="brief" aria-current="page"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="4"/><path d="M12 2v2M12 20v2M2 12h2M20 12h2M4.9 4.9l1.4 1.4M17.7 17.7l1.4 1.4M4.9 19.1l1.4-1.4M17.7 6.3l1.4-1.4"/></svg>Briefing</button>
+ <button class="pl" data-go="work"><svg class="i" viewBox="0 0 24 24"><rect x="4" y="4" width="16" height="16" rx="3"/><path d="m8.5 12 2.5 2.5 4.5-5"/></svg>My work</button>
+ <button class="pl" data-go="init"><svg class="i" viewBox="0 0 24 24"><path d="M12 3 3 8l9 5 9-5z"/><path d="m3 13 9 5 9-5"/></svg>Board</button>
+ <button class="pl" data-go="rep"><svg class="i" viewBox="0 0 24 24"><path d="M4 20V10M10 20V4M16 20v-8M22 20H2"/></svg>Insights</button>
+</nav>
+
+<div class="dock glass" id="dock" inert><span class="nm">Briefing</span><span class="sep"></span><span class="cnt"><b id="dN">·</b><span id="dLab">for you</span></span><span class="sep hide-s"></span><span class="pl2 hide-s" id="dNext"></span><span class="sp"></span><button class="round" id="theme2" aria-label="Switch light or dark" style="width:44px;height:44px"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+<div class="veil" id="veil"></div>
+<div class="dlg" id="dlg" role="dialog" aria-modal="true" aria-labelledby="dTitle" tabindex="-1" data-mode="split" inert>
+ <div class="grab"></div>
+ <div class="dhead"><div class="dht"><p class="label" id="dEye"></p><h2 id="dTitle"></h2><p class="dsub" id="dSub"></p></div>
+  <div class="dtools"><button class="round dx2" id="dPane" aria-label="Hide the conversation" aria-pressed="true" title="Hide the conversation"><svg class="i" viewBox="0 0 24 24"><rect x="3" y="4" width="18" height="16" rx="3"/><path d="M9 4v16"/></svg></button><button class="round dx2" id="dExpand" aria-label="Full screen" aria-pressed="false" title="Full screen"><svg class="i" viewBox="0 0 24 24"><path id="dExpP" d="M14 4h6v6M10 20H4v-6M20 4l-7 7M4 20l7-7"/></svg></button><button class="round dx2" id="dClose" aria-label="Close"><svg class="i" viewBox="0 0 24 24"><path d="M6 6l12 12M18 6 6 18"/></svg></button></div></div>
+ <div class="dtabs" id="dTabs"><div class="seg" role="group" aria-label="Sections"><i class="pill"></i><button data-t="out" aria-pressed="true">Detail</button><button data-t="chat" aria-pressed="false">Conversation</button></div></div>
+ <div class="dgrid" id="dGrid" data-tab="out"><section class="pane p-work" id="dBody" aria-label="Conversation"></section>
+  <section class="pane p-out" id="dOut" aria-label="Detail"><div class="otop"><span class="ol" id="oLab">Detail</span></div><div class="obody" id="oMain"></div></section></div>
+</div>
+<div class="toast glass" id="toast" role="status"></div>
+<main class="stage" id="stage">
+ <header class="top rise" style="--d:0">
+  <h1 class="vh">Briefing</h1><span class="glass name" aria-hidden="true">Briefing</span>
+  <div class="tools tools-top"><span class="snap" id="snap">Reading the repository</span>
+   <span class="pkw" id="pkw" hidden><button class="fchip" id="pick" aria-haspopup="menu" aria-expanded="false" aria-controls="pickMenu">Products<em id="pickN"></em></button><div class="crmenu pkmenu" id="pickMenu" role="menu" hidden></div></span>
+   <button class="glass round" id="theme" aria-label="Switch light or dark"><svg class="i" viewBox="0 0 24 24"><path d="M20 14.5A8 8 0 0 1 9.5 4 8 8 0 1 0 20 14.5z"/></svg></button></div>
+ </header>
+ <section class="hero">
+  <p class="date rise" style="--d:1" id="date"></p>
+  <p class="brief rise" style="--d:2" id="brief" aria-live="polite"></p>
+ </section>
+ <div class="cols2">
+  <div>
+   <section class="card rise" style="--d:6" aria-labelledby="hMoves">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><path d="M5 12l4.5 4.5L19 7"/></svg></span><h2 id="hMoves">What you need to do</h2><small id="movesCap"></small></div>
+    <div class="mprog" id="mprog" role="progressbar" aria-label="Done today" aria-valuemin="0" hidden><b></b></div>
+    <div class="rank" id="rank"></div>
+    <div class="calm" id="calm" hidden><i><svg class="i" viewBox="0 0 24 24"><path d="M5 12.5l4.5 4.5L19 7.5"/></svg></i><div><b>Nothing needs you right now.</b><small id="calmNext"></small></div></div>
+    <p class="note" id="order" style="margin-top:14px"></p>
+    <p class="note" id="putoff" hidden></p>
+   </section>
+  </div>
+  <div>
+   <section class="card rise" id="todayCard" style="--d:7" aria-labelledby="hToday">
+    <div class="ch"><span class="ic"><svg class="i" viewBox="0 0 24 24"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg></span><h2 id="hToday">Today</h2><small id="todayCap"></small><button class="fbtn" data-opts="todayOpts" aria-expanded="false" aria-controls="todayOpts" aria-label="Filter sources"><svg class="i" viewBox="0 0 24 24"><path d="M4 7h9M17 7h3M4 17h3M11 17h9"/><circle cx="15" cy="7" r="2"/><circle cx="9" cy="17" r="2"/></svg></button></div>
+    <div class="opts" id="todayOpts" inert><div><div class="chips" id="srcChips" role="group" aria-label="Sources"></div></div></div>
+    <div class="tl" id="tl" role="group" aria-label="Today. Use the up and down arrow keys to move between rows."></div>
+   </section>
+  </div>
+ </div>
+ <p class="foot" id="foot">This page reads the repository's records. It writes only when you press a button that says it records: a decision goes to pm-decisions.md, a returned run to the corrections ledger, a put-off row and a note to the workspace's state folder. It keeps its last answer in the workspace's state folder, so a reload is quick. Counts come from derived state at the time shown above.</p>
+</main>
+<noscript>This page needs JavaScript.</noscript>
+<script type="module" src="/pm/premium.js"></script>
+</body>
+</html>