@justjoshn/pi-pstack 0.0.0-stage → 0.15.36-pi.11

package/skills/poteto-mode/scripts/worktree-audit.sh

@@ -0,0 +1,156 @@
+#!/usr/bin/env bash
+# Read-only worktree prune audit. Classifies every git worktree by size, merge
+# state, uncommitted work, remote/PR state, and the most recent chat that
+# operated in it. Emits a table sorted by size with a suggested bucket. Never
+# deletes anything; deletion stays a human-gated step in the playbook.
+#
+# Usage: worktree-audit.sh [-b|--base <ref>] [repo-path]
+#   repo-path defaults to the current repo.
+#   -b sets the ref the MERGED column checks against (e.g. origin/integration).
+#   Without it the base is origin/HEAD, then origin/main, then origin/master.
+#   origin/HEAD is the remote's default branch, not necessarily the branch PRs
+#   merge into; pass -b when they differ.
+set -u
+
+base=""
+while [ $# -gt 0 ]; do
+	case "$1" in
+	-b|--base) [ $# -ge 2 ] || { echo "error: $1 needs a ref" >&2; exit 2; }; base="$2"; shift 2 ;;
+	-h|--help) sed -n '2,/^set -u/p' "$0" | sed '$d; s/^# \{0,1\}//'; exit 0 ;;
+	-*) echo "error: unknown option: $1" >&2; exit 2 ;;
+	*) break ;;
+	esac
+done
+
+repo="${1:-$(git rev-parse --show-toplevel 2>/dev/null)}"
+[ -z "$repo" ] && { echo "not in a git repo; pass a repo path" >&2; exit 1; }
+cd "$repo" || exit 1
+git rev-parse --git-dir >/dev/null 2>&1 || { echo "error: not a git repo: $repo" >&2; exit 1; }
+
+# Main worktree is the first entry; everything else is a candidate.
+main_wt=$(git worktree list --porcelain | awk '/^worktree /{print $2; exit}')
+
+if [ -z "$base" ]; then
+	for cand in "$(git symbolic-ref --short refs/remotes/origin/HEAD 2>/dev/null)" origin/main origin/master; do
+		[ -n "$cand" ] && git rev-parse --verify --quiet "$cand^{commit}" >/dev/null && { base="$cand"; break; }
+	done
+	[ -z "$base" ] && { echo "error: no base ref (origin/HEAD, origin/main, origin/master all missing); pass -b <ref>" >&2; exit 1; }
+	echo "warn: no -b given; MERGED checks against $base" >&2
+fi
+
+# The base drives the merge check. The fetch is best-effort (stale is fine for
+# a first pass) and runs before the check, since -b may name a branch not
+# fetched yet. The explicit refspec creates it even in a single-branch clone.
+case "$base" in
+origin/*) git fetch origin "+refs/heads/${base#origin/}:refs/remotes/$base" --quiet 2>/dev/null \
+	|| echo "warn: could not fetch $base; merged column may be stale" >&2 ;;
+esac
+git rev-parse --verify --quiet "$base^{commit}" >/dev/null 2>&1 || { echo "error: base ref not found: $base" >&2; exit 1; }
+
+# GNU coreutils (Linux, Homebrew gnubin) reads `stat -f` as file system status
+# and `date -r` as a file, so pick the stat and date flags once.
+if stat -c %Y / >/dev/null 2>&1; then
+	stat_fmt=(-c '%Y %n'); fmt_day() { date -d "@$1" '+%Y-%m-%d'; }
+else
+	stat_fmt=(-f '%m %N'); fmt_day() { date -r "$1" '+%Y-%m-%d'; }
+fi
+
+# PR state by branch, fetched once as [{number, state, head}] with a lowercase
+# state. Origin when its CLI can read this repo's PRs, otherwise gh. Empty when
+# neither can.
+prs=$(mktemp)
+if command -v origin >/dev/null 2>&1 \
+	&& raw=$(origin pr list --author "@me" --state all --limit 1000 \
+		--json number,status,headRef 2>/dev/null); then
+	printf '%s' "$raw" | jq '[.[] | {number, state: .status, head: .headRef}]' > "$prs" 2>/dev/null
+elif raw=$(gh pr list --author "@me" --state all --limit 1000 \
+	--json number,state,headRefName 2>/dev/null); then
+	printf '%s' "$raw" | jq '[.[] | {number, state: (.state | ascii_downcase), head: .headRefName}]' > "$prs" 2>/dev/null
+fi
+[ -s "$prs" ] || echo "[]" > "$prs"
+
+# Transcripts: Pi session files and pi-pstack subagent transcripts. Pi keeps one session folder per working
+# directory under ${PI_CODING_AGENT_DIR:-~/.pi/agent}/sessions, unless PI_CODING_AGENT_SESSION_DIR or a sessionDir
+# setting (the working directory's .pi/settings.json over the agent's settings.json) names one custom folder, with
+# ~ expanded (also in PI_CODING_AGENT_DIR) and a relative path resolved from that working directory. Subagent transcripts live under
+# <agent dir>/pstack/workspaces/<folder>/subagents.
+pi_expand() { case "$1" in "~") printf '%s' "$HOME" ;; "~/"*) printf '%s' "$HOME/${1#"~/"}" ;; *) printf '%s' "$1" ;; esac; }
+pi_agent_dir=$(pi_expand "${PI_CODING_AGENT_DIR:-$HOME/.pi/agent}")
+pi_slug() { printf -- '--%s--' "$(printf '%s' "$1" | sed 's#^/##; s#[/\\:]#-#g')"; }
+pi_session_dir() {
+	local dir="${PI_CODING_AGENT_SESSION_DIR:-}"
+	[ -n "$dir" ] || dir=$(jq -r '.sessionDir // empty' "$1/.pi/settings.json" 2>/dev/null)
+	[ -n "$dir" ] || dir=$(jq -r '.sessionDir // empty' "$pi_agent_dir/settings.json" 2>/dev/null)
+	dir=$(pi_expand "$dir")
+	case "$dir" in
+	"") printf '%s\n' "$pi_agent_dir/sessions/$(pi_slug "$1")" ;;
+	/*) printf '%s\n' "$dir" ;;
+	*) printf '%s\n' "$1/$dir" ;;
+	esac
+}
+pi_chat_dirs() {
+	pi_session_dir "$1"
+	printf '%s\n' "$pi_agent_dir/pstack/workspaces/$(pi_slug "$1")/subagents"
+}
+now=$(date +%s)
+
+echo "# base: $base"
+printf "SIZE\tAGE\tMERGED\tDIRTY\tREMOTE\tPR\tLAST_CHAT\tBUCKET\tWORKTREE\n"
+
+git worktree list --porcelain | awk '/^worktree /{print $2}' | while read -r wt; do
+	[ "$wt" = "$main_wt" ] && continue
+
+	size=$(du -sh "$wt" 2>/dev/null | awk '{print $1}')
+	head=$(git -C "$wt" rev-parse HEAD 2>/dev/null)
+	head_ts=$(git -C "$wt" log -1 --format='%ct' HEAD 2>/dev/null || echo 0)
+	age=$([ "$head_ts" -gt 0 ] 2>/dev/null && echo "$(( (now - head_ts) / 86400 ))d" || echo "?")
+
+	# Squash-merged branches are not ancestors of the base, so PR state is the
+	# real signal; merge-base only catches fast-forward/rebase merges.
+	git merge-base --is-ancestor "$head" "$base" 2>/dev/null && merged=YES || merged=no
+
+	# Distinguish real WIP (tracked edits) from disposable untracked scratch.
+	porcelain=$(git -C "$wt" status --porcelain 2>/dev/null)
+	if [ -z "$porcelain" ]; then dirty=clean
+	elif printf '%s\n' "$porcelain" | grep -qv '^??'; then
+		dirty="wip:$(printf '%s\n' "$porcelain" | grep -cv '^??')"
+	else dirty="scratch:$(printf '%s\n' "$porcelain" | grep -c '^??')"; fi
+
+	branch=$(git -C "$wt" symbolic-ref --quiet --short HEAD 2>/dev/null || echo "")
+	if [ -z "$branch" ]; then remote=detached
+	elif git -C "$wt" show-ref --verify --quiet "refs/remotes/origin/$branch"; then
+		[ "$(git -C "$wt" rev-parse "origin/$branch" 2>/dev/null)" = "$head" ] \
+			&& remote=pushed \
+			|| remote="ahead$(git -C "$wt" rev-list --count "origin/$branch..HEAD" 2>/dev/null)"
+	else remote=no-remote; fi
+
+	pr=$([ -n "$branch" ] && jq -r --arg b "$branch" \
+		'.[] | select(.head==$b) | "#\(.number)/\(.state)"' "$prs" 2>/dev/null | head -1)
+	[ -z "$pr" ] && pr="-"
+
+	# Most recent chat whose transcript operated in this worktree. Match path
+	# followed by "/" or a quote so glint-482 does not match glint-482-r37.
+	last="-"; last_ts=0
+	chat_dirs=()
+	while IFS= read -r d; do [ -d "$d" ] && chat_dirs+=("$d"); done < <({ pi_chat_dirs "$main_wt"; pi_chat_dirs "$wt"; } | sort -u)
+	if [ ${#chat_dirs[@]} -gt 0 ]; then
+		f=$(rg -l -e "${wt}/" -e "${wt}\"" "${chat_dirs[@]}" 2>/dev/null \
+			| xargs stat "${stat_fmt[@]}" 2>/dev/null | sort -rn | head -1)
+		if [ -n "$f" ]; then last_ts=$(echo "$f" | awk '{print $1}')
+			last=$(fmt_day "$last_ts" 2>/dev/null); fi
+	fi
+	recent=$([ "$last_ts" -gt 0 ] 2>/dev/null && [ $(( (now - last_ts) / 86400 )) -le 4 ] && echo yes || echo no)
+
+	case "$dirty" in wip:*) bucket=hold-wip ;; *)
+		case "$pr" in */open|*/draft) bucket=hold-open-pr ;; *)
+			if [ "$recent" = yes ]; then bucket=verify-recent-chat
+			elif [ "$merged" = YES ] || [ "$pr" != "-" ]; then bucket=safe
+			else bucket=review; fi ;;
+		esac ;;
+	esac
+
+	printf "%s\t%s\t%s\t%s\t%s\t%s\t%s\t%s\t%s\n" \
+		"$size" "$age" "$merged" "$dirty" "$remote" "$pr" "$last" "$bucket" "$wt"
+done | sort -t$'\t' -k1,1 -rh
+
+rm -f "$prs"

package/skills/pr-review-canvas/SKILL.md

@@ -0,0 +1,176 @@
+---
+name: pr-review-canvas
+disable-model-invocation: true
+description: Generate an interactive PR review walkthrough as an HTML page. Fetches PR data via gh API, categorizes files into core vs mechanical changes, adds reviewer annotations, and renders diffs with moved-code detection. Use when the user pastes a GitHub PR URL and asks for a review, walkthrough, or summary, or says "review this PR".
+---
+
+# PR Review Canvas
+
+Generate an interactive HTML review of a GitHub PR that reads like a peer walking you through what matters.
+
+## Workflow
+
+### 1. Fetch PR data
+
+Run these `gh api` calls in parallel:
+
+```bash
+gh api repos/{owner}/{repo}/pulls/{number} --jq '{title, body, user: .user.login, state, additions, deletions, changed_files, base: .base.ref, head: .head.ref}'
+gh api repos/{owner}/{repo}/pulls/{number}/files --paginate --jq '.[] | {filename, status, additions, deletions, patch}'
+gh api repos/{owner}/{repo}/pulls/{number}/comments --jq '.[] | {user: .user.login, body, path, line}'
+```
+
+### 2. Analyze the PR and write the body HTML
+
+Read the diffs, understand the PR, and write the `<body>` content directly as HTML. You have full creative freedom -- the goal is to explain the PR clearly to a reviewer. Use whatever structure best fits the PR.
+
+**Typical structure** (adapt as needed):
+- Header with title, PR number, author, stats
+- Summary box explaining what the PR does in plain English
+- Core file sections with annotations and diffs
+- Mechanical/boilerplate files collapsed by default
+- Review checklist at the bottom
+
+**But you can also add:**
+- **Pseudocode summaries** for verbose code -- show the algorithm in plain English or short pseudocode, with the real diff collapsed below (use a `.bp-section` card labeled "Show full implementation"). Great when 150 lines of retry/backoff/error-handling code is really just "fetch with exponential backoff and circuit breaker."
+- Diagrams (inline SVG, mermaid via CDN, ASCII art in `<pre>`)
+- Flowcharts showing before/after control flow
+- Tables comparing old vs new behavior
+- Callout boxes for warnings, questions, or gotchas
+- Interactive widgets if they help
+- Anything else that makes the review clearer
+
+**Pseudocode pattern example:**
+```html
+<div class="file-card">
+  <div class="file-hdr" onclick="toggle(this)">
+    <span class="fname">retryClient.ts</span>
+    <div class="fstats"><span class="pill add">+173</span><span class="pill del">&minus;11</span><span class="chev open">&#9654;</span></div>
+  </div>
+  <div class="file-body open">
+    <div class="file-note">
+      <strong>What this does in plain English:</strong>
+      <pre style="margin-top:8px;color:var(--text);font-size:12px;line-height:1.6;">
+fetch(url):
+  if circuit breaker is open → fail fast
+  retry up to N times:
+    try fetch with timeout
+    on success → close circuit breaker, return
+    on retryable error → wait (exponential backoff + jitter)
+    on non-retryable error → throw
+  circuit breaker records failure</pre>
+    </div>
+    <div class="bp-section" style="margin:0;border:0;border-radius:0;">
+      <div class="bp-hdr" onclick="toggleBP(this)">
+        <span>Show full implementation (+173 lines)</span><span class="chev">&#9654;</span>
+      </div>
+      <div class="bp-body"><div data-diff="retryClient"></div></div>
+    </div>
+  </div>
+</div>
+```
+
+### 3. Available CSS classes and JS utilities
+
+Read [styles.css](styles.css) and [renderer.js](renderer.js) from this skill directory. These give you a prebuilt dark-themed toolkit. Inject them into [template.html](template.html) verbatim.
+
+**CSS classes you can use:**
+
+| Class | Purpose |
+|-------|---------|
+| `.header`, `.header h1`, `.header-meta` | Page header |
+| `.pill.add`, `.pill.del`, `.pill.files` | Stat badges (+N, -N, N files) |
+| `.content` | Centered content wrapper (max 900px) |
+| `.summary` | Summary/TL;DR box |
+| `.section-title` | Section heading with bottom border |
+| `.ic` | Inline code reference (mono, blue, dark bg) |
+| `.file-card`, `.file-hdr`, `.file-body` | Collapsible file card (use `onclick="toggle(this)"` on `.file-hdr`) |
+| `.file-note` | Sticky reviewer annotation inside a file card |
+| `.bp-section`, `.bp-hdr`, `.bp-body` | Collapsed boilerplate card (use `onclick="toggleBP(this)"`) |
+| `.bp-note` | Note inside a boilerplate card |
+| `.verdict` | Review checklist box |
+
+**JS functions available:**
+
+| Function | Usage |
+|----------|-------|
+| `toggle(hdrElement)` | Toggle a `.file-body` open/closed |
+| `toggleBP(hdrElement)` | Toggle a `.bp-body` open/closed |
+| `renderDiff(target, diffInput)` | Render a unified diff. `target` can be a DOM element, string ID, or CSS selector. `diffInput` can be a raw patch string OR an array of lines -- both work. Automatically filters imports, collapses whitespace-only changes, detects moved code (blue/purple tint). |
+| `esc(string)` | HTML-escape a string |
+
+**Rendering diffs -- use `data-diff` attributes with auto-discovery.**
+Put `<div data-diff="KEY"></div>` placeholders in your body HTML wherever you want a diff rendered. The renderer finds them automatically after DOM load and fills them from the `<script id="pr-diffs-json" type="application/json">` element in `template.html`.
+
+**CRITICAL: Patch strings can contain `</script>` in addition to newlines, backslashes, and quotes.** Even `json.dumps(...)` is not enough if you paste raw output into executable `<script>` because HTML parsing can terminate the tag early. Never manually embed patch strings in JS/JSON. Instead, use this safe approach:
+
+1. During the fetch step, save patches to a JSON file using `jq` (which handles escaping correctly):
+```bash
+gh api repos/{owner}/{repo}/pulls/{number}/files --paginate \
+  --jq '[.[] | {key: (.filename | gsub("[^a-zA-Z0-9]"; "_")), value: (.patch // "")}] | from_entries' \
+  > /tmp/pr-patches-{number}.json
+```
+
+2. During assembly, use Python to safely inject the JSON into `template.html`:
+```bash
+python3 <<'PY'
+import json
+from pathlib import Path
+
+patches = json.loads(Path('/tmp/pr-patches-{number}.json').read_text())
+html = Path('/tmp/pr-review-{number}-body.html').read_text()
+css = Path('styles.css').read_text()
+js = Path('renderer.js').read_text()
+tmpl = Path('template.html').read_text()
+
+# Prevent literal </script> from terminating HTML script tags early.
+safe_json = json.dumps(patches).replace('<', '\\u003c').replace('>', '\\u003e').replace('&', '\\u0026')
+
+out = (
+  tmpl.replace('/* INJECT_CSS */', css)
+      .replace('/* INJECT_JS */', js)
+      .replace('<!-- INJECT_BODY -->', html)
+      .replace('{"__PR_DIFFS_PLACEHOLDER__":true}', safe_json)
+)
+
+Path('/tmp/pr-review-{number}.html').write_text(out)
+PY
+```
+
+This guarantees valid JSON and script-safe HTML embedding. The agent writes body HTML to a temp file, then Python assembles everything safely.
+
+The diff data keys should match the `data-diff` attribute values in the HTML:
+```html
+<div data-diff="path_to_file_ts"></div>
+```
+
+Since renderer.js loads in `<head>`, you can also call `renderDiff(target, lines)` directly from inline `<script>` tags if needed for custom use cases. The function accepts a DOM element, ID string, or CSS selector as `target`, and a string or array as `lines`.
+
+**You're not limited to these.** Add your own inline `<style>` blocks, `<script>` blocks, SVGs, diagrams, or anything else. The prebuilt pieces save time but don't constrain you.
+
+### 4. Assemble and serve
+
+1. Write your body HTML (everything that goes inside `<body>`) to `/tmp/pr-review-{number}-body.html`
+2. Save patches to `/tmp/pr-patches-{number}.json` using the `jq` command from step 3 above
+3. Run the Python assembly script from step 3 above (reads styles.css, renderer.js, template.html from this skill directory, injects body + patches safely, writes final HTML)
+4. Start a local server on a fixed port:
+   ```bash
+   cd /tmp && python3 -m http.server 8432 --bind 127.0.0.1
+   ```
+   Run this backgrounded, then navigate the in-app browser to `http://127.0.0.1:8432/pr-review-{number}.html`.
+
+   **Why a fixed port and `cd /tmp`:** Background shells have no TTY, so Python buffers its startup message ("Serving HTTP on...") indefinitely — using port 0 means you can never read which port was chosen. And `--directory /tmp` works but `cd /tmp` is more robust across Python versions. If port 8432 is taken, try 8433, 8434, etc.
+
+### Diff features (handled automatically by renderer.js)
+
+- Filters out import-only lines
+- Collapses whitespace-only changes into context lines
+- Detects moved code blocks (3+ consecutive lines deleted in one place and added identically elsewhere) -- renders in blue/purple instead of red/green
+- Near-matches (moved + small edit) get a different purple tint
+
+### Style notes
+
+- Dark theme: `#1a1a1a` background, Inter body font, IBM Plex Mono for code
+- Use `var(--warning)` for orange, `var(--success)` for green, `var(--danger)` for red, `var(--accent)` for blue
+- Sticky file headers (`position: sticky; top: 0`) and notes (`top: 35px`) pin while scrolling
+- Core files expanded by default (`.file-body.open`), mechanical files collapsed

package/skills/pr-review-canvas/renderer.js

@@ -0,0 +1,170 @@
+function toggle(hdr) {
+  var b = hdr.nextElementSibling, c = hdr.querySelector('.chev');
+  b.classList.toggle('open'); c.classList.toggle('open');
+}
+function toggleBP(hdr) {
+  var b = hdr.nextElementSibling, c = hdr.querySelector('.chev');
+  b.classList.toggle('open'); c.classList.toggle('open');
+}
+
+function isImport(line) {
+  var s = line.replace(/^[+ -]/, '').trim();
+  return s.startsWith('import ') || s.startsWith('import{') || s.startsWith('} from ');
+}
+
+function isWhitespaceOnly(del, add) {
+  return del.replace(/^-/, '').replace(/\s/g, '') === add.replace(/^\+/, '').replace(/\s/g, '');
+}
+
+function esc(s) {
+  return s.replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
+}
+
+function normWs(s) {
+  return s.replace(/\s+/g, ' ').trim();
+}
+
+function toLines(input) {
+  if (!input) return [];
+  if (Array.isArray(input)) return input;
+  if (typeof input === 'string') return input.split('\n');
+  return [];
+}
+
+function loadPrDiffs() {
+  var el = document.getElementById('pr-diffs-json');
+  if (!el) return null;
+  try {
+    return JSON.parse(el.textContent || '');
+  } catch (err) {
+    console.error('Failed to parse PR diff JSON payload', err);
+    return null;
+  }
+}
+
+function detectMoves(dels, adds) {
+  var TH = 3;
+  var md = {}, ma = {};
+  for (var di = 0; di < dels.length; di++) {
+    if (md[di]) continue;
+    var db = [di];
+    for (var d2 = di+1; d2 < dels.length && d2-di < 40; d2++) {
+      if (dels[d2].consecutive && !md[d2]) db.push(d2); else break;
+    }
+    if (db.length < TH) continue;
+    var dn = db.map(function(i){ return normWs(dels[i].code); });
+    for (var ai = 0; ai < adds.length; ai++) {
+      if (ma[ai]) continue;
+      var ab = [ai];
+      for (var a2 = ai+1; a2 < adds.length && a2-ai < 40; a2++) {
+        if (adds[a2].consecutive && !ma[a2]) ab.push(a2); else break;
+      }
+      if (ab.length < TH) continue;
+      var an = ab.map(function(i){ return normWs(adds[i].code); });
+      var ml = Math.min(dn.length, an.length), mc = 0;
+      for (var m = 0; m < ml; m++) { if (dn[m] === an[m]) mc++; }
+      if (mc >= TH && mc >= ml * 0.7) {
+        for (var k = 0; k < ml; k++) {
+          md[db[k]] = { exact: dn[k] === an[k] };
+          ma[ab[k]] = { exact: dn[k] === an[k] };
+        }
+        break;
+      }
+    }
+  }
+  return { movedDels: md, movedAdds: ma };
+}
+
+/**
+ * renderDiff(target, diffInput)
+ *   target: DOM element, string ID, or CSS selector
+ *   diffInput: array of diff lines, OR a single string (will be split on \n)
+ */
+function renderDiff(target, diffInput) {
+  var el;
+  if (typeof target === 'string') {
+    el = document.getElementById(target) || document.querySelector(target);
+  } else {
+    el = target;
+  }
+  if (!el) return;
+
+  var lines = toLines(diffInput);
+  if (!lines.length) { el.innerHTML = '<div style="padding:12px;color:#777;font-size:12px;">No diff data</div>'; return; }
+
+  var filtered = lines.filter(function(l) {
+    if (l.startsWith('--- ') || l.startsWith('+++ ') || l.startsWith('@@') || l.startsWith('diff ')) return true;
+    return !isImport(l);
+  });
+
+  var wsOut = [];
+  for (var wi = 0; wi < filtered.length; wi++) {
+    if (filtered[wi].startsWith('-')) {
+      var dr = [filtered[wi]], wj = wi+1;
+      while (wj < filtered.length && filtered[wj].startsWith('-')) { dr.push(filtered[wj]); wj++; }
+      var ar = [], wk = wj;
+      while (wk < filtered.length && filtered[wk].startsWith('+')) { ar.push(filtered[wk]); wk++; }
+      if (dr.length === ar.length && dr.length > 0) {
+        var allWs = true;
+        for (var wc = 0; wc < dr.length; wc++) { if (!isWhitespaceOnly(dr[wc], ar[wc])) { allWs = false; break; } }
+        if (allWs) { for (var wx = 0; wx < ar.length; wx++) wsOut.push(' ' + ar[wx].slice(1)); wi = wk-1; continue; }
+      }
+    }
+    wsOut.push(filtered[wi]);
+  }
+
+  var dels = [], adds = [], parsed = [];
+  var oL = 0, nL = 0, pD = false, pA = false;
+  for (var pi = 0; pi < wsOut.length; pi++) {
+    var line = wsOut[pi];
+    if (line.startsWith('--- ') || line.startsWith('+++ ') || line.startsWith('diff ')) continue;
+    if (line.startsWith('@@')) {
+      var hm = line.match(/@@ -(\d+)(?:,\d+)? \+(\d+)/);
+      if (hm) { oL = parseInt(hm[1]); nL = parseInt(hm[2]); }
+      parsed.push({ type: 'hunk', text: line }); pD = false; pA = false; continue;
+    }
+    if (line.startsWith('+')) {
+      var ae = { type:'add', code:line.slice(1), newLine:nL, consecutive:pA, idx:parsed.length };
+      adds.push(ae); parsed.push(ae); nL++; pA = true; pD = false;
+    } else if (line.startsWith('-')) {
+      var de = { type:'del', code:line.slice(1), oldLine:oL, consecutive:pD, idx:parsed.length };
+      dels.push(de); parsed.push(de); oL++; pD = true; pA = false;
+    } else {
+      var c = line.startsWith(' ') ? line.slice(1) : line;
+      parsed.push({ type:'ctx', code:c, oldLine:oL, newLine:nL }); oL++; nL++; pD = false; pA = false;
+    }
+  }
+
+  var mv = detectMoves(dels, adds);
+  var rows = [];
+  for (var ri = 0; ri < parsed.length; ri++) {
+    var p = parsed[ri];
+    if (p.type === 'hunk') {
+      rows.push('<tr class="diff-hunk"><td class="diff-ln"></td><td class="diff-ln"></td><td class="diff-code">' + esc(p.text) + '</td></tr>');
+    } else if (p.type === 'add') {
+      var ai2 = -1; for (var fa=0;fa<adds.length;fa++) if(adds[fa].idx===p.idx){ai2=fa;break;}
+      var cls = (mv.movedAdds[ai2]) ? (mv.movedAdds[ai2].exact ? 'diff-moved-add' : 'diff-moved-add-edited') : 'diff-add';
+      rows.push('<tr class="'+cls+'"><td class="diff-ln"></td><td class="diff-ln">'+p.newLine+'</td><td class="diff-code">'+esc(p.code)+'</td></tr>');
+    } else if (p.type === 'del') {
+      var di2 = -1; for(var fd=0;fd<dels.length;fd++) if(dels[fd].idx===p.idx){di2=fd;break;}
+      var cls2 = (mv.movedDels[di2]) ? (mv.movedDels[di2].exact ? 'diff-moved-del' : 'diff-moved-del-edited') : 'diff-del';
+      rows.push('<tr class="'+cls2+'"><td class="diff-ln">'+p.oldLine+'</td><td class="diff-ln"></td><td class="diff-code">'+esc(p.code)+'</td></tr>');
+    } else {
+      rows.push('<tr class="diff-ctx"><td class="diff-ln">'+p.oldLine+'</td><td class="diff-ln">'+p.newLine+'</td><td class="diff-code">'+esc(p.code)+'</td></tr>');
+    }
+  }
+  el.innerHTML = '<table class="diff-table"><tbody>' + rows.join('') + '</tbody></table>';
+}
+
+/* Auto-discovery: after DOM loads, find all [data-diff] elements and render diffs from pr-diffs-json. */
+document.addEventListener('DOMContentLoaded', function() {
+  var prDiffs = loadPrDiffs();
+  if (!prDiffs) return;
+  var els = document.querySelectorAll('[data-diff]');
+  for (var i = 0; i < els.length; i++) {
+    var key = els[i].getAttribute('data-diff');
+    if (key && Object.prototype.hasOwnProperty.call(prDiffs, key)) {
+      renderDiff(els[i], prDiffs[key]);
+    }
+  }
+});

package/skills/pr-review-canvas/styles.css

@@ -0,0 +1,96 @@
+:root {
+  --bg: #1a1a1a;
+  --surface: #222;
+  --surface-raised: #2a2a2a;
+  --border: #333;
+  --text: #bbb;
+  --text-muted: #777;
+  --text-bright: #e5e5e5;
+  --accent: #7aa2f7;
+  --warning: #e0a458;
+  --success: #73b87e;
+  --danger: #e06060;
+}
+* { margin: 0; padding: 0; box-sizing: border-box; }
+body {
+  background: var(--bg);
+  color: var(--text);
+  font-family: 'Inter', -apple-system, sans-serif;
+  font-size: 13px;
+  line-height: 1.5;
+}
+.header {
+  border-bottom: 1px solid var(--border);
+  padding: 24px 32px 20px;
+}
+.header h1 { font-size: 20px; font-weight: 600; color: var(--text-bright); margin-bottom: 4px; }
+.header-meta { font-size: 12px; color: var(--text-muted); display: flex; gap: 16px; align-items: center; margin-top: 8px; }
+.pill { display: inline-flex; padding: 1px 8px; border-radius: 10px; font-family: 'IBM Plex Mono', monospace; font-size: 11px; font-weight: 500; }
+.pill.add { background: #73b87e22; color: var(--success); }
+.pill.del { background: #e0606022; color: var(--danger); }
+.pill.files { background: #7aa2f722; color: var(--accent); }
+.content { max-width: 900px; margin: 0 auto; padding: 24px 20px 60px; }
+.summary { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 16px 20px; margin-bottom: 28px; font-size: 13px; line-height: 1.6; }
+.summary strong { color: var(--text-bright); }
+.summary ul { margin-top: 8px; padding-left: 18px; }
+.summary li { margin-bottom: 4px; }
+.section-title { font-size: 14px; font-weight: 600; color: var(--text-bright); margin: 28px 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
+.ic { font-family: 'IBM Plex Mono', monospace; font-size: 11px; background: var(--surface-raised); padding: 1px 5px; border-radius: 3px; color: var(--accent); }
+
+.file-card { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; margin-bottom: 12px; }
+.file-hdr {
+  display: flex; align-items: center; justify-content: space-between;
+  padding: 8px 14px; background: var(--surface-raised); border-bottom: 1px solid var(--border);
+  cursor: pointer; user-select: none; position: sticky; top: 0; z-index: 12; border-radius: 6px 6px 0 0;
+}
+.file-hdr:hover { background: #303030; }
+.file-hdr .fname { font-family: 'IBM Plex Mono', monospace; font-size: 12px; color: var(--accent); }
+.file-hdr .fstats { display: flex; gap: 6px; align-items: center; }
+.file-hdr .chev { color: var(--text-muted); transition: transform 0.15s; font-size: 11px; margin-left: 10px; }
+.file-hdr .chev.open { transform: rotate(90deg); }
+.file-body { display: none; }
+.file-body.open { display: block; }
+.file-note {
+  padding: 10px 14px; font-size: 13px; color: var(--text); line-height: 1.55;
+  border-bottom: 1px solid var(--border); background: var(--surface);
+  position: sticky; top: 35px; z-index: 11;
+}
+.file-note strong { color: var(--text-bright); }
+.file-note ul { margin-top: 6px; padding-left: 18px; }
+.file-note li { margin-bottom: 3px; }
+
+.bp-section { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; margin-bottom: 8px; }
+.bp-hdr { display: flex; align-items: center; justify-content: space-between; padding: 8px 14px; cursor: pointer; user-select: none; font-size: 12px; color: var(--text-muted); }
+.bp-hdr:hover { background: var(--surface-raised); }
+.bp-hdr .chev { color: var(--text-muted); transition: transform 0.15s; font-size: 11px; }
+.bp-hdr .chev.open { transform: rotate(90deg); }
+.bp-body { display: none; border-top: 1px solid var(--border); }
+.bp-body.open { display: block; }
+.bp-note { padding: 8px 14px; font-size: 12px; color: var(--text-muted); line-height: 1.5; border-bottom: 1px solid var(--border); background: var(--bg); }
+
+.diff-table { width: 100%; border-collapse: collapse; font-family: 'IBM Plex Mono', monospace; font-size: 12px; line-height: 20px; table-layout: fixed; tab-size: 4; }
+.diff-table td { vertical-align: top; white-space: pre; }
+.diff-ln { width: 40px; min-width: 40px; max-width: 40px; text-align: right; padding: 0 6px 0 0; color: #555; background: var(--surface); user-select: none; }
+.diff-code { padding: 0 12px; color: var(--text); background: var(--bg); overflow-x: auto; }
+tr.diff-add .diff-ln { color: #5a8a5a; background: #1a2a1a; }
+tr.diff-add .diff-code { background: #1a2a1a; color: #c8e6c8; }
+tr.diff-del .diff-ln { color: #8a5a5a; background: #2a1a1a; }
+tr.diff-del .diff-code { background: #2a1a1a; color: #e6c8c8; }
+tr.diff-ctx .diff-ln { background: var(--surface); }
+tr.diff-ctx .diff-code { background: var(--bg); color: var(--text-muted); }
+tr.diff-hunk td { background: var(--surface-raised); color: var(--text-muted); font-size: 11px; padding: 3px 12px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
+tr.diff-hunk .diff-ln { background: var(--surface-raised); }
+tr.diff-moved-del .diff-ln { color: #6a6a8a; background: #1a1a2a; }
+tr.diff-moved-del .diff-code { background: #1a1a2a; color: #a8a8d0; }
+tr.diff-moved-add .diff-ln { color: #6a6a8a; background: #1a1a2a; }
+tr.diff-moved-add .diff-code { background: #1a1a2a; color: #a8a8d0; }
+tr.diff-moved-del-edited .diff-ln { color: #7a6a8a; background: #221a2a; }
+tr.diff-moved-del-edited .diff-code { background: #221a2a; color: #c0a8d0; }
+tr.diff-moved-add-edited .diff-ln { color: #7a6a8a; background: #221a2a; }
+tr.diff-moved-add-edited .diff-code { background: #221a2a; color: #c0a8d0; }
+
+.verdict { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 16px 20px; margin-top: 28px; }
+.verdict h3 { font-size: 14px; font-weight: 600; color: var(--text-bright); margin-bottom: 8px; }
+.verdict ul { padding-left: 18px; }
+.verdict li { font-size: 13px; margin-bottom: 6px; line-height: 1.5; }
+.verdict li strong { color: var(--text-bright); }

package/skills/pr-review-canvas/template.html

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
+<style>
+/* INJECT_CSS */
+</style>
+<script>
+/* INJECT_JS */
+</script>
+</head>
+<body>
+<!-- INJECT_BODY -->
+<script id="pr-diffs-json" type="application/json" data-pr-diffs>{"__PR_DIFFS_PLACEHOLDER__":true}</script>
+</body>
+</html>

package/skills/principle-attack-the-premise/SKILL.md

@@ -0,0 +1,21 @@
+---
+name: principle-attack-the-premise
+description: "Apply when two or more fixes that share one premise have failed the same gate. Write the premise down and test it directly before you write another fix that assumes it."
+disable-model-invocation: true
+---
+
+# Attack the Premise
+
+When two or more fixes that share one premise have failed the same gate, suspect the premise, not the fixes.
+
+**Why:** Each failed fix is evidence against the belief it assumed. A third fix on the same premise spends effort where the evidence already says the cause is not.
+
+**Pattern:**
+- **Write the premise down.** The premise is the one sentence that every failed fix assumed.
+- **Test the premise before the next fix.** Find an observation that would come out differently if the premise were false, and make it. Look at how the failures are distributed, not only at how large they are. Make the check rerunnable per [Build the Lever](../principle-build-the-lever/SKILL.md).
+- **Follow the evidence.** If it contradicts the premise, the cause is elsewhere. Look for what the failures have in common that the premise did not predict. If it confirms the premise, ask the next "why" per [Fix Root Causes](../principle-fix-root-causes/SKILL.md). The earlier fixes may have treated a consequence instead of the cause.
+- **Remove the condition instead of compensating for it**, per the [Laziness Protocol](../principle-laziness-protocol/SKILL.md). If the evidence shows that one part always lands on the losing side, change what puts it there. A mechanism that cleans up after it leaves the cause in place and adds work on every run.
+
+**Stop:** Do not start the next fix before the premise is written down and tested.
+
+This principle is distinct from [Redesign from First Principles](../principle-redesign-from-first-principles/SKILL.md), which rebuilds a design around a new requirement. It questions a fact the current design assumes.