create-pmos 0.133.0 → 0.135.0

package/workspace/public/pm/c3-initiatives.js

@@ -0,0 +1,741 @@
+/* pm/c3-initiatives.js — the Initiatives tab of /c3.html (mockup v5, src/pages/34-initiatives.js, approved 2026-10-11).
+ * Hierarchy: Portfolio > Board > Initiative > Epic > Story, Task or Bug. A board offers workflow templates and a default; each
+ * initiative runs its own workflow. A board with "Build and deliver" on mirrors a Jira project (its items, Releases and Sprints); a
+ * board with it off has PMOS tasks only. c3-shell.js hands the pane to mountInitiatives(pane, { ws, workspaces, demo, showTab }).
+ *
+ * WHAT THIS FILE DRAWS
+ *   Portfolio   breadcrumb, the sentence on board health, the boards (one row each: health, owner, Build and deliver, the category
+ *               stack, risk, new asks, next release), a card per category across the boards, the asks waiting, and the timeline
+ *               across boards (board > initiative > epic). "New board" opens a sheet (name, Build and deliver, Jira key, default
+ *               workflow).
+ *   Board       breadcrumb, Dashboard and Board settings, the sentence, the setup chips (Build and deliver, Jira, PMOS tasks, the
+ *               default workflow), then the tabs Summary · Initiatives · Triage · Backlog · Board · Timeline · Releases · Docs ·
+ *               Sprints (Releases and Sprints only when Build and deliver is on). Summary is drawn here; the rest come from the registry.
+ *   Initiative  breadcrumb, the sentence, status and warning chips, the stepper of its own workflow (a press is POST /api/boards/move;
+ *               the warnings show, nothing is blocked), Edit workflow, the tools of the current stage and a More tools menu, then the
+ *               tabs Overview · Breakdown · Docs · Jira items (Build and deliver only) · Timeline · History, from the registry.
+ *   Sheets      Board settings (POST /api/boards/settings), New board (POST /api/boards/create), New initiative (an ask added and
+ *               accepted at once: POST /api/boards/asks/add then asks/accept, then ini-workflow when it picks another template),
+ *               and the workflow editor in two modes: one initiative's stages (POST /api/boards/ini-workflow) or the board's own
+ *               workflow, the one its initiatives without their own run (POST /api/boards/workflow).
+ *
+ * URL STATE  `init=` with history.replaceState, read back on load:
+ *   (none)                              Portfolio
+ *   board:<board>:<tab>[:<filter>]      a board tab; <filter> is a query string (cat=Do&view=risk), each part URI-encoded
+ *   ini:<board>:<id>:<tab>[:<tool>]     an initiative tab; <tool> is the tool the Overview shows first
+ *
+ * THE TAB REGISTRY  registerBoardTab(id, mount) · registerInitiativeTab(id, mount). Modules, each in its own guarded import():
+ *   ./c3-ib-initiatives.js ./c3-ib-triage.js ./c3-ib-items.js (backlog, board, timeline) ./c3-ib-releases.js ./c3-ib-docs.js
+ *   ./c3-ib-sprints.js ./c3-ii-tabs.js (the six initiative tabs)
+ * mount(host, ctx) draws into host and may return (or resolve to) a function called when the PM leaves the tab. The ctx, frozen:
+ *   ws, board (a row of GET /api/boards: id, name, full, template, workflow, build, jira, offer, defTpl, tracker, sprints, health,
+ *   counts, asks, nextRelease), today ('YYYY-MM-DD' from the server), tab, filter (board tabs), row, history, tools, toolsByCat, tool
+ *   (initiative tabs), api.get/post, go(loc), openInitiative(id, tab?, board?), openBoard(id, tab?, filter?), toast, openSheet,
+ *   refresh() (read the boards again and draw), redraw() (draw the current place again, keeping the reads), demo, showTab,
+ *   moveTo(id, stage) -> Promise<{ ok, row, warnings }>, openWorkflow(row), openBoardSettings(), newInitiative()
+ *
+ * Every control is a <button> (primitives.js button() through c3-ini-ui.js btn()); geometry is a --in-… custom property; no dialog. */
+import { el } from './dom.js';
+import { ensureComponentsCss } from './primitives.js';
+import { pmGet, pmPost } from './http.js';
+import { ensureC3Css } from './pm-work-view.js';
+import { openSheet, closeSheet } from './c3-sheet.js';
+import { toast } from './c3-toast.js';
+import {
+  btn, geo, icon, pbtn, pill, lk, ib, chip, tag, st, note, lbl, mono, sw, plural, trunc, day, daysBetween, statusChip, healthSt, HEALTH, ownerChip, ownerText,
+  stageChip, stepsMini, progChip, dateChip, list, empty, sect, card, nrow, crumbs, lh, segTabs, cols, hbs, hbr, kv, chgl, chgli, openMenu, closeMenu, CATS, PORTFOLIO,
+} from './c3-ini-ui.js';
+import { TEMPLATES, BOARD_TEMPLATES, isBuildStage, templateBuilds, offered, wfOf, catOf, kindOf, tplName, TOOL_META, toolLabel, toolIcon, loadItems, dropItems, workTlRows, iniTlRow, rescheduleTask, lockedToast } from './c3-ini-work.js';
+import { timeline, tlInit, tlRange } from './c3-ini-timeline.js';
+import { RECORD_META, recordToolsFor } from './c3-ini-records.js';
+
+export { btn, geo };
+export { TEMPLATES, CATS };
+
+/* ── the registry ── */
+export const BOARD_TABS = {};
+export const INITIATIVE_TABS = {};
+export function registerBoardTab(id, mount) { if (typeof mount === 'function') BOARD_TABS[id] = mount; }
+export function registerInitiativeTab(id, mount) { if (typeof mount === 'function') INITIATIVE_TABS[id] = mount; }
+
+export const BOARD_TAB_LIST = [['summary', 'Summary', 'report'], ['initiatives', 'Initiatives', 'init'], ['triage', 'Triage', 'inbox'], ['backlog', 'Backlog', 'todo'], ['board', 'Board', 'cols'], ['timeline', 'Timeline', 'cal'], ['releases', 'Releases', 'out'], ['docs', 'Docs', 'doc'], ['sprints', 'Sprints', 'clock']];
+export const INI_TAB_LIST = [['overview', 'Overview', 'init'], ['breakdown', 'Breakdown', 'tree'], ['docs', 'Docs', 'doc'], ['tickets', 'Jira items', 'check'], ['timeline', 'Timeline', 'cal'], ['history', 'History', 'undo']];
+const BUILD_ONLY = ['releases', 'sprints'];
+const BOARD_IDS = BOARD_TAB_LIST.map((t) => t[0]);
+const INI_IDS = INI_TAB_LIST.map((t) => t[0]);
+const MODULES = ['./c3-ib-initiatives.js', './c3-ib-triage.js', './c3-ib-items.js', './c3-ib-releases.js', './c3-ib-docs.js', './c3-ib-sprints.js', './c3-ii-tabs.js'];
+let modulesReady = null;
+/** Import every tab module once. A failed import is recorded, never thrown. */
+export function loadTabModules() {
+  if (!modulesReady) modulesReady = Promise.all(MODULES.map((p) => import(p).then(() => null, (e) => ({ path: p, error: String((e && e.message) || e) })))).then((r) => r.filter(Boolean));
+  return modulesReady;
+}
+const SELF_WHY = 'This board follows the PMOS ladder. The repository derives each stage from its records, so a stage cannot be moved or edited here.';
+/** "Product workflow" or "Product workflow (edited)": the board's own workflow. */
+export function workflowLabel(b) {
+  if (b && b.self) return 'PMOS ladder';
+  const t = TEMPLATES[b && b.template];
+  return t ? t.name + ' workflow' + (b.templateEdited ? ' (edited)' : '') : 'Custom workflow';
+}
+
+/* ── the location in the URL ── */
+const dec = (s) => { try { return decodeURIComponent(s); } catch { return s; } };
+/** `init=` value -> { view, board, id, tab, filter, tool }. Anything unreadable is the Portfolio. */
+export function parseLoc(s) {
+  const p = String(s || '').split(':').map(dec);
+  if (p[0] === 'board' && p[1]) return { view: 'board', board: p[1], tab: BOARD_IDS.includes(p[2]) ? p[2] : 'summary', filter: p[3] ? Object.fromEntries(new URLSearchParams(p[3])) : {} };
+  if (p[0] === 'ini' && p[1] && p[2]) return { view: 'ini', board: p[1], id: p[2], tab: INI_IDS.includes(p[3]) ? p[3] : 'overview', tool: p[4] || '' };
+  return { view: 'portfolio' };
+}
+/** The inverse of parseLoc; '' for the Portfolio. */
+export function formatLoc(loc) {
+  const e = encodeURIComponent;
+  if (!loc || loc.view === 'portfolio' || !loc.board) return '';
+  if (loc.view === 'board') {
+    const f = Object.entries(loc.filter || {}).filter(([, v]) => v !== '' && v != null);
+    return ['board', e(loc.board), e(loc.tab || 'summary')].join(':') + (f.length ? ':' + e(new URLSearchParams(f).toString()) : '');
+  }
+  return ['ini', e(loc.board), e(loc.id), e(loc.tab || 'overview')].join(':') + (loc.tool ? ':' + e(loc.tool) : '');
+}
+
+function ensureCss() {
+  ensureC3Css();
+  ensureComponentsCss();   // first, so the reset in c3-initiatives.css comes after the primitive's own rules
+  if (typeof document === 'undefined' || document.querySelector('link[data-c3-ini]')) return;
+  const l = document.createElement('link');
+  l.rel = 'stylesheet'; l.href = new URL('./c3-initiatives.css', import.meta.url).href; l.setAttribute('data-c3-ini', '');
+  document.head.appendChild(l);
+}
+const warnChip = (w) => st('warn', 'alert', w, { title: 'An order rule, shown as a warning. It never blocks.', 'data-ini-warning': w });
+const buildTag = (b) => (b.build ? el('span', { class: 'tag' }, icon('jira', 'sm'), b.jira ? 'Jira · ' + b.jira : 'Jira not set') : el('span', { class: 'tag' }, 'PMOS tasks only'));
+const errLine = (text) => el('div', { class: 'fold w', role: 'alert', 'data-ini': 'error' }, icon('alert', 'sm'), text);
+const sentenceOf = (bad, warn) => (bad.length || warn.length
+  ? [bad.length ? plural(bad.length, 'board') + (bad.length === 1 ? ' is' : ' are') + ' off track' : '', warn.length ? plural(warn.length, 'board') + ' need' + (warn.length === 1 ? 's' : '') + ' attention' : ''].filter(Boolean).join(', ')
+  : 'Every board is on track');
+
+/* ════════════════════════════════════════════════════════════════════════════════════════════════════════════════════ */
+
+export function mountInitiatives(pane, opts) {
+  opts = opts || {};
+  ensureCss();
+  loadTabModules();
+  const P = { loc: parseLoc(new URLSearchParams(location.search).get('init')), boards: null, today: null, seq: 0, dispose: null, ini: null };
+  const root = el('div', { class: 'calwrap ini', 'data-ini': 'page' });
+  pane.replaceChildren(root);
+
+  /* ── the api, with the board's ws ── */
+  const apiFor = (ws) => ({
+    get(path, params) {
+      const q = new URLSearchParams();
+      if (ws) q.set('ws', ws);
+      for (const [k, v] of Object.entries(params || {})) if (v !== '' && v != null) q.set(k, String(v));
+      const s = q.toString();
+      const url = path + (s ? (path.includes('?') ? '&' : '?') + s : '');
+      // A board read answers { pending } while the repository is first read. Ask again every 2 s for up to a minute.
+      return (async () => {
+        for (let n = 0; ; n++) {
+          const r = await pmGet(url);
+          if (!(r && r.pending) || n >= 30 || !path.startsWith('/api/boards')) return r;
+          await new Promise((res) => setTimeout(res, 2000));
+        }
+      })();
+    },
+    post(path, body) { return pmPost(path, { ws, ...(body || {}) }); },
+  });
+  const pageApi = apiFor(opts.ws || '');
+
+  function writeUrl() {
+    try {
+      const u = new URL(location.href); const v = formatLoc(P.loc);
+      if (v) u.searchParams.set('init', v); else u.searchParams.delete('init');
+      if (u.href !== location.href) history.replaceState(history.state, '', u);
+    } catch { /* no history */ }
+  }
+  function go(loc) {
+    const l = { ...(loc || { view: 'portfolio' }) };
+    if (l.view === 'board') { l.tab = BOARD_IDS.includes(l.tab) ? l.tab : 'summary'; l.filter = l.filter || {}; }
+    if (l.view === 'ini') { l.tab = INI_IDS.includes(l.tab) ? l.tab : 'overview'; l.tool = l.tool || ''; }
+    P.loc = l; writeUrl(); draw();
+  }
+  const openBoard = (id, tab, filter) => go({ view: 'board', board: id, tab: tab || 'summary', filter: filter || {} });
+  const refresh = () => { P.boards = null; P.ini = null; dropItems(); draw(); };
+  const redraw = () => draw();
+
+  async function loadBoards() {
+    if (P.boards) return P.boards;
+    for (let k = 0; k < 20; k++) {
+      const r = await pageApi.get('/api/boards');
+      if (r && r.ok && r.pending) { status('Reading the repository. The boards show when it is read.'); await new Promise((res) => setTimeout(res, 3000)); continue; }
+      if (!r || !r.ok) throw new Error((r && r.error) || 'no answer');
+      P.boards = Array.isArray(r.boards) ? r.boards : [];
+      P.today = r.today || P.today || isoToday();
+      return P.boards;
+    }
+    throw new Error('the repository is taking long to read. Reload in a moment.');
+  }
+  const findBoard = (id) => { const all = (P.boards || []).filter((b) => b.id === id); return all.find((b) => b.ws === opts.ws) || all[0] || null; };
+  function status(text) { root.replaceChildren(note(text)); root.firstChild.setAttribute('role', 'status'); root.firstChild.setAttribute('data-ini', 'status'); }
+
+  async function draw() {
+    const token = ++P.seq;
+    const live = () => token === P.seq;
+    if (P.dispose) { const d = P.dispose; P.dispose = null; try { d(); } catch { /* the view cleans its own */ } }
+    closeMenu();
+    if (!P.boards) status('Reading the boards');
+    let boards;
+    try { boards = await loadBoards(); } catch (e) { if (live()) root.replaceChildren(errLine('The boards could not be read: ' + e.message)); return; }
+    if (!live()) return;
+    root.dataset.iniView = P.loc.view;
+    if (P.loc.view === 'portfolio') return drawPortfolio(boards, token);
+    const b = findBoard(P.loc.board);
+    if (!b) { root.replaceChildren(pathCrumbs(null), errLine('No board "' + P.loc.board + '" is in the portfolio. It may have been renamed or removed.')); return; }
+    if (P.loc.view === 'board') return drawBoard(b, token);
+    return drawIni(b, token);
+  }
+
+  function pathCrumbs(b, row, right) {
+    const parts = [{ t: PORTFOLIO, ic: 'cols', go: b ? () => go({ view: 'portfolio' }) : null, attrs: { 'data-ini-crumb': 'portfolio' } }];
+    if (b) parts.push({ t: b.name, go: row ? () => openBoard(b.id, 'initiatives') : null, attrs: { 'data-ini-crumb': 'board' } });
+    if (row) parts.push({ t: row.id + ' ' + trunc(row.title || '', 44), attrs: { 'data-ini-crumb': 'initiative' } });
+    return crumbs(parts, right);
+  }
+
+  /* ── the ctx a tab is handed ── */
+  function makeCtx(b, extra) {
+    const ws = b.ws || opts.ws || '';
+    const ctx = {
+      ws, board: b, today: P.today || isoToday(), row: null, history: [], tools: [], toolsByCat: null, tab: '', filter: {}, tool: '', ...extra,
+      api: apiFor(ws), go,
+      openInitiative: (id, tab, board) => go({ view: 'ini', board: board || b.id, id, tab: tab || 'overview' }),
+      openBoard, toast, openSheet, refresh, redraw, demo: !!opts.demo, showTab: typeof opts.showTab === 'function' ? opts.showTab : () => {},
+      moveTo: (id, stage) => moveTo(b, id, stage),
+      openWorkflow: (row) => openWorkflow(b, row),
+      openBoardSettings: () => openBoardSettings(b),
+      newInitiative: () => openNewIni(b),
+    };
+    return Object.freeze(ctx);
+  }
+  async function mountTab(host, mount, label, ctx, token) {
+    await loadTabModules();
+    if (token !== P.seq) return;
+    const m = (ctx.row ? INITIATIVE_TABS : BOARD_TABS)[ctx.tab] || mount;
+    if (typeof m !== 'function') { host.replaceChildren(note('The ' + label + ' view is not built yet.')); return; }
+    try {
+      const d = await m(host, ctx);
+      if (typeof d === 'function') { if (token === P.seq) P.dispose = d; else d(); }
+    } catch (e) {
+      if (token === P.seq) host.replaceChildren(errLine('The ' + label + ' view could not draw: ' + String((e && e.message) || e)));
+    }
+  }
+
+  /* ════════ PORTFOLIO ════════ */
+  async function drawPortfolio(boards, token) {
+    const asks = boards.reduce((n, b) => n + (Number(b.asks) || 0), 0);
+    const total = boards.reduce((n, b) => n + ((b.counts && b.counts.total) || 0), 0);
+    const bad = boards.filter((b) => b.health === 'bad'); const warn = boards.filter((b) => b.health === 'warn');
+    const tlHost = el('div', { 'data-ini': 'pf-timeline' }, note('Reading the work items of each board'));
+    const byCatAll = Object.fromEntries(CATS.map((c) => [c, boards.reduce((n, b) => n + (((b.counts || {}).byCat || {})[c] || 0), 0)]));
+    const maxCat = Math.max(1, ...CATS.map((c) => byCatAll[c]));
+    const askBoards = boards.filter((b) => Number(b.asks) > 0);
+    const left = sect({ ic: 'cols', title: 'Boards', count: boards.length },
+      boards.length ? list(boards.map(boardRow), { 'data-ini': 'boards' }) : empty('No board yet. Each repository gets one when it is read. Press New board to add one.'),
+      note('A board holds initiatives. Each initiative runs its own workflow, and boards that build a product also mirror Jira.'));
+    const right = [
+      card({ ic: 'flag', title: 'Where the initiatives are', sub: 'across the boards' },
+        hbs(CATS.map((c) => el('div', { class: 'ini-c', 'data-cat': c }, hbr([sw(c), ' ', c], byCatAll[c], byCatAll[c] / maxCat, 'acc', { class: 'hbr ini-c', 'data-cat': c })))),
+        note('Stages roll up into Discover, Plan, Do and Learn, so boards on different workflows compare.')),
+      card({ ic: 'inbox', title: 'Asks waiting for triage' },
+        askBoards.length ? chgl(askBoards.map((b) => el('li', null, icon('inbox', 'sm'), lk({ onclick: () => openBoard(b.id, 'triage'), 'data-ini-asks': b.id }, b.name), el('span', { class: 'tag' }, plural(Number(b.asks), 'new ask')))))
+          : note('No new asks on any board.')),
+    ];
+    root.replaceChildren(
+      pathCrumbs(null, null, el('div', { class: 'chips2' }, mono(plural(boards.length, 'board') + ' · ' + plural(total, 'initiative') + ' · ' + plural(asks, 'new ask')),
+        pbtn('primary', 'New board', 'plus', { 'data-ini': 'new-board', onclick: () => openNewBoard() }))),
+      el('div', { class: 'calbody', 'data-ini': 'portfolio' },
+        lh('cols', sentenceOf(bad, warn), PORTFOLIO + ': boards hold initiatives, initiatives hold epics, epics hold stories, tasks and bugs. Stages roll up into Discover, Plan, Do and Learn so boards compare.'),
+        cols(left, right),
+        sect({ ic: 'cal', title: 'Timeline across boards', right: mono('Board > initiative > epic') }, tlHost)));
+    /* the cross-board timeline: board > the initiatives that are featured, at risk or carry work > their epics */
+    const reads = await Promise.all(boards.map((b) => loadItems(makeCtx(b, {})).then((r) => ({ b, r }))));
+    if (token !== P.seq) return;
+    const rows = []; let more = 0;
+    for (const { b, r } of reads) {
+      if (!r.ok) continue;
+      const ctx = makeCtx(b, {});
+      const withWork = new Set(r.items.map((w) => w.ini));
+      const now = r.initiatives.filter((i) => i.status !== 'done' && i.start && i.end && (i.horizon === 'now' || withWork.has(i.id) || i.featured));
+      const pick = [...now.filter((i) => withWork.has(i.id) || i.featured), ...now.filter((i) => !withWork.has(i.id) && !i.featured && ['at risk', 'late'].includes(i.status)).sort((x, y) => String(x.end).localeCompare(String(y.end))).slice(0, 2)].slice(0, 6);
+      more += now.length - pick.length;
+      if (!pick.length) continue;
+      pick.sort((x, y) => String(x.start).localeCompare(String(y.start)));
+      const s = pick.map((i) => i.start).sort()[0]; const e = pick.map((i) => i.end).sort().pop();
+      const avg = pick.reduce((n, i) => n + (Number(i.progress) || 0), 0) / pick.length;
+      rows.push({ uid: 'b:' + b.id, label: b.name + ' · ' + pick.length + ' of ' + now.length, start: s, end: e, progress: avg, cls: 'grp', tone: b.health === 'bad' ? 'bad' : b.health === 'warn' ? 'warn' : 'ok',
+        open: () => openBoard(b.id, 'timeline'), tip: { t: b.name + (b.full ? ' · ' + b.full : ''), p: Math.round(avg * 100) + '%', st: HEALTH[b.health] || 'No health yet', o: b.owner || '', src: b.build ? 'Board · Jira ' + (b.jira || '') : 'Board · PMOS tasks only', hint: 'Click the row to fold the board' },
+        kids: pick.map((i) => iniTlRow(ctx, i, workTlRows(ctx, r.items.filter((w) => w.ini === i.id), () => { dropItems(ctx); draw(); }), b)) });
+    }
+    const { from, to } = tlRange(P.today);
+    const node = timeline({ key: 'pf', rows, from, to, today: P.today, markers: [], defOpen: boards.map((b) => 'b:' + b.id), head: 'Board > initiative > epic',
+      onMove: (task, days, uid) => { const b = (reads.find(({ r }) => r.items.some((w) => w.ref === task)) || {}).b; if (b) rescheduleTask(makeCtx(b, {}), task, days, () => draw()); },
+      onLocked: (k) => lockedToast(makeCtx(boards[0] || {}, {}), k) });
+    tlHost.replaceChildren(node, note('Featured, at-risk and active initiatives with dates. ' + (more ? plural(more, 'more is', 'more are') + ' on each board\'s Timeline.' : 'Each board\'s Timeline shows all of its own.')));
+    requestAnimationFrame(() => tlInit(tlHost));
+  }
+  function boardRow(b) {
+    const c = b.counts || {}; const by = c.byCat || {}; const tot = CATS.reduce((n, k) => n + (by[k] || 0), 0) || 1;
+    const asks = Number(b.asks) || 0; const rel = b.nextRelease;
+    const stack = el('div', { class: 'ini-stack', role: 'img', 'aria-label': CATS.map((k) => k + ' ' + (by[k] || 0)).join(', ') },
+      ...CATS.filter((k) => by[k]).map((k) => geo(el('i', { class: 'ini-c', 'data-cat': k }), { '--in-f': ((by[k] || 0) / tot).toFixed(3) })));
+    const after = [stack,
+      el('div', { class: 'chips' }, ...CATS.map((k) => chip(sw(k), k + ' ', el('b', null, String(by[k] || 0))))),
+      el('div', { class: 'chips' },
+        c.risk ? st('warn', 'alert', c.risk + ' at risk') : null, c.late ? st('bad', 'clock', c.late + ' late') : null, !c.risk && !c.late ? chip('No risk flags') : null,
+        asks ? lk({ onclick: () => openBoard(b.id, 'triage'), 'data-ini-asks': b.id }, icon('inbox', 'sm'), plural(asks, 'new ask')) : null,
+        rel ? chip(icon('out', 'sm'), 'Next release ' + (rel.name || rel.id || '') + (rel.at || rel.date ? ' · ' + day(rel.at || rel.date) : ''), rel.status ? tag(rel.status) : null) : b.build ? chip('No release planned') : null)];
+    return nrow({ ic: 'cols', hot: b.health === 'bad' || b.health === 'warn', title: b.name, onOpen: () => openBoard(b.id), openLabel: 'Open ' + b.name, sub: b.full || '',
+      chips: [healthSt(b.health), ownerChip(b.owner), b.build ? chip(icon('bolt', 'sm'), 'Build and deliver') : null, buildTag(b),
+        lk({ onclick: () => openBoard(b.id, 'initiatives'), 'data-ini-count': b.id }, icon('init', 'sm'), plural(c.total || 0, 'initiative'))],
+      after, right: [ib('Open ' + b.name, 'next', { onclick: () => openBoard(b.id), 'data-ini-open-board': b.id })], attrs: { 'data-ini-board': b.id } });
+  }
+
+  /* ════════ BOARD ════════ */
+  async function drawBoard(b, token) {
+    let tab = P.loc.tab;
+    if (BUILD_ONLY.includes(tab) && !b.build) tab = 'summary';
+    const ctx0 = makeCtx(b, {});
+    const items = await loadItems(ctx0);
+    if (token !== P.seq) return;
+    const work = items.items; const jiraN = work.filter((w) => w.src === 'jira').length; const pmN = work.length - jiraN;
+    const c = b.counts || {}; const asks = Number(b.asks) || 0; const risk = (c.risk || 0) + (c.late || 0);
+    const tabs = BOARD_TAB_LIST.filter(([k]) => b.build || !BUILD_ONLY.includes(k)).map(([k, l, ic]) => [k, l, ic,
+      k === 'triage' && asks ? el('span', { class: 'bdg' }, String(asks)) : k === 'initiatives' ? el('span', { class: 'bdg g' }, String(c.total || 0)) : k === 'backlog' && items.ok ? el('span', { class: 'bdg g' }, String(work.filter((w) => w.status !== 'Done' && w.kind !== 'Epic').length)) : null]);
+    const host = el('div', { class: 'calbody', 'data-ini-panel': tab });
+    const def = TEMPLATES[b.defTpl] || TEMPLATES[b.template] || TEMPLATES.product;
+    root.replaceChildren(
+      pathCrumbs(b, null, el('div', { class: 'chips2' }, pbtn('outline', 'Dashboard', 'report', { onclick: () => ctx0.showTab('rep') }),
+        pbtn('outline', 'Board settings', 'settings', { 'data-ini': 'board-settings', 'aria-haspopup': 'dialog', onclick: () => openBoardSettings(b) }))),
+      el('div', { class: 'calbody', 'data-ini-board-page': b.id },
+        lh('cols', b.name + (b.full ? ' · ' + b.full : ''), (HEALTH[b.health] || 'No health yet') + (risk ? ', ' + risk + ' at risk or late' : '') + (asks ? ', ' + plural(asks, 'new ask') + ' to triage' : '') + '. '
+          + plural(c.total || 0, 'initiative') + (items.ok ? ', ' + plural(work.filter((w) => w.kind === 'Epic').length, 'epic') + ', ' + plural(work.filter((w) => w.kind !== 'Epic').length, 'item') : '') + '.'),
+        el('div', { class: 'chips2', 'aria-label': 'Board setup', 'data-ini': 'setup' },
+          ...(b.build ? [st('ok', 'bolt', 'Build and deliver on'), chip(icon('jira', 'sm'), b.jira ? ['Jira project ', el('b', { class: 'mono' }, b.jira), ' · ' + plural(jiraN, 'item')] : 'No Jira project set'), chip('PMOS tasks ' + pmN)]
+            : [chip(icon('x', 'sm'), 'Build and deliver off'), chip('No Jira · ' + plural(pmN, 'PMOS task'))]),
+          chip(icon('flag', 'sm'), 'New initiatives start with ' + def.name), lk({ onclick: () => openBoardSettings(b), 'data-ini': 'setup-change' }, 'Change')),
+        b.self ? note(SELF_WHY) : null,
+        segTabs(tabs, tab, (k) => openBoard(b.id, k), 'Board views', { 'data-ini': 'board-tabs' }),
+        host));
+    mountTab(host, tab === 'summary' ? mountSummary : null, (BOARD_TAB_LIST.find((t) => t[0] === tab) || [])[1], makeCtx(b, { tab, filter: P.loc.filter || {} }), token);
+  }
+
+  /* Summary: initiatives at a glance, where they stand, what needs attention */
+  async function mountSummary(host, ctx) {
+    const b = ctx.board;
+    const r = await loadItems(ctx);
+    if (!r.ok) { host.replaceChildren(errLine('The board could not be read: ' + r.error + '.')); return; }
+    const inis = r.initiatives; const work = r.items; const open = inis.filter((i) => i.status !== 'done');
+    const risk = inis.filter((i) => ['at risk', 'late'].includes(i.status)).sort((x, y) => String(x.end || '9').localeCompare(String(y.end || '9')));
+    const withWork = new Set(work.map((w) => w.ini));
+    const glance = open.filter((i) => withWork.has(i.id) || i.featured || (i.horizon === 'now' && i.status !== 'on track'))
+      .sort((x, y) => (withWork.has(y.id) - withWork.has(x.id)) || ((y.featured ? 1 : 0) - (x.featured ? 1 : 0)) || String(x.end || '9').localeCompare(String(y.end || '9'))).slice(0, 6);
+    const epicsOf = (id) => work.filter((w) => w.ini === id && w.kind === 'Epic').length;
+    const iniGlance = (i) => nrow({ ic: i.status === 'late' || i.status === 'at risk' ? 'alert' : 'init', hot: i.status === 'late' || i.status === 'at risk', title: i.title, onOpen: () => ctx.openInitiative(i.id), openLabel: 'Open ' + i.id,
+      chips: [chipMono(i.id), stepsMini(wfOf(i, b), i.stage, tplName(i, b)), statusChip(i.status), progChip(i.progress || 0, toneOf(i)), ownerChip(i.owner), dateChip(i.start, i.end, i.status !== 'done' && i.end && daysBetween(ctx.today, i.end) < 0), chip(icon('bolt', 'sm'), plural(epicsOf(i.id), 'epic'))],
+      right: [ib('Open ' + i.id, 'next', { onclick: () => ctx.openInitiative(i.id) })], attrs: { 'data-ini-row': i.id } });
+    const att = risk.slice(0, 5).map((i) => nrow({ ic: 'alert', hot: true, title: i.id + ' ' + i.title, onOpen: () => ctx.openInitiative(i.id),
+      chips: [statusChip(i.status), stageChip(i.stage, catOf(wfOf(i, b), i.stage)), ownerChip(i.owner), chip(icon('cal', 'sm'), i.end ? 'ends ' + day(i.end) : 'No end date')], attrs: { 'data-ini-risk': i.id } }));
+    const byCat = (c) => open.filter((i) => catOf(wfOf(i, b), i.stage) === c).length; const maxN = Math.max(1, ...CATS.map(byCat));
+    const items = work.filter((w) => w.kind !== 'Epic'); const tot = Math.max(1, items.length); const nSt = (s) => items.filter((w) => w.status === s).length;
+    const goIni = (filter) => ctx.openBoard(b.id, 'initiatives', filter);
+    const rel = b.build && b.nextRelease;
+    host.replaceChildren(cols(
+      [sect({ ic: 'init', title: 'Initiatives at a glance', count: open.length, right: lk({ onclick: () => goIni({ view: 'all' }), 'data-ini': 'all-initiatives' }, 'All ' + plural(inis.length, 'initiative')) },
+        glance.length ? list(glance.map(iniGlance), { 'data-ini': 'glance' }) : empty('No open initiatives yet. Accept an ask in Triage to start one.')),
+      sect({ ic: 'alert', title: 'Needs attention', count: risk.length, right: risk.length > att.length ? lk({ onclick: () => goIni({ view: 'risk' }) }, 'See all ' + risk.length) : null },
+        att.length ? list(att) : empty('Nothing at risk.'))],
+      [card({ ic: 'flag', title: 'Where the initiatives are', sub: 'each on its own workflow' },
+        hbs(CATS.map((c) => btn({ class: 'ini-hbb', 'data-ini-catgo': c, title: 'See ' + c + ' initiatives', onclick: () => goIni({ view: 'all', cat: c }) }, hbr([sw(c), ' ', c], byCat(c), byCat(c) / maxN, 'acc', { class: 'hbr ini-c', 'data-cat': c })))),
+        note('Stages roll up into four categories. Press one to list its initiatives.')),
+      card({ ic: 'todo', title: 'Work items', sub: b.build ? 'Jira ' + (b.jira || '') + ' and PMOS' : 'PMOS tasks' },
+        hbs(['To do', 'In progress', 'In review', 'Done'].map((s) => hbr(s, nSt(s), nSt(s) / tot, s === 'Done' ? 'ok' : s === 'To do' ? 'pm' : 'acc'))),
+        el('div', { class: 'chips2' }, lk({ onclick: () => ctx.openBoard(b.id, 'board') }, 'Open the Board'), lk({ onclick: () => ctx.openBoard(b.id, 'timeline') }, 'Open the Timeline'))),
+      card({ ic: 'report', title: 'At a glance' }, chgl([
+        el('li', null, icon('bolt', 'sm'), lk({ onclick: () => goIni({ view: 'all', cat: 'Do' }) }, 'Open initiatives in Do'), tag(String(byCat('Do')))),
+        el('li', null, icon('alert', 'sm'), lk({ onclick: () => goIni({ view: 'risk' }) }, 'At risk or late'), tag(String(risk.length))),
+        el('li', null, icon('user', 'sm'), lk({ onclick: () => goIni({ view: 'noowner' }) }, 'No owner'), tag(String(open.filter((i) => !i.owner).length))),
+        el('li', null, icon('inbox', 'sm'), lk({ onclick: () => ctx.openBoard(b.id, 'triage') }, 'New asks'), tag(String(Number(b.asks) || 0)))], { 'data-ini': 'at-a-glance' })),
+      card({ ic: 'report', title: 'Board dashboard', sub: 'in Reports' },
+        rel ? note('Next release: ' + (rel.name || rel.id) + (rel.at || rel.date ? ' · ' + day(rel.at || rel.date) : '')) : null,
+        el('div', { class: 'chips2' }, pbtn('outline', 'Open the ' + b.name + ' dashboard', 'next', { onclick: () => ctx.showTab('rep') })))]));
+  }
+
+  /* ════════ BOARD SETTINGS, NEW BOARD, NEW INITIATIVE ════════ */
+  const checkbox = (on, label, attrs, onchange) => el('label', { class: 'ini-chk' }, el('input', { type: 'checkbox', checked: !!on, ...(attrs || {}), onchange }), el('span', null, ...[].concat(label)));
+  const flowOf = (stages) => { const out = []; stages.forEach((s, k) => { if (k) out.push(icon('next', 'sm')); out.push(stageChip(s.name, s.cat)); }); return el('div', { class: 'chips2' }, ...out); };
+  const tplCase = (k) => el('div', { class: 'case', 'data-ini': 'tpl-case' }, el('p', { class: 'sit' }, TEMPLATES[k].use), flowOf(TEMPLATES[k].stages));
+  function tplSeg(allowed, cur, onPick, label, extra) {
+    return el('div', { class: 'seg ini-seg', role: 'group', 'aria-label': label },
+      ...Object.keys(TEMPLATES).map((k) => btn({ 'aria-pressed': String(cur === k), 'data-ini-tpl': k, disabled: !allowed.includes(k), title: allowed.includes(k) ? TEMPLATES[k].use : templateBuilds(k) ? 'Needs Build and deliver' : 'Not offered', onclick: () => onPick(k) },
+        TEMPLATES[k].name, extra && extra === k ? el('span', { class: 'dim' }, ' default') : null)));
+  }
+
+  function openBoardSettings(b) {
+    if (b.self) { openSheet({ title: 'Board settings · ' + b.name, icon: 'lock', body: el('div', { class: 'ini-form' }, note(SELF_WHY)) }); return; }
+    const B = { build: b.build !== false, jira: b.jira || '', offer: new Set(offered(b)), def: b.defTpl || offered(b)[0], err: '', busy: false };
+    const host = el('div', { class: 'ini-form', 'data-ini': 'settings-form' });
+    const sh = openSheet({ title: 'Board settings · ' + b.name, icon: 'cols', body: host, wide: true });
+    let usage = null;
+    loadItems(makeCtx(b, {})).then((r) => { usage = r; render(); });
+    function render(focusSel) {
+      const allowed = (k) => B.build || !templateBuilds(k);
+      for (const k of [...B.offer]) if (!allowed(k)) B.offer.delete(k);
+      if (!B.offer.size) B.offer.add(Object.keys(TEMPLATES).find(allowed));
+      if (!B.offer.has(B.def)) B.def = [...B.offer][0];
+      const inis = usage && usage.ok ? usage.initiatives : [];
+      const jiraN = usage && usage.ok ? usage.items.filter((w) => w.src === 'jira').length : 0;
+      const usingBuild = inis.filter((i) => wfOf(i, b).some(isBuildStage)).length;
+      const jira = el('input', { type: 'text', value: B.jira, 'aria-label': 'Jira project key', placeholder: 'Project key, e.g. IDPF', 'data-ini': 'jira-key', oninput: (e) => { B.jira = e.target.value; } });
+      host.replaceChildren(
+        note('Settings for the board. Workflows belong to each initiative; here you choose which templates the board offers and which one new initiatives start with.'),
+        checkbox(B.build, [el('b', null, 'Build and deliver'), ': this board builds a product and mirrors Jira'], { 'data-ini': 'build' }, (e) => { B.build = e.target.checked; if (B.build) Object.keys(TEMPLATES).filter(templateBuilds).forEach((k) => B.offer.add(k)); render('[data-ini="build"]'); }),
+        B.build ? el('div', { class: 'ini-field' }, lbl('JIRA PROJECT'), el('div', { class: 'form' }, jira), note('Shows Jira epics, stories, tasks and bugs next to PMOS tasks, and adds the Sprints and Releases tabs (mirrored, read-only).'))
+          : note('Off: Backlog, Board and Timeline show PMOS tasks only. No Sprints or Releases tab, and initiatives choose workflows without Build and Deliver.'),
+        !B.build && b.build ? el('div', { class: 'fold w', role: 'alert', 'data-ini': 'build-off-warning' }, icon('alert', 'sm'), el('span', null, plural(jiraN, 'Jira item') + ' will be hidden from this board.' + (usingBuild ? ' ' + plural(usingBuild, 'initiative') + ' use Build or Deliver stages; they keep them until you edit their workflow.' : ''))) : null,
+        lbl('WORKFLOWS THIS BOARD OFFERS'),
+        chgl(Object.keys(TEMPLATES).map((k) => el('li', null,
+          checkbox(B.offer.has(k), [el('b', null, TEMPLATES[k].name), ' ', el('span', { class: 'dim' }, TEMPLATES[k].stages.map((s) => s.name).join(' > '))], { 'data-ini-offer': k, disabled: !allowed(k) },
+            (e) => { if (e.target.checked) B.offer.add(k); else if (B.offer.size > 1) B.offer.delete(k); render('[data-ini-offer="' + k + '"]'); }),
+          el('span'), tag(allowed(k) ? plural(inis.filter((i) => i.template === k).length, 'uses it', 'use it') : 'needs Build and deliver'))), { 'data-ini': 'offer' }),
+        lbl('DEFAULT FOR NEW INITIATIVES AND ACCEPTED ASKS'),
+        tplSeg([...B.offer], B.def, (k) => { B.def = k; render('[data-ini-tpl="' + k + '"]'); }, 'Default workflow'),
+        tplCase(B.def),
+        el('div', { class: 'chips2' }, el('span', { class: 'dim ini-note' }, 'Initiatives that do not run their own workflow run the board\'s: ' + workflowLabel(b) + '.'), lk({ 'data-ini': 'edit-board-workflow', onclick: () => openBoardWorkflow(b) }, 'Edit the board\'s workflow')),
+        B.err ? errLine(B.err) : null,
+        el('div', { class: 'chips2' }, pbtn('primary', B.busy ? 'Saving' : 'Save board settings', null, { 'data-ini': 'settings-save', disabled: B.busy, onclick: save }), pbtn('ghost', 'Cancel', null, { onclick: () => sh.close() })));
+      if (focusSel) { const f = host.querySelector(focusSel); if (f) f.focus(); }
+    }
+    async function save() {
+      const key = B.jira.trim();
+      if (B.build && key && !/^[A-Za-z][A-Za-z0-9_]{0,19}$/.test(key)) { B.err = 'A Jira project key is a letter, then letters, digits or _.'; render(); return; }
+      B.busy = true; B.err = ''; render();
+      const body = { board: b.id, buildDeliver: B.build, offer: [...B.offer], defTpl: B.def };
+      if (B.build && key) body.jira = key;
+      const r = await apiFor(b.ws).post('/api/boards/settings', body);
+      B.busy = false;
+      if (!r || !r.ok) { B.err = 'The settings were not saved: ' + ((r && r.error) || 'no answer') + '.'; render(); return; }
+      sh.close();
+      const nb = r.board || {};
+      toast(b.name + ': Build and deliver ' + (nb.build ? 'on' + (nb.jira ? ', mirroring Jira ' + nb.jira : '') : 'off, PMOS tasks only') + '. New initiatives start with ' + (TEMPLATES[nb.defTpl] || TEMPLATES[B.def]).name + '.');
+      refresh();
+    }
+    render();
+  }
+
+  function openNewBoard() {
+    const wsList = (opts.workspaces || []).filter((w) => w && w.id);
+    const N = { name: '', build: true, jira: '', tpl: 'product', ws: opts.ws || (wsList[0] && wsList[0].id) || '', err: '', busy: false };
+    const host = el('div', { class: 'ini-form', 'data-ini': 'new-board-form' });
+    const sh = openSheet({ title: 'New board', icon: 'plus', body: host, wide: true });
+    const name = el('input', { type: 'text', placeholder: 'For example: Partner portal', 'aria-label': 'Board name', 'data-ini': 'nb-name', oninput: (e) => { N.name = e.target.value; } });
+    function render(focusSel) {
+      const allowed = Object.keys(TEMPLATES).filter((k) => N.build || !templateBuilds(k));
+      if (!allowed.includes(N.tpl)) N.tpl = allowed[0];
+      host.replaceChildren(
+        note('A board sits in the ' + PORTFOLIO + ' and holds initiatives. Each initiative picks its own workflow; the board only offers templates and a default.'),
+        lbl('BOARD NAME'), el('div', { class: 'form' }, name),
+        wsList.length > 1 ? el('label', { class: 'ini-field' }, lbl('WORKSPACE'), el('select', { 'data-ini': 'nb-ws', onchange: (e) => { N.ws = e.target.value; } }, ...wsList.map((w) => el('option', { value: w.id, selected: w.id === N.ws }, w.name || w.id)))) : null,
+        checkbox(N.build, [el('b', null, 'Build and deliver'), ': this board builds a product and mirrors Jira'], { 'data-ini': 'nb-build' }, (e) => { N.build = e.target.checked; render('[data-ini="nb-build"]'); }),
+        N.build ? el('div', { class: 'ini-field' }, lbl('JIRA PROJECT'), el('div', { class: 'form' }, el('input', { type: 'text', value: N.jira, placeholder: 'Project key, e.g. PP', 'aria-label': 'Jira project key', 'data-ini': 'nb-jira', oninput: (e) => { N.jira = e.target.value; } })),
+          note('Epics, stories, tasks and bugs from this project show next to PMOS tasks. Sprints and releases are mirrored, read-only.'))
+          : note('Off: no Jira. Initiatives here use workflows without Build and Deliver, and the work is PMOS tasks. Good for a microsite run by an agency, an office move or hiring.'),
+        lbl('DEFAULT WORKFLOW FOR NEW INITIATIVES'), tplSeg(allowed, N.tpl, (k) => { N.tpl = k; render('[data-ini-tpl="' + k + '"]'); }, 'Default workflow'), tplCase(N.tpl),
+        note('Any initiative can switch to another offered workflow, or edit its own stages, from the initiative page.'),
+        N.err ? errLine(N.err) : null,
+        el('div', { class: 'chips2' }, pbtn('primary', N.busy ? 'Creating' : 'Create board', null, { 'data-ini': 'nb-create', disabled: N.busy, onclick: create }), pbtn('ghost', 'Cancel', null, { onclick: () => sh.close() })));
+      if (focusSel) { const f = host.querySelector(focusSel); if (f) f.focus(); }
+    }
+    async function create() {
+      const n = N.name.trim();
+      if (!n) { N.err = 'Give the board a name.'; render(); name.focus(); return; }
+      const kind = TEMPLATES[N.tpl].kind;
+      const template = kind === 'simple' ? 'simple' : kind === 'project' || !N.build ? 'project' : 'product';
+      const body = { name: n, template, buildDeliver: N.build, offer: Object.keys(TEMPLATES).filter((k) => N.build || !templateBuilds(k)), defTpl: N.tpl };
+      if (N.build && N.jira.trim()) body.jira = N.jira.trim();
+      N.busy = true; N.err = ''; render();
+      const r = await apiFor(N.ws).post('/api/boards/create', body);
+      N.busy = false;
+      if (!r || !r.ok) { N.err = 'The board was not created: ' + ((r && r.error) || 'no answer') + '.'; render(); return; }
+      sh.close();
+      toast('Board ' + n + ' created' + (N.build ? (body.jira ? ', mirroring Jira ' + body.jira.toUpperCase() : ', Build and deliver on') : ', PMOS tasks only') + '. New initiatives start with ' + TEMPLATES[N.tpl].name + '.');
+      P.boards = null;
+      go({ view: 'board', board: (r.board && r.board.id) || n, tab: 'triage' });
+    }
+    render();
+    name.focus();
+  }
+
+  /* New initiative: the server creates an initiative only by accepting an ask, so this sheet adds the ask and accepts it at once. */
+  function openNewIni(b) {
+    const offer = offered(b);
+    const F = { title: '', anchor: '', lane: 'feature', tpl: offer.includes(b.defTpl) ? b.defTpl : offer[0], err: '', busy: false };
+    const host = el('div', { class: 'ini-form', 'data-ini': 'new-ini-form' });
+    const sh = openSheet({ title: 'New initiative · ' + b.name, icon: 'plus', body: host, wide: true });
+    const title = el('input', { type: 'text', 'aria-label': 'Initiative title', placeholder: 'e.g. Enable passwordless login with email OTP', 'data-ini': 'ni-title', oninput: (e) => { F.title = e.target.value; } });
+    const anchor = el('input', { type: 'text', 'aria-label': 'Anchor', placeholder: 'A key result or a health budget, e.g. KR 2.1 Activation to 45%', 'data-ini': 'ni-anchor', oninput: (e) => { F.anchor = e.target.value; } });
+    function render(focusSel) {
+      host.replaceChildren(
+        note('Lives in ' + PORTFOLIO + ' > ' + b.name + '. It gets its own workflow: pick one of the templates this board offers. You can edit its stages later. It is recorded as an ask you accepted.'),
+        lbl('TITLE'), el('div', { class: 'form' }, title),
+        lbl('ANCHOR'), el('div', { class: 'form' }, anchor), note('Every initiative anchors to a key result or a health budget. PMOS refuses one without it.'),
+        el('label', { class: 'ini-field' }, lbl('LANE'), el('select', { 'aria-label': 'Lane', 'data-ini': 'ni-lane', onchange: (e) => { F.lane = e.target.value; } }, ...['feature', 'discovery', 'chore', 'incident', 'content', 'prototype'].map((l) => el('option', { value: l, selected: l === F.lane }, l)))),
+        lbl('WORKFLOW'), tplSeg(offer, F.tpl, (k) => { F.tpl = k; render('[data-ini-tpl="' + k + '"]'); }, 'Workflow', b.defTpl), tplCase(F.tpl),
+        b.build ? null : note(b.name + ' does not build a product, so workflows with Build and Deliver are not offered.'),
+        F.err ? errLine(F.err) : null,
+        el('div', { class: 'chips2' }, pbtn('primary', F.busy ? 'Creating' : 'Create initiative', null, { 'data-ini': 'ni-create', disabled: F.busy, onclick: create }), pbtn('ghost', 'Cancel', null, { onclick: () => sh.close() })));
+      if (focusSel) { const f = host.querySelector(focusSel); if (f) f.focus(); }
+    }
+    async function create() {
+      const t = F.title.trim(); const a = F.anchor.trim();
+      if (!t || !a) { F.err = !t ? 'Give the initiative a title.' : 'Give it an anchor: a key result or a health budget.'; render(); (t ? anchor : title).focus(); return; }
+      const api = apiFor(b.ws);
+      F.busy = true; F.err = ''; render();
+      const add = await api.post('/api/boards/asks/add', { board: b.id, line: t, source: 'New initiative, typed by you' });
+      const askId = add && add.ok && add.ask && add.ask.id;
+      const acc = askId ? await api.post('/api/boards/asks/accept', { board: b.id, ask: askId, title: t, lane: F.lane, anchor: a }) : add;
+      const id = acc && acc.ok && acc.initiative && (acc.initiative.id || acc.initiative);
+      if (!id) { F.busy = false; F.err = 'The initiative was not created: ' + ((acc && acc.error) || 'no answer') + '.'; render(); return; }
+      if (F.tpl !== b.defTpl) {
+        const stages = TEMPLATES[F.tpl].stages.map((s) => ({ name: s.name, cat: s.cat }));
+        await api.post('/api/boards/ini-workflow', { board: b.id, id, template: F.tpl, stages, moveTo: stages[0].name });
+      }
+      sh.close();
+      toast(id + ' created with the ' + TEMPLATES[F.tpl].name + ' workflow.');
+      P.boards = null; dropItems();
+      go({ view: 'ini', board: b.id, id, tab: 'overview' });
+    }
+    render();
+    title.focus();
+  }
+
+  /* ════════ THE WORKFLOW EDITOR: one initiative's stages, or the board's own ════════ */
+  function openWorkflow(b, row) {
+    if (b.self) { openSheet({ title: 'Workflow · ' + row.id, icon: 'lock', body: el('div', { class: 'ini-form' }, note(SELF_WHY)) }); return; }
+    const offer = offered(b);
+    const now = wfOf(row, b);
+    let seq = 0;
+    const W = { tpl: row.template || null, draft: now.map((s) => ({ key: 'k' + (++seq), name: s.name, cat: s.cat, was: s.name })), confirm: false, err: '', busy: false };
+    const host = el('div', { class: 'ini-form', 'data-ini': 'wf-editor' });
+    const sh = openSheet({ title: 'Workflow · ' + row.id, icon: 'cols', body: host, wide: true });
+    const mv = () => {
+      const kept = new Map(W.draft.filter((d) => d.was).map((d) => [d.was, d.name.trim()]));
+      if (kept.has(row.stage)) return { to: kept.get(row.stage), removed: false };
+      const k = now.findIndex((s) => s.name === row.stage);
+      for (let j = k - 1; j >= 0; j--) if (kept.has(now[j].name)) return { to: kept.get(now[j].name), removed: true };
+      const same = W.draft.find((d) => d.cat === catOf(now, row.stage));
+      return { to: ((same || W.draft[0] || {}).name || '').trim(), removed: true };
+    };
+    const rowsUi = stageRows(W, { current: row.stage, build: b.build !== false, onChange: () => { W.confirm = false; render(); } });
+    function render(focusSel) {
+      const m = mv();
+      host.replaceChildren(
+        note('The ordered stages of ' + row.id + ' only. Other initiatives on ' + b.name + ' keep their own. Each stage sits in one category so the portfolio can compare. No conditions or validators, by design: moving work is your call.'),
+        el('div', { class: 'chips2', role: 'group', 'aria-label': 'Start from a template' }, mono('Start from a template ' + b.name + ' offers'),
+          ...Object.keys(TEMPLATES).map((k) => pill({ 'aria-pressed': String(W.tpl === k), 'data-wf-tpl': k, disabled: !offer.includes(k), title: offer.includes(k) ? TEMPLATES[k].use : templateBuilds(k) && b.build === false ? 'Needs Build and deliver on the board' : 'Not offered on this board',
+            onclick: () => { W.tpl = k; W.draft = TEMPLATES[k].stages.map((s) => ({ key: 'k' + (++seq), name: s.name, cat: s.cat, was: now.some((o) => o.name === s.name) ? s.name : null })); W.confirm = false; W.err = ''; render('[data-wf-tpl="' + k + '"]'); } }, TEMPLATES[k].name))),
+        b.build === false ? note(b.name + ' has Build and deliver off, so Build and Deliver stages are not offered. Turn it on in the board settings to use them.') : null,
+        rowsUi.list(),
+        el('div', { class: 'chips2' }, pbtn('outline', 'Add stage', 'plus', { 'data-wf-add': '', onclick: () => { W.draft.push({ key: 'k' + (++seq), name: 'New stage', cat: 'Do', was: null }); W.confirm = false; render(); const ins = host.querySelectorAll('[data-wf-name]'); const last = ins[ins.length - 1]; if (last) { last.focus(); last.select(); } } })),
+        m.removed && !W.confirm ? note(row.id + ' is in ' + row.stage + ', which you removed. It moves to ' + (m.to || 'the first stage') + ' when you save.') : null,
+        W.err ? errLine(W.err) : null,
+        W.confirm ? el('div', { class: 'fold w ini-confirm', role: 'alert', 'data-ini': 'wf-confirm' }, el('b', null, 'Move ' + row.id + ' from ' + row.stage + ' to ' + m.to + ' before saving?'),
+          el('span', { class: 'dim' }, 'The move is recorded in the initiative\'s history as your act.'),
+          el('div', { class: 'chips2' }, pbtn('primary', 'Move it and save', null, { 'data-wf-confirm': '', onclick: () => save(true) }), pbtn('outline', 'Keep editing', null, { 'data-wf-back': '', onclick: () => { W.confirm = false; render(); } }))) : null,
+        el('div', { class: 'chips2' }, pbtn('primary', W.busy ? 'Saving' : 'Save workflow', null, { 'data-wf-save': '', disabled: W.busy, onclick: () => save(false) }), pbtn('ghost', 'Cancel', null, { onclick: () => sh.close() })));
+      if (focusSel) { const f = host.querySelector(focusSel); if (f) f.focus(); }
+      if (W.confirm) { const c = host.querySelector('[data-ini="wf-confirm"]'); if (c && c.scrollIntoView) c.scrollIntoView({ block: 'nearest' }); }
+    }
+    rowsUi.render = render;
+    async function save(force) {
+      const names = W.draft.map((d) => d.name.trim());
+      W.err = names.some((n) => !n) ? 'Every stage needs a name.' : new Set(names.map((n) => n.toLowerCase())).size !== names.length ? 'Two stages have the same name.'
+        : b.build === false && W.draft.some(isBuildStage) ? 'Build and Deliver need a board with Build and deliver on. ' + b.name + ' has it off.' : '';
+      if (W.err) { W.confirm = false; render(); return; }
+      const m = mv();
+      if (m.removed && !force) { W.confirm = true; render(); return; }
+      W.busy = true; render();
+      const r = await apiFor(b.ws).post('/api/boards/ini-workflow', { board: b.id, id: row.id, template: W.tpl || undefined, stages: W.draft.map((d) => ({ name: d.name.trim(), cat: d.cat, was: d.was || undefined })), moveTo: m.removed ? m.to : undefined });
+      W.busy = false;
+      if (!r || !r.ok) { W.err = 'The workflow was not saved: ' + ((r && r.error) || 'no answer') + '.'; W.confirm = false; render(); return; }
+      sh.close();
+      toast('Workflow saved for ' + row.id + (r.moved ? '. Moved to ' + r.moved.to : '') + '.');
+      P.ini = null; P.boards = null; dropItems(); draw();
+    }
+    render('[data-wf-name="0"]');
+  }
+
+  /** The stage rows of an editor: grip (drag to reorder), name, category, chips, up, down, remove. o.render is set by the caller. */
+  function stageRows(W, o) {
+    let dragFrom = null;
+    const api = { render: () => {} };
+    api.list = () => list(W.draft.map((s, k) => {
+      const grip = el('span', { class: 'ki ini-grip', draggable: 'true', 'data-wf-drag': String(k), title: 'Drag to reorder', 'aria-hidden': 'true' }, icon('grip'));
+      grip.addEventListener('dragstart', (e) => { dragFrom = k; try { e.dataTransfer.setData('text/plain', 'wf'); e.dataTransfer.effectAllowed = 'move'; const r = grip.closest('[data-wf-row]'); if (r) e.dataTransfer.setDragImage(r, 10, 10); } catch { /* no data transfer */ } });
+      const li = el('li', { class: 'nrow', 'data-wf-row': String(k) }, grip,
+        el('div', { class: 'nb' },
+          el('div', { class: 'form' },
+            el('input', { type: 'text', value: s.name, 'aria-label': 'Stage ' + (k + 1) + ' name', 'data-wf-name': String(k), oninput: (e) => { s.name = e.target.value; } }),
+            el('select', { 'aria-label': 'Stage ' + (k + 1) + ' category', 'data-wf-cat': String(k), onchange: (e) => { s.cat = e.target.value; o.onChange(); } }, ...CATS.map((c) => el('option', { value: c, selected: c === s.cat }, c)))),
+          el('div', { class: 'chips' }, chip(sw(s.cat), s.cat), o.current && s.was === o.current ? st('ok', null, 'current stage') : null,
+            s.was ? (s.was !== s.name.trim() ? chip('was ' + s.was) : null) : tag('new'),
+            o.counts && s.was ? chip(plural(Number(o.counts[s.was]) || 0, 'initiative')) : null,
+            !o.build && isBuildStage(s) ? st('warn', 'alert', 'needs Build and deliver') : null)),
+        el('div', { class: 'acts' },
+          ib('Move ' + s.name + ' up', el('span', { class: 'ini-up' }, icon('next', 'sm')), { 'data-wf-up': String(k), disabled: k === 0, onclick: () => { [W.draft[k - 1], W.draft[k]] = [W.draft[k], W.draft[k - 1]]; o.onChange(); focusIn('[data-wf-up="' + (k - 1) + '"]', '[data-wf-down="' + (k - 1) + '"]'); } }),
+          ib('Move ' + s.name + ' down', el('span', { class: 'ini-down' }, icon('next', 'sm')), { 'data-wf-down': String(k), disabled: k === W.draft.length - 1, onclick: () => { [W.draft[k + 1], W.draft[k]] = [W.draft[k], W.draft[k + 1]]; o.onChange(); focusIn('[data-wf-down="' + (k + 1) + '"]', '[data-wf-up="' + (k + 1) + '"]'); } }),
+          ib('Remove ' + s.name, 'x', { 'data-wf-del': String(k), disabled: W.draft.length < 2, onclick: () => { if (W.draft.length > 1) W.draft.splice(k, 1); o.onChange(); focusIn('[data-wf-del="' + Math.min(k, W.draft.length - 1) + '"]', '[data-wf-add]'); } })));
+      li.addEventListener('dragover', (e) => { if (dragFrom == null) return; e.preventDefault(); li.classList.add('over'); });
+      li.addEventListener('dragleave', () => li.classList.remove('over'));
+      li.addEventListener('drop', (e) => { if (dragFrom == null) return; e.preventDefault(); const [m] = W.draft.splice(dragFrom, 1); W.draft.splice(k, 0, m); dragFrom = null; o.onChange(); });
+      li.addEventListener('dragend', () => { dragFrom = null; li.classList.remove('over'); });
+      return li;
+    }), { 'data-ini': 'wf-list' });
+    const focusIn = (a, b2) => { const sheetEl = document.querySelector('[data-ini="wf-editor"]'); if (!sheetEl) return; const f = sheetEl.querySelector(a); if (f && !f.disabled) f.focus(); else { const g = sheetEl.querySelector(b2); if (g) g.focus(); } };
+    return api;
+  }
+
+  /* The board's own workflow: what an initiative that does not run its own workflow runs. Removing a stage that holds such initiatives asks
+   * where they go (POST /api/boards/workflow, moveRemoved). */
+  async function openBoardWorkflow(b) {
+    if (b.self) return;
+    let seq = 0;
+    const counts = {};
+    const W = { tpl: b.template, draft: (b.workflow || []).map((s) => ({ key: 'k' + (++seq), name: s.name, cat: s.cat, hint: s.hint || '', was: s.name })), targets: {}, err: '', busy: false };
+    const host = el('div', { class: 'ini-form', 'data-ini': 'wf-editor', 'data-ini-mode': 'board' });
+    const sh = openSheet({ title: 'Board workflow · ' + b.name, icon: 'cols', body: host, wide: true });
+    const r0 = await loadItems(makeCtx(b, {}));
+    for (const i of r0.initiatives || []) if (!i.template) counts[i.stage] = (counts[i.stage] || 0) + 1;
+    const old = (b.workflow || []).map((s) => s.name);
+    const removed = () => old.filter((n) => !W.draft.some((d) => d.was === n));
+    const target = (n) => { const names = W.draft.map((d) => d.name.trim()); if (names.includes(W.targets[n])) return W.targets[n]; const k = old.indexOf(n); for (let j = k - 1; j >= 0; j--) { const d = W.draft.find((x) => x.was === old[j]); if (d) return d.name.trim(); } return names[0] || ''; };
+    const rowsUi = stageRows(W, { build: b.build !== false, counts, onChange: () => render() });
+    function render(focusSel) {
+      const gone = removed().filter((n) => Number(counts[n]) > 0);
+      host.replaceChildren(
+        note('The stages that ' + b.name + '\'s initiatives run when they have no workflow of their own. Each initiative can still pick its own from the templates the board offers.'),
+        el('div', { class: 'chips2', role: 'group', 'aria-label': 'Start from a template' }, mono('Start from a template'),
+          ...BOARD_TEMPLATES.map((k) => pill({ 'aria-pressed': String(W.tpl === k), 'data-wf-tpl': k, disabled: b.build === false && templateBuilds(k), onclick: () => { W.tpl = k; W.draft = TEMPLATES[k].stages.map((s) => ({ key: 'k' + (++seq), name: s.name, cat: s.cat, hint: '', was: old.includes(s.name) ? s.name : null })); render('[data-wf-tpl="' + k + '"]'); } }, TEMPLATES[k].name))),
+        rowsUi.list(),
+        el('div', { class: 'chips2' }, pbtn('outline', 'Add stage', 'plus', { 'data-wf-add': '', onclick: () => { W.draft.push({ key: 'k' + (++seq), name: 'New stage', cat: 'Do', hint: '', was: null }); render('[data-wf-name="' + (W.draft.length - 1) + '"]'); } })),
+        gone.length ? el('div', { class: 'fold w ini-confirm', 'data-ini': 'wf-moves' }, el('b', null, 'Where do their initiatives go?'),
+          ...gone.map((n) => el('label', { class: 'chips2' }, plural(Number(counts[n]), 'initiative') + ' in ' + n + ' move to',
+            el('select', { 'data-wf-target': n, 'aria-label': 'Stage for the initiatives of ' + n, onchange: (e) => { W.targets[n] = e.target.value; } }, ...W.draft.map((d) => d.name.trim()).filter(Boolean).map((x) => el('option', { value: x, selected: x === target(n) }, x))))),
+          el('span', { class: 'dim' }, 'Each move is recorded in the initiative history as your act.')) : null,
+        W.err ? errLine(W.err) : null,
+        el('div', { class: 'chips2' }, pbtn('primary', W.busy ? 'Saving' : 'Save workflow', null, { 'data-wf-save': '', disabled: W.busy, onclick: save }), pbtn('ghost', 'Cancel', null, { onclick: () => sh.close() })));
+      if (focusSel) { const f = host.querySelector(focusSel); if (f) f.focus(); }
+    }
+    async function save() {
+      const names = W.draft.map((d) => d.name.trim());
+      W.err = names.some((n) => !n) ? 'Every stage needs a name.' : new Set(names.map((n) => n.toLowerCase())).size !== names.length ? 'Two stages have the same name.' : '';
+      if (W.err) { render(); return; }
+      const moveRemoved = {}; for (const n of removed()) if (Number(counts[n]) > 0) moveRemoved[n] = target(n);
+      W.busy = true; render();
+      const r = await apiFor(b.ws).post('/api/boards/workflow', { board: b.id, stages: W.draft.map((d) => ({ name: d.name.trim(), cat: d.cat, hint: d.hint || '', was: d.was || undefined })), moveRemoved, template: W.tpl });
+      W.busy = false;
+      if (!r || !r.ok) { W.err = 'The workflow was not saved: ' + ((r && r.error) || 'no answer') + '.'; render(); return; }
+      sh.close();
+      toast('Board workflow saved.' + (Number(r.moved) ? ' ' + plural(Number(r.moved), 'initiative') + ' moved to a new stage.' : ''));
+      refresh();
+    }
+    render('[data-wf-name="0"]');
+  }
+
+  /* ════════ INITIATIVE ════════ */
+  async function drawIni(b, token) {
+    const { id } = P.loc;
+    if (!P.ini || P.ini.id !== id || P.ini.board !== b.id) {
+      status('Reading ' + id);
+      const r = await apiFor(b.ws).get('/api/boards/initiative', { board: b.id, id });
+      if (token !== P.seq) return;
+      if (!r || !r.ok || !r.row) {
+        root.replaceChildren(pathCrumbs(b, { id, title: '' }), errLine(r && r.pending ? 'Reading the repository. Open the page again in a moment.' : 'The initiative could not be read: ' + ((r && r.error) || 'no answer') + '.'));
+        return;
+      }
+      P.ini = { id, board: b.id, row: r.row, history: r.history || [], tools: r.tools || [], toolsByCat: r.toolsByCat || null, b: { ...b, ...(r.board || {}), counts: b.counts, asks: b.asks, nextRelease: b.nextRelease } };
+    }
+    const { row, history, tools, toolsByCat } = P.ini; const bb = P.ini.b;
+    let tab = P.loc.tab; if (tab === 'tickets' && !bb.build) tab = 'overview';
+    const ctxI = makeCtx(bb, { row, history, tools, toolsByCat, tab, tool: P.loc.tool || '' });
+    const items = await loadItems(ctxI);
+    if (token !== P.seq) return;
+    const work = items.items.filter((w) => w.ini === row.id); const ep = work.filter((w) => w.kind === 'Epic').length;
+    const wf = wfOf(row, bb); const idx = wf.findIndex((s) => s.name === row.stage); const cat = row.cat || catOf(wf, row.stage);
+    const warnings = Array.isArray(row.warnings) ? row.warnings : [];
+    const stepper = el('div', { class: 'calbar' },
+      el('div', { class: 'seg ini-seg', role: 'group', 'aria-label': 'Workflow position', 'data-ini': 'stepper' },
+        ...wf.map((s, k) => btn({ 'aria-pressed': String(k === idx), 'aria-current': k === idx ? 'step' : 'false', 'data-ini-step': s.name, title: bb.self ? SELF_WHY : k === idx ? 'Current stage' : 'Move to ' + s.name, onclick: () => stepTo(s.name) },
+          k < idx ? icon('check', 'sm') : sw(s.cat), s.name))),
+      el('span', { class: 'chips2' }, mono(tplName(row, bb) + ' workflow · ' + cat + ' · you decide when it moves'),
+        pill({ 'data-ini': 'edit-workflow', 'aria-haspopup': 'dialog', onclick: () => openWorkflow(bb, row) }, icon('settings', 'sm'), 'Edit workflow')));
+    const kind = kindOf(row, bb);
+    const toolList = [...recordToolsFor(kind, cat, bb.build).map((id) => ({ id, label: RECORD_META[id][0], rec: true })), ...(Array.isArray(tools) ? tools : []).map((t) => (typeof t === 'string' ? { id: t } : t)).filter((t) => t && t.id)];
+    const moreBtn = pill({ 'data-ini': 'more-tools', 'aria-haspopup': 'menu', 'aria-expanded': 'false', onclick: (e) => moreTools(e.currentTarget, row, bb, cat, kind) }, icon('more', 'sm'), 'More tools');
+    const strip = el('div', { class: 'chips2', 'data-ini': 'tools' }, mono('Tools for ' + row.stage),
+      ...toolList.map((t) => pill({ 'data-ini-tool': t.id, 'aria-pressed': String(P.loc.tool === t.id), onclick: () => pickTool(t.id) }, icon(t.rec ? RECORD_META[t.id][1] : toolIcon(t.id), 'sm'), toolLabel(t))), moreBtn);
+    const tabs = INI_TAB_LIST.filter(([k]) => k !== 'tickets' || bb.build).map(([k, l, ic]) => [k, l, ic,
+      k === 'breakdown' && work.length ? el('span', { class: 'bdg g' }, String(work.length)) : k === 'tickets' ? el('span', { class: 'bdg g' }, String(work.filter((w) => w.src === 'jira').length)) : null]);
+    const host = el('div', { class: 'calbody', 'data-ini-panel': tab });
+    root.replaceChildren(
+      pathCrumbs(bb, row, el('div', { class: 'chips2' }, pbtn('outline', 'Dashboard', 'report', { onclick: () => ctxI.showTab('rep') }))),
+      el('div', { class: 'calbody', 'data-ini-page': row.id },
+        lh('target', row.title || row.id, [row.id, bb.name, row.anchor || 'no anchor', row.owner || 'no owner', row.start || row.end ? day(row.start) + ' to ' + day(row.end) : 'no dates yet', row.horizon ? row.horizon[0].toUpperCase() + row.horizon.slice(1) : '', Math.round((Number(row.progress) || 0) * 100) + '% done'].filter(Boolean).join(' · ')),
+        el('div', { class: 'chips2', 'data-ini': 'ini-chips' }, statusChip(row.status), chip(icon('bolt', 'sm'), plural(ep, 'epic') + ', ' + plural(work.length - ep, 'item')), buildTag(bb),
+          row.lane ? tag(row.lane) : null, el('span', { class: 'chips2', 'data-ini': 'warnings', 'aria-live': 'polite' }, ...warnings.map(warnChip))),
+        stepper, bb.self ? note(SELF_WHY) : null, strip,
+        segTabs(tabs, tab, (k) => go({ view: 'ini', board: bb.id, id: row.id, tab: k }), 'Initiative views', { 'data-ini': 'ini-tabs' }),
+        host));
+    if (P.focusStep) { const f = stepper.querySelector('[data-ini-step="' + CSS.escape(P.focusStep) + '"]'); P.focusStep = null; if (f) f.focus(); }
+    mountTab(host, null, (INI_TAB_LIST.find((t) => t[0] === tab) || [])[1], ctxI, token);
+  }
+  function pickTool(id) {
+    if (P.loc.tab !== 'overview' || P.loc.tool !== id) { go({ ...P.loc, tab: 'overview', tool: id }); return; }
+    const n = root.querySelector('[data-ini-tool-card="' + CSS.escape(id) + '"]');
+    if (n) { n.scrollIntoView({ behavior: 'smooth', block: 'start' }); n.classList.add('ini-flash'); setTimeout(() => n.classList.remove('ini-flash'), 1400); }
+  }
+  function moreTools(anchor, row, b, cat, kind) {
+    const byCat = (P.ini && P.ini.toolsByCat) || {};
+    const recOf = (c) => recordToolsFor(kind, c, b.build).map((id) => ({ id, label: RECORD_META[id][0], rec: true }));
+    const seen = new Set([...(byCat[cat] || []), ...recOf(cat)].map((t) => t.id));
+    const items = [];
+    for (const s of wfOf(row, b)) {
+      const ks = [...recOf(s.cat), ...(byCat[s.cat] || [])].filter((t) => !seen.has(t.id)); ks.forEach((t) => seen.add(t.id));
+      if (ks.length) items.push({ group: s.name }, ...ks.map((t) => ({ kids: [icon(t.rec ? RECORD_META[t.id][1] : toolIcon(t.id), 'sm'), toolLabel(t)], attrs: { 'data-ini-moretool': t.id }, onPick: () => go({ ...P.loc, tab: 'overview', tool: t.id }) })));
+    }
+    openMenu(anchor, { label: 'More tools', items: items.length ? items : [{ label: 'No other tools for this workflow.', disabled: true, onPick: () => {} }] });
+  }
+  async function stepTo(stage) {
+    const ini = P.ini; if (!ini) return;
+    const r = await moveTo(ini.b, ini.row.id, stage);
+    if (r && r.ok) { P.focusStep = stage; draw(); }
+  }
+  /** Move an initiative to a stage of its own workflow: POST /api/boards/move; warnings are shown, never a block. */
+  async function moveTo(b, id, stage) {
+    if (b.self) { toast(SELF_WHY); return { ok: false }; }
+    const r = await apiFor(b.ws).post('/api/boards/move', { board: b.id, id, to: stage });
+    if (!r || !r.ok) { toast({ text: 'The move did not save: ' + ((r && r.error) || 'no answer') + '.', tone: 'error' }); return { ok: false }; }
+    const warnings = Array.isArray(r.warnings) ? r.warnings : [];
+    toast(id + ' moved to ' + stage + '.' + (warnings.length ? ' Warning: ' + warnings.join(', ') + '. Not blocked.' : ''));
+    if (P.ini && P.ini.id === id) { P.ini.row = { ...P.ini.row, ...(r.row || {}), stage, warnings: (r.row && r.row.warnings) || warnings }; P.ini.history = [{ kind: 'move', at: new Date().toISOString(), by: 'You', from: null, to: stage, warnings }, ...P.ini.history]; P.ini = null; }
+    P.boards = null; dropItems();
+    loadBoards().catch(() => null);
+    return { ok: true, row: r.row, warnings };
+  }
+
+  writeUrl();
+  draw();
+  return { go, refresh, get location() { return { ...P.loc }; }, close: () => { closeMenu(); closeSheet(); } };
+}
+
+const chipMono = (t) => el('span', { class: 'chip2 mono' }, t);
+const toneOf = (i) => (i.status === 'late' ? 'bad' : i.status === 'at risk' ? 'warn' : 'ok');
+function isoToday() { const d = new Date(); return d.getFullYear() + '-' + String(d.getMonth() + 1).padStart(2, '0') + '-' + String(d.getDate()).padStart(2, '0'); }
+export { ownerText, kv, TOOL_META };