From 0df17b2948f08441f7f611314752842253fe0f4d Mon Sep 17 00:00:00 2001
From: alowpoly <agustin@lowpoly.gg>
Date: Fri, 17 Jul 2026 19:41:44 -0300
Subject: [PATCH] feat: add Visual Parity Oven and engine identity

---
 dashboard/src/App.tsx                         |   6 +-
 .../src/components/AppHeader/AppHeader.tsx    |   3 +-
 .../components/VisualParity/VisualParity.tsx  | 110 ++++++++++++++++
 .../src/components/VisualParity/index.ts      |   1 +
 dashboard/src/components/index.ts             |   1 +
 dashboard/src/hooks/index.ts                  |   1 +
 dashboard/src/hooks/useVisualParityData.ts    |  42 ++++++
 dashboard/src/index.css                       |   1 +
 dashboard/src/lib/hrefs.ts                    |   3 +-
 dashboard/src/lib/index.ts                    |   2 +
 dashboard/src/lib/visual-parity.ts            |  67 ++++++++++
 .../differential-testing-data-contract.mjs    |  24 +++-
 ...ifferential-testing-data-contract.test.mjs |  22 ++++
 ...erential-testing-transport-server.test.mjs |   8 ++
 .../engine/differential-testing-transport.mjs |  16 ++-
 .../differential-testing-data.schema.json     |  10 ++
 ovens/visual-parity/detail.json               |  41 ++++++
 .../engine/visual-parity-contract.mjs         | 122 ++++++++++++++++++
 .../engine/visual-parity-contract.test.mjs    | 101 +++++++++++++++
 .../engine/visual-parity-handler.mjs          |  73 +++++++++++
 ovens/visual-parity/instructions.md           |   7 +
 .../visual-parity/renderer/visual-parity.css  | 107 +++++++++++++++
 package.json                                  |   1 +
 scripts/verify-package.mjs                    |   5 +
 scripts/verify-test-files.mjs                 |   1 +
 scripts/verify.mjs                            |   7 +-
 src/ovens/built-in-handlers.mjs               |   1 +
 27 files changed, 775 insertions(+), 8 deletions(-)
 create mode 100644 dashboard/src/components/VisualParity/VisualParity.tsx
 create mode 100644 dashboard/src/components/VisualParity/index.ts
 create mode 100644 dashboard/src/hooks/useVisualParityData.ts
 create mode 100644 dashboard/src/lib/visual-parity.ts
 create mode 100644 ovens/visual-parity/detail.json
 create mode 100644 ovens/visual-parity/engine/visual-parity-contract.mjs
 create mode 100644 ovens/visual-parity/engine/visual-parity-contract.test.mjs
 create mode 100644 ovens/visual-parity/engine/visual-parity-handler.mjs
 create mode 100644 ovens/visual-parity/instructions.md
 create mode 100644 ovens/visual-parity/renderer/visual-parity.css

diff --git a/dashboard/src/App.tsx b/dashboard/src/App.tsx
index dc26d7b..e124a11 100644
--- a/dashboard/src/App.tsx
+++ b/dashboard/src/App.tsx
@@ -1,6 +1,6 @@
 import { useMemo, useState } from "react";
 import { Clock3, ListChecks } from "lucide-react";
-import { AppHeader, ChecklistDashboard, DashboardError, DifferentialTestingPage, EmptyState, FILTERS, Filters, NewOvenPage, ProjectGroup, RunBurnPage, StreamingDiff } from "@components";
+import { AppHeader, ChecklistDashboard, DashboardError, DifferentialTestingPage, EmptyState, FILTERS, Filters, NewOvenPage, ProjectGroup, RunBurnPage, StreamingDiff, VisualParityPage } from "@components";
 import { useDashboardData } from "@hooks";
 import { currentSection, filterFromUrl, listHref, selectedBurnlist } from "@lib";
 import type { Filter } from "@lib";
@@ -24,8 +24,8 @@ export function App() {
   return (
     <div className="dashboard-app">
       <AppHeader section={section} />
-      <main className="dashboard-main" data-layout={section === "differential-testing" || section === "performance-tracing" || section === "streaming-diff" || selected ? "full" : "index"} data-section={section}>
-        {section === "differential-testing" ? <DifferentialTestingPage /> : section === "performance-tracing" ? <DifferentialTestingPage ovenId="performance-tracing" /> : section === "streaming-diff" ? <StreamingDiff projects={projects} projectsLoading={loading} /> : section === "new-oven" ? <NewOvenPage /> : section === "run-burn" ? <RunBurnPage /> : selected ? (
+      <main className="dashboard-main" data-layout={section === "differential-testing" || section === "performance-tracing" || section === "streaming-diff" || section === "visual-parity" || selected ? "full" : "index"} data-section={section}>
+        {section === "differential-testing" ? <DifferentialTestingPage /> : section === "performance-tracing" ? <DifferentialTestingPage ovenId="performance-tracing" /> : section === "streaming-diff" ? <StreamingDiff projects={projects} projectsLoading={loading} /> : section === "visual-parity" ? <VisualParityPage /> : section === "new-oven" ? <NewOvenPage /> : section === "run-burn" ? <RunBurnPage /> : selected ? (
           error ? <DashboardError message={error} /> : loading && !progress ? <EmptyState title="Loading progress" detail="Reading the selected Burnlist." /> : progress ? (
             <ChecklistDashboard backHref={listHref(filter)} data={progress} />
           ) : <EmptyState title="Choose a Burnlist" detail="Select an item from the list to inspect its progress." icon={ListChecks} />
diff --git a/dashboard/src/components/AppHeader/AppHeader.tsx b/dashboard/src/components/AppHeader/AppHeader.tsx
index 6d6b21c..80dfe1a 100644
--- a/dashboard/src/components/AppHeader/AppHeader.tsx
+++ b/dashboard/src/components/AppHeader/AppHeader.tsx
@@ -15,8 +15,9 @@ export function AppHeader({ section }: { section: string }) {
         {section === "differential-testing" && <div className="dashboard-oven-title">Differential Testing</div>}
         {section === "performance-tracing" && <div className="dashboard-oven-title">Performance Tracing</div>}
         {section === "streaming-diff" && <div className="dashboard-oven-title">Streaming Diff</div>}
+        {section === "visual-parity" && <div className="dashboard-oven-title">Visual Parity</div>}
         <nav aria-label="Primary navigation" className="dashboard-primary-nav">
-          {section !== "differential-testing" && section !== "performance-tracing" && section !== "streaming-diff" && HEADER_LINKS.map((link, index) => (
+          {section !== "differential-testing" && section !== "performance-tracing" && section !== "streaming-diff" && section !== "visual-parity" && HEADER_LINKS.map((link, index) => (
             <span className="dashboard-primary-nav-item" key={link.href}>
               {index > 0 && <span aria-hidden="true" className="dashboard-primary-nav-separator">·</span>}
               <a aria-label={link.label} aria-current={section === link.section ? "page" : undefined} className="dashboard-primary-nav-link" href={link.href} title={link.label}>
diff --git a/dashboard/src/components/VisualParity/VisualParity.tsx b/dashboard/src/components/VisualParity/VisualParity.tsx
new file mode 100644
index 0000000..d3d0d43
--- /dev/null
+++ b/dashboard/src/components/VisualParity/VisualParity.tsx
@@ -0,0 +1,110 @@
+import { useEffect, useMemo, useState } from "react";
+import { ArrowLeft } from "lucide-react";
+import { useVisualParityData } from "@hooks";
+import { visualParityDomainSummary } from "@lib";
+
+function percent(value: number) {
+  return `${(value * 100).toFixed(value < 0.01 ? 3 : 2)}%`;
+}
+
+function delta(value: number) {
+  return value.toFixed(4).replace(/0+$/u, "").replace(/\.$/u, "");
+}
+
+export function VisualParityPage() {
+  const { payload, error, loading } = useVisualParityData();
+  const initialDomain = payload?.domains.find((domain) => domain.qualification === "target")?.id
+    ?? payload?.domains[0]?.id ?? "";
+  const [selectedDomainId, setSelectedDomainId] = useState(initialDomain);
+
+  useEffect(() => {
+    if (!payload?.domains.length) return;
+    if (!payload.domains.some((domain) => domain.id === selectedDomainId)) {
+      setSelectedDomainId(payload.domains.find((domain) => domain.qualification === "target")?.id
+        ?? payload.domains[0].id);
+    }
+  }, [payload, selectedDomainId]);
+
+  const domain = payload?.domains.find((entry) => entry.id === selectedDomainId)
+    ?? payload?.domains.find((entry) => entry.qualification === "target")
+    ?? payload?.domains[0];
+  const summary = useMemo(() => payload && domain
+    ? visualParityDomainSummary(payload, domain.id) : null, [payload, domain]);
+  const targetPass = payload?.comparisons.every((comparison) => comparison.status === "pass") ?? false;
+  const visibleComparisons = payload && domain ? payload.comparisons.filter((comparison) => {
+    const entry = comparison.domains[domain.id];
+    return entry.reference.src && entry.candidate.src && entry.diff.src;
+  }) : [];
+
+  if (loading && !payload) return <div className="visual-parity-state">Loading Visual Parity…</div>;
+  if (error && !payload) return <div className="visual-parity-state is-error">{error}</div>;
+  if (!payload || !domain || !summary) return <div className="visual-parity-state">Visual Parity has no retained domains.</div>;
+
+  return (
+    <section className="visual-parity-page">
+      <header className="visual-parity-heading">
+        <a className="visual-parity-back" href="/"><ArrowLeft aria-hidden="true" />Burnlists</a>
+        <div>
+          <div className={`visual-parity-verdict ${targetPass ? "pass" : "fail"}`}>
+            {targetPass ? "Target qualified" : "Target open"}
+          </div>
+          <p>{payload.comparisons.length} settled frames · isolated render passes · live refresh</p>
+        </div>
+        {error && <span className="visual-parity-refresh-error">{error}</span>}
+      </header>
+
+      <nav aria-label="Visual parity domains" className="visual-parity-domains">
+        {payload.domains.map((entry) => {
+          const current = entry.id === domain.id;
+          const domainSummary = visualParityDomainSummary(payload, entry.id);
+          return (
+            <button
+              aria-pressed={current}
+              className={current ? "is-active" : ""}
+              key={entry.id}
+              onClick={() => setSelectedDomainId(entry.id)}
+              type="button"
+            >
+              <span>{entry.label}</span>
+              <small>{entry.qualification} · {domainSummary.failed ? `${domainSummary.failed} fail` : "pass"}</small>
+            </button>
+          );
+        })}
+      </nav>
+
+      <div className="visual-parity-metrics">
+        <article><span>Frames</span><strong>{summary.passed}/{payload.comparisons.length}</strong></article>
+        <article><span>Changed pixels</span><strong>{percent(summary.ratio)}</strong></article>
+        <article><span>Mean RGB delta</span><strong>{delta(summary.meanAbsoluteDelta)}</strong></article>
+        <article><span>Maximum delta</span><strong>{summary.maximumAbsoluteDelta}</strong></article>
+      </div>
+
+      <div className="visual-parity-domain-note">
+        <strong>{domain.qualification === "target" ? "Qualifying target" : "Diagnostic context"}</strong>
+        <span>{domain.tolerance?.rationale ?? "Exact zero tolerance."}</span>
+      </div>
+
+      <div className="visual-parity-frames">
+        {visibleComparisons.map((comparison) => {
+          const entry = comparison.domains[domain.id];
+          return (
+            <article className={`visual-parity-frame ${entry.status}`} key={comparison.id}>
+              <header>
+                <strong>Frame {comparison.frame}</strong>
+                <span>{entry.status} · {percent(entry.difference.ratio)} · mean {delta(entry.difference.meanAbsoluteDelta)} · max {entry.difference.maximumAbsoluteDelta}</span>
+              </header>
+              <div className="visual-parity-shots">
+                {[entry.reference, entry.candidate, entry.diff].map((image) => (
+                  <figure key={image.label}>
+                    <figcaption>{image.label}</figcaption>
+                    <img alt={`${entry.label} ${image.label.toLowerCase()} frame ${comparison.frame}`} height={image.height} src={image.src ?? undefined} width={image.width} />
+                  </figure>
+                ))}
+              </div>
+            </article>
+          );
+        })}
+      </div>
+    </section>
+  );
+}
diff --git a/dashboard/src/components/VisualParity/index.ts b/dashboard/src/components/VisualParity/index.ts
new file mode 100644
index 0000000..0401ef2
--- /dev/null
+++ b/dashboard/src/components/VisualParity/index.ts
@@ -0,0 +1 @@
+export { VisualParityPage } from "./VisualParity";
diff --git a/dashboard/src/components/index.ts b/dashboard/src/components/index.ts
index 340766d..cdce3a9 100644
--- a/dashboard/src/components/index.ts
+++ b/dashboard/src/components/index.ts
@@ -7,3 +7,4 @@ export { EmptyState } from "./EmptyState";
 export { FILTERS, Filters } from "./Filters";
 export { ProjectGroup } from "./ProjectGroup";
 export { StreamingDiff } from "./StreamingDiff";
+export { VisualParityPage } from "./VisualParity";
diff --git a/dashboard/src/hooks/index.ts b/dashboard/src/hooks/index.ts
index 8a513a7..30a4495 100644
--- a/dashboard/src/hooks/index.ts
+++ b/dashboard/src/hooks/index.ts
@@ -1,2 +1,3 @@
 export { useDashboardData } from "./useDashboardData";
 export { useStreamingDiffCards, useStreamingDiffFeeds } from "./useStreamingDiff";
+export { useVisualParityData } from "./useVisualParityData";
diff --git a/dashboard/src/hooks/useVisualParityData.ts b/dashboard/src/hooks/useVisualParityData.ts
new file mode 100644
index 0000000..48a48f7
--- /dev/null
+++ b/dashboard/src/hooks/useVisualParityData.ts
@@ -0,0 +1,42 @@
+import { useEffect, useRef, useState } from "react";
+import { ovenRepoKey, type VisualParityPayload } from "@lib";
+
+export function useVisualParityData() {
+  const [payload, setPayload] = useState<VisualParityPayload | null>(null);
+  const [error, setError] = useState("");
+  const [loading, setLoading] = useState(true);
+  const inFlight = useRef(false);
+
+  useEffect(() => {
+    let cancelled = false;
+    const refresh = async () => {
+      if (inFlight.current) return;
+      inFlight.current = true;
+      try {
+        const repoKey = ovenRepoKey();
+        const query = repoKey ? `?repoKey=${encodeURIComponent(repoKey)}` : "";
+        const response = await fetch(`/api/oven-data/visual-parity${query}`, { cache: "no-store" });
+        const data = await response.json();
+        if (!response.ok) throw new Error(data.error ?? "Could not load Visual Parity.");
+        if (data.validated !== true) throw new Error("Visual Parity data was not validated by the Oven.");
+        if (!cancelled) {
+          setPayload(data.payload);
+          setError("");
+        }
+      } catch (cause) {
+        if (!cancelled) setError(cause instanceof Error ? cause.message : "Could not load Visual Parity.");
+      } finally {
+        inFlight.current = false;
+        if (!cancelled) setLoading(false);
+      }
+    };
+    void refresh();
+    const timer = window.setInterval(refresh, 2_000);
+    return () => {
+      cancelled = true;
+      window.clearInterval(timer);
+    };
+  }, []);
+
+  return { payload, error, loading };
+}
diff --git a/dashboard/src/index.css b/dashboard/src/index.css
index c1094cd..fe30a45 100644
--- a/dashboard/src/index.css
+++ b/dashboard/src/index.css
@@ -1,4 +1,5 @@
 @import "../../ovens/differential-testing/renderer/differential-testing.css";
+@import "../../ovens/visual-parity/renderer/visual-parity.css";
 
 :root {
   color-scheme: dark;
diff --git a/dashboard/src/lib/hrefs.ts b/dashboard/src/lib/hrefs.ts
index c909f40..c9ef2e7 100644
--- a/dashboard/src/lib/hrefs.ts
+++ b/dashboard/src/lib/hrefs.ts
@@ -5,12 +5,13 @@ export function currentSection() {
   if (window.location.pathname === "/ovens/differential-testing/view") return "differential-testing";
   if (window.location.pathname === "/ovens/performance-tracing/view") return "performance-tracing";
   if (window.location.pathname === "/ovens/streaming-diff/view") return "streaming-diff";
+  if (window.location.pathname === "/ovens/visual-parity/view") return "visual-parity";
   if (window.location.pathname === "/runs/new") return "run-burn";
   return "burnlists";
 }
 
 export function ovenRepoKey() {
-  return ["differential-testing", "performance-tracing", "streaming-diff"].includes(currentSection())
+  return ["differential-testing", "performance-tracing", "streaming-diff", "visual-parity"].includes(currentSection())
     ? new URLSearchParams(window.location.search).get("repoKey")
     : null;
 }
diff --git a/dashboard/src/lib/index.ts b/dashboard/src/lib/index.ts
index 7fc8192..797fe12 100644
--- a/dashboard/src/lib/index.ts
+++ b/dashboard/src/lib/index.ts
@@ -2,6 +2,8 @@ export { formatTime } from "./format";
 export { burnlistHref, currentSection, filterFromUrl, listHref, ovenRepoKey, selectedBurnlist, streamingDiffSelection } from "./hrefs";
 export { adaptPerformanceTracingReport } from "./performance-tracing.mjs";
 export { applyStreamingDiffUpdate, fileKindChip, groupStreamingDiffCard, isTextFileKind, mapStreamingDiffFeeds, mapStreamingDiffLandingFeeds, parseStreamingDiffCard, streamingDiffAutoOpenHref, streamingDiffFeedHref, streamingDiffFeedKey, streamingDiffRepositories } from "./streaming-diff.mjs";
+export { visualParityDomainSummary } from "./visual-parity";
+export type { VisualParityDifference, VisualParityDomain, VisualParityDomainComparison, VisualParityImage, VisualParityPayload } from "./visual-parity";
 export type { Burnlist, ChecklistProgressData, ChecklistItem, CompletedItem, Filter, HistoryPoint, ProgressData, Project, SelectedBurnlist, StreamingDiffCard, StreamingDiffFeed, StreamingDiffFile, StreamingDiffFileKind, StreamingDiffIdentity, Warning } from "./types";
 export { cn, joinClasses } from "./utils";
 export type { ClassValue } from "./utils";
diff --git a/dashboard/src/lib/visual-parity.ts b/dashboard/src/lib/visual-parity.ts
new file mode 100644
index 0000000..e86f51a
--- /dev/null
+++ b/dashboard/src/lib/visual-parity.ts
@@ -0,0 +1,67 @@
+export type VisualParityDifference = {
+  changedPixels: number;
+  totalPixels: number;
+  ratio: number;
+  meanAbsoluteDelta: number;
+  maximumAbsoluteDelta: number;
+};
+
+export type VisualParityImage = {
+  label: string;
+  src: string | null;
+  width: number;
+  height: number;
+};
+
+export type VisualParityDomain = {
+  id: string;
+  label: string;
+  isolation: "render-pass";
+  qualification: "target" | "context";
+  tolerance?: {
+    channelDelta: number;
+    meanAbsoluteDelta: number;
+    changedPixelRatio: number;
+    rationale: string;
+  };
+};
+
+export type VisualParityDomainComparison = {
+  label: string;
+  status: "pass" | "fail";
+  reference: VisualParityImage;
+  candidate: VisualParityImage;
+  diff: VisualParityImage;
+  difference: VisualParityDifference;
+};
+
+export type VisualParityPayload = {
+  schema: "burnlist-visual-parity-data@1";
+  domains: VisualParityDomain[];
+  differentialTesting: Record<string, unknown>;
+  comparisons: Array<{
+    id: string;
+    label: string;
+    frame: number;
+    status: "pass" | "fail";
+    domains: Record<string, VisualParityDomainComparison>;
+  }>;
+};
+
+export function visualParityDomainSummary(payload: VisualParityPayload, domainId: string) {
+  const entries = payload.comparisons.map((comparison) => comparison.domains[domainId]);
+  const changedPixels = entries.reduce((sum, entry) => sum + entry.difference.changedPixels, 0);
+  const totalPixels = entries.reduce((sum, entry) => sum + entry.difference.totalPixels, 0);
+  const absoluteDelta = entries.reduce((sum, entry) => (
+    sum + entry.difference.meanAbsoluteDelta * entry.difference.totalPixels * 3
+  ), 0);
+  return {
+    passed: entries.filter((entry) => entry.status === "pass").length,
+    failed: entries.filter((entry) => entry.status === "fail").length,
+    ratio: totalPixels ? changedPixels / totalPixels : 0,
+    meanAbsoluteDelta: totalPixels ? absoluteDelta / (totalPixels * 3) : 0,
+    maximumAbsoluteDelta: entries.reduce((maximum, entry) => (
+      Math.max(maximum, entry.difference.maximumAbsoluteDelta)
+    ), 0),
+  };
+}
diff --git a/ovens/differential-testing/engine/differential-testing-data-contract.mjs b/ovens/differential-testing/engine/differential-testing-data-contract.mjs
index 708a678..d6c975f 100644
--- a/ovens/differential-testing/engine/differential-testing-data-contract.mjs
+++ b/ovens/differential-testing/engine/differential-testing-data-contract.mjs
@@ -241,11 +241,26 @@ export function validateDifferentialTestingData(payload, { maxIssues = 50 } = {}
           issue(path, "must be a scenario catalog entry");
           return;
         }
-        onlyKeys(scenario, path, new Set(["id", "label", "frameCount", "replaySha256", "profileSha256", "contractSha256", "updatedAt"]), "scenario-catalog contract");
+        onlyKeys(scenario, path, new Set(["id", "label", "engine", "frameCount", "replaySha256", "profileSha256", "contractSha256", "updatedAt"]), "scenario-catalog contract");
         if (typeof scenario.id !== "string" || !scenarioIdPattern.test(scenario.id)) issue(`${path}.id`, "must be a lowercase 16-character hexadecimal scenario id");
         else if (scenarioIds.has(scenario.id)) issue(`${path}.id`, `duplicates scenario id ${scenario.id}`);
         else scenarioIds.add(scenario.id);
         text(scenario.label, `${path}.label`, { max: 160 });
+        if (scenario.engine !== undefined) {
+          if (!plainObject(scenario.engine)) {
+            issue(`${path}.engine`, "must identify a runtime engine");
+          } else {
+            onlyKeys(scenario.engine, `${path}.engine`, new Set(["id", "runtimeRoot"]), "scenario-engine contract");
+            text(scenario.engine.id, `${path}.engine.id`, { max: 80 });
+            if (typeof scenario.engine.id === "string" && !/^[A-Za-z][A-Za-z0-9_-]*$/u.test(scenario.engine.id)) {
+              issue(`${path}.engine.id`, "must be a runtime engine id");
+            }
+            text(scenario.engine.runtimeRoot, `${path}.engine.runtimeRoot`, { max: 400 });
+            if (typeof scenario.engine.runtimeRoot === "string" && !containedRuntimeRoot(scenario.engine.runtimeRoot)) {
+              issue(`${path}.engine.runtimeRoot`, "must be a contained relative path");
+            }
+          }
+        }
         count(scenario.frameCount, `${path}.frameCount`);
         if (scenario.frameCount === 0) issue(`${path}.frameCount`, "must be greater than zero");
         sha256(scenario.replaySha256, `${path}.replaySha256`);
@@ -1135,6 +1150,13 @@ export function validateDifferentialTestingData(payload, { maxIssues = 50 } = {}
   return { ok: issues.length === 0, issues };
 }
 
+function containedRuntimeRoot(value) {
+  if (value === ".") return true;
+  const parts = value.split("/");
+  return !value.startsWith("/") && !value.includes("\\")
+    && parts.every((part) => part && part !== "." && part !== "..");
+}
+
 export function assertDifferentialTestingData(payload, options) {
   const result = validateDifferentialTestingData(payload, options);
   if (!result.ok) throw new DifferentialTestingDataValidationError(result.issues);
diff --git a/ovens/differential-testing/engine/differential-testing-data-contract.test.mjs b/ovens/differential-testing/engine/differential-testing-data-contract.test.mjs
index d7cf14c..1c8ea80 100644
--- a/ovens/differential-testing/engine/differential-testing-data-contract.test.mjs
+++ b/ovens/differential-testing/engine/differential-testing-data-contract.test.mjs
@@ -375,6 +375,28 @@ test("accepts the empty shipped example without inventing a run", () => {
   assert.doesNotThrow(() => assertDifferentialTestingData(payload));
 });
 
+test("scenario catalogs retain a contained runtime engine identity", () => {
+  const payload = buildPayload(...populatedCaptures());
+  payload.scenarioCatalog.scenarios[0].engine = {
+    id: "fixtureEngine",
+    runtimeRoot: "src/runtime",
+  };
+  assert.doesNotThrow(() => assertDifferentialTestingData(payload));
+
+  payload.scenarioCatalog.scenarios[0].engine.runtimeRoot = ".";
+  assert.doesNotThrow(() => assertDifferentialTestingData(payload));
+
+  for (const runtimeRoot of ["/tmp/runtime", "../runtime", "src/../runtime", "src\\runtime", "src//runtime"]) {
+    const invalid = structuredClone(payload);
+    invalid.scenarioCatalog.scenarios[0].engine.runtimeRoot = runtimeRoot;
+    assert.match(
+      validateDifferentialTestingData(invalid).issues.map((entry) => entry.message).join("\n"),
+      /contained relative path/u,
+      runtimeRoot,
+    );
+  }
+});
+
 test("empty scenario state rejects fake selection and retained data", async (t) => {
   await t.test("selectedScenarioId must stay null", () => {
     const payload = buildPayload(...emptyCaptures());
diff --git a/ovens/differential-testing/engine/differential-testing-transport-server.test.mjs b/ovens/differential-testing/engine/differential-testing-transport-server.test.mjs
index ab17040..921cff8 100644
--- a/ovens/differential-testing/engine/differential-testing-transport-server.test.mjs
+++ b/ovens/differential-testing/engine/differential-testing-transport-server.test.mjs
@@ -51,6 +51,10 @@ test("the Differential Testing data route serves bounded bundle pages with stabl
     assert.equal(current.transport.scenarioSha256, fixture.scenarioSha256);
     assert.equal(Object.hasOwn(current.payload, "fields"), false);
     assert.equal(current.payload.scenarioCatalog.selectedScenarioId, fixture.scenarioId);
+    assert.deepEqual(current.payload.scenarioCatalog.scenarios[0].engine, {
+      id: "fixtureEngine",
+      runtimeRoot: "src/runtime",
+    });
     assert.deepEqual(current.frameDeltaMetrics, {
       frameDeviationRatios: [0, 0, 0.5],
       firstFailingFrame: 2,
@@ -137,6 +141,10 @@ test("the Differential Testing data route serves bounded bundle pages with stabl
 
 async function publishBundle(root) {
   const payload = buildPayload(...populatedCaptures());
+  payload.scenarioCatalog.scenarios[0].engine = {
+    id: "fixtureEngine",
+    runtimeRoot: "src/runtime",
+  };
   const scenarioId = payload.scenarioCatalog.selectedScenarioId;
   const scenarioDirectory = join(root, "bundle", "scenarios", scenarioId);
   await mkdir(scenarioDirectory, { recursive: true });
diff --git a/ovens/differential-testing/engine/differential-testing-transport.mjs b/ovens/differential-testing/engine/differential-testing-transport.mjs
index 8ac9441..b3c668b 100644
--- a/ovens/differential-testing/engine/differential-testing-transport.mjs
+++ b/ovens/differential-testing/engine/differential-testing-transport.mjs
@@ -503,11 +503,12 @@ function validateScenarioCatalog(value, label) {
   const ids = new Set();
   for (const [index, entry] of value.scenarios.entries()) {
     const entryLabel = `${label}.scenarios[${index}]`;
-    assertOnlyKeys(entry, new Set(["id", "label", "frameCount", "replaySha256", "profileSha256", "contractSha256", "updatedAt"]), entryLabel);
+    assertOnlyKeys(entry, new Set(["id", "label", "engine", "frameCount", "replaySha256", "profileSha256", "contractSha256", "updatedAt"]), entryLabel);
     scenarioId(entry.id, `${entryLabel}.id`);
     if (ids.has(entry.id)) fail(`${entryLabel}.id is duplicated`);
     ids.add(entry.id);
     text(entry.label, `${entryLabel}.label`, 160);
+    if (entry.engine !== undefined) validateScenarioEngine(entry.engine, `${entryLabel}.engine`);
     positiveCount(entry.frameCount, `${entryLabel}.frameCount`);
     for (const key of ["replaySha256", "profileSha256", "contractSha256"]) digest(entry[key], `${entryLabel}.${key}`);
     timestamp(entry.updatedAt, `${entryLabel}.updatedAt`);
@@ -516,6 +517,19 @@ function validateScenarioCatalog(value, label) {
   return value;
 }
 
+function validateScenarioEngine(value, label) {
+  assertOnlyKeys(value, new Set(["id", "runtimeRoot"]), label);
+  text(value.id, `${label}.id`, 80);
+  if (!/^[A-Za-z][A-Za-z0-9_-]*$/u.test(value.id)) fail(`${label}.id is invalid`);
+  text(value.runtimeRoot, `${label}.runtimeRoot`, 400);
+  if (value.runtimeRoot === ".") return;
+  const parts = value.runtimeRoot.split("/");
+  if (value.runtimeRoot.startsWith("/") || value.runtimeRoot.includes("\\")
+    || parts.some((part) => !part || part === "." || part === "..")) {
+    fail(`${label}.runtimeRoot must be a contained relative path`);
+  }
+}
+
 function reconcileMetric(actual, expected, label) {
   if (!plainObject(actual)) fail(`${label} must be a metric`);
   for (const [key, value] of Object.entries(expected)) if (actual[key] !== value) fail(`${label}.${key} does not reconcile; expected ${value}`);
diff --git a/ovens/differential-testing/schema/differential-testing-data.schema.json b/ovens/differential-testing/schema/differential-testing-data.schema.json
index 2733ec2..73abde2 100644
--- a/ovens/differential-testing/schema/differential-testing-data.schema.json
+++ b/ovens/differential-testing/schema/differential-testing-data.schema.json
@@ -216,12 +216,22 @@
       "additionalProperties": false
     },
     "scenarioId": { "type": "string", "pattern": "^[a-f0-9]{16}$" },
+    "scenarioEngine": {
+      "type": "object",
+      "required": ["id", "runtimeRoot"],
+      "properties": {
+        "id": { "type": "string", "pattern": "^[A-Za-z][A-Za-z0-9_-]*$", "maxLength": 80 },
+        "runtimeRoot": { "type": "string", "minLength": 1, "maxLength": 400 }
+      },
+      "additionalProperties": false
+    },
     "scenarioCatalogEntry": {
       "type": "object",
       "required": ["id", "label", "frameCount", "replaySha256", "profileSha256", "contractSha256", "updatedAt"],
       "properties": {
         "id": { "$ref": "#/$defs/scenarioId" },
         "label": { "type": "string", "minLength": 1, "maxLength": 160 },
+        "engine": { "$ref": "#/$defs/scenarioEngine" },
         "frameCount": { "type": "integer", "minimum": 1, "maximum": 9007199254740991 },
         "replaySha256": { "$ref": "#/$defs/sha256" },
         "profileSha256": { "$ref": "#/$defs/sha256" },
diff --git a/ovens/visual-parity/detail.json b/ovens/visual-parity/detail.json
new file mode 100644
index 0000000..7407021
--- /dev/null
+++ b/ovens/visual-parity/detail.json
@@ -0,0 +1,41 @@
+{
+  "version": 1,
+  "columns": 12,
+  "rows": 12,
+  "rowHeight": 64,
+  "cells": [
+    {
+      "id": "verdict",
+      "title": "Target verdict",
+      "widget": "status",
+      "source": "/comparisons",
+      "format": "plain",
+      "column": 1,
+      "row": 1,
+      "columnSpan": 3,
+      "rowSpan": 2
+    },
+    {
+      "id": "domains",
+      "title": "Render domains",
+      "widget": "table",
+      "source": "/domains",
+      "format": "plain",
+      "column": 4,
+      "row": 1,
+      "columnSpan": 9,
+      "rowSpan": 2
+    },
+    {
+      "id": "frames",
+      "title": "Frame comparisons",
+      "widget": "comparison",
+      "source": "/comparisons",
+      "format": "plain",
+      "column": 1,
+      "row": 3,
+      "columnSpan": 12,
+      "rowSpan": 10
+    }
+  ]
+}
diff --git a/ovens/visual-parity/engine/visual-parity-contract.mjs b/ovens/visual-parity/engine/visual-parity-contract.mjs
new file mode 100644
index 0000000..38cadd1
--- /dev/null
+++ b/ovens/visual-parity/engine/visual-parity-contract.mjs
@@ -0,0 +1,122 @@
+import { assertDifferentialTestingData } from "../../differential-testing/engine/differential-testing-data-contract.mjs";
+
+export const VISUAL_PARITY_SCHEMA = "burnlist-visual-parity-data@1";
+
+export function assertVisualParityData(value, label = "Visual Parity data") {
+  if (!value || value.schema !== VISUAL_PARITY_SCHEMA) {
+    throw new Error(label + " must use " + VISUAL_PARITY_SCHEMA + ".");
+  }
+  assertDifferentialTestingData(value.differentialTesting);
+  const scenarioId = value.differentialTesting.scenarioCatalog.selectedScenarioId;
+  const scenario = value.differentialTesting.scenarioCatalog.scenarios
+    .find((entry) => entry.id === scenarioId);
+  if (!scenario) throw new Error(label + " must retain one selected Differential Testing scenario.");
+  if (!Array.isArray(value.domains) || value.domains.length < 1 || value.domains.length > 12) {
+    throw new Error(label + " must define 1-12 isolated render domains.");
+  }
+  const domainIds = new Set();
+  const domains = new Map();
+  for (const domain of value.domains) {
+    if (!domain?.id || !/^[a-z][a-z0-9-]*$/u.test(domain.id) || domainIds.has(domain.id)
+      || !domain.label || domain.isolation !== "render-pass"
+      || !["target", "context"].includes(domain.qualification)) {
+      throw new Error(label + " contains an invalid, duplicate, or unqualified render domain.");
+    }
+    domainIds.add(domain.id);
+    domains.set(domain.id, domain);
+    if (domain.tolerance !== undefined) assertTolerance(domain.tolerance, label + ".domains." + domain.id);
+  }
+  if (![...domains.values()].some((domain) => domain.qualification === "target")) {
+    throw new Error(label + " must identify at least one qualifying target domain.");
+  }
+  if (!Array.isArray(value.comparisons) || value.comparisons.length < 1 || value.comparisons.length > 10_000) {
+    throw new Error(label + " must retain 1-10000 frame comparisons.");
+  }
+  let previousFrame = -1;
+  const comparisonIds = new Set();
+  const capturedDomains = new Set();
+  for (const comparison of value.comparisons) {
+    if (!comparison?.id || comparisonIds.has(comparison.id) || !comparison.label
+      || !Number.isSafeInteger(comparison.frame) || comparison.frame <= previousFrame
+      || comparison.frame < 0 || comparison.frame >= scenario.frameCount
+      || !["pass", "fail"].includes(comparison.status)) {
+      throw new Error(label + " contains invalid, duplicate, or unordered frame comparisons.");
+    }
+    comparisonIds.add(comparison.id);
+    previousFrame = comparison.frame;
+    const entries = comparison.domains;
+    if (!entries || typeof entries !== "object" || Array.isArray(entries)
+      || Object.keys(entries).length !== domains.size
+      || Object.keys(entries).some((id) => !domains.has(id))) {
+      throw new Error(label + " frame comparisons must contain every declared domain exactly once.");
+    }
+    for (const [id, domain] of domains) {
+      const entry = entries[id];
+      assertDomainComparison(entry, domain, label + `.comparisons.${comparison.frame}.${id}`);
+      if (entry.reference.src !== null) capturedDomains.add(id);
+    }
+    const expected = [...domains].filter(([, domain]) => domain.qualification === "target")
+      .every(([id]) => entries[id].status === "pass") ? "pass" : "fail";
+    if (comparison.status !== expected) {
+      throw new Error(label + " frame status must reconcile only the qualifying target domains.");
+    }
+  }
+  if ([...domainIds].some((id) => !capturedDomains.has(id))) {
+    throw new Error(label + " must retain one complete screenshot triplet for every domain.");
+  }
+  return value;
+}
+
+function assertTolerance(value, label) {
+  if (!value || !/^[a-z][a-z0-9-]*-visual-parity-tolerance@1$/u.test(value.schema)
+    || !Number.isSafeInteger(value.channelDelta) || value.channelDelta < 0 || value.channelDelta > 255
+    || !finiteRange(value.meanAbsoluteDelta, 0, 255)
+    || !finiteRange(value.changedPixelRatio, 0, 1)
+    || typeof value.rationale !== "string" || !value.rationale.trim() || value.rationale.length > 320) {
+    throw new Error(label + " contains an invalid calibrated tolerance.");
+  }
+}
+
+function assertDomainComparison(value, domain, label) {
+  if (!value || value.label !== domain.label || !["pass", "fail"].includes(value.status)) {
+    throw new Error(label + " must retain the declared domain label and pass/fail status.");
+  }
+  const images = [value.reference, value.candidate, value.diff];
+  for (const image of images) {
+    if (!image?.label || !Number.isSafeInteger(image.width) || image.width < 1 || image.width > 16_384
+      || !Number.isSafeInteger(image.height) || image.height < 1 || image.height > 16_384
+      || !(image.src === null || (typeof image.src === "string" && image.src.startsWith("data:image/png;base64,")))) {
+      throw new Error(label + " contains an invalid screenshot descriptor.");
+    }
+  }
+  if (!images.every((image) => image.width === images[0].width && image.height === images[0].height)
+    || !([0, 3].includes(images.filter((image) => image.src !== null).length))) {
+    throw new Error(label + " screenshot triplets must be complete and dimension-aligned.");
+  }
+  const difference = value.difference;
+  const totalPixels = images[0].width * images[0].height;
+  if (!difference || difference.totalPixels !== totalPixels
+    || !Number.isSafeInteger(difference.changedPixels) || difference.changedPixels < 0
+    || difference.changedPixels > totalPixels
+    || difference.ratio !== difference.changedPixels / totalPixels
+    || !finiteRange(difference.meanAbsoluteDelta, 0, 255)
+    || !finiteRange(difference.maximumAbsoluteDelta, 0, 255)
+    || difference.maximumAbsoluteDelta < difference.meanAbsoluteDelta) {
+    throw new Error(label + " contains contradictory difference metrics.");
+  }
+  const tolerance = domain.tolerance ?? {
+    channelDelta: 0,
+    meanAbsoluteDelta: 0,
+    changedPixelRatio: 0,
+  };
+  const expected = difference.maximumAbsoluteDelta <= tolerance.channelDelta
+    && difference.meanAbsoluteDelta <= tolerance.meanAbsoluteDelta
+    && difference.ratio <= tolerance.changedPixelRatio ? "pass" : "fail";
+  if (value.status !== expected) {
+    throw new Error(label + " status does not reconcile with its declared domain tolerance.");
+  }
+}
+
+function finiteRange(value, minimum, maximum) {
+  return typeof value === "number" && Number.isFinite(value) && value >= minimum && value <= maximum;
+}
diff --git a/ovens/visual-parity/engine/visual-parity-contract.test.mjs b/ovens/visual-parity/engine/visual-parity-contract.test.mjs
new file mode 100644
index 0000000..ce1587c
--- /dev/null
+++ b/ovens/visual-parity/engine/visual-parity-contract.test.mjs
@@ -0,0 +1,101 @@
+import assert from "node:assert/strict";
+import test from "node:test";
+import { buildPayload } from "../../differential-testing/example/adapter.mjs";
+import { assertVisualParityData } from "./visual-parity-contract.mjs";
+
+test("Visual Parity qualifies target domains without hiding failing context", () => {
+  const payload = fixture();
+  assert.equal(assertVisualParityData(payload), payload);
+  assert.equal(payload.comparisons[0].status, "pass");
+  assert.equal(payload.comparisons[0].domains.world.status, "fail");
+});
+
+test("Visual Parity rejects target verdicts that context contamination flips", () => {
+  const payload = fixture();
+  payload.comparisons[0].status = "fail";
+  assert.throws(() => assertVisualParityData(payload), /qualifying target domains/u);
+});
+
+test("Visual Parity enforces every calibrated tolerance dimension", () => {
+  const payload = fixture();
+  payload.domains[1].tolerance.channelDelta = 0;
+  assert.throws(() => assertVisualParityData(payload), /does not reconcile/u);
+});
+
+test("Visual Parity accepts a bounded subset of scenario frames", () => {
+  const payload = fixture();
+  payload.differentialTesting.scenarioCatalog.scenarios[0].frameCount = 10;
+  payload.differentialTesting.refresh.report.frameCount = 10;
+  payload.comparisons[0].frame = 9;
+  assert.doesNotThrow(() => assertVisualParityData(payload));
+
+  payload.comparisons[0].frame = 10;
+  assert.throws(() => assertVisualParityData(payload), /frame comparisons/u);
+});
+
+function fixture() {
+  const generatedAt = "2026-07-16T12:00:00.000Z";
+  const differentialTesting = buildPayload({
+    captureId: "reference-fixture",
+    generatedAt,
+    fields: [{
+      id: "position",
+      label: "Position",
+      sourceOwner: "fixture/state",
+      meaning: "One retained position.",
+      unit: "units",
+      tolerance: 0,
+    }],
+    samples: [{ tick: 0, values: { position: 1 } }],
+  }, {
+    captureId: "candidate-fixture",
+    generatedAt,
+    samples: [{ tick: 0, values: { position: 1 } }],
+  });
+  const image = (label) => ({ label, src: "data:image/png;base64,AA==", width: 1, height: 1 });
+  const difference = { changedPixels: 1, totalPixels: 1, ratio: 1, meanAbsoluteDelta: 1, maximumAbsoluteDelta: 1 };
+  return {
+    schema: "burnlist-visual-parity-data@1",
+    differentialTesting,
+    domains: [
+      { id: "world", label: "World", isolation: "render-pass", qualification: "context" },
+      {
+        id: "cars",
+        label: "Cars",
+        isolation: "render-pass",
+        qualification: "target",
+        tolerance: {
+          schema: "fixture-visual-parity-tolerance@1",
+          channelDelta: 1,
+          meanAbsoluteDelta: 1,
+          changedPixelRatio: 1,
+          rationale: "Fixture-only deterministic raster allowance.",
+        },
+      },
+    ],
+    comparisons: [{
+      id: differentialTesting.scenarioCatalog.selectedScenarioId + "-frame-0",
+      label: "Fixture frame 0",
+      frame: 0,
+      status: "pass",
+      domains: {
+        world: {
+          label: "World",
+          status: "fail",
+          reference: image("Reference"),
+          candidate: image("Candidate"),
+          diff: image("Diff"),
+          difference: { ...difference },
+        },
+        cars: {
+          label: "Cars",
+          status: "pass",
+          reference: image("Reference"),
+          candidate: image("Candidate"),
+          diff: image("Diff"),
+          difference: { ...difference },
+        },
+      },
+    }],
+  };
+}
diff --git a/ovens/visual-parity/engine/visual-parity-handler.mjs b/ovens/visual-parity/engine/visual-parity-handler.mjs
new file mode 100644
index 0000000..0c1f20d
--- /dev/null
+++ b/ovens/visual-parity/engine/visual-parity-handler.mjs
@@ -0,0 +1,73 @@
+import { basename } from "node:path";
+import { registerOvenHandler } from "../../../src/ovens/oven-registry.mjs";
+import { readTextFileWithLimit, safeStat } from "../../../src/server/fs-safe.mjs";
+import { assertVisualParityData } from "./visual-parity-contract.mjs";
+
+function readVisualParityData(bindingPath, maxOvenDataBytes) {
+  const stat = safeStat(bindingPath);
+  if (!stat?.isFile()) throw new Error("configured Visual Parity data is missing");
+  const payload = JSON.parse(readTextFileWithLimit(bindingPath, maxOvenDataBytes, "Visual Parity Oven data"));
+  assertVisualParityData(payload);
+  return { payload, stat };
+}
+
+function targetProgress(payload) {
+  const targetIds = new Set(payload.domains
+    .filter((domain) => domain.qualification === "target")
+    .map((domain) => domain.id));
+  const qualified = payload.comparisons.filter((comparison) => [...targetIds]
+    .every((id) => comparison.domains[id].status === "pass")).length;
+  return { qualified, total: payload.comparisons.length };
+}
+
+export const visualParityHandler = Object.freeze({
+  id: "visual-parity",
+
+  serveData({ bindingPath, maxOvenDataBytes }) {
+    const { payload } = readVisualParityData(bindingPath, maxOvenDataBytes);
+    return { ovenId: "visual-parity", path: bindingPath, payload, validated: true };
+  },
+
+  dashboardEntries(ctx) {
+    return (ctx.ovenDataBindings.get("visual-parity") ?? []).map((binding) => {
+      try {
+        const { payload, stat } = readVisualParityData(binding.path, ctx.maxOvenDataBytes);
+        const scenarioId = payload.differentialTesting.scenarioCatalog.selectedScenarioId;
+        const scenario = payload.differentialTesting.scenarioCatalog.scenarios
+          .find((entry) => entry.id === scenarioId);
+        const progress = targetProgress(payload);
+        const complete = progress.qualified === progress.total;
+        const repo = binding.repoKey === null ? "visual-parity"
+          : ctx.discoveredRepos().find((entry) => entry.repoKey === binding.repoKey)?.name
+            ?? basename(binding.repoRoot);
+        return {
+          id: scenarioId, repo, repoKey: binding.repoKey, repoRoot: binding.repoRoot,
+          title: scenario.label, planPath: null, planLabel: null,
+          status: complete ? "complete" : "active", statusLabel: complete ? "Qualified" : "Open",
+          total: progress.total, done: progress.qualified, remaining: progress.total - progress.qualified,
+          percent: progress.total ? (progress.qualified / progress.total) * 100 : 0,
+          errors: 0, warnings: payload.domains.filter((domain) => domain.qualification === "context"
+            && payload.comparisons.some((comparison) => comparison.domains[domain.id].status === "fail")).length,
+          lastCompletedAt: complete ? payload.differentialTesting.publishedAt : null,
+          updatedAt: payload.differentialTesting.publishedAt ?? stat.mtime.toISOString(),
+          ovenId: "visual-parity", ovenName: "Visual Parity",
+          href: `/ovens/visual-parity/view${binding.repoKey === null ? "" : `?repoKey=${encodeURIComponent(binding.repoKey)}`}`,
+          progressLabel: `${progress.qualified}/${progress.total} target frames`,
+        };
+      } catch (error) {
+        const repo = binding.repoKey === null ? "visual-parity" : basename(binding.repoRoot);
+        return {
+          id: `blocked-${binding.repoKey ?? "global"}`, repo, repoKey: binding.repoKey, repoRoot: binding.repoRoot,
+          title: "Visual Parity", planPath: null, planLabel: "Oven data binding",
+          status: "active", statusLabel: "Blocked", total: 0, done: null, remaining: null, percent: null,
+          errors: 1, warnings: 0, lastCompletedAt: null, updatedAt: null,
+          ovenId: "visual-parity", ovenName: "Visual Parity",
+          href: `/ovens/visual-parity/view${binding.repoKey === null ? "" : `?repoKey=${encodeURIComponent(binding.repoKey)}`}`,
+          progressLabel: "Blocked", blockers: String(error?.message ?? error ?? "Data binding is unavailable.").slice(0, 200),
+        };
+      }
+    });
+  },
+});
+
+registerOvenHandler("visual-parity", visualParityHandler);
diff --git a/ovens/visual-parity/instructions.md b/ovens/visual-parity/instructions.md
new file mode 100644
index 0000000..e6876e4
--- /dev/null
+++ b/ovens/visual-parity/instructions.md
@@ -0,0 +1,7 @@
+# Visual Parity
+
+Visual Parity compares trusted reference and candidate frames as isolated render passes. Each domain declares whether it qualifies the current scenario (`target`) or remains visible diagnostic context (`context`), so unrelated render domains never contaminate one another.
+
+The project adapter publishes `burnlist-visual-parity-data@1`. A passing domain must satisfy its explicit calibrated channel, mean-delta, and changed-pixel bounds. Context domains remain visible and retain their own pass/fail state, but do not decide the target scenario verdict.
+
+Do not widen a tolerance to make a regression green. Calibrate only a deterministic renderer-boundary residual with a written rationale, preserve the zero-tolerance default, and keep gameplay/state authority in the linked Differential Testing payload.
diff --git a/ovens/visual-parity/renderer/visual-parity.css b/ovens/visual-parity/renderer/visual-parity.css
new file mode 100644
index 0000000..eb42b91
--- /dev/null
+++ b/ovens/visual-parity/renderer/visual-parity.css
@@ -0,0 +1,107 @@
+.visual-parity-page {
+  width: min(1500px, 100%);
+  margin: 0 auto;
+  padding: 24px;
+  color: var(--text);
+}
+
+.visual-parity-state {
+  padding: 48px 24px;
+  color: var(--muted);
+  text-align: center;
+}
+
+.visual-parity-state.is-error,
+.visual-parity-refresh-error { color: var(--status-red); }
+
+.visual-parity-heading {
+  display: grid;
+  grid-template-columns: minmax(110px, auto) 1fr auto;
+  align-items: center;
+  gap: 24px;
+  padding-bottom: 20px;
+}
+
+.visual-parity-heading p { margin: 4px 0 0; color: var(--muted); }
+.visual-parity-back { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); }
+.visual-parity-back svg { width: 16px; }
+.visual-parity-verdict { font: 400 24px/1.1 var(--dashboard-title-font); }
+.visual-parity-verdict.pass { color: var(--status-green); }
+.visual-parity-verdict.fail { color: var(--status-red); }
+
+.visual-parity-domains {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
+  border: 1px solid var(--line);
+  background: var(--panel);
+}
+
+.visual-parity-domains button {
+  display: grid;
+  gap: 3px;
+  padding: 14px 16px;
+  border-right: 1px solid var(--line);
+  color: var(--muted);
+  text-align: left;
+  cursor: pointer;
+}
+
+.visual-parity-domains button:last-child { border-right: 0; }
+.visual-parity-domains button.is-active { box-shadow: inset 0 -2px 0 var(--active); color: var(--text); }
+.visual-parity-domains small { color: var(--muted); text-transform: capitalize; }
+
+.visual-parity-metrics {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  border: 1px solid var(--line);
+  border-top: 0;
+}
+
+.visual-parity-metrics article {
+  display: grid;
+  gap: 4px;
+  padding: 16px;
+  border-right: 1px solid var(--line);
+}
+
+.visual-parity-metrics article:last-child { border-right: 0; }
+.visual-parity-metrics span { color: var(--muted); }
+.visual-parity-metrics strong { font: 400 20px/1 var(--dashboard-title-font); }
+
+.visual-parity-domain-note {
+  display: flex;
+  gap: 12px;
+  align-items: baseline;
+  padding: 14px 16px;
+  border: 1px solid var(--line);
+  border-top: 0;
+}
+
+.visual-parity-domain-note span { color: var(--muted); }
+.visual-parity-frames { display: grid; gap: 10px; margin-top: 20px; }
+.visual-parity-frame { border: 1px solid var(--line); background: var(--panel); }
+.visual-parity-frame.pass { border-left: 2px solid var(--status-green); }
+.visual-parity-frame.fail { border-left: 2px solid var(--status-red); }
+
+.visual-parity-frame > header {
+  display: flex;
+  justify-content: space-between;
+  gap: 16px;
+  padding: 12px 14px;
+}
+
+.visual-parity-frame > header span { color: var(--muted); }
+.visual-parity-shots { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); }
+.visual-parity-shots figure { margin: 0; padding: 12px; border-right: 1px solid var(--line); }
+.visual-parity-shots figure:last-child { border-right: 0; }
+.visual-parity-shots figcaption { margin-bottom: 8px; color: var(--muted); }
+.visual-parity-shots img { width: 100%; height: auto; background: #87ceeb; image-rendering: pixelated; }
+
+@media (max-width: 760px) {
+  .visual-parity-heading { grid-template-columns: 1fr; gap: 10px; }
+  .visual-parity-metrics { grid-template-columns: repeat(2, 1fr); }
+  .visual-parity-metrics article:nth-child(2) { border-right: 0; }
+  .visual-parity-shots { grid-template-columns: 1fr; }
+  .visual-parity-shots figure { border-right: 0; border-bottom: 1px solid var(--line); }
+  .visual-parity-frame > header, .visual-parity-domain-note { align-items: flex-start; flex-direction: column; }
+}
diff --git a/package.json b/package.json
index 80a95da..229ff8e 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
     "build:dashboard": "vite build --config dashboard/vite.config.mjs",
     "test:differential-testing": "node --test ovens/differential-testing/engine/differential-testing-adapter-sdk.test.mjs ovens/differential-testing/engine/differential-testing-contract.test.mjs ovens/differential-testing/engine/differential-testing-data-contract.test.mjs ovens/differential-testing/engine/differential-testing-transport-renderer.test.mjs ovens/differential-testing/engine/differential-testing-transport-server.test.mjs",
     "test:performance-tracing": "node --test ovens/performance-tracing/engine/performance-tracing-contract.test.mjs",
+    "test:visual-parity": "node --test ovens/visual-parity/engine/visual-parity-contract.test.mjs",
     "verify": "node scripts/verify.mjs",
     "verify:clean": "node scripts/verify-clean.mjs",
     "verify:package": "node scripts/verify-package.mjs",
diff --git a/scripts/verify-package.mjs b/scripts/verify-package.mjs
index 9025ca1..0251505 100755
--- a/scripts/verify-package.mjs
+++ b/scripts/verify-package.mjs
@@ -58,6 +58,11 @@ const required = [
   "ovens/performance-tracing/detail.json",
   "ovens/performance-tracing/engine/performance-tracing-contract.mjs",
   "ovens/performance-tracing/engine/performance-tracing-handler.mjs",
+  "ovens/visual-parity/instructions.md",
+  "ovens/visual-parity/detail.json",
+  "ovens/visual-parity/engine/visual-parity-contract.mjs",
+  "ovens/visual-parity/engine/visual-parity-handler.mjs",
+  "ovens/visual-parity/renderer/visual-parity.css",
   "dashboard/dist/index.html",
 ];
 
diff --git a/scripts/verify-test-files.mjs b/scripts/verify-test-files.mjs
index ffedb2f..c6319ef 100644
--- a/scripts/verify-test-files.mjs
+++ b/scripts/verify-test-files.mjs
@@ -13,6 +13,7 @@ export const verificationTestFiles = [
   "ovens/differential-testing/engine/differential-testing-data-contract.test.mjs",
   "ovens/differential-testing/engine/differential-testing-transport-server.test.mjs",
   "ovens/performance-tracing/engine/performance-tracing-contract.test.mjs",
+  "ovens/visual-parity/engine/visual-parity-contract.test.mjs",
   "ovens/streaming-diff/engine/streaming-diff-data-contract.test.mjs",
   "ovens/streaming-diff/engine/streaming-diff-capture.test.mjs",
   "ovens/streaming-diff/engine/streaming-diff-capture-git.test.mjs",
diff --git a/scripts/verify.mjs b/scripts/verify.mjs
index 9b3e338..8695282 100755
--- a/scripts/verify.mjs
+++ b/scripts/verify.mjs
@@ -49,6 +49,8 @@ function withoutCanonicalTemplateVocabulary(text) {
   return text
     .replaceAll(/driving-parity/giu, "")
     .replaceAll(/driving parity/giu, "")
+    .replaceAll(/visual-parity/giu, "")
+    .replaceAll(/visual parity/giu, "")
     .replaceAll(/parity progress/giu, "");
 }
 
@@ -221,6 +223,7 @@ const jsFiles = [...new Set([
   ...walkFiles(resolve(repoRoot, "ovens/differential-testing/engine"), (path) => path.endsWith(".mjs")),
   ...walkFiles(resolve(repoRoot, "ovens/performance-tracing/engine"), (path) => path.endsWith(".mjs")),
   ...walkFiles(resolve(repoRoot, "ovens/streaming-diff/engine"), (path) => path.endsWith(".mjs")),
+  ...walkFiles(resolve(repoRoot, "ovens/visual-parity/engine"), (path) => path.endsWith(".mjs")),
   resolve(repoRoot, "src/ovens/oven-registry.mjs"),
   resolve(repoRoot, "src/ovens/built-in-handlers.mjs"),
   resolve(repoRoot, "src/ovens/handlers/generic-json-handler.mjs"),
@@ -252,6 +255,7 @@ assertSourceIncludes(".github/workflows/publish.yml", '"refs/tags/${VERSION}^{}"
 assertSourceIncludes("src/server/burnlist-dashboard-server.mjs", "ovenId(record.ovenId);", "Burn run reads do not require the canonical ovenId.");
 assertSourceIncludes("ovens/differential-testing/engine/differential-testing-handler.mjs", "assertDifferentialTestingData(payload)", "Differential Testing data is not validated at the server boundary.");
 assertSourceIncludes("ovens/performance-tracing/engine/performance-tracing-handler.mjs", "assertPerformanceTracingData(payload)", "Performance Tracing data is not validated at the server boundary.");
+assertSourceIncludes("ovens/visual-parity/engine/visual-parity-handler.mjs", "assertVisualParityData(payload)", "Visual Parity data is not validated at the server boundary.");
 assertSourceIncludes("ovens/differential-testing/engine/differential-testing-handler.mjs", 'ovenName: "Differential Testing"', "Differential Testing scenarios are missing from the shared dashboard table.");
 assertSourceIncludes("ovens/differential-testing/engine/differential-testing-handler.mjs", "queryDifferentialTestingFieldPage", "Differential Testing server is missing bounded field-page transport.");
 assertSourceExcludes("src/server/burnlist-dashboard-server.mjs", 'id === "differential-testing"', "Dashboard server still hardcodes the Differential Testing Oven.");
@@ -372,11 +376,12 @@ assertSourceExcludes("src/server/burnlist-dashboard-server.mjs", '"/targets"', "
 assertSourceExcludes("dashboard/src/App.tsx", '"/targets"', "React dashboard still exposes the removed Targets route.");
 assertSourceExcludes("src/ovens/oven-contract.mjs", '"target"', "Oven contract still accepts the removed Target widget.");
 assertSkillSet(repoRoot, ["burnlist"]);
-assertBuiltInOvenSet(repoRoot, ["checklist", "differential-testing", "performance-tracing", "streaming-diff"]);
+assertBuiltInOvenSet(repoRoot, ["checklist", "differential-testing", "performance-tracing", "streaming-diff", "visual-parity"]);
 assertBuiltInOven(repoRoot, "checklist", "Checklist");
 assertBuiltInOven(repoRoot, "differential-testing", "Differential Testing");
 assertBuiltInOven(repoRoot, "performance-tracing", "Performance Tracing");
 assertBuiltInOven(repoRoot, "streaming-diff", "Streaming Diff");
+assertBuiltInOven(repoRoot, "visual-parity", "Visual Parity");
 assertDifferentialTestingContractAssets();
 assertPublishablePackage();
 
diff --git a/src/ovens/built-in-handlers.mjs b/src/ovens/built-in-handlers.mjs
index 84c56cc..106b071 100644
--- a/src/ovens/built-in-handlers.mjs
+++ b/src/ovens/built-in-handlers.mjs
@@ -2,3 +2,4 @@ import "./handlers/checklist.mjs";
 import "../../ovens/differential-testing/engine/differential-testing-handler.mjs";
 import "../../ovens/performance-tracing/engine/performance-tracing-handler.mjs";
 import "../../ovens/streaming-diff/engine/streaming-diff-handler.mjs";
+import "../../ovens/visual-parity/engine/visual-parity-handler.mjs";