fix(compare): clarify narrative is anchored to slug defaults (Bugbot #5)

Bugbot flagged that the SSR narrative doesn't recompute when a reader
changes model/sequence/precision client-side (the table and chart do).
Making the narrative client-reactive would require duplicating the
interpolation pipeline on the client; the SSR text is also the SEO
payload and must remain server-rendered.

Mitigate with an inline italicized caveat appended to the narrative on
both routes: "(Numbers reflect the default <sequence> · <precision>
selection for this URL — table and chart below update if you change
sequence, precision, or model in the controls.)" — sets reader
expectations without losing the indexable prose. JSDoc on
compareTableNarrative documents the design choice.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: functionstackx

packages/app/src/app/compare-per-dollar/[slug]/page-client.tsx

@@ -143,7 +143,12 @@ export default function ComparePerDollarPageClient({
                   className="mt-3 text-sm text-foreground/80 max-w-3xl"
                   data-testid="compare-per-dollar-narrative"
                 >
-                  {narrative}
+                  {narrative}{' '}
+                  <span className="text-muted-foreground italic">
+                    (Numbers reflect the default {defaultSequence ?? 'sequence'} ·{' '}
+                    {defaultPrecision ?? 'precision'} selection for this URL — table and chart below
+                    update if you change sequence, precision, or model in the controls.)
+                  </span>
                 </p>
               )}
               {(aCostPerGpuHr > 0 || bCostPerGpuHr > 0) && (

packages/app/src/app/compare/[slug]/page-client.tsx

@@ -120,7 +120,12 @@ export default function ComparePageClient({
                   className="mt-3 text-sm text-foreground/80 max-w-3xl"
                   data-testid="compare-narrative"
                 >
-                  {narrative}
+                  {narrative}{' '}
+                  <span className="text-muted-foreground italic">
+                    (Numbers reflect the default {defaultSequence ?? 'sequence'} ·{' '}
+                    {defaultPrecision ?? 'precision'} selection for this URL — table and chart below
+                    update if you change sequence, precision, or model in the controls.)
+                  </span>
                 </p>
               )}
               <p className="mt-2 text-sm">

packages/app/src/lib/compare-ssr.ts

@@ -338,7 +338,16 @@ function fmtPctDelta(ratio: number): string {
  *  the points readers care about), or falls back to a single-GPU description
  *  at the mid row if there's no overlap. Template differs by variant —
  *  `'full'` mentions both cost and throughput; `'per-dollar'` focuses on cost
- *  and references the table for the rest. */
+ *  and references the table for the rest.
+ *
+ *  The returned prose anchors to the SSR'd default model / sequence /
+ *  precision — i.e. the slug's canonical operating point. The chart and
+ *  interpolated table beneath the narrative re-render on client-side filter
+ *  changes; the narrative does not. This is intentional: the URL slug *is*
+ *  the canonical view, and the narrative is the canonical view's prose
+ *  summary. The caller adds a small "(default configuration)" caveat after
+ *  the narrative so a reader who fiddles with the chart controls sees that
+ *  the narrative is fixed to the slug's defaults. */
 export function compareTableNarrative(
   variant: CompareJsonLdVariant,
   modelLabel: string,