feat: reconstructed-resume view with inline editing + rewrite (#57–59)

Replace the flat per-bullet feedback wall with a faithful reconstructed-
resume view as the primary post-parse surface, then add inline editing
of contact fields and role headers, and re-attach the per-bullet rewrite
affordance — completing the three-part pivot (A/B/C).

A — read-only view (#57):
- Add ReconstructedResume.tsx: rollup strip → contact → roles+bullets
  (flagged inline, passing plain) → education → skills
- Add ReconstructedRole.tsx: RoleEntry (header + bullet list) and
  ResumeBulletRow, decomposed to keep the container under ~200 LOC
- Remove PerBulletFeedback.tsx and RoleGroup.tsx (replaced)
- Move needsAttention() from PerBulletFeedback into group-bullets.ts
  (library predicate, not UI)
- Wire ReconstructedResume into Result.tsx ParsedCard, replacing the
  ContactCard + PerBulletFeedback composition

B — inline editing (#58):
- Add EditableField.tsx (ui/ primitive): pencil-icon affordance, read/
  edit mode, Enter/Escape/blur commit, semantic tokens only
- Add useEditableParse.ts hook: in-memory ContactOverrides +
  ExperienceFieldOverrides, setters, no raw useState in feature code
- Extend ContactCard with optional overrides + onFieldChange props;
  read-only rendering unchanged when props absent

C — per-bullet rewrite (#59):
- Re-home the existing WebGPU/Qwen2-1.5B rewrite affordance onto
  flagged bullets in ReconstructedRole, preserving WebGPU gating,
  lazy-load discipline, and CTA-hidden-on-unsupported behavior

Resolves #57
Resolves #58
Resolves #59

Author: s-annam

src/components/Result.tsx

@@ -8,10 +8,9 @@ import { PdfPreview } from "./PdfPreview";
 import { ScoreRing } from "./features/ScoreRing.tsx";
 import { VerdictHeader } from "./features/VerdictHeader.tsx";
 import type { VerdictDimension } from "./features/VerdictHeader.tsx";
-import { ContactCard } from "./features/ContactCard.tsx";
 import { Card } from "./shared/Card.tsx";
 import { FeedbackControl } from "./features/FeedbackControl.tsx";
-import { PerBulletFeedback } from "./features/PerBulletFeedback.tsx";
+import { ReconstructedResume } from "./features/ReconstructedResume.tsx";
 import {
   scoreBandTextClass,
   scoreBandBgClass,
@@ -98,8 +97,7 @@ function ParsedCard({
       </header>
 
       <AtsScoreReadout score={score} />
-      <ContactCard result={result} />
-      <PerBulletFeedback bullets={score.bullets} experiences={result.parsed.experience} />
+      <ReconstructedResume result={result} score={score} />
 
       {/* Evidence — how a generic extractor read this PDF. Reference
           material, so it sits below the score and per-bullet findings.

src/components/features/ContactCard.tsx

@@ -7,39 +7,122 @@
  * Detected fields show the value with a success chip; undetected fields
  * show a warning chip with a "not detected" label. Always renders all 5
  * fields so the reader can spot gaps at a glance.
+ *
+ * Edit mode (#58): when `overrides` and `onFieldChange` are provided, each
+ * field chip gains an inline EditableField affordance. Edited values replace
+ * the parser-detected value in the display (in memory only; lost on reset).
+ * A cleared field reverts to the "not detected" chip state.
  */
 
 import type { CascadeResult } from "../../lib/heuristics/types.ts";
 import { buildContactFields } from "../../lib/contact.ts";
 import { Chip } from "../ui/Chip.tsx";
 import { Card } from "../shared/Card.tsx";
+import { EditableField } from "../ui/EditableField.tsx";
+import type { ContactOverrides } from "../../hooks/useEditableParse.ts";
 
 interface ContactCardProps {
   result: CascadeResult;
+  /** In-memory overrides for contact fields. When provided, each field gains
+   *  an inline edit affordance. */
+  overrides?: ContactOverrides;
+  /** Called when the user commits an edit on a contact field. */
+  onFieldChange?: (key: keyof ContactOverrides, newValue: string) => void;
 }
 
-export function ContactCard({ result }: ContactCardProps) {
+/** Map from ContactOverrides key → display label. */
+const FIELD_LABELS: Record<keyof ContactOverrides, string> = {
+  full_name: "Name",
+  email: "Email",
+  phone: "Phone",
+  linkedin_url: "LinkedIn",
+  location: "Location",
+};
+
+/** Map from ContactDisplayField.key → ContactOverrides key (only the 5 editable ones). */
+const KEY_MAP: Record<string, keyof ContactOverrides> = {
+  full_name: "full_name",
+  email: "email",
+  phone: "phone",
+  linkedin_url: "linkedin_url",
+  location: "location",
+};
+
+export function ContactCard({
+  result,
+  overrides,
+  onFieldChange,
+}: ContactCardProps) {
   const fields = buildContactFields(result);
-  const detectedCount = fields.filter((f) => !f.gated).length;
+  const editable = overrides !== undefined && onFieldChange !== undefined;
+
+  // Apply in-memory overrides: a non-empty override replaces the parsed value;
+  // an empty string means "user cleared it" → treat as absent.
+  const displayFields = fields.map((field) => {
+    const overrideKey = KEY_MAP[field.key];
+    if (!editable || overrideKey === undefined) return field;
+    const ov = overrides[overrideKey];
+    if (ov === undefined) return field; // no override yet
+    if (ov === "") {
+      // User cleared → show as absent.
+      return { ...field, value: "", gated: true, reason: "absent" as const };
+    }
+    // User set a value → show as detected.
+    return { ...field, value: ov, gated: false, reason: undefined };
+  });
+
+  const detectedCount = displayFields.filter((f) => !f.gated).length;
 
   return (
     <Card id="contact" className="scroll-mt-6">
       <h2 className="mb-3 text-xs font-semibold uppercase tracking-wider text-content-muted">
         Contact — {detectedCount} of 5 detected
       </h2>
       <div className="flex flex-wrap gap-2">
-        {fields.map((field) =>
-          field.gated ? (
-            <Chip key={field.key} tone="warning" icon="⚠">
-              {field.label} not detected
-              {field.reason === "low_confidence" && " (low confidence)"}
-            </Chip>
-          ) : (
-            <Chip key={field.key} tone="success" icon="✓">
-              {field.value}
-            </Chip>
-          ),
-        )}
+        {displayFields.map((field) => {
+          const overrideKey = KEY_MAP[field.key] as
+            | keyof ContactOverrides
+            | undefined;
+
+          if (!editable || overrideKey === undefined) {
+            // Read-only rendering (no edit hooks provided).
+            return field.gated ? (
+              <Chip key={field.key} tone="warning" icon="⚠">
+                {field.label} not detected
+                {field.reason === "low_confidence" && " (low confidence)"}
+              </Chip>
+            ) : (
+              <Chip key={field.key} tone="success" icon="✓">
+                {field.value}
+              </Chip>
+            );
+          }
+
+          // Editable chip: wraps value in EditableField inside a chip-shaped shell.
+          const fieldLabel = FIELD_LABELS[overrideKey];
+          const currentValue = field.gated ? "" : field.value;
+
+          return (
+            <span
+              key={field.key}
+              className={[
+                "inline-flex items-center gap-1 rounded-full px-2.5 py-1 text-xs",
+                field.gated
+                  ? "bg-feedback-warning-bg text-feedback-warning-text"
+                  : "bg-feedback-success-bg text-feedback-success-text",
+              ].join(" ")}
+            >
+              <span aria-hidden="true">{field.gated ? "⚠" : "✓"}</span>
+              <EditableField
+                value={currentValue || undefined}
+                placeholder={`${field.label} not detected`}
+                label={fieldLabel}
+                textSize="xs"
+                onCommit={(v) => onFieldChange(overrideKey, v)}
+              />
+            </span>
+          );
+        })}
       </div>
     </Card>
   );