astack-skills 0.7.0 → 0.8.0

package/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "astack",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Skills for Claude Code and Codex that take product work from the thread to a proven, live release.",
   "author": {
     "name": "Andrew Wilkinson",

package/.codex-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "astack",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Skills for Claude Code and Codex that take product work from the thread to a proven, live release.",
   "author": {
     "name": "Andrew Wilkinson",

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## 0.8.0
+
+Measured checks for defects a settled screenshot hides, and a harder rule for launch stills. No library was added.
+
+- `shoot.mjs` reads the rendered page and reports inputs under 16px, a viewport that disables zoom, `:hover` rules outside `@media (hover: hover)`, selectable controls on a narrow viewport, and a missing tap-highlight reset. `--shift` compares a loading page with the settled page. It exits 1 when a shared region or the document scroll height moved by more than 1px, and exits 2 when no region was marked and the scroll height did not change. It does not read the performance timeline's layout-shift entries: headless Chrome can report none for a jump that has already painted, and a score of 0 would pass that page.
+- `web-design` states how to build that loading layout, and `mobile.md` says which of those lines a desktop capture can see. `dogfood` and `astack`'s completion checks read them before calling a phone journey done.
+- `deslop` names this season's UI tells with examples (pill tags, italic headline words, dividers, opacity ladders, borders on every box, over-detailed diagrams, decorative breadcrumbs, section numbers). `slop-scan.mjs` flags `section-index` and `opacity-ramp`.
+- `launch` and `web-graphics`: a bento, device or clip may frame a real capture. It may not redraw the screen, and it may not show a number the agreed copy file does not contain.
+- New `shift-and-still` eval fixture, with the planted failures named. The blind comparison was not run. The deterministic `shoot.mjs --shift` run is recorded in `evals/RESULTS.md`.
+
+## 0.7.1
+
+- Keep coupled work in one agent context and load skills as needed. Independent review now depends on risk, unresolved judgment and repository requirements.
+- Shorten skill descriptions while preserving tested routing cues. Context gathering stops when remaining unknowns cannot change the next step.
+- Reuse existing delivery authority and preserve explicit targets. Skills do not create permission to send, publish or bypass a repository gate.
+- Reject incomplete routing evals and report individual improvements and regressions, including when aggregate scores tie.
+
 ## 0.7.0
 
 Review gates and video from LangChain's open-source design agent, [Content Studio](https://github.com/langchain-ai/design-agent) (Apache-2.0), credited where they are used. Its idea is that the model makes the creative calls and code renders, measures and refuses.

package/README.md

@@ -40,15 +40,15 @@ Two ways in, depending on whether you're watching.
 astack this: add annual pricing to the billing page. phones matter most
 ```
 
-`astack` takes it to a PR you'd be happy to merge. It reads the context, plans, builds, uses the thing like a customer, adds tracking, cleans up the slop, gets a second agent to check the work, and stops there for you.
+`astack` takes it to a PR you'd be happy to merge. It reads the context, plans, builds, uses the thing like a customer, adds relevant tracking, cleans up the diff, and verifies the result. A separate reviewer joins when the risk or judgment calls for one.
 
 ```text
 oneshot this: add annual pricing and get it live
 ```
 
-`oneshot` is for when you're not watching. Same work, then it merges, deploys, proves production is serving it and tells the team. It only runs when you ask for it by name.
+`oneshot` is for when you're not watching. Same work, then it merges, deploys, proves production is serving it and sends any authorized update. It only runs when you ask for it by name.
 
-Both pull in the other skills as they need them.
+Both keep one working context and load other skills only when their procedure helps the next step. Required repository checks and delivery proof still apply.
 
 ## Skills
 
@@ -63,7 +63,7 @@ Both pull in the other skills as they need them.
 | [instrument](skills/instrument/SKILL.md) | "can we measure this" | Tracking that fires once, on real success, and a query you can actually trust. |
 | [discoverability](skills/discoverability/SKILL.md) | "why doesn't ChatGPT mention us" | Checks what Google and AI crawlers really see, fixes it, measures before and after. |
 | [dogfood](skills/dogfood/SKILL.md) | "use it like a customer" | Walks the real journeys signed in, fixes what breaks and goes round again. |
-| [ship](skills/ship/SKILL.md) | "ship it" | Clears CI and review comments, gets an independent check, deploys, and proves production is serving it. Also checks other people's "it's shipped". |
+| [ship](skills/ship/SKILL.md) | "ship it" | Clears CI and review comments, verifies the affected behavior, deploys, and proves production is serving it. Also checks other people's "it's shipped". |
 | [launch](skills/launch/SKILL.md) | "we launch tomorrow" | Share cards, page checks, posts for X and Show HN, a tracker and how you'll read the results. |
 
 Each one has a short guide in [docs/skills](docs/skills/).
@@ -72,7 +72,7 @@ Each one has a short guide in [docs/skills](docs/skills/).
 
 Most skill packs tell the model to be thorough. These come with small scripts so it can actually check. Node 22, nothing else to install, and every skill carries its own copy.
 
-- `shoot.mjs` screenshots a page on a phone and on desktop, light and dark, and flags stranded words, tiny tap targets and anything spilling sideways.
+- `shoot.mjs` screenshots a page on a phone and on desktop, light and dark, and flags stranded words, tiny tap targets, anything spilling sideways, inputs that will zoom the page, hover that is not gated to a real pointer, and (with `--shift`) a loading state whose boxes do not match the loaded page.
 - `pr-state.mjs` reads every check on the current commit and every unresolved review thread. `--watch` sits in the background and pings you when something changes.
 - `verify-live.mjs` confirms the URL is serving the commit you shipped, not a cached copy of the last one.
 - `slop-scan.mjs` finds the usual suspects, from "seamless" to gradient headlines to emoji bullets, and explains why each one reads as generated. <!-- slop-scan: ignore-line -->

package/package.json

@@ -1,13 +1,15 @@
 {
   "name": "astack-skills",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "private": false,
   "description": "Skills for Claude Code and Codex that take product work from the thread to a proven, live release.",
   "license": "MIT",
   "repository": "https://github.com/ADWilkinson/astack",
   "packageManager": "bun@1.4.2",
   "scripts": {
-    "check": "bun scripts/check.ts && bun test",
+    "check": "bun scripts/check.ts && bun test tests/package.test.ts tests/install.test.ts && bun scripts/smoke.ts",
+    "smoke": "bun scripts/smoke.ts",
+    "test": "bun test",
     "validate": "bun scripts/check.ts",
     "metadata": "bun scripts/metadata.ts",
     "pack": "bun scripts/pack.ts",

package/plugin.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://agent-plugins.org/schemas/1.0.0/plugin.schema.json",
   "name": "astack",
-  "version": "0.7.0",
+  "version": "0.8.0",
   "description": "Skills for Claude Code and Codex that take product work from the thread to a proven, live release.",
   "author": {
     "name": "Andrew Wilkinson",

package/skills/astack/SKILL.md

@@ -1,17 +1,17 @@
 ---
 name: astack
-description: Take a product task from "here's the idea" to a pull request that is proven, green and ready for review, covering context, plan, build, real use, measurement and cleanup, without being walked through each step. Use when the user says "astack this", "take this end to end", "do this properly", or hands over a feature, fix, page or experiment and expects it finished rather than planned. Stops before merge; for all the way to production use oneshot.
+description: "Own context, planning, implementation, real use, measurement and checks through a review-ready PR. Use for \"astack this\", \"own this\" or a product task to finish end to end. Load further procedures only as needed. Honor an explicit delivery target."
 ---
 
 # astack
 
-You own the outcome up to a PR the user can review and merge with confidence. Nobody should have to come back and ask "did you check mobile", "is the event firing" or "did CI pass".
+By default, own the outcome up to a PR the user can review and merge with confidence. Honor an explicit target and existing authority. Nobody should have to come back and ask "did you check mobile", "is the event firing" or "did CI pass".
 
 `<skill-dir>` means this skill's folder. Run its scripts from the project root.
 
-## Start by writing the stages into your todo list
+## Own the work in one loop
 
-Copy these eight lines into your todo list before any task-specific items. Close each one with its proof, or leave it in the list as `skip: <one-line reason>`. A stage that silently disappears is a stage you didn't do.
+Keep context, decisions and execution in the main agent. Load another skill or reference only when its procedure changes the next step; the names below are options, not a required chain. Small fixes need only the relevant checks. For sustained work, track the acceptance criteria and their evidence in the existing plan or PR.
 
 1. **Context**: outcome, decisions already made, starting state, the one unknown that could change the approach. (`context`)
 2. **Plan**: every requirement has a change, a proof and a target. Measurement and delivery are in it. ([planning](references/plan.md); small fixes need three lines)
@@ -19,23 +19,25 @@ Copy these eight lines into your todo list before any task-specific items. Close
 4. **Use it**: the real journey, in a browser or runtime, to the real outcome; fix and replay. (`dogfood`)
 5. **Measure**: the success action fires once, on real success, and arrives. (`instrument`, when there is a success action)
 6. **Clean**: `deslop` scan on changed copy, UI and code; every medium or high hit fixed or dismissed with a reason.
-7. **Verify independently**: a fresh agent that did not write the change exercises it and returns PASS or FAIL with evidence. For visual work it also scores its own renders with `web-design`'s review rubric and gives ship, fix or rework. (`ship`; docs-only or trivial changes may skip)
+7. **Verify**: run the repo's required checks and exercise the affected behavior. Use an independent reviewer when subjective quality, security, money, migrations or unresolved uncertainty warrants a separate perspective. Give it acceptance criteria and source evidence, not your conclusions. For visual work, inspect renders against the product's design and the user's references.
 8. **PR ready**: `node <skill-dir>/scripts/pr-state.mjs` reports no blockers on the current head; the PR body says what changed, how it was proven, and what was not verified. (`ship`)
 
-For visual changes, capture 390 and 1440 in light and dark with [`scripts/shoot.mjs`](scripts/shoot.mjs) and look at the images. Use [completion checks](references/completion-checks.md) as the final gate.
+For visual changes, capture 390 and 1440 with [`scripts/shoot.mjs`](scripts/shoot.mjs) and inspect the images, including the themes and states the product supports. Read [completion checks](references/completion-checks.md) when reconciling a larger change before delivery.
+
+Delegate when parallel work needs independent context, reading would crowd out the main task, or an independent verdict matters. Keep ownership separate and return evidence, limitations and affected files. A specialist name alone is no reason to start another agent.
 
 ## What you may do without asking
 
-Invoking astack is the permission for everything reversible that the stages need: create a branch, run the app and dev servers, drive a browser, take screenshots, run any test method, install dev dependencies the repo already declares, push the branch, open or update the PR, reply to review threads with fixes, and re-run CI after a diagnosis.
+Within the user's authorized task and target: create a branch, run the app and dev servers, drive a browser, take screenshots, run tests, install dev dependencies the repo already declares, push the branch, open or update the PR, and re-run CI after a diagnosis. External replies still need authority for that destination. A skill describes procedure; it does not expand the user's grant.
 
 ## Ask only when
 
 - you cannot find a way to prove a change;
 - the goal is ambiguous in a way that changes the result;
-- the next step is outside the grant: merging, deploying to production, deleting data, spending money, messaging people, changing anything outside the repo;
+- the next step is outside the existing grant, such as merging, production deployment, deleting data, spending money or messaging people;
 - another PR or decision makes this one obsolete.
 
-Ask with the harness's question tool (`AskUserQuestion` in Claude Code, `request_user_input` in Codex), not in a normal message, or the thread looks finished. Put the context and your recommendation in the question. If no tool exists or nobody answers, take the safe path: leave the work on its branch or open PR, and start your final message with the question. Decide everything else yourself and list those decisions in the report.
+Reuse authority already given for the same action and target. If a material decision remains, use the client's available question mechanism and explain what it changes. Continue independent work while waiting. Without required authority, leave the result concrete and reviewable at the authorized target. Decide routine implementation details yourself.
 
 ## Do not stop early
 
@@ -43,9 +45,9 @@ Ending your turn while checks or reviews are pending ends the work, because nobo
 
 ## Finish
 
-- **Outcome**: one sentence, at the PR-ready target.
-- **Proof**: PR link, checks, the independent verdict, screenshots or queries, each with how it was observed.
+- **Outcome**: one sentence at the agreed target, defaulting to PR-ready.
+- **Proof**: PR link, verification method and any independent verdict, screenshots or queries, each with how it was observed.
 - **Decisions you made** for the user.
 - **Not verified**: the exact gap and next step, if any.
 
-To take it further (merge, deploy, verify live, tell the team) the user says `oneshot`.
+Further delivery follows the user's explicit target and existing authority; `oneshot` requests the full path.

package/skills/astack/agents/openai.yaml

@@ -1,3 +1,3 @@
-interface: 
+interface:
   display_name: astack
   short_description: "Own a product task up to a proven, review-ready PR"

package/skills/astack/references/completion-checks.md

@@ -13,7 +13,8 @@ Run this before writing "done". Every line is either checked, not applicable (sa
 
 - [ ] Captured at 390 and 1440, light and dark, reduced motion on (`node <skill-dir>/scripts/shoot.mjs <url>`), and the screenshots were looked at.
 - [ ] No horizontal overflow, stranded single words in headings, tap targets under 44px or text under 12px that you did not choose on purpose.
-- [ ] Loading, empty, error and success states seen, not assumed.
+- [ ] Phone lines from that capture are clean or chosen on purpose: no input under 16px, no zoom lock, no ungated `:hover`, no selectable control text, tap highlight disabled. Name anything that still needs a phone in the hand.
+- [ ] Loading, empty, error and success states seen, not assumed. Where a screen waits on data, `shoot.mjs <loading> --shift <loaded>` exits 0. Exit 1 is a shift to fix. Exit 2 means the regions were not marked, which is not a pass.
 - [ ] `deslop` scan run on changed copy and UI; every medium/high hit fixed or dismissed with a reason.
 
 ## Measurement (when the change has a success action)

package/skills/astack/scripts/shoot.mjs

@@ -29,23 +29,43 @@ Options:
                        offsets depend on capture speed and are reported)
   --click SELECTOR     Click this element before capturing (e.g. to open a menu)
   --scale N            Device scale factor (default: 2)
+  --shift URL          Load this second page at the same sizes. The first
+                       page is the loading state, this one the settled state.
+                       Reports regions (same id or data-region) whose box
+                       moved by more than 1px, and any change in document
+                       scroll height. Exits 1 when one did. Exits 2 when no
+                       region was marked and the scroll height did not change,
+                       which is not a pass. Settled shots are named with -settled.
   --json               Print a JSON manifest instead of text
 
 Set SHOOT_CHROME_FLAGS for extra browser flags. --no-sandbox is added
 automatically when CI is set or when running as root.
 
-Also reports: horizontal overflow, stranded words in wrapped text, tap
-targets under 44px (widths < 768), text under 12px, console errors, failed
-requests and
-elements wider than the viewport, per capture. Set CHROME_PATH to override
-browser discovery. The temporary browser profile is deleted afterwards.
-Exits 1 if the page fails to load or returns an HTTP error. A bare
+Also reports, per capture: horizontal overflow, elements wider than the
+viewport, stranded words in wrapped text, tap targets under 44px and
+selectable control text (widths < 768), text under 12px, inputs under 16px,
+a viewport that disables zoom, :hover rules outside @media (hover: hover),
+a missing tap-highlight reset when the page has controls, console errors
+and failed requests. Set CHROME_PATH to override browser discovery. The
+temporary browser profile is deleted afterwards. Exits 1 if a page fails
+to load, returns an HTTP error, or --shift finds a moved region or a
+document scroll height change of more than 1px. Exits 2 when --shift could
+not compare a marked region and the scroll height did not change. A bare
 host:port (localhost:3000) is treated as http://.
+The layout-shift entries on the performance timeline are not read. Headless
+Chrome can report none of them for a jump that has already painted, so a
+score of 0 would pass a page that moved. The two-page box compare is the check.
 `;
 
+function resolveTarget(value) {
+  if (/^[a-z]+:\/\//i.test(value)) return value;
+  return !existsSync(value) && /^(?:localhost|[\w-]+(?:\.[\w-]+)+|\d+\.\d+\.\d+\.\d+)(?::\d+)?(?:\/|$)|^[\w.-]+:\d+/.test(value)
+    ? `http://${value}` : pathToFileURL(resolve(value)).href;
+}
+
 function parse(argv) {
-  const o = { target: "", out: "shots", widths: [390, 1440], height: 0, themes: ["light", "dark"],
-    motion: "reduce", full: false, wait: 600, frames: 0, every: 100, click: "", scale: 2, json: false };
+  const o = { target: "", shift: "", out: "shots", widths: [390, 1440], height: 0, themes: ["light", "dark"],
+    motion: "reduce", full: false, wait: 600, frames: 0, every: 100, click: "", scale: 2, shotSuffix: "", json: false };
   for (let i = 0; i < argv.length; i++) {
     const a = argv[i], v = () => { const x = argv[++i]; if (x === undefined) throw new Error(`${a} needs a value`); return x; };
     if (a === "--help" || a === "-h") { process.stdout.write(HELP); process.exit(0); }
@@ -60,14 +80,14 @@ function parse(argv) {
     else if (a === "--every") o.every = Number(v());
     else if (a === "--click") o.click = v();
     else if (a === "--scale") o.scale = Number(v());
+    else if (a === "--shift") o.shift = v();
     else if (a === "--json") o.json = true;
     else if (a.startsWith("--")) throw new Error(`Unknown option ${a}`);
     else o.target = a;
   }
   if (!o.target) { process.stdout.write(HELP); process.exit(1); }
-  if (!/^[a-z]+:\/\//i.test(o.target))
-    o.target = !existsSync(o.target) && /^(?:localhost|[\w-]+(?:\.[\w-]+)+|\d+\.\d+\.\d+\.\d+)(?::\d+)?(?:\/|$)|^[\w.-]+:\d+/.test(o.target)
-      ? `http://${o.target}` : pathToFileURL(resolve(o.target)).href;
+  o.target = resolveTarget(o.target);
+  if (o.shift) o.shift = resolveTarget(o.shift);
   if (o.frames) o.motion = "no-preference";
   return o;
 }
@@ -197,7 +217,7 @@ async function capture(cdp, o, width, theme) {
     if (!o.frames) await sleep(o.wait);
   }
   const files = [], frameTimes = [];
-  const base = `${String(width)}-${theme}`;
+  const base = `${String(width)}-${theme}${o.shotSuffix || ""}`;
   if (o.frames) {
     // Capture first, measure the page afterwards, so frame 0 is as close to the trigger as possible.
     for (let f = 0; f < o.frames; f++) {
@@ -277,8 +297,64 @@ async function capture(cdp, o, width, theme) {
       const size = parseFloat(getComputedStyle(el).fontSize);
       if (size < 12) { tinyText.push(label(el) + " " + size + "px"); if (tinyText.length >= 5) break; }
     }
+    const inputsUnder16 = [];
+    for (const el of document.querySelectorAll("input:not([type=hidden]):not([type=checkbox]):not([type=radio]):not([type=range]):not([type=button]):not([type=submit]):not([type=reset]):not([type=file]):not([type=image]), textarea, select")) {
+      if (!visible(el)) continue;
+      const size = parseFloat(getComputedStyle(el).fontSize);
+      if (size < 16) { inputsUnder16.push((el.getAttribute("aria-label") || el.id || el.getAttribute("name") || el.getAttribute("placeholder") || el.tagName.toLowerCase()) + " " + (Math.round(size * 10) / 10) + "px"); if (inputsUnder16.length >= 8) break; }
+    }
+    const viewportMeta = document.querySelector('meta[name="viewport" i]')?.getAttribute("content") || "";
+    const zoomLocked = /user-scalable\\s*=\\s*(?:no|0)\\b|maximum-scale\\s*=\\s*1(?:\\.0+)?(?![.\\d])/i.test(viewportMeta);
+    const ungatedHovers = [];
+    let ungatedHoverCount = 0, tapHighlightDisabled = false;
+    const coversRoot = selector => selector.split(",").some(s => /^(?:html|:root|\\*|body)(?:\\s|$)/.test(s.trim()));
+    const visitRules = (rules, media) => {
+      if (!rules) return;
+      for (const rule of rules) {
+        if (rule.type === 4) visitRules(rule.cssRules, (media ? media + " " : "") + (rule.conditionText || ""));
+        else if (rule.type === 3 && rule.styleSheet) { try { visitRules(rule.styleSheet.cssRules, media); } catch (e) { /* unreadable import */ } }
+        else {
+          if (rule.type === 1 && rule.selectorText) {
+            if (/:hover\\b/.test(rule.selectorText) && !/\\(\\s*(?:any-)?hover\\s*:\\s*hover\\s*\\)/.test(media) && !/hover\\s*:\\s*none/.test(media)) {
+              ungatedHoverCount++;
+              if (ungatedHovers.length < 8) ungatedHovers.push(rule.selectorText.slice(0, 100));
+            }
+            const tap = rule.style && rule.style.getPropertyValue("-webkit-tap-highlight-color");
+            if (tap && /transparent|rgba\\(\\s*0\\s*,\\s*0\\s*,\\s*0\\s*,\\s*0\\s*\\)/i.test(tap) && coversRoot(rule.selectorText)) tapHighlightDisabled = true;
+          }
+          if (rule.cssRules && rule.type !== 4) visitRules(rule.cssRules, media);
+        }
+      }
+    };
+    const seenSheets = new Set();
+    for (const sheet of [...document.styleSheets, ...(document.adoptedStyleSheets || [])]) {
+      if (seenSheets.has(sheet)) continue;
+      seenSheets.add(sheet);
+      try { visitRules(sheet.cssRules, ""); } catch (e) { /* cross-origin sheet */ }
+    }
+    const inlineTap = document.documentElement.style.getPropertyValue("-webkit-tap-highlight-color");
+    if (inlineTap && /transparent/i.test(inlineTap)) tapHighlightDisabled = true;
+    const hasControls = !!document.querySelector("a[href], button, [role=button], input, select, textarea");
+    const selectableControls = [];
+    if (vw < 768) for (const el of document.querySelectorAll("button, [role=button]")) {
+      if (!visible(el) || !(el.innerText || "").trim()) continue;
+      const cs = getComputedStyle(el);
+      if ((cs.userSelect || cs.webkitUserSelect) !== "none") { selectableControls.push(label(el)); if (selectableControls.length >= 8) break; }
+    }
+    const regions = [], seenKeys = new Set();
+    for (const el of document.querySelectorAll("[id], [data-region]")) {
+      if (!visible(el)) continue;
+      const key = el.id ? "#" + el.id : "region:" + el.getAttribute("data-region");
+      if (seenKeys.has(key)) continue;
+      seenKeys.add(key);
+      const box = el.getBoundingClientRect();
+      regions.push({ key, top: Math.round(box.top), left: Math.round(box.left), width: Math.round(box.width), height: Math.round(box.height) });
+      if (regions.length >= 80) break;
+    }
     return { scrollWidth: document.documentElement.scrollWidth, viewport: vw, overflowing: wide.map(w => w.text), stranded, smallTargets, tinyText,
-      height: document.documentElement.scrollHeight, title: document.title };
+      height: document.documentElement.scrollHeight, title: document.title,
+      inputsUnder16, zoomLocked, ungatedHovers, ungatedHoverCount, tapHighlightDisabled: hasControls ? tapHighlightDisabled : null,
+      selectableControls, regions };
   })()` });
   if (!o.frames) {
     const shot = await cdp.send("Page.captureScreenshot", { format: "png", captureBeyondViewport: o.full });
@@ -287,10 +363,36 @@ async function capture(cdp, o, width, theme) {
   }
   const l = layout.result.value;
   return { width, height, theme, motion: o.motion, files, ...(o.frames ? { frameTimesMs: frameTimes } : {}), title: l.title,
+    scrollHeight: l.height, regions: l.regions,
+    inputsUnder16: l.inputsUnder16, zoomLocked: l.zoomLocked, ungatedHovers: l.ungatedHovers, ungatedHoverCount: l.ungatedHoverCount,
+    tapHighlightDisabled: l.tapHighlightDisabled, selectableControls: l.selectableControls,
     horizontalOverflow: l.scrollWidth > l.viewport ? `${l.scrollWidth - l.viewport}px` : null,
     overflowingElements: l.overflowing, strandedWords: l.stranded, smallTapTargets: l.smallTargets, tinyText: l.tinyText, ...issues };
 }
 
+// Same id or data-region in both pages. A disappearing spinner is not a shift;
+// a card that grows, or a control that moves, is.
+function compareShift(before, after) {
+  const settled = new Map((after.regions || []).map(r => [r.key, r]));
+  const shifts = [];
+  let shared = 0;
+  for (const region of before.regions || []) {
+    const other = settled.get(region.key);
+    if (!other) continue;
+    shared++;
+    const dx = other.left - region.left, dy = other.top - region.top, dw = other.width - region.width, dh = other.height - region.height;
+    if (Math.abs(dx) > 1 || Math.abs(dy) > 1 || Math.abs(dw) > 1 || Math.abs(dh) > 1)
+      shifts.push({ key: region.key, before: region, after: other, dx, dy, dw, dh });
+  }
+  const scrollDelta = (after.scrollHeight ?? 0) - (before.scrollHeight ?? 0);
+  return {
+    scrollBefore: before.scrollHeight ?? null, scrollAfter: after.scrollHeight ?? null,
+    scrollDelta: Math.abs(scrollDelta) > 1 ? scrollDelta : 0, shared, shifts,
+    settledFiles: after.files,
+    ...(shared === 0 ? { note: "no shared id or data-region; only the document scroll height was compared" } : {}),
+  };
+}
+
 async function main() {
   const o = parse(process.argv.slice(2));
   mkdirSync(o.out, { recursive: true });
@@ -300,15 +402,31 @@ async function main() {
     for (const width of o.widths) for (const theme of o.themes) {
       const cdp = await connect(browser.port);
       await cdp.send("Page.enable"); await cdp.send("Runtime.enable"); await cdp.send("Network.enable");
-      results.push(await capture(cdp, o, width, theme));
+      const before = await capture(cdp, o, width, theme);
       cdp.close();
+      if (o.shift) {
+        const settled = await connect(browser.port);
+        await settled.send("Page.enable"); await settled.send("Runtime.enable"); await settled.send("Network.enable");
+        const after = await capture(settled, { ...o, target: o.shift, shotSuffix: "-settled" }, width, theme);
+        settled.close();
+        before.shift = compareShift(before, after);
+        if (after.loadError && !before.loadError) before.loadError = `settled page: ${after.loadError}`;
+      }
+      results.push(before);
     }
   } finally { await browser.close(); }
   const failed = results.some(r => r.loadError);
-  if (failed) process.exitCode = 1;
+  const shifted = results.some(r => r.shift && (r.shift.shifts.length > 0 || r.shift.scrollDelta));
+  // No marked region and no scroll change means the jump was not measured.
+  // Scroll height stays at the viewport when both states fit, so that case must not pass.
+  const unchecked = results.some(r => r.shift && r.shift.shared === 0 && !r.shift.scrollDelta);
+  if (failed || shifted) process.exitCode = 1;
+  else if (unchecked) process.exitCode = 2;
   if (o.json) { process.stdout.write(JSON.stringify({ target: o.target, captures: results }, null, 2) + "\n"); return; }
   for (const r of results) {
-    const flags = [r.loadError, r.horizontalOverflow && `horizontal overflow ${r.horizontalOverflow}`,
+    const shiftFlag = r.shift && (r.shift.shifts.length > 0 || r.shift.scrollDelta) ? "layout shift" : "";
+    const uncheckedFlag = r.shift && r.shift.shared === 0 && !r.shift.scrollDelta ? "shift not checked" : "";
+    const flags = [r.loadError, shiftFlag, uncheckedFlag, r.horizontalOverflow && `horizontal overflow ${r.horizontalOverflow}`,
       r.consoleErrors.length && `${r.consoleErrors.length} console error(s)`,
       r.failedRequests.length && `${r.failedRequests.length} failed request(s)`].filter(Boolean);
     process.stdout.write(`${r.width}px ${r.theme}: ${r.files.join(", ")}${flags.length ? "  !! " + flags.join("; ") : ""}\n`);
@@ -316,6 +434,20 @@ async function main() {
     for (const e of r.strandedWords) process.stdout.write(`    stranded words: ${e}\n`);
     for (const e of r.smallTapTargets) process.stdout.write(`    tap target < 44px: ${e}\n`);
     for (const e of r.tinyText) process.stdout.write(`    text < 12px: ${e}\n`);
+    for (const e of r.inputsUnder16 || []) process.stdout.write(`    input under 16px: ${e}\n`);
+    if (r.zoomLocked) process.stdout.write(`    viewport disables zoom\n`);
+    if (r.ungatedHoverCount) process.stdout.write(`    hover not gated (${r.ungatedHoverCount}): ${(r.ungatedHovers || []).join("; ")}\n`);
+    if (r.tapHighlightDisabled === false) process.stdout.write(`    tap highlight not disabled\n`);
+    for (const e of r.selectableControls || []) process.stdout.write(`    control text selectable: ${e}\n`);
+    if (r.shift) {
+      if (r.shift.note) process.stdout.write(`    shift: ${r.shift.note}\n`);
+      if (r.shift.scrollDelta) process.stdout.write(`    document scroll height ${r.shift.scrollDelta > 0 ? "+" : ""}${r.shift.scrollDelta}px after load\n`);
+      for (const s of r.shift.shifts.slice(0, 12)) {
+        const part = (n, label) => n ? `${label} ${n > 0 ? "+" : ""}${n}px` : "";
+        const bits = [part(s.dy, "top"), part(s.dh, "height"), part(s.dx, "left"), part(s.dw, "width")].filter(Boolean);
+        process.stdout.write(`    layout shift ${s.key}: ${bits.join(", ")}\n`);
+      }
+    }
     for (const e of [...new Set(r.consoleErrors)].slice(0, 5)) process.stdout.write(`    console: ${e}\n`);
     for (const e of [...new Set(r.failedRequests)].slice(0, 5)) process.stdout.write(`    request: ${e}\n`);
   }

package/skills/context/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: context
-description: Gather what actually changes a task before starting it, from Slack threads, issues, PRs, docs, git history, the live product and analytics, and reconcile it into a short brief. Use when picking up a ticket, a Slack ask, a half-finished branch, "look into X", or any task where earlier decisions, corrections or numbers live somewhere other than the prompt.
+description: "Reconcile prior decisions and current evidence into a brief that changes the next step. Use when picking up a ticket, thread or unfinished branch whose scope depends on history outside the prompt."
 ---
 
 # Context
@@ -21,7 +21,7 @@ Search for those answers. Stop reading sources that answer nothing on the list.
 
 If the task touches existing code, anchor first: the files and line ranges involved, `git blame` on them, the last commits and the PRs those commits came from (`gh pr view <n> --json title,body,comments,reviews`). That anchor tells you which threads and decisions to look for.
 
-Then go through each kind of evidence that is available: code history, the issue tracker, docs, team chat, error tracking, analytics. One that has nothing relevant is still a finding; write "searched, nothing" rather than skipping it silently. One you cannot reach is a gap; say so.
+Follow the sources most likely to settle the named unknowns: code history, the issue tracker, docs, team chat, error tracking or analytics. Stop when the next action is clear. Report an unreachable source when it leaves a material question unresolved; an exhaustive source sweep is not a completion requirement.
 
 Use the connected tools; prefer the original over a summary of it. Commands that pay off:
 
@@ -34,10 +34,10 @@ git log -p --follow -- path/to/file | head -200
 git blame -L 120,160 path/to/file
 ```
 
-- **Slack / chat**: read the whole thread including late replies; the correction is usually at the bottom. Search with the channel and date bounds (`in:#channel after:2026-01-01 "keyword"`), then open each hit in context.
-- **Docs and specs**: check the date and whether later code or chat superseded them.
-- **Live product**: open the real page or call the real endpoint. What it does today beats what a doc says it does.
-- **Analytics**: read the definition (event, filters, window) before reading the number. A number without its definition is not context.
+- Slack / chat: read the whole thread including late replies; the correction is usually at the bottom. Search with the channel and date bounds (`in:#channel after:2026-01-01 "keyword"`), then open each hit in context.
+- Docs and specs: check the date and whether later code or chat superseded them.
+- Live product: open the real page or call the real endpoint. What it does today beats what a doc says it does.
+- Analytics: read the definition (event, filters, window) before reading the number. A number without its definition is not context.
 
 See [source selection](references/source-selection.md) for which source wins when they disagree, and for multi-source tasks.
 

package/skills/context/agents/openai.yaml

@@ -1,3 +1,3 @@
-interface: 
+interface:
   display_name: Context
   short_description: Gather and reconcile what changes the task

package/skills/context/references/source-selection.md

@@ -22,7 +22,7 @@
 
 ## Signs the context is wrong
 
-- The brief has no "Open" line. Something is always uncertain; find it.
+- A material unknown is hidden. If no remaining uncertainty changes the next step, say "Open: none material" and proceed.
 - The brief repeats the prompt. You read nothing that changed the work.
 - A number appears without project, population, filter and window.
 - A "decided" item has no link or date.

package/skills/deslop/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: deslop
-description: Strip the tells of generated work from copy, UI and code, such as inflated vocabulary, "not just X but Y", staged reveals, em-dash rhythm, emoji bullets, gradient-and-glass UI, narrating comments and defensive clutter, while keeping facts, behaviour and voice. Use when the user says deslop, "this sounds like AI", "make it sound human", "tighten this", before publishing copy or merging UI, or when writing anything public. Also builds a voice profile from someone's real writing.
+description: "Write or revise public copy, UI and code without generated tells, preserving facts and voice. Use for \"deslop\", \"sounds like AI\", tightening prose, user emails, removing generic UI or learning a voice from real writing."
 ---
 
 # Deslop
@@ -33,7 +33,11 @@ Work through [prose patterns](references/prose-patterns.md). The ones that matte
 
 ## 3. Fix UI
 
-Run the scan on components and check the rendered page against `web-design`'s anti-patterns if installed. The usual repairs: delete the eyebrow labels and explainer subtitles; replace gradient text with solid ink; remove glass, glows and sparkles; flatten nested cards; give CTAs real verbs; remove emoji from interface copy. Re-shoot and look after removing structure: a deleted container can take a needed grouping with it.
+Run the scan on components and check the rendered page against `web-design`'s anti-patterns if installed. The usual repairs: delete the eyebrow labels and explainer subtitles; replace gradient text with solid ink; remove glass, glows and sparkles; flatten nested cards; give CTAs real verbs; remove emoji from interface copy.
+
+This season's tells, each fine when the brief asks and slop when it shows up anyway: a pill tag above the heading (`New`), one italic word in the headline, a divider under every section, four opacities of the same neutral instead of two inks, a border on every box, a diagram that draws the whole system, a decorative `Home / Settings / Billing`, and `01` `02` `03` on items that are not a sequence. The scan flags the numbered markers (`section-index`) and the opacity ladder (`opacity-ramp`). The rest need the render. Instrument Serif with tight tracking is the current reflex display; it stays only when DESIGN.md names it.
+
+Re-shoot and look after removing structure: a deleted container can take a needed grouping with it.
 
 ## 4. Fix code
 

package/skills/deslop/agents/openai.yaml

@@ -1,3 +1,3 @@
-interface: 
+interface:
   display_name: Deslop
   short_description: "Strip AI tells from copy, UI and code"

package/skills/deslop/scripts/slop-scan.mjs

@@ -65,6 +65,7 @@ const RULES = [
   ["caps-eyebrow", "ui", "info", /\buppercase\b[^"'`]*\btracking-(?:widest|\[0\.[1-9]\d*em\])|\btracking-(?:widest|\[0\.[1-9]\d*em\])[^"'`]*\buppercase\b|text-transform:\s*uppercase;\s*letter-spacing:\s*0?\.[12]\d*em/g, "Tracked-out all-caps label; the eyebrow above every heading."],
   ["generic-cta", "ui", "info", />\s*(?:Get Started|Learn More|Start (?:your )?(?:free )?trial|Join the waitlist|Explore (?:now|features))\s*</g, "Generic CTA label; name what happens next ('Create a listing', 'See rates')."],
   ["emoji-in-ui", "ui", "medium", />[^<{]*?(?:🚀|✨|🔥|💡|⚡|🎉|👋|💪|🙌|📈|🎯)[^<]*?</gu, "Emoji in interface copy; usually stands in for an icon system or a point of view."],
+  ["section-index", "ui", "info", />\s*0[1-9]\s*(?:<\/|—|–|-|\/)/g, "Numbered marker (01, 02) on content that is not a sequence. Delete it, or keep it only where order is the point."],
   // Motion and mobile details that make an interface feel slightly off.
   ["transition-all", "ui", "medium", /\btransition-all\b|transition:\s*all\b/g, "Transitions every property, including layout ones nobody meant to animate. Name them: transform, opacity."],
   ["ease-in-ui", "ui", "info", /\bease-in\b(?!-out)|(?:transition|animation)(?:-timing-function)?:[^;]*\bease-in\b(?!-out)/g, "ease-in starts slowly, exactly when the user is watching; UI enters and exits on ease-out."],
@@ -161,6 +162,9 @@ function scanFile(file, o) {
     const acid = hexes.some(([r, g, b]) => (g >= 0xd0 && r >= 0x80 && r <= 0xe0 && b <= 0x60) || (r >= 0xe0 && g <= 0x60 && b <= 0x40)) || /\b(?:text|bg|border)-lime-\d{3}\b/.test(src);
     if (cream && serif) density.push({ rule: "warm-editorial", severity: "medium", detail: `cream background with a serif display${clay ? " and a clay/terracotta accent" : ""}`, why: "Today's most common generated look; fine if the brief asked for it, slop if it arrived by default." });
     if (nearBlack && acid) density.push({ rule: "dark-acid", severity: "info", detail: "near-black background with an acid/vermilion accent", why: "A current generated-design default; check it was a choice." });
+    const opacities = [...src.matchAll(/\b(?:text|bg)-(?:black|white|neutral|zinc|gray|slate|stone)\/(?:[1-9]\d)\b/g)].map(m => m[0].replace(/.*\//, ""));
+    const distinct = [...new Set(opacities)];
+    if (distinct.length >= 4) density.push({ rule: "opacity-ramp", severity: "info", detail: `${distinct.length} opacities of one neutral (${distinct.sort().join(", ")})`, why: "A ladder of opacities standing in for a type scale. Two inks, primary and secondary, are enough unless the brand defines more." });
   }
   const boldLeads = hits.filter(h => h.rule === "bold-lead-list").length;
   if (boldLeads > DENSITY["bold-lead-list"]) density.push({ rule: "bold-lead-density", severity: "medium", detail: `${boldLeads} bold-lead bullets`, why: "Every list as '**Label:** text' reads as generated; use prose or a table where it fits." });

package/skills/discoverability/SKILL.md

@@ -1,6 +1,6 @@
 ---
 name: discoverability
-description: Find out why the right people do not find or choose a product through Google, Bing and AI answer engines (ChatGPT, Claude, Perplexity, AI Overviews), fix the cause, and measure the result. Use for SEO audits, "why aren't we ranking", "does ChatGPT recommend us", GEO/AEO, indexing problems, canonical/robots/sitemap issues, comparison and alternatives pages, or before and after a content push.
+description: "Diagnose and fix why Google, Bing or AI answers miss or misdescribe a product. Use for SEO/GEO/AEO, ranking or indexing problems, canonical/robots/sitemap checks and search-focused content."
 ---
 
 # Discoverability

package/skills/discoverability/agents/openai.yaml

@@ -1,3 +1,3 @@
-interface: 
+interface:
   display_name: Discoverability
   short_description: Fix why search and AI answers miss the product

package/skills/dogfood/SKILL.md

@@ -1,12 +1,14 @@
 ---
 name: dogfood
-description: Use the product like a real user, signed in, with real data, through to the result they came for, then fix what breaks and repeat until the journeys pass. Use for "test this end to end", "QA the app", "use it like a customer", "find what's broken", pre-launch checks, after a big change, or for AI features whose answers need repeated real trials. Fixes as it goes when fixes are authorised.
+description: "Walk real product journeys, fix authorized problems and replay through the outcome. Use for end-to-end QA, signed-in mobile checks, pre-launch testing and repeated trials of AI features. Review-only requests produce findings."
 ---
 
 # Dogfood
 
 Tests check what the author thought of. Dogfooding finds what a user hits. The output is fixed journeys, not a list of complaints.
 
+`<skill-dir>` below means this skill's own folder. Run its scripts from the project root so output lands in the project, not in the installed skill.
+
 ## 0. Pick the mode
 
 - **Diff-aware** (default on a branch): start from what the branch changed (`git diff origin/main...HEAD --stat`), map each change to the screens and journeys it touches, and test those first.
@@ -28,6 +30,7 @@ Use the browser session and account the user selected; never sign in as someone
 - Real clicks and typing in a real browser, at real speed. No mocked responses, no seeding past the hard part.
 - Follow through to the outcome: the record exists, the email arrived, the export opens and contains the right rows, the public page shows the change.
 - Look at each screen. Capture the important ones at phone and desktop width with [`scripts/shoot.mjs`](scripts/shoot.mjs) when the URL is reachable without your session; use the browser tool's screenshots for signed-in states.
+- When the journey waits on data, capture the waiting page and the settled page and compare them: `node <skill-dir>/scripts/shoot.mjs <waiting> --shift <settled> --widths 390 --themes light`. Exit 1 is a finding (a marked region or the document moved). Exit 2 means the regions were not marked, so the jump was not measured. Read the phone lines on that capture too: input size, zoom lock, ungated hover, selectable controls, tap highlight. A 390px picture can look aligned and still jump, zoom and stick. The lines that need a physical phone (a hover that stays after a tap, the notch, the keyboard) stay named as unverified.
 - Keep the console and network panel open. A 500 behind a friendly toast is a finding.
 - Note friction as well as failure: a step that needs thinking, a label that misleads, a wait with no feedback.
 

package/skills/dogfood/agents/openai.yaml

@@ -1,3 +1,3 @@
-interface: 
+interface:
   display_name: Dogfood
   short_description: "Use the product for real, fix what breaks"