diff --git a/apps/application/AGENTS.md b/apps/application/AGENTS.md
index 3c1225b2..172187ab 100644
--- a/apps/application/AGENTS.md
+++ b/apps/application/AGENTS.md
@@ -100,7 +100,7 @@ those fields — intentional).
 `app/components/shared/` holds the building blocks — **prefer them over re-implementing**. `SectionCard` /
 `CollapsibleSectionCard` (headers + folding), `EmptyState` / `LoadingState` / `ErrorState`, `StatTile` + `StatTileGrid`
 (never hand-rolled tile markup), `FilterToolbar`, `TableScroller`, `NavbarActions`, `BreadcrumbNav`, `ChartCard`,
-`DurationValue`, `DiffPatch` / `DiffFile`, `HelpHint`, `DocLink`, `EnvManagedBadge` / `EnvManagedAlert`,
+`DurationValue`, `ErrorText` (never print a raw error string — it carries ANSI codes), `DiffPatch` / `DiffFile`, `HelpHint`, `DocLink`, `EnvManagedBadge` / `EnvManagedAlert`,
 `SettingsField`, `OpenInIdeLink`. See [`ARCHITECTURE.md`](ARCHITECTURE.md) for what each one does.
 
 ### Responsive / mobile (MUST follow)
diff --git a/apps/application/ARCHITECTURE.md b/apps/application/ARCHITECTURE.md
index 648fa2c6..bc78abea 100644
--- a/apps/application/ARCHITECTURE.md
+++ b/apps/application/ARCHITECTURE.md
@@ -167,9 +167,12 @@ Shared building blocks worth knowing before writing new markup (`AGENTS.md` make
   y-axis) / `ChartTooltip` / `ChartMarkerLines` / `ChartLegend` / `ChartMarkerTooltip`, `MiniRunBars`,
   `DurationValue` (tight `210ms` via
   the pure `splitDuration`), `CodeBlock`, `MarkdownPreview`, `DiffPatch` / `DiffFile`, `LocatorCode` (a locator
-  expression syntax-highlighted through `@piwitests/picker-dom`'s `tokenizeLocator`).
+  expression syntax-highlighted through `@piwitests/picker-dom`'s `tokenizeLocator`), `ErrorText` (error text with
+  its ANSI colors rendered — a one-line `line` preview for lists and cells, or the full `block`).
 - **Navigation & actions** — `NavbarActions` (every `UDashboardNavbar` `#right` group; labels collapse to icons below
-  `sm`), `BreadcrumbNav` (drop-in for `UBreadcrumb`, collapses ancestors below `sm`), `OpenInIdeLink` +
+  `xl`), `BreadcrumbNav` (drop-in for `UBreadcrumb` and the page title of every detail page — the navbar never
+  repeats it; only the current crumb truncates, middle levels hide below `2xl`, ancestors collapse into a dropdown
+  below `sm`), `OpenInIdeLink` +
   `OpenInIdeSettingsModal`, `DocLink`, `LinkChip` / `EntityLinks`.
 - **Help & settings** — `HelpHint` (topic keys from `app/utils/help-content.ts`), `SettingsField`, `EnvManagedBadge`,
   `EnvManagedAlert`.
@@ -184,7 +187,8 @@ Shared building blocks worth knowing before writing new markup (`AGENTS.md` make
 (`useRunStream`, `useNotificationStream`), diagnosis (`useClusterDiagnosis`, `useStreamingDiagnosis`,
 `useDiagnosisNotification`), timeline (`useTimelineModel`, `useTimelineViewport`), fold/tree state
 (`useFoldedState`, `useFoldableSummary`, `useTreeViewCookie`), settings derivation (`useSettingsNav`,
-`useSettingsEnvState`), analytics scope, IDE preferences (`useOpenInIde`), desktop detection (`useIsDesktop`,
+`useSettingsEnvState`), analytics scope, the run page's retry command (`useRunRetryCommand` — one failing set and one
+shared mode for every copy button on the page), IDE preferences (`useOpenInIde`), desktop detection (`useIsDesktop`,
 `useTauri`), demo helpers, and small utilities (`useCopy` / `useCopyRich` — use these instead of hand-rolling
 `navigator.clipboard`, `useAiStatus`, `useChartTooltip`).
 
diff --git a/apps/application/app/components/cluster/ClusterTestEvidence.vue b/apps/application/app/components/cluster/ClusterTestEvidence.vue
index 56bc6c72..4c35162a 100644
--- a/apps/application/app/components/cluster/ClusterTestEvidence.vue
+++ b/apps/application/app/components/cluster/ClusterTestEvidence.vue
@@ -243,9 +243,7 @@ const evidenceChips = computed(() => {
         <div class="divide-y divide-default">
           <div v-for="(step, idx) in failingSteps" :key="idx" class="px-3 py-2 space-y-0.5">
             <p class="text-xs font-medium text-gray-700 dark:text-gray-300">{{ idx + 1 }}. {{ step.title }}</p>
-            <p v-if="step.error?.message" class="text-xs font-mono text-red-500 whitespace-pre-wrap break-all">
-              {{ step.error.message }}
-            </p>
+            <ErrorText v-if="step.error?.message" mode="block" :text="step.error.message" />
           </div>
         </div>
       </TestEvidenceSection>
diff --git a/apps/application/app/components/run/FailureGroups.vue b/apps/application/app/components/run/FailureGroups.vue
index 03948a13..40c77f8a 100644
--- a/apps/application/app/components/run/FailureGroups.vue
+++ b/apps/application/app/components/run/FailureGroups.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { TableColumn } from '@nuxt/ui';
-import type { FailureGroup } from '~~/types/api';
-import { buildRetryCommand } from '~/utils/retry-command';
+import type { FailureGroup, TestCaseResult } from '~~/types/api';
 
 const emit = defineEmits<{
   selectCluster: [clusterId: number];
@@ -10,6 +9,8 @@ const emit = defineEmits<{
 const props = defineProps<{
   /** Increments when the run finishes so this tab can refetch. */
   refreshKey?: number;
+  /** The run's execution rows — the retry command is built from these, same as the summary's. */
+  testCases: TestCaseResult[];
 }>();
 
 const route = useRoute();
@@ -34,28 +35,12 @@ watch(
 );
 
 const diagnosisClusterId = ref<number | null>(null);
-const { copy, copied } = useCopy();
-
-const allFailedCases = computed(() => {
-  if (!groups.value) return [];
-  return groups.value.flatMap((g) =>
-    g.cases
-      .filter((c) => !c.passedOnRetry)
-      .map((c) => ({
-        filePath: c.filePath,
-        title: c.title,
-        line: null,
-        projectName: null,
-      })),
-  );
-});
-
-const retryCommand = computed(() => buildRetryCommand(allFailedCases.value));
-
-function copyRetryCommand() {
-  const cmd = retryCommand.value;
-  if (cmd) copy(cmd, { toast: 'Retry command copied' });
-}
+const {
+  failedCases,
+  copyCommand: copyRetryCommand,
+  copied,
+  title: retryTitle,
+} = useRunRetryCommand(() => props.testCases);
 
 const columns: TableColumn<FailureGroup>[] = [
   { accessorKey: 'signature', header: createSortHeader<FailureGroup>('Signature') },
@@ -86,12 +71,12 @@ const totalCases = computed(() => groups.value?.reduce((sum, g) => sum + g.caseC
           <HelpHint topic="cluster.concept" />
         </p>
         <UButton
-          v-if="allFailedCases.length > 0"
+          v-if="failedCases.length > 0"
           size="xs"
           variant="outline"
           color="neutral"
           :icon="copied ? 'i-lucide-check' : 'i-lucide-play'"
-          :title="copied ? 'Copied!' : copyPreview(retryCommand)"
+          :title="retryTitle"
           @click="copyRetryCommand()"
         >
           Copy retry command
diff --git a/apps/application/app/components/run/RunSummary.vue b/apps/application/app/components/run/RunSummary.vue
index a0e48ff9..b1d163d5 100644
--- a/apps/application/app/components/run/RunSummary.vue
+++ b/apps/application/app/components/run/RunSummary.vue
@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import type { TestRunDetails, ReportInfo } from '~~/types/api';
 import type { RetryMode } from '~/utils/retry-command';
-import { buildRetryCommand } from '~/utils/retry-command';
 
 const props = defineProps<{
   testRun: TestRunDetails;
@@ -38,8 +37,13 @@ const showStorage = computed(() => !!(storageStats.value?.totalFiles || props.fi
 const primaryReport = computed(() => props.allReports[0] ?? null);
 
 const { copy, copied } = useCopy();
-const retryMode = ref<RetryMode>('file-line');
-const retryCopied = ref(false);
+const {
+  mode: retryMode,
+  failedCases,
+  copyCommand: copyRetryCommand,
+  copied: retryCopied,
+  title: retryTitle,
+} = useRunRetryCommand(() => props.testRun?.testCases);
 
 // Inside the desktop shell the run-locally split button covers copying the
 // command ("Copy as command"), so the copy-only Retry button stays web-only.
@@ -48,37 +52,6 @@ onMounted(() => {
   desktopBridge.value = !!tauriCore();
 });
 
-const failedCases = computed(() => {
-  if (!props.testRun?.testCases) return [];
-  return props.testRun.testCases
-    .filter((tc) => tc.status === 'failed' || tc.status === 'timedout')
-    .map((tc) => ({
-      filePath: (tc.filePath || tc.location?.split(':')[0]) ?? '',
-      title: tc.title,
-      line: tc.location ? parseInt(tc.location.split(':')[1] ?? '', 10) || null : null,
-      projectName: (tc.browser as { projectName?: string } | null)?.projectName || null,
-    }));
-});
-
-function buildRetry() {
-  return buildRetryCommand(failedCases.value, { mode: retryMode.value });
-}
-
-async function copyRetryCommand() {
-  const cmd = buildRetry();
-  if (!cmd) return;
-  retryCopied.value = true;
-  await copy(cmd, { toast: 'Retry command copied' });
-  setTimeout(() => {
-    retryCopied.value = false;
-  }, 2000);
-}
-
-const retryTitle = computed(() => {
-  if (retryCopied.value) return 'Copied!';
-  return copyPreview(buildRetry());
-});
-
 function buildRunSummary() {
   const run = props.testRun;
   if (!run) return '';
diff --git a/apps/application/app/components/run/TestCasesList.vue b/apps/application/app/components/run/TestCasesList.vue
index b96218d7..6a40d389 100644
--- a/apps/application/app/components/run/TestCasesList.vue
+++ b/apps/application/app/components/run/TestCasesList.vue
@@ -435,6 +435,7 @@ defineExpose({ scrollToCase });
       :live-steps="liveSteps"
       :project-key="projectKey"
       :project-name="projectName"
+      :cluster-names="clusterNames"
       class="flex-1 min-h-0"
     />
 
@@ -565,13 +566,7 @@ defineExpose({ scrollToCase });
                       <BrowserBadge :browser="item.browser" size="sm" class="mt-0.5" />
                     </div>
 
-                    <p
-                      v-if="isFailedStatus(item.status) && item.error"
-                      class="pl-6 text-xs text-rose-600 dark:text-rose-400 truncate"
-                      :title="item.error"
-                    >
-                      {{ item.error }}
-                    </p>
+                    <ErrorText v-if="isFailedStatus(item.status) && item.error" :text="item.error" class="pl-6" />
 
                     <OpenInIdeLink
                       v-if="item.location"
@@ -665,13 +660,7 @@ defineExpose({ scrollToCase });
                           </UBadge>
                         </NuxtLink>
                       </div>
-                      <p
-                        v-if="isFailedStatus(item.status) && item.error"
-                        class="text-xs text-rose-600 dark:text-rose-400 truncate"
-                        :title="item.error"
-                      >
-                        {{ item.error }}
-                      </p>
+                      <ErrorText v-if="isFailedStatus(item.status) && item.error" :text="item.error" />
                       <OpenInIdeLink
                         v-if="item.location"
                         :location="item.location"
diff --git a/apps/application/app/components/run/TestCasesTree.vue b/apps/application/app/components/run/TestCasesTree.vue
index 5d8e6af9..6163f1f3 100644
--- a/apps/application/app/components/run/TestCasesTree.vue
+++ b/apps/application/app/components/run/TestCasesTree.vue
@@ -13,8 +13,16 @@ const props = defineProps<{
   /** Piwi project id + name, threaded so the IDE opener can resolve a workspace root. */
   projectKey?: string | number | null;
   projectName?: string | null;
+  /** Failure-cluster id → display name, for the cluster badges on failing rows. */
+  clusterNames?: Record<number, string> | null;
 }>();
 
+// A failing row always identifies its cluster from `failureClusterId` alone —
+// a name the page has not resolved yet falls back to the id, never to no badge.
+function clusterLabel(id: number): string {
+  return props.clusterNames?.[id] ?? `Cluster #${id}`;
+}
+
 const suiteLookup = computed(() => {
   const map = new Map<string, { mode: string; annotations: Array<{ type: string; description?: string }> }>();
   for (const s of props.suites) {
@@ -326,6 +334,15 @@ const flatRows = computed<FlatRow[]>(() => {
             :max-tags="3"
             class="shrink-0"
           />
+          <NuxtLink
+            v-if="row.test.failureClusterId"
+            :to="`/failure-clusters/${row.test.failureClusterId}`"
+            class="shrink-0"
+          >
+            <UBadge color="info" variant="subtle" size="xs" class="max-w-44">
+              <span class="truncate">{{ clusterLabel(row.test.failureClusterId) }}</span>
+            </UBadge>
+          </NuxtLink>
           <div class="flex items-center gap-1.5 sm:gap-2 shrink-0 ml-auto">
             <template v-if="row.test.status === 'running'">
               <TestRowLiveStep
@@ -358,6 +375,12 @@ const flatRows = computed<FlatRow[]>(() => {
               <DurationValue :ms="row.test.wastedTimeMs" unit-class="opacity-60" no-title />
             </span>
           </div>
+          <!-- The one-line error under a failing row, the same as the flat list shows -->
+          <ErrorText
+            v-if="isFailedStatus(row.test.status) && row.test.error"
+            :text="row.test.error"
+            class="basis-full pl-6"
+          />
         </div>
       </template>
 
diff --git a/apps/application/app/components/shared/BreadcrumbNav.vue b/apps/application/app/components/shared/BreadcrumbNav.vue
index bd928d5f..6975914a 100644
--- a/apps/application/app/components/shared/BreadcrumbNav.vue
+++ b/apps/application/app/components/shared/BreadcrumbNav.vue
@@ -1,10 +1,14 @@
 <script setup lang="ts">
 /**
- * Responsive breadcrumb. From `sm` up it renders the standard `UBreadcrumb`
- * (all levels, any custom item slots forwarded). Below `sm`, where a deep
- * path is unreadable, it collapses the ancestor levels into a dropdown and
- * shows only the current page label — tapping the leading chip reveals the
- * full path. Drop-in replacement for `<UBreadcrumb :items>`.
+ * Responsive breadcrumb — the page title of every detail page, so the navbar
+ * never repeats it. From `sm` up it renders the standard `UBreadcrumb` (any
+ * custom item slots forwarded) and takes the room the navbar actions leave:
+ * ancestors keep their natural width (capped) and the current page label
+ * takes the rest, down to a readable floor. Below `2xl` the root keeps just
+ * its icon and the middle levels beyond the nearest two ancestors are hidden,
+ * so a deep path still reads on a laptop next to the actions. Below `sm` the ancestors collapse into a
+ * dropdown and only the current page label shows — tapping the leading chip
+ * reveals the full path. Drop-in replacement for `<UBreadcrumb :items>`.
  */
 import type { BreadcrumbItem, DropdownMenuItem } from '@nuxt/ui';
 
@@ -23,22 +27,38 @@ const ancestorItems = computed<DropdownMenuItem[]>(() =>
 
 const hasAncestors = computed(() => ancestorItems.value.length > 0);
 
-// The leaf truncates so a long page title never collides with the navbar
-// actions; every level needs `min-w-0` for the truncation to take effect.
-const truncatingItems = computed(() => {
-  const items = props.items.map((item) => ({ ...item }));
-  const last = items[items.length - 1];
-  if (last) last.class = 'truncate';
-  return items;
+// The ancestors are the path and stay readable: natural width, capped so a
+// long project name ellipsizes (an item with a custom slot sizes itself).
+// The current page label is the title and takes the remaining room, down to
+// a floor, truncating from the end. Below `2xl` the root keeps its icon only
+// and the middle levels hide, together with the separator each one owns.
+// Every level needs `min-w-0` for the truncation to take effect.
+const desktopItems = computed(() => {
+  const count = props.items.length;
+  return props.items.map((item, index) => {
+    if (index === count - 1) return { ...item, class: 'truncate', ui: { ...item.ui, item: 'min-w-40' } };
+    const rootIconOnly = index === 0 && item.icon ? 'max-2xl:sr-only' : '';
+    const hidden = index > 0 && index < count - 3 ? 'max-2xl:hidden' : '';
+    return {
+      ...item,
+      class: item.slot ? undefined : 'max-w-48',
+      ui: {
+        ...item.ui,
+        item: ['shrink-0', hidden].join(' ').trim(),
+        separator: hidden,
+        linkLabel: ['truncate', rootIconOnly].join(' ').trim(),
+      },
+    };
+  });
 });
 </script>
 
 <template>
   <!-- Desktop: full breadcrumb, forwarding any custom per-item slots (e.g. #project). -->
   <UBreadcrumb
-    :items="truncatingItems"
-    class="hidden min-w-0 sm:flex"
-    :ui="{ root: 'min-w-0', list: 'min-w-0', item: 'min-w-0', link: 'min-w-0' }"
+    :items="desktopItems"
+    class="hidden min-w-0 flex-1 overflow-hidden sm:flex"
+    :ui="{ root: 'min-w-0', list: 'min-w-0', item: 'min-w-0', link: 'min-w-0', separator: 'shrink-0' }"
   >
     <template v-for="(_, name) in $slots" #[name]="slotData">
       <slot :name="name" v-bind="slotData ?? {}" />
diff --git a/apps/application/app/components/shared/EnvironmentDiffCard.vue b/apps/application/app/components/shared/EnvironmentDiffCard.vue
index c03fd25d..7b67deae 100644
--- a/apps/application/app/components/shared/EnvironmentDiffCard.vue
+++ b/apps/application/app/components/shared/EnvironmentDiffCard.vue
@@ -34,6 +34,12 @@ const {
   lazy: true,
 });
 
+// The card renders only for a usable diff; the page reads `available` to show
+// its jump chip for exactly the same condition.
+const emit = defineEmits<{ available: [value: boolean] }>();
+const available = computed(() => !pending.value && !error.value && diff.value?.status === 'ok');
+watch(available, (value) => emit('available', value), { immediate: true });
+
 const entries = computed<EnvironmentDiffEntry[]>(() => diff.value?.entries ?? []);
 const meaningful = computed(() => entries.value.filter((e) => !e.informational));
 const informational = computed(() => entries.value.filter((e) => e.informational));
@@ -60,7 +66,7 @@ defineExpose({ reveal: () => card.value?.reveal?.() });
 <template>
   <component
     :is="cardComponent"
-    v-if="!pending && !error && diff?.status === 'ok'"
+    v-if="available && diff"
     ref="card"
     v-bind="cardBind"
     icon="i-lucide-git-compare-arrows"
@@ -83,6 +89,13 @@ defineExpose({ reveal: () => card.value?.reveal?.() });
     />
 
     <div v-else class="space-y-2">
+      <!-- Which side is which: the failing run on the left, its last pass on the right -->
+      <div class="flex items-center gap-1.5 text-xs font-medium px-3">
+        <span class="hidden sm:block sm:w-40 shrink-0" aria-hidden="true" />
+        <span class="text-red-700 dark:text-red-400">This run</span>
+        <UIcon name="i-lucide-arrow-left" class="size-3 shrink-0 text-gray-400" />
+        <span class="text-green-700 dark:text-green-400">Last pass, run #{{ diff?.baseline?.runId }}</span>
+      </div>
       <div
         v-for="entry in meaningful"
         :key="entry.key"
diff --git a/apps/application/app/components/shared/ErrorText.vue b/apps/application/app/components/shared/ErrorText.vue
new file mode 100644
index 00000000..ef19a8c3
--- /dev/null
+++ b/apps/application/app/components/shared/ErrorText.vue
@@ -0,0 +1,37 @@
+<script setup lang="ts">
+/**
+ * Error text as Playwright printed it, with its ANSI colors rendered instead
+ * of leaking as `[31m` fragments. The base color is muted — the status icon
+ * next to it already says "failed" — and the ANSI highlights (received in red,
+ * expected in green, dimmed punctuation) carry the emphasis.
+ *
+ * `line` (default) is the one-line preview for lists and table cells: the
+ * whole message collapsed onto one line and truncated, so the locator or the
+ * received value that follows the first line still shows, with the plain full
+ * text as a tooltip. `block` keeps every line for a step's or an error card's
+ * full message.
+ */
+import { renderAnsi } from '~/utils';
+import { stripAnsi } from '~/utils/text-format';
+
+const props = withDefaults(defineProps<{ text: string; mode?: 'line' | 'block' }>(), { mode: 'line' });
+
+const html = computed(() => renderAnsi(props.text));
+const plain = computed(() => stripAnsi(props.text).trim());
+</script>
+
+<template>
+  <!-- eslint-disable vue/no-v-html — renderAnsi escapes the text before wrapping it in styled spans -->
+  <p
+    v-if="mode === 'line'"
+    class="font-mono text-xs text-gray-600 dark:text-gray-400 truncate min-w-0"
+    :title="plain"
+    v-html="html"
+  />
+  <div
+    v-else
+    class="font-mono text-xs text-gray-600 dark:text-gray-400 whitespace-pre-wrap break-words"
+    v-html="html"
+  />
+  <!-- eslint-enable vue/no-v-html -->
+</template>
diff --git a/apps/application/app/components/shared/ExportMenu.vue b/apps/application/app/components/shared/ExportMenu.vue
index 3568a189..4b71793c 100644
--- a/apps/application/app/components/shared/ExportMenu.vue
+++ b/apps/application/app/components/shared/ExportMenu.vue
@@ -67,8 +67,15 @@ function copyReport() {
 
 <template>
   <UPopover v-model:open="open">
-    <UButton icon="i-lucide-share" size="xs" color="neutral" variant="outline" title="Take this investigation away">
-      Export
+    <UButton
+      icon="i-lucide-share"
+      size="xs"
+      color="neutral"
+      variant="outline"
+      title="Take this investigation away"
+      aria-label="Export"
+    >
+      <span class="hidden xl:inline">Export</span>
     </UButton>
 
     <template #content>
diff --git a/apps/application/app/components/shared/LocatorHealingPanel.vue b/apps/application/app/components/shared/LocatorHealingPanel.vue
index 0be4afc3..64490cad 100644
--- a/apps/application/app/components/shared/LocatorHealingPanel.vue
+++ b/apps/application/app/components/shared/LocatorHealingPanel.vue
@@ -5,7 +5,7 @@
  * note. Used on both the cluster detail page and the test-case detail page.
  */
 
-import { recommendLocatorFix } from '#shared/locator-healing';
+import { recommendLocatorFix, locatorExpression } from '#shared/locator-healing';
 import type { RankedLocator, LocatorFixRecommendation, LocatorHealingResult } from '#shared/locator-healing.types';
 import type { AiStepIntent, TraceInfo } from '~~/types/api';
 import SectionCard from './SectionCard.vue';
@@ -142,15 +142,16 @@ const sourceClass = computed(() => {
   }
 });
 
+/** The failing locator as Playwright source, the same form every alternative renders in. */
 const failingLocatorText = computed(() => {
   const f = healing.value?.failingLocator;
-  return f ? `${f.method}(${JSON.stringify(f.args)})` : '';
+  return f ? locatorExpression(f.method, f.args) : '';
 });
 
 /**
- * Quote/whitespace/bracket-insensitive form so the failing locator (JSON-ish
- * rendering) can be compared against an AI-step intent locator (Playwright
- * source style) — both collapse to `getbyrole(textbox,name:email)`.
+ * Quote/whitespace/bracket-insensitive form so the failing locator can be
+ * compared against an AI-step intent locator regardless of quoting or spacing
+ * — both collapse to `getbyrole(textbox,name:email)`.
  */
 function normalizeLocator(text: string): string {
   return text.toLowerCase().replace(/[\s'"`{}[\]]/g, '');
@@ -403,7 +404,7 @@ const visibleAlternatives = computed<RankedLocator[]>(() =>
     <div v-if="healing?.failingLocator" class="bg-elevated rounded p-2 mb-3 border border-red-200 dark:border-red-800">
       <div class="flex items-center gap-2">
         <UIcon name="i-lucide-x-circle" class="size-4 text-red-500 shrink-0" />
-        <code class="text-xs font-mono text-red-600 dark:text-red-400 flex-1 truncate">{{ failingLocatorText }}</code>
+        <LocatorCode :locator="failingLocatorText" truncate class="text-xs flex-1 min-w-0" />
         <UButton
           size="xs"
           variant="ghost"
diff --git a/apps/application/app/components/shared/NavbarActions.vue b/apps/application/app/components/shared/NavbarActions.vue
index f0dfeed8..69fbd8f5 100644
--- a/apps/application/app/components/shared/NavbarActions.vue
+++ b/apps/application/app/components/shared/NavbarActions.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 /**
  * Responsive action row for `UDashboardNavbar` `#right` slots. Renders each
- * action as a `UButton` whose text label collapses below the `sm` breakpoint
+ * action as a `UButton` whose text label collapses below the `xl` breakpoint
  * (icon-only, `aria-label`/`title` preserved), so page actions never crowd
  * the breadcrumb on phones. Extra custom controls can be placed in the
  * `leading` (before) and default (after) slots.
@@ -46,7 +46,7 @@ withDefaults(
       :title="action.title ?? action.label"
       @click="action.onClick?.()"
     >
-      <span class="hidden sm:inline">{{ action.label }}</span>
+      <span class="hidden xl:inline">{{ action.label }}</span>
     </UButton>
     <slot />
   </div>
diff --git a/apps/application/app/components/shared/ShareLinksModal.vue b/apps/application/app/components/shared/ShareLinksModal.vue
index 3926b5ef..938019cd 100644
--- a/apps/application/app/components/shared/ShareLinksModal.vue
+++ b/apps/application/app/components/shared/ShareLinksModal.vue
@@ -113,9 +113,10 @@ function linkState(link: ShareLinkSummary): { label: string; color: 'success' |
     color="neutral"
     variant="outline"
     title="Hand this investigation to someone without an account"
+    aria-label="Share"
     @click="open = true"
   >
-    Share
+    <span class="hidden xl:inline">Share</span>
   </UButton>
 
   <UModal v-model:open="open" title="Share links" description="Read-only links anyone can open — no account needed.">
diff --git a/apps/application/app/components/test-case/DomSnapshotCard.vue b/apps/application/app/components/test-case/DomSnapshotCard.vue
index b7f37004..86ec0015 100644
--- a/apps/application/app/components/test-case/DomSnapshotCard.vue
+++ b/apps/application/app/components/test-case/DomSnapshotCard.vue
@@ -35,6 +35,14 @@ const {
   lazy: true,
 });
 
+// The card renders only for a usable snapshot; the page reads `available` to show
+// its jump chip for exactly the same condition.
+const emit = defineEmits<{ available: [value: boolean] }>();
+const available = computed(
+  () => !pending.value && !error.value && snapshot.value?.status === 'ok' && !!snapshot.value.html,
+);
+watch(available, (value) => emit('available', value), { immediate: true });
+
 // Highlighting hundreds of KB of HTML would freeze the tab — show a capped
 // excerpt inline and offer the full document via copy.
 const DISPLAY_CAP = 20_000;
@@ -58,7 +66,7 @@ defineExpose({ reveal: () => card.value?.reveal?.() });
 <template>
   <component
     :is="cardComponent"
-    v-if="!pending && !error && snapshot?.status === 'ok' && snapshot.html"
+    v-if="available && snapshot?.html"
     ref="card"
     v-bind="cardBind"
     icon="i-lucide-file-code"
diff --git a/apps/application/app/components/test-case/TestCaseAiCard.vue b/apps/application/app/components/test-case/TestCaseAiCard.vue
index 9afbb3f5..5a4b9fdb 100644
--- a/apps/application/app/components/test-case/TestCaseAiCard.vue
+++ b/apps/application/app/components/test-case/TestCaseAiCard.vue
@@ -254,7 +254,7 @@ const showRunning = computed(
             AI diagnosis is not configured <HelpHint topic="cluster.ai-setup" />
           </p>
           <p class="text-xs mt-2 max-w-xs mx-auto">
-            Use <strong>Export → AI context</strong> in the header to grab the full evidence bundle for your own AI
+            Use <strong>Copy prompt</strong> in this card's header to grab the full evidence bundle for your own AI
             tool, or configure a provider.
           </p>
           <UButton to="/settings/ai" size="xs" color="neutral" variant="outline" class="mt-3">
diff --git a/apps/application/app/components/test-case/TestCaseConsoleCard.vue b/apps/application/app/components/test-case/TestCaseConsoleCard.vue
index dbdfd317..3e9d6d2f 100644
--- a/apps/application/app/components/test-case/TestCaseConsoleCard.vue
+++ b/apps/application/app/components/test-case/TestCaseConsoleCard.vue
@@ -1,15 +1,46 @@
 <script setup lang="ts">
-defineProps<{
+/**
+ * Browser console output captured while the test ran. With a `storageKey` the
+ * card folds to its header with a one-line peek (entry count plus the first
+ * entry, ANSI-stripped) and the fold state persists per user; without one it is
+ * a plain always-open card.
+ */
+import { stripAnsi } from '~/utils/text-format';
+import SectionCard from '../shared/SectionCard.vue';
+import CollapsibleSectionCard from '../shared/CollapsibleSectionCard.vue';
+
+const props = defineProps<{
   entries: Array<{
     type: string;
     text: string;
     timestamp?: number;
     location?: string | null;
   }>;
+  /** When set, the card folds to a header with a peek (persisted per user). */
+  storageKey?: string;
+  /** Whether the card starts folded on first visit (no stored cookie). */
+  defaultFolded?: boolean;
 }>();
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const expanded = ref(false);
+const cardComponent = computed(() => (props.storageKey ? CollapsibleSectionCard : SectionCard));
+const cardBind = computed(() =>
+  props.storageKey ? { storageKey: props.storageKey, defaultFolded: props.defaultFolded } : {},
+);
+
+const peek = computed(() => {
+  const n = props.entries.length;
+  const first = props.entries[0];
+  const head = `${n} entr${n === 1 ? 'y' : 'ies'}`;
+  return first ? `${head} · ${first.type}: ${stripAnsi(first.text).trim()}` : head;
+});
+
+// Forward reveal so a jump chip or diagnosis citation can unfold + scroll to this card.
+const card = ref<{ reveal?: () => void; $el?: HTMLElement } | null>(null);
+function reveal() {
+  if (card.value?.reveal) card.value.reveal();
+  else card.value?.$el?.scrollIntoView?.({ behavior: 'smooth', block: 'start' });
+}
+defineExpose({ reveal });
 
 function consoleTypeColor(type: string): 'error' | 'warning' | 'neutral' {
   switch (type) {
@@ -39,13 +70,17 @@ function consoleTypeIcon(type: string): string {
 </script>
 
 <template>
-  <SectionCard
+  <component
+    :is="cardComponent"
     v-if="entries.length > 0"
+    ref="card"
+    v-bind="cardBind"
     icon="i-lucide-terminal"
     title="Console output"
     :count="entries.length"
     help="case.console"
   >
+    <template v-if="storageKey" #folded>{{ peek }}</template>
     <div class="space-y-1 max-h-80 overflow-y-auto">
       <div
         v-for="(entry, index) in entries"
@@ -76,5 +111,5 @@ function consoleTypeIcon(type: string): string {
         </div>
       </div>
     </div>
-  </SectionCard>
+  </component>
 </template>
diff --git a/apps/application/app/components/test-case/TestCaseEvidenceCard.vue b/apps/application/app/components/test-case/TestCaseEvidenceCard.vue
index 7a8181c2..cceac4e9 100644
--- a/apps/application/app/components/test-case/TestCaseEvidenceCard.vue
+++ b/apps/application/app/components/test-case/TestCaseEvidenceCard.vue
@@ -12,6 +12,8 @@ const props = defineProps<{
   attachments: AttachmentInfo[];
   traces: TraceInfo[];
   storageKey: string;
+  /** Whether the card starts folded on first visit (no stored cookie). */
+  defaultFolded?: boolean;
 }>();
 
 const config = useRuntimeConfig();
@@ -60,6 +62,7 @@ defineExpose({ reveal: () => card.value?.reveal?.() });
   <CollapsibleSectionCard
     ref="card"
     :storage-key="storageKey"
+    :default-folded="defaultFolded"
     icon="i-lucide-camera"
     title="Failure evidence"
     :count="totalCount"
diff --git a/apps/application/app/components/test-case/TestCaseNetworkRequests.vue b/apps/application/app/components/test-case/TestCaseNetworkRequests.vue
index cf1a67ef..b8f8c859 100644
--- a/apps/application/app/components/test-case/TestCaseNetworkRequests.vue
+++ b/apps/application/app/components/test-case/TestCaseNetworkRequests.vue
@@ -1,5 +1,7 @@
 <script setup lang="ts">
 import type { NetworkRequest, ServerLogEntry, ServerSpanEntry } from '~~/types/api';
+import SectionCard from '../shared/SectionCard.vue';
+import CollapsibleSectionCard from '../shared/CollapsibleSectionCard.vue';
 
 const props = defineProps<{
   requests: NetworkRequest[];
@@ -7,8 +9,17 @@ const props = defineProps<{
   runId?: number | null;
   testRunsCaseId?: number | null;
   hasTrace?: boolean;
+  /** When set, the card folds to a header with a peek (persisted per user). */
+  storageKey?: string;
+  /** Whether the card starts folded on first visit (no stored cookie). */
+  defaultFolded?: boolean;
 }>();
 
+const cardComponent = computed(() => (props.storageKey ? CollapsibleSectionCard : SectionCard));
+const cardBind = computed(() =>
+  props.storageKey ? { storageKey: props.storageKey, defaultFolded: props.defaultFolded } : {},
+);
+
 type Filter = 'all' | 'failed' | 'logs';
 const filter = ref<Filter>('all');
 
@@ -55,7 +66,22 @@ const viewItems = computed(() => [
 function showTraceMode() {
   if (props.hasTrace) manualView.value = 'trace';
 }
-defineExpose({ showTraceMode });
+
+// Forward reveal so a jump chip or diagnosis citation can unfold + scroll to this card.
+const card = ref<{ reveal?: () => void; $el?: HTMLElement } | null>(null);
+function reveal() {
+  if (card.value?.reveal) card.value.reveal();
+  else card.value?.$el?.scrollIntoView?.({ behavior: 'smooth', block: 'start' });
+}
+defineExpose({ showTraceMode, reveal });
+
+/** Folded peek: the captured request count and the first request, or the trace-only hint. */
+const peek = computed(() => {
+  const n = props.requests.length;
+  if (n === 0) return 'Full network activity from the trace';
+  const first = props.requests[0]!;
+  return `${n} request${n === 1 ? '' : 's'} · ${first.method} ${toPath(first.url)} → ${first.status}`;
+});
 
 /** Per-request expansion state (keyed by stable index). */
 const expanded = ref<Set<number>>(new Set());
@@ -246,12 +272,16 @@ function rowAccent(r: DecoratedRequest): string {
 </script>
 
 <template>
-  <SectionCard
+  <component
+    :is="cardComponent"
+    ref="card"
+    v-bind="cardBind"
     icon="i-lucide-network"
     title="Network requests"
     :count="view === 'trace' ? traceCount : totals.total"
     help="case.network"
   >
+    <template v-if="storageKey" #folded>{{ peek }}</template>
     <template #actions>
       <div class="flex flex-wrap items-center gap-x-3 gap-y-1">
         <template v-if="view === 'captured'">
@@ -472,5 +502,5 @@ function rowAccent(r: DecoratedRequest): string {
         <DocLink to="evidence#trace-powered-deep-views" no-icon class="underline">Learn more</DocLink>
       </span>
     </p>
-  </SectionCard>
+  </component>
 </template>
diff --git a/apps/application/app/components/test-case/TestCaseSummary.vue b/apps/application/app/components/test-case/TestCaseSummary.vue
index 786bf4e3..68c71715 100644
--- a/apps/application/app/components/test-case/TestCaseSummary.vue
+++ b/apps/application/app/components/test-case/TestCaseSummary.vue
@@ -1,7 +1,15 @@
 <script setup lang="ts">
 import { isPiwiAnnotation } from '@piwitests/core/test-meta';
-import type { TestCaseResult, EntityLinkInfo, TestRunScmMetadata, TestRunCiMetadata } from '~~/types/api';
+import type {
+  AttemptOutcome,
+  TestCaseResult,
+  EntityLinkInfo,
+  TestRunScmMetadata,
+  TestRunCiMetadata,
+} from '~~/types/api';
 import type { BrowserConfig } from '#shared/types';
+import type { RetryCase } from '~/utils/retry-command';
+import { buildRetryCommand } from '~/utils/retry-command';
 
 interface HistoricalTiming {
   avg: number;
@@ -22,6 +30,10 @@ const props = defineProps<{
   /** Piwi project id/name, threaded into `OpenInIdeLink` for workspace overrides. */
   projectKey?: number | string;
   projectName?: string;
+  /** Display label of the project, for the desktop run-locally button. */
+  projectLabel?: string;
+  /** The execution as a retry target — powers the copy and run-locally controls. */
+  retryCases?: RetryCase[];
 }>();
 
 defineEmits<{
@@ -62,9 +74,20 @@ const annotations = computed(() =>
 
 const startedAtMs = computed<number | null>(() => props.testCase?.startedAt ?? null);
 
+// Inside the desktop shell the run-locally split button covers copying the
+// command ("Copy as command"), so the copy-only button stays web-only.
+const desktopBridge = ref(false);
+onMounted(() => {
+  desktopBridge.value = !!tauriCore();
+});
+
+const retryCommand = computed(() => buildRetryCommand(props.retryCases ?? []));
+const { copy: copyRetry, copied: retryCopied } = useCopy();
+const retryTitle = computed(() => (retryCopied.value ? 'Copied!' : copyPreview(retryCommand.value)));
+
 const showCiGroup = computed(() => !!(props.ciInfo || props.environment));
 
-/** Per-attempt outcomes `{ retry, status, duration, startedAt }`, oldest first. */
+/** Per-attempt outcomes, oldest first. */
 const attempts = computed(() => props.testCase?.attempts ?? null);
 
 function attemptColor(status: string): 'success' | 'error' | 'neutral' {
@@ -73,10 +96,20 @@ function attemptColor(status: string): 'success' | 'error' | 'neutral' {
   return 'neutral';
 }
 
-function attemptTitle(a: { retry: number; status: string; duration: number; startedAt: number | null }): string {
+function attemptTitle(a: AttemptOutcome): string {
   const when = a.startedAt ? ` at ${new Date(a.startedAt).toLocaleString()}` : '';
   return `Attempt ${a.retry + 1}: ${a.status} (${Math.round(a.duration)} ms)${when}`;
 }
+
+// The execution being viewed is the row whose `retries` equals the attempt's
+// retry index; every other attempt links to its own sibling execution row.
+function isCurrentAttempt(a: AttemptOutcome): boolean {
+  return a.retry === (props.testCase?.retries ?? 0);
+}
+
+function attemptLink(a: AttemptOutcome): string | null {
+  return !isCurrentAttempt(a) && a.executionId ? `/test-run-cases/${a.executionId}` : null;
+}
 </script>
 
 <template>
@@ -162,6 +195,26 @@ function attemptTitle(a: { retry: number; status: string; duration: number; star
                 </span>
               </p>
             </div>
+            <!-- Re-run controls sit with the execution they target, as on the run summary -->
+            <div v-if="retryCommand" class="flex items-center gap-1.5 shrink-0">
+              <UButton
+                v-if="!desktopBridge"
+                size="xs"
+                color="warning"
+                variant="subtle"
+                :icon="retryCopied ? 'i-lucide-check' : 'i-lucide-clipboard'"
+                :title="retryTitle"
+                aria-label="Copy retry command"
+                @click="copyRetry(retryCommand, { toast: 'Retry command copied' })"
+              >
+                <span class="hidden @2xl:inline">Copy retry command</span>
+              </UButton>
+              <DesktopRunLocallyButton
+                :project-id="projectKey"
+                :project-label="projectLabel ?? projectName"
+                :cases="retryCases ?? []"
+              />
+            </div>
           </div>
 
           <StatTileGrid>
@@ -175,19 +228,39 @@ function attemptTitle(a: { retry: number; status: string; duration: number; star
             <StatTile label="Attempts" size="sm">
               <span v-if="testCase?.status === 'didnotrun'" class="text-gray-400">—</span>
               <template v-else-if="attempts && attempts.length > 1">
-                <div class="flex items-center gap-1 flex-wrap">
-                  <UBadge
-                    v-for="a in attempts"
-                    :key="a.retry"
-                    :color="attemptColor(a.status)"
-                    variant="soft"
-                    size="sm"
-                    class="font-mono"
-                    :title="attemptTitle(a)"
-                  >
-                    {{ a.retry + 1 }}/{{ attempts.length }}
-                    <UIcon :name="a.status === 'passed' ? 'i-lucide-check' : 'i-lucide-x'" class="w-3 h-3" />
-                  </UBadge>
+                <div
+                  class="flex items-center gap-1 flex-wrap"
+                  role="group"
+                  aria-label="Attempts of this test in this run"
+                >
+                  <template v-for="a in attempts" :key="a.retry">
+                    <!-- A sibling attempt links to its own execution; the viewed one is the ringed, non-link chip -->
+                    <NuxtLink
+                      v-if="attemptLink(a)"
+                      :to="attemptLink(a)!"
+                      :title="`${attemptTitle(a)} — open this attempt`"
+                      :aria-label="`Open attempt ${a.retry + 1} of ${attempts.length}: ${a.status}`"
+                      class="inline-flex rounded-md outline-none focus-visible:outline-2 focus-visible:outline-offset-1 focus-visible:outline-primary hover:opacity-80"
+                    >
+                      <UBadge :color="attemptColor(a.status)" variant="soft" size="sm" class="font-mono">
+                        {{ a.retry + 1 }}/{{ attempts.length }}
+                        <UIcon :name="a.status === 'passed' ? 'i-lucide-check' : 'i-lucide-x'" class="w-3 h-3" />
+                      </UBadge>
+                    </NuxtLink>
+                    <UBadge
+                      v-else
+                      :color="attemptColor(a.status)"
+                      variant="soft"
+                      size="sm"
+                      class="font-mono"
+                      :class="isCurrentAttempt(a) ? 'ring-2 ring-offset-1 ring-primary' : ''"
+                      :title="isCurrentAttempt(a) ? `${attemptTitle(a)} — this execution` : attemptTitle(a)"
+                      :aria-current="isCurrentAttempt(a) ? 'true' : undefined"
+                    >
+                      {{ a.retry + 1 }}/{{ attempts.length }}
+                      <UIcon :name="a.status === 'passed' ? 'i-lucide-check' : 'i-lucide-x'" class="w-3 h-3" />
+                    </UBadge>
+                  </template>
                 </div>
               </template>
               <!-- One attempt, or a row recorded before attempts were stored:
diff --git a/apps/application/app/components/test-case/TestCaseVerdictCard.vue b/apps/application/app/components/test-case/TestCaseVerdictCard.vue
index c62084d4..d3235f6b 100644
--- a/apps/application/app/components/test-case/TestCaseVerdictCard.vue
+++ b/apps/application/app/components/test-case/TestCaseVerdictCard.vue
@@ -95,6 +95,9 @@ const verdict = computed(() => {
   return { streak, lastPass, total: h.length, anchorFailing: isFail(h[anchor]?.status) };
 });
 
+// Names the strip for assistive tech: the visible caption labels the group of links.
+const stripLabelId = useId();
+
 const squareClass = (status: string) => ({
   'bg-red-500 hover:bg-red-600': isFail(status),
   'bg-green-500 hover:bg-green-600': status === 'passed',
@@ -156,8 +159,8 @@ const squareClass = (status: string) => ({
 
         <!-- Clickable recent-status strip -->
         <div v-if="strip.length > 1">
-          <p class="text-xs text-gray-400 mb-1">Recent executions of this test (oldest → newest)</p>
-          <div class="flex items-center gap-1 flex-wrap">
+          <p :id="stripLabelId" class="text-xs text-gray-400 mb-1">Recent executions of this test (oldest → newest)</p>
+          <div class="flex items-center gap-1 flex-wrap" role="group" :aria-labelledby="stripLabelId">
             <UTooltip
               v-for="point in strip"
               :key="point.id"
@@ -167,7 +170,7 @@ const squareClass = (status: string) => ({
                 :to="`/test-run-cases/${point.id}`"
                 :aria-label="`Execution in run #${point.runId}: ${formatStatusLabel(point.status)}`"
                 :aria-current="point.id === currentId ? 'true' : undefined"
-                class="size-3.5 rounded-sm inline-block transition-colors"
+                class="size-3.5 rounded-sm inline-block transition-colors outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary"
                 :class="[squareClass(point.status), point.id === currentId ? 'ring-2 ring-offset-1 ring-primary' : '']"
               />
             </UTooltip>
diff --git a/apps/application/app/components/test-case/TestSourceCard.vue b/apps/application/app/components/test-case/TestSourceCard.vue
index 90e8613d..9b244b8b 100644
--- a/apps/application/app/components/test-case/TestSourceCard.vue
+++ b/apps/application/app/components/test-case/TestSourceCard.vue
@@ -18,6 +18,8 @@ const props = defineProps<{
   projectKey?: string | number | null;
   projectName?: string | null;
   storageKey: string;
+  /** Whether the card starts folded on first visit (no stored cookie). */
+  defaultFolded?: boolean;
 }>();
 
 const { data: stack, pending: stackPending } = useTraceCallStack(
@@ -58,6 +60,7 @@ defineExpose({ reveal: () => card.value?.reveal() });
   <CollapsibleSectionCard
     ref="card"
     :storage-key="storageKey"
+    :default-folded="defaultFolded"
     icon="i-lucide-code"
     :count="count"
     title="Test source"
diff --git a/apps/application/app/components/test-case/VisualDiffCard.vue b/apps/application/app/components/test-case/VisualDiffCard.vue
index 7692842b..79e61176 100644
--- a/apps/application/app/components/test-case/VisualDiffCard.vue
+++ b/apps/application/app/components/test-case/VisualDiffCard.vue
@@ -47,6 +47,12 @@ const {
 
 const diff = computed(() => (result.value?.status === 'ok' ? (result.value.diff ?? null) : null));
 
+// The card renders only for a usable diff; the page reads `available` to show
+// its jump chip for exactly the same condition.
+const emit = defineEmits<{ available: [value: boolean] }>();
+const available = computed(() => !pending.value && !error.value && !!diff.value);
+watch(available, (value) => emit('available', value), { immediate: true });
+
 const view = ref<'overlay' | 'side-by-side'>('overlay');
 const viewItems = [
   { label: 'Overlay', value: 'overlay' as const },
@@ -92,7 +98,7 @@ defineExpose({ reveal: () => card.value?.reveal?.() });
 <template>
   <component
     :is="cardComponent"
-    v-if="!pending && !error && diff"
+    v-if="available && diff"
     ref="card"
     v-bind="cardBind"
     icon="i-lucide-images"
diff --git a/apps/application/app/composables/useRunRetryCommand.ts b/apps/application/app/composables/useRunRetryCommand.ts
new file mode 100644
index 00000000..b761fcc9
--- /dev/null
+++ b/apps/application/app/composables/useRunRetryCommand.ts
@@ -0,0 +1,46 @@
+import type { TestCaseResult } from '~~/types/api';
+import type { RetryCase, RetryMode } from '~/utils/retry-command';
+import { buildRetryCommand } from '~/utils/retry-command';
+
+/**
+ * The run page's retry command, derived once from the run's execution rows so
+ * every "Copy retry command" button on the page copies the same command for the
+ * same failing set. The mode is page-level state shared by all callers.
+ *
+ * The failing set is one row per test and Playwright project: the final
+ * attempt (highest retry index) when its status is failed or timed out, so a
+ * test that passed on retry is never re-run. File, line and project come from
+ * the row itself, which makes the command exact.
+ */
+export function useRunRetryCommand(testCases: MaybeRefOrGetter<TestCaseResult[] | null | undefined>) {
+  const mode = useState<RetryMode>('run-retry-mode', () => 'file-line');
+
+  const failedCases = computed<RetryCase[]>(() => {
+    const finalAttempt = new Map<string, TestCaseResult>();
+    for (const tc of toValue(testCases) ?? []) {
+      const projectName = (tc.browser as { projectName?: string } | null)?.projectName ?? '';
+      const key = `${tc.testCaseId ?? tc.location ?? tc.title}|${projectName}`;
+      const prev = finalAttempt.get(key);
+      if (!prev || (tc.retries ?? 0) > (prev.retries ?? 0)) finalAttempt.set(key, tc);
+    }
+    return [...finalAttempt.values()]
+      .filter((tc) => tc.status === 'failed' || tc.status === 'timedout' || tc.status === 'timedOut')
+      .map((tc) => ({
+        filePath: (tc.filePath || tc.location?.split(':')[0]) ?? '',
+        title: tc.title,
+        line: tc.location ? parseInt(tc.location.split(':')[1] ?? '', 10) || null : null,
+        projectName: (tc.browser as { projectName?: string } | null)?.projectName || null,
+      }));
+  });
+
+  const command = computed(() => buildRetryCommand(failedCases.value, { mode: mode.value }));
+
+  const { copy, copied } = useCopy();
+  function copyCommand() {
+    if (command.value) copy(command.value, { toast: 'Retry command copied' });
+  }
+
+  const title = computed(() => (copied.value ? 'Copied!' : copyPreview(command.value)));
+
+  return { mode, failedCases, command, copyCommand, copied, title };
+}
diff --git a/apps/application/app/pages/failure-clusters/[id].vue b/apps/application/app/pages/failure-clusters/[id].vue
index dd80a0c0..8e0d4f92 100644
--- a/apps/application/app/pages/failure-clusters/[id].vue
+++ b/apps/application/app/pages/failure-clusters/[id].vue
@@ -6,6 +6,8 @@ import { buildRetryCommand } from '~/utils/retry-command';
 
 const route = useRoute();
 const clusterId = parseInt(String(route.params.id));
+// Share links need the server; the public demo has no share-link routes.
+const isDemoMode = Boolean(useRuntimeConfig().public.demoMode);
 
 // Provide shared diagnosis/investigation state (consumed by ClusterInvestigation
 // and ClusterDiagnosis). Must run before the top-level await below so provide()
@@ -194,7 +196,10 @@ const breadcrumbItems = computed(() => [
           <BreadcrumbNav :items="breadcrumbItems" />
         </template>
         <template #right>
-          <ShareLinksModal v-if="cluster" :endpoint="`/api/failure-clusters/${cluster.id}/share-links`" />
+          <ShareLinksModal
+            v-if="cluster && !isDemoMode"
+            :endpoint="`/api/failure-clusters/${cluster.id}/share-links`"
+          />
           <ExportMenu
             v-if="cluster"
             :endpoint="`/api/failure-clusters/${cluster.id}/export`"
@@ -381,7 +386,11 @@ const breadcrumbItems = computed(() => [
         </div>
       </div>
 
-      <div v-else class="flex items-center justify-center h-64 text-gray-500">Cluster not found.</div>
+      <ErrorState v-else text="Cluster not found." icon="i-lucide-search-x" class="h-64">
+        <template #action>
+          <UButton to="/projects" size="xs" color="neutral" variant="outline">Back to projects</UButton>
+        </template>
+      </ErrorState>
     </template>
   </UDashboardPanel>
 
diff --git a/apps/application/app/pages/test-cases/[id].vue b/apps/application/app/pages/test-cases/[id].vue
index 6a1a87c2..2044e911 100644
--- a/apps/application/app/pages/test-cases/[id].vue
+++ b/apps/application/app/pages/test-cases/[id].vue
@@ -287,13 +287,7 @@ const executionColumns: TableColumn<ExecutionRow>[] = [
               </NuxtLink>
             </template>
             <template #error-cell="{ row }">
-              <span
-                v-if="row.original.error"
-                class="text-red-600 text-xs truncate max-w-xs block"
-                :title="row.original.error"
-              >
-                {{ row.original.error.length > 80 ? `${row.original.error.substring(0, 80)}…` : row.original.error }}
-              </span>
+              <ErrorText v-if="row.original.error" :text="row.original.error" class="max-w-xs" />
             </template>
             <template #actions-header>
               <div class="text-right">Actions</div>
diff --git a/apps/application/app/pages/test-run-cases/[id].vue b/apps/application/app/pages/test-run-cases/[id].vue
index 0dce5fca..917c4eb5 100644
--- a/apps/application/app/pages/test-run-cases/[id].vue
+++ b/apps/application/app/pages/test-run-cases/[id].vue
@@ -13,7 +13,6 @@ import { getPerformanceHints } from '~/utils/performance-hints';
 import { renderAnsi } from '~/utils';
 import type { NavbarAction } from '~/components/shared/NavbarActions.vue';
 import type { HelpTopicKey } from '~/utils/help-content';
-import { buildRetryCommand } from '~/utils/retry-command';
 import { condenseErrorText } from '#shared/error-fingerprint';
 import { clusterSectionLocatorKey } from '~/composables/useClusterSectionLocator';
 
@@ -358,6 +357,8 @@ function stepBarColorClass(duration: number): string {
 const environment = computed(() => testCase.value?.testRun?.environment);
 
 // ── Retry command ─────────────────────────────────────────────────────────
+// The summary card owns the copy and run-locally controls (as the run page's
+// summary does); the navbar keeps only the page-level actions.
 const retryCases = computed(() => [
   {
     filePath: testCase.value?.filePath ?? '',
@@ -366,17 +367,8 @@ const retryCases = computed(() => [
     projectName: (testCase.value?.browser as { projectName?: string } | null)?.projectName ?? null,
   },
 ]);
-const retryCommand = computed(() => buildRetryCommand(retryCases.value));
-const { copy: copyRetry, copied: retryCopied } = useCopy();
 
 const navbarActions = computed<NavbarAction[]>(() => [
-  {
-    label: retryCopied.value ? 'Copied' : 'Copy retry command',
-    icon: retryCopied.value ? 'i-lucide-check' : 'i-lucide-clipboard',
-    variant: 'outline',
-    title: retryCopied.value ? 'Copied!' : copyPreview(retryCommand.value),
-    onClick: () => copyRetry(retryCommand.value, { toast: 'Retry command copied' }),
-  },
   { label: 'Refresh', icon: 'i-lucide-refresh-cw', onClick: () => refresh() },
 ]);
 
@@ -471,10 +463,9 @@ function copyFailure() {
 // Lets an AI-diagnosis evidence citation (in TestCaseAiCard → DiagnosisResult)
 // unfold and scroll to the matching evidence section on this page.
 const errorEl = ref<HTMLElement | null>(null);
-const consoleEl = ref<HTMLElement | null>(null);
-const networkEl = ref<HTMLElement | null>(null);
 const testSourceCard = ref<{ reveal: () => void } | null>(null);
-const networkCard = ref<{ showTraceMode: () => void } | null>(null);
+const consoleCard = ref<{ reveal: () => void } | null>(null);
+const networkCard = ref<{ showTraceMode: () => void; reveal: () => void } | null>(null);
 const evidenceCard = ref<{ reveal: () => void } | null>(null);
 const envDiffCard = ref<{ reveal: () => void } | null>(null);
 const visualDiffCard = ref<{ reveal: () => void } | null>(null);
@@ -497,13 +488,13 @@ const sectionToAction: Record<string, () => void> = {
   screenshots: () => evidenceCard.value?.reveal(),
   tracePointers: () => evidenceCard.value?.reveal(),
   artifacts: () => evidenceCard.value?.reveal(),
-  console: () => scrollToEl(consoleEl.value),
-  networkRequests: () => scrollToEl(networkEl.value),
-  serverTraces: () => scrollToEl(networkEl.value),
+  console: () => consoleCard.value?.reveal(),
+  networkRequests: () => networkCard.value?.reveal(),
+  serverTraces: () => networkCard.value?.reveal(),
   traceCallStack: () => testSourceCard.value?.reveal(),
   traceNetwork: () => {
     networkCard.value?.showTraceMode();
-    scrollToEl(networkEl.value);
+    networkCard.value?.reveal();
   },
   steps: () => {
     activeTab.value = 'steps';
@@ -513,6 +504,12 @@ const sectionToAction: Record<string, () => void> = {
   },
 };
 
+// The lazily fetched cards report whether they rendered anything (no baseline,
+// no screenshot or no trace leaves them empty), so their chips follow the card.
+const envDiffAvailable = ref(false);
+const visualDiffAvailable = ref(false);
+const domSnapshotAvailable = ref(false);
+
 // The jump-chip row under the error — the same section map the AI citations
 // use, so the funnel has a map even when no AI is configured. Each chip is
 // gated by the same availability condition as the section it targets: a chip
@@ -524,9 +521,9 @@ const sectionChips = computed(() =>
       label: 'Test source',
       available: Boolean(testCase.value?.testSourceFrames?.length || testCase.value?.testSource || hasTrace.value),
     },
-    { id: 'environmentDiff', label: 'Environment diff', available: Boolean(testCase.value?.testRun?.id) },
-    { id: 'visualDiff', label: 'Visual diff', available: Boolean(testCase.value?.testRun?.id) },
-    { id: 'domSnapshot', label: 'DOM snapshot', available: Boolean(testCase.value?.testRun?.id) },
+    { id: 'environmentDiff', label: 'Environment diff', available: envDiffAvailable.value },
+    { id: 'visualDiff', label: 'Visual diff', available: visualDiffAvailable.value },
+    { id: 'domSnapshot', label: 'DOM snapshot', available: domSnapshotAvailable.value },
     { id: 'ariaSnapshot', label: 'ARIA snapshot', available: Boolean(testCase.value?.ariaSnapshot) },
     { id: 'screenshots', label: 'Screenshots', available: true },
     { id: 'console', label: 'Console', available: Boolean((testCase.value as any)?.consoleLogs?.length) },
@@ -544,7 +541,8 @@ provide(clusterSectionLocatorKey, {
 <template>
   <UDashboardPanel id="test-run-case-detail">
     <template #header>
-      <UDashboardNavbar :title="testCase?.title ?? `Execution #${testCaseId}`">
+      <!-- The breadcrumb's current crumb is the page title; a navbar title would repeat it. -->
+      <UDashboardNavbar>
         <template #leading>
           <UDashboardSidebarCollapse />
           <BreadcrumbNav
@@ -560,13 +558,7 @@ provide(clusterSectionLocatorKey, {
                   ]
                 : [{ label: 'Project' }]),
               ...(testCase?.testRun?.id
-                ? [
-                    {
-                      label:
-                        `Run #${testCase.testRun.id}` + (testCase.testRun.label ? ` — ${testCase.testRun.label}` : ''),
-                      to: `/test-runs/${testCase.testRun.id}`,
-                    },
-                  ]
+                ? [{ label: `Run #${testCase.testRun.id}`, to: `/test-runs/${testCase.testRun.id}` }]
                 : [{ label: 'Test run' }]),
               { label: testCase?.title || `Execution #${testCaseId}` },
             ]"
@@ -579,23 +571,21 @@ provide(clusterSectionLocatorKey, {
               :to="`/test-cases/${testCase.testCaseId}`"
               class="text-xs text-gray-500 hover:text-primary mr-2 flex items-center gap-1 shrink-0"
               title="View test case history"
+              aria-label="Test case history"
             >
               <UIcon name="i-lucide-trending-up" class="size-3.5" />
-              <span class="hidden sm:inline">Test case</span>
+              <span class="hidden xl:inline">Test case</span>
             </NuxtLink>
-            <ShareLinksModal v-if="testCase" :endpoint="`/api/test-run-cases/${testCase.id}/share-links`" />
+            <ShareLinksModal
+              v-if="testCase && !isDemoMode"
+              :endpoint="`/api/test-run-cases/${testCase.id}/share-links`"
+            />
             <ExportMenu
               v-if="testCase"
               :endpoint="`/api/test-run-cases/${testCase.id}/export`"
               :base-name="`piwi-execution-${testCase.id}`"
               class="mr-2"
             />
-            <DesktopRunLocallyButton
-              :project-id="testCase?.testRun?.project?.id"
-              :project-label="testCase?.testRun?.project?.label ?? testCase?.testRun?.project?.name"
-              :cases="retryCases"
-              class="mr-2"
-            />
             <NavbarActions :actions="navbarActions" />
           </div>
         </template>
@@ -616,6 +606,8 @@ provide(clusterSectionLocatorKey, {
             :stable-links="(testCase as any)?.stableLinks ?? null"
             :project-key="testCase?.testRun?.project?.id"
             :project-name="testCase?.testRun?.project?.name"
+            :project-label="testCase?.testRun?.project?.label ?? testCase?.testRun?.project?.name"
+            :retry-cases="retryCases"
             @refresh="refresh()"
           />
           <DidNotRunCard
@@ -665,8 +657,8 @@ provide(clusterSectionLocatorKey, {
               />
             </div>
             <div class="grid grid-cols-1 xl:grid-cols-[3fr_2fr] gap-4">
-              <!-- Right rail (DOM-first so it follows the error on mobile) -->
-              <div class="space-y-4 lg:order-2">
+              <!-- Right rail (DOM-first so it follows the error below the xl split) -->
+              <div class="space-y-4 xl:order-2">
                 <TestCaseVerdictCard
                   :test-case="(testCase as any) ?? null"
                   :history="historyData"
@@ -679,12 +671,13 @@ provide(clusterSectionLocatorKey, {
               </div>
 
               <!-- Left column: evidence funnel -->
-              <div class="space-y-4 lg:order-1 min-w-0">
+              <div class="space-y-4 xl:order-1 min-w-0">
                 <!-- Test source: the failing line and its callers; full trace call stack when available -->
                 <TestSourceCard
                   v-if="testCase?.testSourceFrames?.length || testCase?.testSource || hasTrace"
                   ref="testSourceCard"
                   storage-key="case-test-source"
+                  :default-folded="false"
                   :frames="testCase?.testSourceFrames ?? null"
                   :test-source="testCase?.testSource ?? null"
                   :run-id="testCase?.testRun?.id ?? null"
@@ -698,6 +691,7 @@ provide(clusterSectionLocatorKey, {
                 <TestCaseEvidenceCard
                   ref="evidenceCard"
                   storage-key="case-evidence"
+                  :default-folded="false"
                   :attachments="(testCase as any)?.attachments ?? []"
                   :traces="(traceData as any[]) ?? []"
                 />
@@ -718,6 +712,7 @@ provide(clusterSectionLocatorKey, {
                   storage-key="case-env-diff"
                   :run-id="testCase.testRun.id"
                   :test-runs-case-id="Number(testCaseId)"
+                  @available="envDiffAvailable = $event"
                 />
 
                 <!-- What changed visually since the last pass -->
@@ -727,23 +722,27 @@ provide(clusterSectionLocatorKey, {
                   storage-key="case-visual-diff"
                   :run-id="testCase.testRun.id"
                   :test-runs-case-id="Number(testCaseId)"
+                  @available="visualDiffAvailable = $event"
                 />
 
                 <!-- Console output -->
-                <div v-if="(testCase as any)?.consoleLogs?.length" ref="consoleEl" class="scroll-mt-4">
-                  <TestCaseConsoleCard :entries="(testCase as any)?.consoleLogs ?? []" />
-                </div>
+                <TestCaseConsoleCard
+                  v-if="(testCase as any)?.consoleLogs?.length"
+                  ref="consoleCard"
+                  storage-key="case-console"
+                  :entries="(testCase as any)?.consoleLogs ?? []"
+                />
 
                 <!-- Network requests + backend logs; full trace network when available -->
-                <div v-if="networkRequests.length > 0 || hasTrace" ref="networkEl" class="scroll-mt-4">
-                  <TestCaseNetworkRequests
-                    ref="networkCard"
-                    :requests="networkRequests"
-                    :run-id="testCase?.testRun?.id ?? null"
-                    :test-runs-case-id="Number(testCaseId)"
-                    :has-trace="hasTrace"
-                  />
-                </div>
+                <TestCaseNetworkRequests
+                  v-if="networkRequests.length > 0 || hasTrace"
+                  ref="networkCard"
+                  storage-key="case-network"
+                  :requests="networkRequests"
+                  :run-id="testCase?.testRun?.id ?? null"
+                  :test-runs-case-id="Number(testCaseId)"
+                  :has-trace="hasTrace"
+                />
 
                 <!-- App state at test end -->
                 <PageStateCard
@@ -774,6 +773,7 @@ provide(clusterSectionLocatorKey, {
                   storage-key="case-dom-snapshot"
                   :run-id="testCase.testRun.id"
                   :test-runs-case-id="Number(testCaseId)"
+                  @available="domSnapshotAvailable = $event"
                 />
               </div>
             </div>
@@ -862,12 +862,12 @@ provide(clusterSectionLocatorKey, {
                         slowest
                       </UBadge>
                     </div>
-                    <p
+                    <ErrorText
                       v-if="row.original.failed && row.original.error?.message"
-                      class="text-xs text-red-500 mt-1 whitespace-pre-wrap break-words font-mono"
-                    >
-                      {{ row.original.error.message }}
-                    </p>
+                      mode="block"
+                      :text="row.original.error.message"
+                      class="mt-1"
+                    />
                     <OpenInIdeLink
                       v-if="row.original.location"
                       :location="row.original.location"
@@ -1193,15 +1193,7 @@ provide(clusterSectionLocatorKey, {
                     </NuxtLink>
                   </template>
                   <template #error-cell="{ row }">
-                    <span
-                      v-if="row.original.error"
-                      class="text-red-600 text-xs truncate max-w-xs block"
-                      :title="row.original.error"
-                    >
-                      {{
-                        row.original.error.length > 80 ? `${row.original.error.substring(0, 80)}…` : row.original.error
-                      }}
-                    </span>
+                    <ErrorText v-if="row.original.error" :text="row.original.error" class="max-w-xs" />
                   </template>
                 </UTable>
               </TableScroller>
diff --git a/apps/application/app/pages/test-runs/[id].vue b/apps/application/app/pages/test-runs/[id].vue
index d11edff7..c6e1f412 100644
--- a/apps/application/app/pages/test-runs/[id].vue
+++ b/apps/application/app/pages/test-runs/[id].vue
@@ -24,17 +24,10 @@ const latestRunId = computed(() => latestRunInfo.value?.id ?? testRun.value?.pro
 const latestRunStatus = computed(() => latestRunInfo.value?.status ?? testRun.value?.project?.latestRunStatus ?? null);
 const isLatestRunActive = computed(() => latestRunStatus.value === 'running' || latestRunStatus.value === 'finalizing');
 
-const navbarTitle = computed(() => {
-  // The page heading must name this specific run — the breadcrumb and the
-  // URL carry the project identity.
-  const project = testRun.value?.project?.label || testRun.value?.project?.name;
-  return project ? `Run #${runId} — ${project}` : `Run #${runId}`;
-});
-
 useHead(
   computed(() => {
-    // Match the on-page heading: prefer the project's display label so a
-    // labeled project reads the same in the tab title and the navbar.
+    // The tab title names the run and its project (display label first); on
+    // the page the breadcrumb carries the project.
     const project = testRun.value?.project?.label || testRun.value?.project?.name;
     return {
       title: `Test run #${runId}${project ? ` — ${project}` : ''} — Piwi Dashboard`,
@@ -667,7 +660,8 @@ function handleSelectCluster(clusterId: number) {
 <template>
   <UDashboardPanel id="test-run-detail">
     <template #header>
-      <UDashboardNavbar :title="navbarTitle">
+      <!-- The breadcrumb's current crumb is the page title; a navbar title would repeat it. -->
+      <UDashboardNavbar>
         <template #leading>
           <UDashboardSidebarCollapse />
           <BreadcrumbNav
@@ -791,7 +785,11 @@ function handleSelectCluster(clusterId: number) {
         </template>
 
         <template #tab-failure-groups>
-          <FailureGroups :refresh-key="runRefreshKey" @select-cluster="handleSelectCluster" />
+          <FailureGroups
+            :refresh-key="runRefreshKey"
+            :test-cases="testRun?.testCases ?? []"
+            @select-cluster="handleSelectCluster"
+          />
         </template>
 
         <template #tab-regression>
diff --git a/apps/application/shared/handlers/test-cases.ts b/apps/application/shared/handlers/test-cases.ts
index 1ef958fb..76647e74 100644
--- a/apps/application/shared/handlers/test-cases.ts
+++ b/apps/application/shared/handlers/test-cases.ts
@@ -158,6 +158,26 @@ export async function getTestRunCase(
   // Large evidence payloads are content-addressed; legacy rows keep them inline.
   const evidence = await inlineCasePayloads(db, trc);
 
+  // Every attempt is its own execution row (unique on run + test case + retries
+  // + browser), so each stored attempt maps to the sibling row that holds it.
+  const siblingRows = await db
+    .select({ id: testRunsCases.id, retries: testRunsCases.retries })
+    .from(testRunsCases)
+    .where(
+      and(
+        eq(testRunsCases.testRunId, trc.testRunId),
+        eq(testRunsCases.testCaseId, trc.testCaseId),
+        trc.browserName ? eq(testRunsCases.browserName, trc.browserName) : sql`${testRunsCases.browserName} IS NULL`,
+      ),
+    );
+  const executionByRetry = new Map(siblingRows.map((r: any) => [r.retries ?? 0, r.id as number]));
+  const attempts = Array.isArray(trc.attempts)
+    ? (trc.attempts as Array<{ retry: number }>).map((a) => ({
+        ...a,
+        executionId: executionByRetry.get(a.retry) ?? null,
+      }))
+    : null;
+
   const [[testCase], [testRun], reportList, attachmentList] = await Promise.all([
     db
       .select()
@@ -342,7 +362,7 @@ export async function getTestRunCase(
     duration: trc.duration,
     error: trc.error,
     retries: trc.retries,
-    attempts: trc.attempts ?? null,
+    attempts,
     steps: trc.steps,
     testSource: evidence.testSource,
     testSourceFrames: evidence.testSourceFrames,
diff --git a/apps/application/shared/locator-healing.ts b/apps/application/shared/locator-healing.ts
index 367ffe1b..2d8094b1 100644
--- a/apps/application/shared/locator-healing.ts
+++ b/apps/application/shared/locator-healing.ts
@@ -204,3 +204,52 @@ export async function locatorSignatureFromExpression(expr: string): Promise<stri
   const method = locatorExpressionMethod(expr) ?? '';
   return sha256Hex(`${method} ${JSON.stringify(locatorExpressionStrings(expr))}`);
 }
+
+/**
+ * The positional first argument of each Playwright locator method, as keyed by
+ * the parsed failing locator (`{ method, args }`); every other arg key is an
+ * option. `getByAltText` shares the `text` key with `getByText`.
+ */
+const LOCATOR_PRIMARY_ARG: Record<string, string> = {
+  getByTestId: 'testId',
+  getByRole: 'role',
+  getByText: 'text',
+  getByLabel: 'label',
+  getByPlaceholder: 'placeholder',
+  getByAltText: 'text',
+  getByTitle: 'title',
+  locator: 'selector',
+  'page.locator': 'selector',
+};
+
+/** A parsed arg value as Playwright source: quoted string, bare literal, or regex text as-is. */
+function locatorArgLiteral(value: unknown): string {
+  if (typeof value === 'string') {
+    if (value.startsWith('/') && /\/[a-z]*$/.test(value) && value.length > 1) return value;
+    return `'${value.replace(/\\/g, '\\\\').replace(/'/g, "\\'")}'`;
+  }
+  if (typeof value === 'number' || typeof value === 'boolean') return String(value);
+  if (value == null) return 'undefined';
+  return JSON.stringify(value);
+}
+
+/**
+ * Render a parsed locator back to the Playwright expression a developer would
+ * write, e.g. `{ method: 'getByRole', args: { role: 'row', name: 'Total' } }`
+ * → `getByRole('row', { name: 'Total' })`. The inverse of the server-side
+ * expression parser, so the failing locator reads like every alternative.
+ */
+export function locatorExpression(method: string, args: Record<string, unknown> | null | undefined): string {
+  const a = args ?? {};
+  const parts: string[] = [];
+  if (Array.isArray(a.args) && !(method in LOCATOR_PRIMARY_ARG)) {
+    return `${method}(${a.args.map(locatorArgLiteral).join(', ')})`;
+  }
+  const primary = LOCATOR_PRIMARY_ARG[method];
+  if (primary && a[primary] !== undefined) parts.push(locatorArgLiteral(a[primary]));
+  const options = Object.entries(a).filter(([key, value]) => key !== primary && value !== undefined);
+  if (options.length) {
+    parts.push(`{ ${options.map(([key, value]) => `${key}: ${locatorArgLiteral(value)}`).join(', ')} }`);
+  }
+  return `${method}(${parts.join(', ')})`;
+}
diff --git a/apps/application/tests/test-run-case-page.spec.ts b/apps/application/tests/test-run-case-page.spec.ts
index 5a71f279..afb47f14 100644
--- a/apps/application/tests/test-run-case-page.spec.ts
+++ b/apps/application/tests/test-run-case-page.spec.ts
@@ -96,10 +96,10 @@ test.describe('Test-run-case page', () => {
     await expect(page.getByRole('button', { name: /^Steps/ })).toBeVisible();
   });
 
-  test('the header offers a Copy retry command action', async ({ page }) => {
+  test('the summary offers a Copy retry command action', async ({ page }) => {
     await page.goto(`/test-run-cases/${failedCaseId}`);
     await waitForHydration(page);
-    // NavbarActions keeps the label as accessible name even when icon-only on mobile.
+    // The button keeps its label as accessible name even when icon-only in a narrow card.
     await expect(page.getByRole('button', { name: /Copy retry command/ })).toBeVisible();
   });
 
diff --git a/apps/application/tests/unit/locator-healing.test.ts b/apps/application/tests/unit/locator-healing.test.ts
index 26905391..a8c52a2d 100644
--- a/apps/application/tests/unit/locator-healing.test.ts
+++ b/apps/application/tests/unit/locator-healing.test.ts
@@ -6,6 +6,7 @@ import {
   locatorIdentityEquals,
   alternativeUsesName,
   CONVENTION_STABILITY_FLOOR,
+  locatorExpression,
 } from '#shared/locator-healing';
 import type { RankedLocator } from '#shared/locator-healing.types';
 import { extractLeafSelector } from '#shared/error-fingerprint';
@@ -296,3 +297,28 @@ describe('alternativeUsesName', () => {
     expect(alternativeUsesName(alt('getByLabel', { label: 'Email' }), '  ')).toBe(false);
   });
 });
+
+describe('locatorExpression', () => {
+  test('renders the positional arg and options as Playwright source', () => {
+    expect(locatorExpression('getByRole', { role: 'row' })).toBe("getByRole('row')");
+    expect(locatorExpression('getByRole', { role: 'button', name: 'Pay now', exact: true })).toBe(
+      "getByRole('button', { name: 'Pay now', exact: true })",
+    );
+    expect(locatorExpression('getByRole', { role: 'heading', level: 2 })).toBe("getByRole('heading', { level: 2 })");
+    expect(locatorExpression('getByLabel', { label: 'Email address' })).toBe("getByLabel('Email address')");
+    expect(locatorExpression('getByTestId', { testId: 'submit' })).toBe("getByTestId('submit')");
+    expect(locatorExpression('locator', { selector: '.btn-primary' })).toBe("locator('.btn-primary')");
+  });
+
+  test('keeps regex options verbatim and escapes quotes', () => {
+    expect(locatorExpression('getByText', { text: "it's here" })).toBe("getByText('it\\'s here')");
+    expect(locatorExpression('getByRole', { role: 'link', name: '/^Docs/i' })).toBe(
+      "getByRole('link', { name: /^Docs/i })",
+    );
+  });
+
+  test('falls back to positional args for an unknown method', () => {
+    expect(locatorExpression('frameLocator', { args: ['#frame'] })).toBe("frameLocator('#frame')");
+    expect(locatorExpression('getByRole', {})).toBe('getByRole()');
+  });
+});
diff --git a/apps/application/types/api.ts b/apps/application/types/api.ts
index 2a042eea..e538a94b 100644
--- a/apps/application/types/api.ts
+++ b/apps/application/types/api.ts
@@ -701,6 +701,19 @@ export interface AiStepIntent {
 /**
  * Test case result (for a specific test run)
  */
+/**
+ * One attempt of a test within a run. Every attempt is its own execution row;
+ * `executionId` is that sibling row's id (null when the row is not stored,
+ * e.g. rows recorded before attempts were kept).
+ */
+export interface AttemptOutcome {
+  retry: number;
+  status: string;
+  duration: number;
+  startedAt: number | null;
+  executionId?: number | null;
+}
+
 export interface TestCaseResult {
   /** The execution id (a test_runs_cases row): this test case run within this run. */
   executionId: number;
@@ -722,8 +735,8 @@ export interface TestCaseResult {
   testSourceFrames?: TestSourceFrame[] | null;
   failureClusterId?: number | null;
   retries?: number | null;
-  /** Per-attempt outcomes `{ retry, status, duration, startedAt }`, oldest first. */
-  attempts?: Array<{ retry: number; status: string; duration: number; startedAt: number | null }> | null;
+  /** Per-attempt outcomes, oldest first. */
+  attempts?: AttemptOutcome[] | null;
   steps?: PerformanceStep[] | null;
   stepEvents?: TestStepEvent[] | null;
   slowestStep?: string | null;
@@ -1082,8 +1095,8 @@ export interface TestCaseHistoryPoint {
   duration: number | null;
   error: string | null;
   retries: number | null;
-  /** Per-attempt outcomes `{ retry, status, duration, startedAt }`, oldest first. */
-  attempts?: Array<{ retry: number; status: string; duration: number; startedAt: number | null }> | null;
+  /** Per-attempt outcomes, oldest first. */
+  attempts?: AttemptOutcome[] | null;
   startTime: string | Date;
   runStatus: string;
 }
diff --git a/apps/docs/evidence.md b/apps/docs/evidence.md
index 130df015..26757387 100644
--- a/apps/docs/evidence.md
+++ b/apps/docs/evidence.md
@@ -23,8 +23,8 @@ Most links from a run land on an execution; the test's title links to the test c
 Everything about a single test execution, laid out **diagnosis-first**. A pinned **summary** carries the status, title, copyable location, duration, worker, retries and duration-vs-average, plus at-a-glance **signal badges** (new regression, new flaky, passed-on-retry), any test annotations (`@fixme`, `@slow`, …), the **wasted time** spent in fixed waits, and metadata cards (environment, CI, branch, commit, author, browser, storage). Traces stream in live while the parent run is still running.
 
 <figure>
-  <img src="/screenshots/gather-evidence.png" alt="A failing execution's Diagnosis tab: the pinned summary, the error and call log, and the folded evidence sections (test source, failure evidence, alternative locators, environment diff, visual diff, console)">
-  <figcaption>A failing execution, diagnosis-first — the summary with its wasted-time readout, the error, and the captured evidence folded into one screen.</figcaption>
+  <img src="/screenshots/gather-evidence.png" alt="A failing execution's Diagnosis tab: the pinned summary, the error and call log, the test source and failure evidence open, and the remaining evidence sections folded (alternative locators, environment diff, visual diff, console, network)">
+  <figcaption>A failing execution, diagnosis-first — the summary with its wasted-time readout, the error, the test source and screenshots open, and the rest of the captured evidence folded into one screen.</figcaption>
 </figure>
 
 The tabs adapt to the result.
@@ -34,11 +34,11 @@ The tabs adapt to the result.
 - **Verdict** — is this a new regression or flaky, how many times it retried, and how long the test has been failing, with a clickable recent-runs strip to jump between executions.
 - **Failure cluster** *(when the failure is clustered)* — signature, error type, how many tests it hit, the cluster's own AI verdict, and a hand-off to the full cross-test investigation.
 - **AI diagnosis** — diagnose *this execution* with one click, or **Copy AI context** to paste the full evidence bundle into your own assistant (works even with no provider configured). Cited evidence links jump to the matching section on the page.
-- **Evidence funnel** — the **test source** as a call stack (the line that actually threw plus the callers above it, so a failure inside a helper is visible, not just the test line that invoked it — and, [with a trace](#trace-powered-deep-views), the complete stack with real source), grouped **failure evidence** (screenshots, video, traces, attachments), [alternative locators](./reporter#locator-healing) for a broken locator, an **environment diff** and **visual diff** against the last green run, **console** output, **network requests** with inline [backend logs](./backend-logs) and a [Full trace](#trace-powered-deep-views) network view, **app state**, the failure-time **ARIA snapshot**, and the reconstructed **DOM snapshot**.
+- **Evidence funnel** — every section is a card that folds to a one-line peek and remembers your choice; the test source and the failure evidence open expanded so the failing line and the screenshot are on the first screen, the rest starts folded. It runs from the **test source** as a call stack (the line that actually threw plus the callers above it, so a failure inside a helper is visible, not just the test line that invoked it — and, [with a trace](#trace-powered-deep-views), the complete stack with real source), grouped **failure evidence** (screenshots, video, traces, attachments), [alternative locators](./reporter#locator-healing) for a broken locator, an **environment diff** and **visual diff** against the last green run, **console** output, **network requests** with inline [backend logs](./backend-logs) and a [Full trace](#trace-powered-deep-views) network view, **app state**, the failure-time **ARIA snapshot**, and the reconstructed **DOM snapshot**.
 
 **A passing execution opens on Steps**, with an **Artifacts** tab for its traces, attachments, console and network.
 
-Both keep a **Performance** tab (performance hints plus color-coded **Web Vitals**) and a **History** tab (this test's status and duration trend over recent runs, linking through to the full test history). A **Copy retry command** button in the header gives you the exact Playwright command to re-run just this test. The Web Vitals, network, console, ARIA-snapshot and alternative-locator data all come from the [capture fixtures](./capture-fixtures).
+Both keep a **Performance** tab (performance hints plus color-coded **Web Vitals**) and a **History** tab (this test's status and duration trend over recent runs, linking through to the full test history). A **Copy retry command** button in the summary gives you the exact Playwright command to re-run just this test. The Web Vitals, network, console, ARIA-snapshot and alternative-locator data all come from the [capture fixtures](./capture-fixtures).
 
 ## Trace-powered deep views
 
diff --git a/apps/docs/share-links.md b/apps/docs/share-links.md
index 0dd95cbb..b06d2e89 100644
--- a/apps/docs/share-links.md
+++ b/apps/docs/share-links.md
@@ -12,6 +12,9 @@ export time, the link renders the investigation as it stands when it is opened.
 Share links are **off by default**. Set `PIWI_SHARE_LINKS_ENABLED=true` to allow them — see the
 [configuration reference](./configuration#authentication).
 
+The [live demo](https://piwitests.dev/demo/) runs without a server, so it has no share links and hides the **Share**
+button.
+
 ## Creating a link
 
 On an execution page or a failure-cluster page, open **Share** (next to **Export**):
diff --git a/apps/docs/ui-overview.md b/apps/docs/ui-overview.md
index 44867527..2502a400 100644
--- a/apps/docs/ui-overview.md
+++ b/apps/docs/ui-overview.md
@@ -116,7 +116,9 @@ A failing execution opens diagnosis-first: the error, a verdict, the cluster it
 evidence funnel running from the call stack down to the ARIA snapshot — deeper still when a trace is
 attached. All of it, plus the bundled trace viewer, is described in
 [Failure evidence](./evidence). The summary shows one chip per **attempt** (with its outcome and
-duration) when a test retried, so "how did this execution get here" is answerable at a glance.
+duration) when a test retried, so "how did this execution get here" is answerable at a glance; every
+attempt is its own execution, and each chip links to that attempt's page while the one you are viewing
+is ringed.
 
 ## Failure cluster detail