feat(web): shiki syntax highlighting for code surfaces

One highlighter for the client: a synchronous fine-grained shiki core
(JS regex engine, no WASM) in ui-primitives with an explicit grammar
allowlist (typescript, shellscript, json — aliases resolve, unknown
languages take a geometry-identical plain arm). The shared CodeBlock
component owns both arms; markdown fences, the run_code expanded
program body (typescript), and the details panel Input (json) all
route through it. Token colors live in a new ui-theme shiki.css sheet
as --shiki-* custom properties (light/dark blocks), wired through the
shell's base.css chain — tokens-only styling holds; shiki's generated
span tree is the sanctioned innerHTML path (static output, no user
HTML). jsdom specs pin token spans, aliases, both fallbacks, and the
fence route; the built-bundle snapshot asserts the highlighted program
under the code row.

packages/client/ui-primitives/src/markdown/MarkdownText.tsx

@@ -1,6 +1,8 @@
+import { isValidElement } from 'react'
 import ReactMarkdown from 'react-markdown'
 import type { Components, UrlTransform } from 'react-markdown'
 import remarkGfm from 'remark-gfm'
+import { CodeBlock } from './CodeBlock.tsx'
 import css from './MarkdownText.module.css'
 
 const remarkPlugins = [remarkGfm]
@@ -42,6 +44,19 @@ const components: Components = {
       <table>{children}</table>
     </div>
   ),
+  // Fenced blocks route through the shared CodeBlock (shiki for registered
+  // grammars, identical-geometry plain fallback for unknown/absent languages);
+  // inline code keeps the default <code> path (the :not(pre) rule styles it).
+  pre: ({ children }) => {
+    const child = isValidElement<{ className?: string; children?: unknown }>(children) ? children : undefined
+    const raw = child?.props.children
+    const text = typeof raw === 'string' ? raw : Array.isArray(raw) && typeof raw[0] === 'string' ? raw[0] : undefined
+    // A fence whose content isn't one plain string (never produced by the
+    // markdown pipeline) keeps the stock <pre> rather than guessing.
+    if (text === undefined) return <pre>{children}</pre>
+    const lang = /language-([\w-]+)/.exec(child?.props.className ?? '')?.[1]
+    return <CodeBlock code={text} lang={lang} />
+  },
 }
 
 /**