feat: enhance font styling in Diff Viewer and Streamdown components

packages/ui/src/components/views/PierreDiffViewer.tsx

@@ -19,12 +19,23 @@ interface PierreDiffViewerProps {
 // CSS injected into Pierre's Shadow DOM for WebKit scroll optimization
 // Note: avoid will-change and contain:paint as they break resize behavior
 const WEBKIT_SCROLL_FIX_CSS = `
+  :host {
+    font-family: var(--font-mono);
+    font-size: var(--text-code);
+  }
+
   :host, pre, [data-diffs], [data-code] {
     transform: translateZ(0);
     -webkit-transform: translateZ(0);
     -webkit-backface-visibility: hidden;
     backface-visibility: hidden;
   }
+
+  pre, [data-code] {
+    font-family: var(--font-mono);
+    font-size: var(--text-code);
+  }
+
   [data-code] {
     -webkit-overflow-scrolling: touch;
   }

packages/ui/src/index.css

@@ -1381,10 +1381,12 @@ html:not(.dark) .chat-scroll {
 .streamdown-content code,
 .streamdown-content pre {
   font-family: var(--font-mono);
+  font-size: var(--text-code);
 }
 
 /* Streamdown code blocks: ensure light/dark Shiki vars work even when Tailwind doesn't scan Streamdown's internal class names. */
 .streamdown-content [data-streamdown="code-block-body"] {
+  font-size: var(--text-code);
   background-color: var(--shiki-light-bg, transparent);
   color: var(--shiki-light, inherit);
 }