diff --git a/.agents/skills/impeccable/reference/live.md b/.agents/skills/impeccable/reference/live.md
index 258a93940..249eae44b 100644
--- a/.agents/skills/impeccable/reference/live.md
+++ b/.agents/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .agents/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .agents/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.agents/skills/impeccable/scripts/live-wrap.mjs b/.agents/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.agents/skills/impeccable/scripts/live-wrap.mjs
+++ b/.agents/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.claude/skills/impeccable/reference/live.md b/.claude/skills/impeccable/reference/live.md
index 1eb67d890..76c58fb1f 100644
--- a/.claude/skills/impeccable/reference/live.md
+++ b/.claude/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .claude/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .claude/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.claude/skills/impeccable/scripts/live-wrap.mjs b/.claude/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.claude/skills/impeccable/scripts/live-wrap.mjs
+++ b/.claude/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.cursor/skills/impeccable/reference/live.md b/.cursor/skills/impeccable/reference/live.md
index e2cff7fc2..67f955536 100644
--- a/.cursor/skills/impeccable/reference/live.md
+++ b/.cursor/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .cursor/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .cursor/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.cursor/skills/impeccable/scripts/live-wrap.mjs b/.cursor/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.cursor/skills/impeccable/scripts/live-wrap.mjs
+++ b/.cursor/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.gemini/skills/impeccable/reference/live.md b/.gemini/skills/impeccable/reference/live.md
index c4f891bf2..a236af927 100644
--- a/.gemini/skills/impeccable/reference/live.md
+++ b/.gemini/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .gemini/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .gemini/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.gemini/skills/impeccable/scripts/live-wrap.mjs b/.gemini/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.gemini/skills/impeccable/scripts/live-wrap.mjs
+++ b/.gemini/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.github/skills/impeccable/reference/live.md b/.github/skills/impeccable/reference/live.md
index 51b8b14a6..87e7a9e38 100644
--- a/.github/skills/impeccable/reference/live.md
+++ b/.github/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .github/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .github/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.github/skills/impeccable/scripts/live-wrap.mjs b/.github/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.github/skills/impeccable/scripts/live-wrap.mjs
+++ b/.github/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.kiro/skills/impeccable/reference/live.md b/.kiro/skills/impeccable/reference/live.md
index 6f754b218..773fa63ac 100644
--- a/.kiro/skills/impeccable/reference/live.md
+++ b/.kiro/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .kiro/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --file
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .kiro/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.kiro/skills/impeccable/scripts/live-wrap.mjs b/.kiro/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.kiro/skills/impeccable/scripts/live-wrap.mjs
+++ b/.kiro/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.opencode/skills/impeccable/reference/live.md b/.opencode/skills/impeccable/reference/live.md
index 8f92e62d0..dc840872c 100644
--- a/.opencode/skills/impeccable/reference/live.md
+++ b/.opencode/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .opencode/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --f
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .opencode/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.opencode/skills/impeccable/scripts/live-wrap.mjs b/.opencode/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.opencode/skills/impeccable/scripts/live-wrap.mjs
+++ b/.opencode/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.pi/skills/impeccable/reference/live.md b/.pi/skills/impeccable/reference/live.md
index e465282d7..a88eaa578 100644
--- a/.pi/skills/impeccable/reference/live.md
+++ b/.pi/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .pi/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --file RE
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .pi/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.pi/skills/impeccable/scripts/live-wrap.mjs b/.pi/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.pi/skills/impeccable/scripts/live-wrap.mjs
+++ b/.pi/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.rovodev/skills/impeccable/reference/live.md b/.rovodev/skills/impeccable/reference/live.md
index 3d856f0ed..8612f8bf7 100644
--- a/.rovodev/skills/impeccable/reference/live.md
+++ b/.rovodev/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .rovodev/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fi
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .rovodev/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.rovodev/skills/impeccable/scripts/live-wrap.mjs b/.rovodev/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.rovodev/skills/impeccable/scripts/live-wrap.mjs
+++ b/.rovodev/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.trae-cn/skills/impeccable/reference/live.md b/.trae-cn/skills/impeccable/reference/live.md
index 4f1ab7d63..d1f6c05d8 100644
--- a/.trae-cn/skills/impeccable/reference/live.md
+++ b/.trae-cn/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .trae-cn/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fi
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .trae-cn/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.trae-cn/skills/impeccable/scripts/live-wrap.mjs b/.trae-cn/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.trae-cn/skills/impeccable/scripts/live-wrap.mjs
+++ b/.trae-cn/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/.trae/skills/impeccable/reference/live.md b/.trae/skills/impeccable/reference/live.md
index 02be74a61..c1b4d88eb 100644
--- a/.trae/skills/impeccable/reference/live.md
+++ b/.trae/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .trae/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --file
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .trae/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/.trae/skills/impeccable/scripts/live-wrap.mjs b/.trae/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/.trae/skills/impeccable/scripts/live-wrap.mjs
+++ b/.trae/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/plugin/skills/impeccable/reference/live.md b/plugin/skills/impeccable/reference/live.md
index 1eb67d890..76c58fb1f 100644
--- a/plugin/skills/impeccable/reference/live.md
+++ b/plugin/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node .claude/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID done --fil
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node .claude/skills/impeccable/scripts/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/plugin/skills/impeccable/scripts/live-wrap.mjs b/plugin/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/plugin/skills/impeccable/scripts/live-wrap.mjs
+++ b/plugin/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/source/skills/impeccable/reference/live.md b/source/skills/impeccable/reference/live.md
index 11ff57119..d30352439 100644
--- a/source/skills/impeccable/reference/live.md
+++ b/source/skills/impeccable/reference/live.md
@@ -184,6 +184,8 @@ The first variant has no `display: none` (visible by default). All others do. If
 
 One edit, all variants — the browser's MutationObserver picks everything up in one pass.
 
+**Author every `:scope` rule with a descendant combinator.** The `@scope` boundary is the **variant wrapper `<div data-impeccable-variant="N">`**, not the element you're designing. A bare `:scope { background: cream; }` styles the wrapper, not the inner replacement, so the cream lands on a `display: contents` shell while the actual element keeps page defaults. Always step in: `:scope > .card`, `:scope > section`, `:scope .hero-title`, etc. The fake test agent's CSS in `tests/live-e2e/agent.mjs` is a faithful template — every rule starts `:scope > ...`.
+
 **JSX / TSX target files.** Wrap `<style>` content in a template literal so the CSS `{` / `}` aren't parsed as JSX expressions, and use `className=` / `style={{…}}` on every variant element. Keep `data-impeccable-*` attributes as-is — they're plain strings:
 
 ```tsx
@@ -266,6 +268,16 @@ node {{scripts_path}}/live-poll.mjs --reply EVENT_ID done --file RELATIVE_PATH
 
 Then run `live-poll.mjs` again immediately.
 
+### Aborting an in-flight session
+
+If wrap or generation fails after the browser has flipped to GENERATING (e.g. wrap landed on the wrong source branch and you've already reverted it, or generation hit an unrecoverable error), tell the **browser** so its bar resets to PICKING:
+
+```bash
+node {{scripts_path}}/live-poll.mjs --reply EVENT_ID error "Short reason"
+```
+
+Don't run `live-accept --discard` for this — that's a pure file mutator, the browser doesn't see it, and the bar gets stuck on the GENERATING dots forever (the user has to refresh). `--discard` is only correct when the **browser** initiated the discard (user clicked ✕ during CYCLING) and the agent is just running source-side cleanup the browser already triggered.
+
 ## Handle fallback
 
 When wrap returns `fallback: "agent-driven"`, the deterministic flow doesn't apply. Pick up here.
diff --git a/source/skills/impeccable/scripts/live-wrap.mjs b/source/skills/impeccable/scripts/live-wrap.mjs
index 0c8be7fdf..62acf4bf1 100644
--- a/source/skills/impeccable/scripts/live-wrap.mjs
+++ b/source/skills/impeccable/scripts/live-wrap.mjs
@@ -438,28 +438,35 @@ function findAllElements(lines, query, tag = null) {
 }
 
 /**
- * Narrow a candidate set to those whose source body literally contains a
- * meaningful prefix of the picked element's textContent. The compare ignores
- * tags, JSX expressions (`{title}`), and whitespace so a match survives JSX
- * formatting variation. A snippet shorter than 6 chars after stripping is
- * treated as too weak to disambiguate — the caller should fall back.
+ * Narrow a candidate set to those whose source body matches a meaningful
+ * prefix of the picked element's textContent. The compare strips tags and
+ * JSX expressions, then checks two whitespace normalizations side-by-side:
+ *
+ *   - single-space ("hero two second card body")
+ *   - no-whitespace ("herotwosecondcardbody")
+ *
+ * Both are needed because `el.textContent` concatenates sibling text without
+ * inserting whitespace (e.g. `<h1>Hero Two</h1><p>Second…</p>` reads as
+ * `"Hero TwoSecond…"`), while the source has whitespace between tags. If
+ * EITHER normalization matches, the candidate keeps. A snippet shorter than
+ * 8 chars after stripping is too weak to disambiguate — the caller falls
+ * back to first-match.
  */
 function filterByText(candidates, lines, text) {
-  const target = text
-    .replace(/\s+/g, ' ')
-    .trim()
-    .toLowerCase()
-    .slice(0, 80);
-  if (target.length < 6) return candidates.slice();
+  const trimmed = text.replace(/\s+/g, ' ').trim().toLowerCase().slice(0, 80);
+  if (trimmed.length < 8) return candidates.slice();
+  const targetSpaced = trimmed;
+  const targetCompact = trimmed.replace(/\s+/g, '');
+
   return candidates.filter((c) => {
     const body = lines.slice(c.startLine, c.endLine + 1).join(' ');
-    const norm = body
+    const inner = body
       .replace(/<[^>]*>/g, ' ')   // strip HTML/JSX tags
       .replace(/\{[^}]*\}/g, ' ')  // strip JSX expressions
-      .replace(/\s+/g, ' ')
-      .trim()
       .toLowerCase();
-    return norm.includes(target);
+    const sourceSpaced = inner.replace(/\s+/g, ' ').trim();
+    const sourceCompact = inner.replace(/\s+/g, '');
+    return sourceSpaced.includes(targetSpaced) || sourceCompact.includes(targetCompact);
   });
 }
 
diff --git a/tests/live-wrap.test.mjs b/tests/live-wrap.test.mjs
index ba5a0240c..11432fc43 100644
--- a/tests/live-wrap.test.mjs
+++ b/tests/live-wrap.test.mjs
@@ -534,6 +534,49 @@ describe('live-wrap — JSX / TSX correctness', () => {
     assert.ok(!inside.includes('Gamma card'), 'did not wrap Gamma');
   });
 
+  it('disambiguates when the picked element has multiple text-node children (textContent has no inter-element whitespace)', () => {
+    // Real-world regression caught while driving a live loop in the browser.
+    // textContent concatenates child text without inserting whitespace, so
+    // an <aside><h1>Hero Two</h1><p>Second card body copy.</p></aside> reads
+    // as "Hero TwoSecond card body copy." — but the source has whitespace
+    // between </h1> and <p>. A single-space normalization on both sides
+    // misses the join boundary; a no-whitespace normalization catches it.
+    const tsx = `export default function Page() {
+  return (
+    <main>
+      <aside className="card">
+        <h1 className="hero-title">Hero One</h1>
+        <p className="hero-hook">First card body copy.</p>
+      </aside>
+      <aside className="card">
+        <h1 className="hero-title">Hero Two</h1>
+        <p className="hero-hook">Second card body copy.</p>
+      </aside>
+      <aside className="card">
+        <h1 className="hero-title">Hero Three</h1>
+        <p className="hero-hook">Third card body copy.</p>
+      </aside>
+    </main>
+  );
+}`;
+    writeFileSync(join(tmp, 'Page.tsx'), tsx);
+
+    // Note: --text is the textContent the BROWSER produced — no space between
+    // "Two" and "Second" because textContent has no inter-element whitespace.
+    execSync(
+      `node source/skills/impeccable/scripts/live-wrap.mjs --id concat1 --count 3 --classes "card" --tag "aside" --text "Hero TwoSecond card body copy." --file "${join(tmp, 'Page.tsx')}"`,
+      { cwd: process.cwd(), encoding: 'utf-8' }
+    );
+
+    const modified = readFileSync(join(tmp, 'Page.tsx'), 'utf-8');
+    const originalMatch = modified.match(/data-impeccable-variant="original"[\s\S]*?<\/div>/);
+    assert.ok(originalMatch, 'original wrapper present');
+    const inside = originalMatch[0];
+    assert.ok(inside.includes('Hero Two'), 'wrapped Hero Two (the picked card)');
+    assert.ok(!inside.includes('Hero One'), 'did not wrap Hero One');
+    assert.ok(!inside.includes('Hero Three'), 'did not wrap Hero Three');
+  });
+
   it('falls back to first-match when --text is not literally present in source (e.g. {title})', () => {
     // textContent the browser sends is the rendered text, but the source uses
     // a JSX expression. No candidate's source body contains the literal