dw-kit 1.4.0 → 1.7.0-rc.1

package/src/commands/goal-render.mjs

@@ -0,0 +1,49 @@
+import { writeFileSync, mkdirSync, existsSync } from 'node:fs';
+import { join, dirname } from 'node:path';
+import chalk from 'chalk';
+import { renderGoalSvg } from '../lib/goal-svg.mjs';
+import { readGoal, listGoalIds, goalDir } from '../lib/goal-store.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+export async function goalRenderCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  const ids = goalId ? [goalId] : listGoalIds(rootDir);
+  if (ids.length === 0) {
+    console.log(chalk.dim('  No goals to render.'));
+    return;
+  }
+
+  console.log();
+  console.log(chalk.bold(`  Rendering ${ids.length} goal SVG${ids.length === 1 ? '' : 's'}:`));
+
+  let rendered = 0;
+  let failed = 0;
+  for (const id of ids) {
+    const goal = readGoal(id, rootDir);
+    if (!goal) {
+      console.log(chalk.yellow(`  ⚠  ${id} — goal.md not found, skipping`));
+      failed++;
+      continue;
+    }
+    try {
+      const svg = renderGoalSvg(id, rootDir);
+      const outFile = join(goalDir(id, rootDir), 'goal.svg');
+      const dir = dirname(outFile);
+      if (!existsSync(dir)) mkdirSync(dir, { recursive: true });
+      writeFileSync(outFile, svg, 'utf8');
+      console.log(chalk.green(`  ✓  ${id} → .dw/goals/${id}/goal.svg`));
+      rendered++;
+    } catch (e) {
+      console.log(chalk.red(`  ✗  ${id} — render failed: ${e.message}`));
+      failed++;
+    }
+  }
+
+  console.log();
+  console.log(chalk.dim(`  ${rendered} rendered · ${failed} failed`));
+  console.log(chalk.dim(`  View in browser via \`dw task watch\` then navigate to /goals/<id> (SVG inlined)`));
+  console.log();
+
+  logEvent({ event: 'goal', action: 'render', count: ids.length, success: rendered, failed }, rootDir);
+}

package/src/commands/goal-set.mjs

@@ -0,0 +1,62 @@
+import chalk from 'chalk';
+import { readGoal, updateGoalFrontmatter, syncIndexEntry, todayIso } from '../lib/goal-store.mjs';
+import { logGoalEvent } from '../lib/goal-events.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+const SETTABLE = ['icon', 'cycle', 'owner', 'target_date', 'parent_goal_id'];
+
+export async function goalSetCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  if (!goalId) {
+    console.error(chalk.red('✗ Usage: dw goal set <goal-id> [--icon <emoji>] [--cycle <label>] [--owner <name>] [--target-date <YYYY-MM-DD>] [--parent-goal-id <G-id>]'));
+    process.exit(1);
+  }
+
+  const goal = readGoal(goalId, rootDir);
+  if (!goal) {
+    console.error(chalk.red(`✗ Goal ${goalId} not found`));
+    process.exit(1);
+  }
+
+  const fields = {};
+  if (opts.icon !== undefined) fields.icon = opts.icon || null;
+  if (opts.cycle !== undefined) fields.cycle = opts.cycle || null;
+  if (opts.owner !== undefined) fields.owner = opts.owner;
+  if (opts.targetDate !== undefined) fields.target_date = opts.targetDate;
+  if (opts.parentGoalId !== undefined) fields.parent_goal_id = opts.parentGoalId || 'none';
+
+  if (Object.keys(fields).length === 0) {
+    console.error(chalk.red('✗ No field provided. Use --icon, --cycle, --owner, --target-date, or --parent-goal-id'));
+    process.exit(1);
+  }
+
+  const changedBy = process.env.USER || process.env.USERNAME || 'unknown';
+  const before = { ...goal.fm };
+
+  updateGoalFrontmatter(goalId, (fm) => {
+    for (const [k, v] of Object.entries(fields)) fm[k] = v;
+    fm.last_updated = todayIso();
+    return fm;
+  }, rootDir);
+  syncIndexEntry(goalId, rootDir);
+
+  for (const [k, v] of Object.entries(fields)) {
+    logGoalEvent({
+      event: 'goal_field_updated',
+      goal_id: goalId,
+      field: k,
+      old: before[k] !== undefined ? before[k] : null,
+      new: v,
+      changed_by: changedBy,
+    }, rootDir);
+  }
+  logEvent({ event: 'goal', action: 'set', name: goalId, fields: Object.keys(fields) }, rootDir);
+
+  console.log();
+  console.log(chalk.green(`  ✓  Updated ${chalk.bold(goalId)}:`));
+  for (const [k, v] of Object.entries(fields)) {
+    console.log(chalk.dim(`     ${k}: ${before[k] || '∅'} → ${v || '∅'}`));
+  }
+  console.log();
+}

package/src/commands/goal-show.mjs

@@ -0,0 +1,94 @@
+import chalk from 'chalk';
+import { readGoal, listGoalIds, findLinkedTaskIds, computeGoalProgress } from '../lib/goal-store.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+function progressBar(percent, width = 24) {
+  const filled = Math.round((percent / 100) * width);
+  return chalk.green('█'.repeat(filled)) + chalk.dim('░'.repeat(width - filled)) + chalk.dim(` ${percent}%`);
+}
+
+function statusBadge(status) {
+  const badges = {
+    Draft: chalk.dim('[Draft]'),
+    Active: chalk.cyan('[Active]'),
+    Achieved: chalk.green('[Achieved]'),
+    Abandoned: chalk.red('[Abandoned]'),
+    Pivoted: chalk.yellow('[Pivoted]'),
+  };
+  return badges[status] || chalk.dim(`[${status}]`);
+}
+
+export async function goalShowCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  if (!goalId) {
+    const ids = listGoalIds(rootDir);
+    if (ids.length === 0) {
+      console.log(chalk.dim('  No goals found in .dw/goals/. Create one: dw goal new G-001'));
+      return;
+    }
+    console.log();
+    console.log(chalk.bold(`  Goals (${ids.length}):`));
+    for (const id of ids) {
+      const goal = readGoal(id, rootDir);
+      if (!goal) continue;
+      const icon = goal.fm.icon || '🎯';
+      const prog = computeGoalProgress(id, rootDir);
+      const cycle = goal.fm.cycle ? chalk.cyan(`[${goal.fm.cycle}]`) + ' ' : '';
+      console.log(`    ${statusBadge(goal.fm.status)} ${icon} ${chalk.bold(id)}  ${cycle}${chalk.dim(goal.fm.summary || '(no summary)')}`);
+      if (prog.total > 0) console.log('                 ' + progressBar(prog.percent) + chalk.dim(`  (${prog.done}/${prog.total})`));
+    }
+    console.log();
+    console.log(chalk.dim('  Show detail: dw goal show <id>'));
+    return;
+  }
+
+  const goal = readGoal(goalId, rootDir);
+  if (!goal) {
+    console.error(chalk.red(`✗ Goal ${goalId} not found`));
+    console.error(chalk.dim(`  Expected: .dw/goals/${goalId}/goal.md`));
+    process.exit(1);
+  }
+
+  const linkedTasks = findLinkedTaskIds(goalId, rootDir);
+  const prog = computeGoalProgress(goalId, rootDir, linkedTasks);
+  const icon = goal.fm.icon || '🎯';
+
+  console.log();
+  console.log(chalk.bold(`  ${statusBadge(goal.fm.status)} ${icon} ${goalId}`));
+  console.log(chalk.dim(`  ${goal.file}`));
+  console.log();
+  console.log(`  ${chalk.bold('Owner:')}        ${goal.fm.owner || 'unknown'}`);
+  console.log(`  ${chalk.bold('Target date:')}  ${goal.fm.target_date || 'TBD'}`);
+  if (goal.fm.cycle) console.log(`  ${chalk.bold('Cycle:')}        ${chalk.cyan(goal.fm.cycle)}`);
+  console.log(`  ${chalk.bold('Version:')}      ${goal.fm.goal_version || 1}`);
+  console.log(`  ${chalk.bold('Created:')}      ${goal.fm.created || '?'}`);
+  console.log(`  ${chalk.bold('Last updated:')} ${goal.fm.last_updated || '?'}`);
+  if (goal.fm.archived_at) console.log(`  ${chalk.bold('Archived at:')}  ${chalk.red(goal.fm.archived_at)}`);
+  if (goal.fm.parent_goal_id && goal.fm.parent_goal_id !== 'none') {
+    console.log(`  ${chalk.bold('Parent:')}       ${goal.fm.parent_goal_id}`);
+  }
+  console.log();
+
+  if (prog.total > 0) {
+    console.log(`  ${chalk.bold('Progress:')}     ` + progressBar(prog.percent, 32));
+    console.log(chalk.dim(`                ${prog.done} done · ${prog.in_progress} in progress · ${prog.blocked} blocked · ${prog.pending} pending  (of ${prog.total} subtasks across ${linkedTasks.length} task${linkedTasks.length === 1 ? '' : 's'})`));
+    console.log();
+  }
+
+  if (goal.fm.summary) {
+    console.log(chalk.bold('  Summary:'));
+    console.log(chalk.dim('    ') + chalk.white(goal.fm.summary));
+    console.log();
+  }
+
+  console.log(chalk.bold(`  Linked tasks (${linkedTasks.length}):`));
+  if (linkedTasks.length === 0) {
+    console.log(chalk.dim('    (none — link with `dw goal link <goal-id> <task-id>`)'));
+  } else {
+    for (const t of linkedTasks) console.log(chalk.dim('    · ') + t);
+  }
+  console.log();
+
+  logEvent({ event: 'goal', action: 'show', name: goalId }, rootDir);
+}

package/src/commands/goal-stubs.mjs

@@ -0,0 +1,21 @@
+import chalk from 'chalk';
+import { readGoal } from '../lib/goal-store.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+export async function goalMigrateCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+  const target = opts.to || 'goal@v2';
+
+  console.log();
+  console.log(chalk.cyan(`  dw goal migrate — stub (S-1)`));
+  console.log(chalk.dim(`  Target schema: ${target}`));
+  console.log(chalk.dim(`  No migration paths defined yet — goal@v1 is current.`));
+  console.log(chalk.dim(`  This command reserves the CLI namespace for future schema bumps.`));
+  console.log();
+
+  logEvent({ event: 'goal', action: 'migrate.stub', name: goalId || 'all', target }, rootDir);
+}
+
+// goalSuggestKrsCommand moved to src/commands/goal-suggest-krs.mjs (real implementation)
+
+// goalRenderCommand moved to src/commands/goal-render.mjs (real implementation, not stub)

package/src/commands/goal-suggest-krs.mjs

@@ -0,0 +1,139 @@
+import { readFileSync, existsSync } from 'node:fs';
+import { join } from 'node:path';
+import chalk from 'chalk';
+import { readGoal, findLinkedTaskIds } from '../lib/goal-store.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+const TASKS_DIR = '.dw/tasks';
+
+function extractKRs(content) {
+  const m = content.match(/###\s+Key Results[\s\S]*?(?=^###\s+|^##\s+|\Z)/m);
+  if (!m) return [];
+  const krs = [];
+  for (const line of m[0].split('\n')) {
+    if (!/^\|\s*KR-/.test(line)) continue;
+    const cells = line.split('|').map((c) => c.trim());
+    if (cells.length < 5) continue;
+    krs.push({ id: cells[1], description: cells[2], target: cells[3], current: cells[4], status: cells[5] || '' });
+  }
+  return krs;
+}
+
+function readTaskTitle(taskId, rootDir) {
+  const file = join(rootDir, TASKS_DIR, taskId, 'task.md');
+  if (!existsSync(file)) return taskId;
+  try {
+    const content = readFileSync(file, 'utf8');
+    const fmMatch = content.match(/^---\n([\s\S]*?)\n---/);
+    const titleMatch = content.match(/^#\s+(?:Timeline:|Spec:)?\s*(.+?)\s*$/m);
+    return titleMatch ? titleMatch[1].trim() : taskId;
+  } catch { return taskId; }
+}
+
+export async function goalSuggestKrsCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  if (!goalId) {
+    console.error(chalk.red('✗ Usage: dw goal suggest-krs <goal-id> [--count N] [--json]'));
+    process.exit(1);
+  }
+
+  const goal = readGoal(goalId, rootDir);
+  if (!goal) {
+    console.error(chalk.red(`✗ Goal ${goalId} not found`));
+    process.exit(1);
+  }
+
+  const linkedTasks = findLinkedTaskIds(goalId, rootDir);
+  const existingKRs = extractKRs(goal.content);
+  const count = parseInt(opts.count || '3', 10);
+
+  const context = {
+    goal_id: goalId,
+    icon: goal.fm.icon || '🎯',
+    title: extractTitle(goal.content) || goalId,
+    status: goal.fm.status || 'Draft',
+    cycle: goal.fm.cycle || null,
+    target_date: goal.fm.target_date || null,
+    summary: goal.fm.summary || null,
+    existing_krs: existingKRs,
+    linked_tasks: linkedTasks.map((t) => ({ id: t, title: readTaskTitle(t, rootDir) })),
+    requested_count: count,
+  };
+
+  if (opts.json) {
+    console.log(JSON.stringify({
+      context,
+      smart_template: SMART_TEMPLATE,
+      paste_target: `.dw/goals/${goalId}/goal.md Section 3 Key Results table`,
+      skill_pointer: '.claude/skills/dw-goal-sync/SKILL.md',
+    }, null, 2));
+    logEvent({ event: 'goal', action: 'suggest-krs.json', name: goalId }, rootDir);
+    return;
+  }
+
+  console.log();
+  console.log(chalk.bold(`  KR brainstorm context for ${chalk.cyan(goalId)}`));
+  console.log(chalk.dim('  Pipe this into Claude/Codex/Gemini chat with the SMART template; paste returned'));
+  console.log(chalk.dim(`  KRs into .dw/goals/${goalId}/goal.md Section 3 (Key Results table).`));
+  console.log();
+  console.log(chalk.bold('  ━━━━━━━━━━━━━━━━━━━━━━ COPY BELOW ━━━━━━━━━━━━━━━━━━━━━━'));
+  console.log();
+  console.log(buildPrompt(context, count));
+  console.log();
+  console.log(chalk.bold('  ━━━━━━━━━━━━━━━━━━━━━━ END COPY  ━━━━━━━━━━━━━━━━━━━━━━━'));
+  console.log();
+  console.log(chalk.dim(`  Tip: \`dw goal suggest-krs ${goalId} --json\` returns machine-readable context.`));
+  console.log();
+
+  logEvent({ event: 'goal', action: 'suggest-krs', name: goalId, existing_krs: existingKRs.length, count }, rootDir);
+}
+
+function extractTitle(content) {
+  const m = content.match(/^#\s+Goal:\s+(.+?)\s*$/m) || content.match(/^#\s+(.+?)\s*$/m);
+  return m ? m[1].trim() : null;
+}
+
+const SMART_TEMPLATE = `Each KR must satisfy SMART:
+- Specific: names the exact outcome (not "improve X")
+- Measurable: has a numeric metric and unit (≥, %, count, time)
+- Achievable: within owner's control + reasonable in the cycle
+- Relevant: clearly serves the goal statement above
+- Time-bound: ties to the goal's target_date or shorter milestone`;
+
+function buildPrompt(ctx, count) {
+  const existing = ctx.existing_krs.length > 0
+    ? '\nExisting KRs (avoid duplication):\n' + ctx.existing_krs.map((kr) => `  - ${kr.id}: ${kr.description} (target ${kr.target}, current ${kr.current})`).join('\n')
+    : '\nNo Key Results defined yet.';
+
+  const tasks = ctx.linked_tasks.length > 0
+    ? '\nLinked tasks (signals about scope):\n' + ctx.linked_tasks.map((t) => `  - ${t.id}: ${t.title}`).join('\n')
+    : '';
+
+  const cycleLine = ctx.cycle ? `Cycle: ${ctx.cycle}\n` : '';
+  const targetLine = ctx.target_date ? `Target date: ${ctx.target_date}\n` : '';
+
+  return `## Goal context
+
+${ctx.icon} ${ctx.goal_id} — ${ctx.title}
+Status: ${ctx.status}
+${cycleLine}${targetLine}
+Summary:
+${ctx.summary || '(no summary set — consider adding one before drafting KRs)'}
+${existing}${tasks}
+
+## Task
+
+Propose ${count} Key Results for this goal.
+
+${SMART_TEMPLATE}
+
+Return KRs as a markdown table ready to paste into goal.md Section 3:
+
+| # | Key Result | Target | Current | Status | Notes |
+|---|-----------|--------|---------|--------|-------|
+| KR-XXX | … | … | 0% | ⬜ Pending | … |
+
+After the table, briefly justify each KR (1-2 sentences) explaining how it satisfies
+each SMART letter.`;
+}

package/src/commands/goal-summary.mjs

@@ -0,0 +1,67 @@
+import chalk from 'chalk';
+import { readGoal, updateGoalFrontmatter, syncIndexEntry, todayIso } from '../lib/goal-store.mjs';
+import { logGoalEvent } from '../lib/goal-events.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+const MAX_SUMMARY_CHARS = 1000;
+
+export async function goalSummaryCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  if (!goalId) {
+    console.error(chalk.red('✗ Usage: dw goal summary <goal-id> [--write "..."]'));
+    process.exit(1);
+  }
+
+  const goal = readGoal(goalId, rootDir);
+  if (!goal) {
+    console.error(chalk.red(`✗ Goal ${goalId} not found`));
+    process.exit(1);
+  }
+
+  if (opts.write !== undefined) {
+    if (opts.write.length > MAX_SUMMARY_CHARS) {
+      console.error(chalk.red(`✗ Summary exceeds ${MAX_SUMMARY_CHARS} chars (got ${opts.write.length})`));
+      process.exit(1);
+    }
+    const oldSummary = goal.fm.summary || null;
+    const newSummary = opts.write || null;
+
+    updateGoalFrontmatter(goalId, (fm) => {
+      fm.summary = newSummary;
+      fm.last_updated = todayIso();
+      return fm;
+    }, rootDir);
+    syncIndexEntry(goalId, rootDir);
+
+    logGoalEvent({
+      event: 'goal_field_updated',
+      goal_id: goalId,
+      field: 'summary',
+      old: oldSummary,
+      new: newSummary,
+      changed_by: process.env.USER || process.env.USERNAME || 'unknown',
+    }, rootDir);
+
+    logEvent({ event: 'goal', action: 'summary.write', name: goalId, length: (newSummary || '').length }, rootDir);
+
+    console.log();
+    console.log(chalk.green(`  ✓  Summary updated for ${chalk.bold(goalId)} (${(newSummary || '').length}/${MAX_SUMMARY_CHARS} chars)`));
+    console.log(chalk.dim(`     Mirrored to .dw/goals/goals-index.json`));
+    console.log();
+    return;
+  }
+
+  console.log();
+  if (!goal.fm.summary) {
+    console.log(chalk.dim(`  (no summary set for ${goalId})`));
+    console.log(chalk.dim(`  Add with: dw goal summary ${goalId} --write "..."`));
+  } else {
+    console.log(chalk.bold(`  Summary for ${goalId} (${goal.fm.summary.length}/${MAX_SUMMARY_CHARS} chars):`));
+    console.log();
+    console.log(chalk.white(goal.fm.summary));
+  }
+  console.log();
+
+  logEvent({ event: 'goal', action: 'summary.read', name: goalId }, rootDir);
+}

package/src/commands/goal-view.mjs

@@ -0,0 +1,196 @@
+import { writeFileSync, mkdirSync, existsSync } from 'node:fs';
+import { join, dirname } from 'node:path';
+import { execSync } from 'node:child_process';
+import chalk from 'chalk';
+import { readGoalIndex, listGoalIds, syncIndexEntry } from '../lib/goal-store.mjs';
+import { logEvent } from '../lib/telemetry.mjs';
+
+const CACHE_DIR = '.dw/cache/preview';
+
+function statusBg(status) {
+  switch (status) {
+    case 'Active': return '#0ea5e9';
+    case 'Achieved': return '#10b981';
+    case 'Abandoned': return '#ef4444';
+    case 'Pivoted': return '#f59e0b';
+    default: return '#6b7280';
+  }
+}
+
+function esc(s) {
+  if (s == null) return '';
+  return String(s)
+    .replace(/&/g, '&')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+function statusColorBar(status) {
+  switch (status) {
+    case 'Active': return '#0ea5e9';
+    case 'Achieved': return '#10b981';
+    case 'Abandoned': return '#ef4444';
+    case 'Pivoted': return '#f59e0b';
+    default: return '#6b7280';
+  }
+}
+
+function renderCard(id, g) {
+  const linked = (g.linked_task_ids || []).length;
+  const archived = g.archived_at ? '<span class="archived">archived</span>' : '';
+  const icon = g.icon || '🎯';
+  const prog = g.progress || { percent: 0, total: 0, done: 0, in_progress: 0, blocked: 0, pending: 0 };
+  const progLabel = prog.total > 0
+    ? `<div class="progress-row"><div class="progress-bar"><div class="progress-fill" style="width:${prog.percent}%;background:${statusColorBar(g.status)}"></div></div><span class="progress-label">${prog.percent}% · ${prog.done}/${prog.total}</span></div>`
+    : '<div class="progress-row muted">No linked subtasks yet</div>';
+  return `
+  <a class="card-link" href="/goals/${esc(id)}">
+    <article class="card">
+      <header>
+        <span class="icon">${esc(icon)}</span>
+        <span class="badge" style="background:${statusBg(g.status)}">${esc(g.status || 'Draft')}</span>
+        <h2>${esc(id)}</h2>
+        ${archived}
+        <span class="edit-link" title="Open editor"><a href="/goals/${esc(id)}/edit" onclick="event.stopPropagation()">✎</a></span>
+      </header>
+      <h3>${esc(g.title || '')}</h3>
+      ${g.summary ? `<p class="summary">${esc(g.summary)}</p>` : '<p class="summary muted">(no summary)</p>'}
+      ${progLabel}
+      <footer>
+        <span>${esc(g.owner || '?')}</span>
+        <span>·</span>
+        <span>${esc(g.target_date || 'TBD')}</span>
+        <span>·</span>
+        <span>v${esc(g.goal_version || 1)}</span>
+        <span>·</span>
+        <span>${linked} task${linked === 1 ? '' : 's'}</span>
+      </footer>
+    </article>
+  </a>`;
+}
+
+function groupByCycle(entries) {
+  const groups = new Map();
+  for (const [id, g] of entries) {
+    const cycle = g.cycle || '(no cycle)';
+    if (!groups.has(cycle)) groups.set(cycle, []);
+    groups.get(cycle).push([id, g]);
+  }
+  // Sort: named cycles first (alphabetical), no-cycle last
+  return [...groups.entries()].sort(([a], [b]) => {
+    if (a === '(no cycle)') return 1;
+    if (b === '(no cycle)') return -1;
+    return a.localeCompare(b);
+  });
+}
+
+export function renderGoalPortfolioHtml(index) {
+  const entries = Object.entries(index.goals || {});
+  const total = entries.length;
+  const groups = groupByCycle(entries);
+
+  const sections = groups.map(([cycle, items]) => {
+    const cards = items.map(([id, g]) => renderCard(id, g)).join('\n');
+    return `
+    <section class="cycle">
+      <h2 class="cycle-title">${esc(cycle)} <span class="cycle-count">${items.length}</span></h2>
+      <div class="grid">${cards}</div>
+    </section>`;
+  }).join('\n');
+
+  return `<!doctype html>
+<html><head>
+<meta charset="utf-8">
+<title>dw goal view — portfolio (${total})</title>
+<style>
+* { box-sizing: border-box; margin: 0; padding: 0; }
+body { font: 14px/1.5 -apple-system, sans-serif; background: #0d1117; color: #c9d1d9; padding: 32px; }
+@media (prefers-color-scheme: light) { body { background: #fff; color: #1f2328; } }
+h1 { font-size: 24px; margin-bottom: 8px; }
+.meta { color: #6b7280; font-size: 12px; margin-bottom: 24px; }
+.cycle { margin-bottom: 32px; }
+.cycle-title { font-size: 14px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.8px; color: #58a6ff; margin-bottom: 12px; display: flex; align-items: center; gap: 10px; padding-bottom: 6px; border-bottom: 1px solid #30363d; }
+@media (prefers-color-scheme: light) { .cycle-title { border-bottom-color: #d0d7de; } }
+.cycle-count { font-weight: 400; color: #6b7280; font-size: 12px; letter-spacing: 0; }
+.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 16px; }
+.card-link { text-decoration: none; color: inherit; display: block; }
+.card { background: #161b22; border: 1px solid #30363d; border-radius: 8px; padding: 16px; transition: border-color 0.15s, transform 0.15s; }
+.card-link:hover .card { border-color: #58a6ff; transform: translateY(-2px); }
+@media (prefers-color-scheme: light) { .card { background: #f6f8fa; border-color: #d0d7de; } }
+.edit-link { margin-left: auto; font-size: 16px; }
+.edit-link a { color: #6b7280; text-decoration: none; padding: 2px 6px; border-radius: 4px; }
+.edit-link a:hover { color: #58a6ff; background: rgba(88,166,255,0.12); }
+.card header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
+.card .icon { font-size: 20px; line-height: 1; }
+.badge { display: inline-block; padding: 2px 8px; border-radius: 4px; font-size: 11px; font-weight: 600; color: white; letter-spacing: 0.5px; }
+.archived { padding: 2px 6px; background: rgba(220,38,38,0.18); color: #ef4444; border-radius: 4px; font-size: 10px; font-weight: 600; margin-left: auto; }
+.card h2 { font-size: 14px; font-family: ui-monospace, monospace; }
+.card h3 { font-size: 13px; font-weight: 400; margin-bottom: 12px; color: #8b949e; }
+@media (prefers-color-scheme: light) { .card h3 { color: #57606a; } }
+.summary { font-size: 13px; line-height: 1.6; margin-bottom: 12px; }
+.summary.muted { color: #6b7280; font-style: italic; }
+.progress-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: 11px; }
+.progress-row.muted { color: #6b7280; font-style: italic; padding: 4px 0; }
+.progress-bar { flex: 1; height: 6px; background: rgba(107,114,128,0.25); border-radius: 3px; overflow: hidden; }
+.progress-fill { height: 100%; border-radius: 3px; transition: width 0.3s; }
+.progress-label { color: #8b949e; font-family: ui-monospace, monospace; font-size: 10px; min-width: 70px; text-align: right; }
+.card footer { display: flex; gap: 8px; font-size: 11px; color: #6b7280; flex-wrap: wrap; }
+.empty { text-align: center; padding: 64px; color: #6b7280; }
+</style>
+</head><body>
+<h1>🎯 Goals portfolio</h1>
+<div class="meta">${total} goal${total === 1 ? '' : 's'} across ${groups.length} cycle${groups.length === 1 ? '' : 's'} · source: .dw/goals/goals-index.json · ${esc(index.last_updated || '')}</div>
+${total === 0 ? '<div class="empty">No goals yet. Create one with <code>dw goal new G-001 --icon "🚀" --cycle "Q2 2026"</code></div>' : sections}
+</body></html>
+`;
+}
+
+function openInBrowser(url) {
+  const platform = process.platform;
+  try {
+    if (platform === 'win32') execSync(`start "" "${url}"`, { stdio: 'ignore', shell: true });
+    else if (platform === 'darwin') execSync(`open "${url}"`, { stdio: 'ignore' });
+    else execSync(`xdg-open "${url}"`, { stdio: 'ignore' });
+    return true;
+  } catch { return false; }
+}
+
+export async function goalViewCommand(goalId, opts = {}) {
+  const rootDir = process.cwd();
+
+  // Repair index from filesystem (idempotent)
+  for (const id of listGoalIds(rootDir)) {
+    syncIndexEntry(id, rootDir);
+  }
+
+  const index = readGoalIndex(rootDir);
+  const html = renderGoalPortfolioHtml(index);
+
+  const outDir = join(rootDir, CACHE_DIR);
+  if (!existsSync(outDir)) mkdirSync(outDir, { recursive: true });
+  const outFile = join(outDir, 'goals-portfolio.html');
+  writeFileSync(outFile, html, 'utf8');
+
+  console.log();
+  console.log(chalk.green(`  ✓  Goals portfolio HTML: ${outFile}`));
+  console.log(chalk.dim(`     ${Object.keys(index.goals || {}).length} goals rendered`));
+
+  if (opts.open !== false && !opts.noOpen) {
+    const fileUrl = process.platform === 'win32'
+      ? `file:///${outFile.replace(/\\/g, '/')}`
+      : `file://${outFile}`;
+    if (openInBrowser(fileUrl)) {
+      console.log(chalk.dim(`     Opening in browser...`));
+    } else {
+      console.log(chalk.dim(`     Open manually: ${fileUrl}`));
+    }
+  }
+
+  console.log();
+  console.log(chalk.dim(`  Live update: serve via \`dw task watch\` (extends /goals route)`));
+  console.log();
+
+  logEvent({ event: 'goal', action: 'view.invoke', count: Object.keys(index.goals || {}).length }, rootDir);
+}