diff --git a/apps/web/src/components/DiffPanel.tsx b/apps/web/src/components/DiffPanel.tsx
index acf07f94f4846a5761cb7af614f18f6e0851952c..d45ef6a26c5a65498e3f5ddd97ef9daa6f46d1a7 100644
--- a/apps/web/src/components/DiffPanel.tsx
+++ b/apps/web/src/components/DiffPanel.tsx
@@ -464,7 +464,7 @@ export default function DiffPanel({ mode = "inline" }: DiffPanelProps) {
               </div>
             ) : renderablePatch.kind === "files" ? (
               <Virtualizer
-                className="h-full min-h-0 overflow-auto px-3 py-2"
+                className="diff-render-surface h-full min-h-0 overflow-auto px-3 py-2"
                 config={{
                   overscrollSize: 600,
                   intersectionObserverMargin: 1200,
@@ -475,7 +475,11 @@ export default function DiffPanel({ mode = "inline" }: DiffPanelProps) {
                   const fileKey = buildFileDiffRenderKey(fileDiff);
                   const themedFileKey = `${fileKey}:${resolvedTheme}`;
                   return (
-                    <div key={themedFileKey} data-diff-file-path={filePath} className="rounded-md">
+                    <div
+                      key={themedFileKey}
+                      data-diff-file-path={filePath}
+                      className="diff-render-file rounded-md"
+                    >
                       <FileDiff
                         fileDiff={fileDiff}
                         options={{
diff --git a/apps/web/src/index.css b/apps/web/src/index.css
index 0ecf9313919f217b984904db8ee6512886f6dc49..274c1d739e72d12e8e926f42abcf56ff14d0a35d 100644
--- a/apps/web/src/index.css
+++ b/apps/web/src/index.css
@@ -314,6 +314,10 @@ label:has(> select#reasoning-effort) select {
   font-size: 0.875rem;
 }
 
+.chat-markdown .chat-markdown-shiki .shiki {
+  background: color-mix(in srgb, var(--muted) 78%, var(--background)) !important;
+}
+
 .chat-markdown table {
   width: 100%;
   border-collapse: collapse;
@@ -325,3 +329,49 @@ label:has(> select#reasoning-effort) select {
   padding: 0.35rem 0.45rem;
   text-align: left;
 }
+
+/* Diffs theme bridge (match diff surfaces to app palette) */
+.diff-render-surface [data-diffs-header],
+.diff-render-surface [data-diff],
+.diff-render-surface [data-file],
+.diff-render-surface [data-error-wrapper],
+.diff-render-surface [data-virtualizer-buffer] {
+  --diffs-light-bg: color-mix(in srgb, var(--card) 92%, var(--background));
+  --diffs-dark-bg: color-mix(in srgb, var(--card) 92%, var(--background));
+
+  --diffs-bg-context-override: color-mix(in srgb, var(--background) 97%, var(--foreground));
+  --diffs-bg-hover-override: color-mix(in srgb, var(--background) 94%, var(--foreground));
+  --diffs-bg-separator-override: color-mix(in srgb, var(--background) 95%, var(--foreground));
+  --diffs-bg-buffer-override: color-mix(in srgb, var(--background) 90%, var(--foreground));
+
+  --diffs-bg-addition-override: color-mix(in srgb, var(--background) 92%, var(--success));
+  --diffs-bg-addition-number-override: color-mix(in srgb, var(--background) 88%, var(--success));
+  --diffs-bg-addition-hover-override: color-mix(in srgb, var(--background) 85%, var(--success));
+  --diffs-bg-addition-emphasis-override: color-mix(in srgb, var(--background) 80%, var(--success));
+
+  --diffs-bg-deletion-override: color-mix(in srgb, var(--background) 92%, var(--destructive));
+  --diffs-bg-deletion-number-override: color-mix(
+    in srgb,
+    var(--background) 88%,
+    var(--destructive)
+  );
+  --diffs-bg-deletion-hover-override: color-mix(in srgb, var(--background) 85%, var(--destructive));
+  --diffs-bg-deletion-emphasis-override: color-mix(
+    in srgb,
+    var(--background) 80%,
+    var(--destructive)
+  );
+}
+
+.diff-render-surface [data-file-info] {
+  background-color: color-mix(in srgb, var(--card) 94%, var(--foreground)) !important;
+  border-block-color: var(--border) !important;
+  color: var(--foreground) !important;
+}
+
+.diff-render-file [data-diff],
+.diff-render-file [data-file] {
+  border: 1px solid var(--border);
+  border-radius: 0.5rem;
+  overflow: clip;
+}