style(webui): improve typography with Apple-inspired font stack and CJK support

- Add explicit CJK fonts (PingFang SC, Noto Sans SC, Microsoft YaHei) and
  programmer fonts (JetBrains Mono, Fira Code, Cascadia Code) to Tailwind config
- Bump prose base size from prose-sm (14px) to prose-lg (18px) for sharper CJK rendering
- Unify user/assistant message font size at 18px with CJK-aware line-height (1.8)
- Replace pure black/white foreground with Apple-style warm grays (#1d1d1f / #f5f5f7)
- Override Tailwind Typography colors to use design tokens for consistency
- Add negative letter-spacing on headings for tighter, more polished look

webui/src/globals.css

@@ -6,12 +6,12 @@
 @layer base {
   :root {
     --background: 0 0% 100%;
-    --foreground: 0 0% 3.9%;
+    --foreground: 240 3% 12%;
     --card: 0 0% 100%;
-    --card-foreground: 0 0% 3.9%;
+    --card-foreground: 240 3% 12%;
     --popover: 0 0% 100%;
-    --popover-foreground: 0 0% 3.9%;
-    --primary: 0 0% 9%;
+    --popover-foreground: 240 3% 12%;
+    --primary: 240 4% 16%;
     --primary-foreground: 0 0% 98%;
     --secondary: 0 0% 96.1%;
     --secondary-foreground: 0 0% 9%;
@@ -34,12 +34,12 @@
 
   .dark {
     --background: 0 0% 10%;
-    --foreground: 0 0% 98%;
+    --foreground: 240 4% 96%;
     --card: 0 0% 12%;
-    --card-foreground: 0 0% 98%;
+    --card-foreground: 240 4% 96%;
     --popover: 0 0% 12%;
-    --popover-foreground: 0 0% 98%;
-    --primary: 0 0% 98%;
+    --popover-foreground: 240 4% 96%;
+    --primary: 240 5% 98%;
     --primary-foreground: 0 0% 9%;
     --secondary: 0 0% 12%;
     --secondary-foreground: 0 0% 98%;
@@ -72,11 +72,7 @@
   }
 
   body {
-    @apply bg-background text-foreground antialiased;
-    font-family:
-      ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
-      Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif,
-      "Apple Color Emoji", "Segoe UI Emoji";
+    @apply bg-background text-foreground font-sans antialiased;
   }
 
   ::selection {
@@ -97,6 +93,30 @@
     @apply mb-0;
   }
 
+  /* Override Tailwind Typography's built-in colors with our design tokens
+     so assistant messages use the same --foreground as user messages. */
+  .markdown-content {
+    --tw-prose-body: hsl(var(--foreground));
+    --tw-prose-headings: hsl(var(--foreground));
+    --tw-prose-bold: hsl(var(--foreground));
+    --tw-prose-lead: hsl(var(--foreground));
+  }
+
+  /* CJK-friendly line-height: prose paragraphs default to 1.625 which is
+     tight for Chinese/Japanese/Korean characters. Bump to 1.8 for better
+     readability when the browser detects a CJK primary font. */
+  :lang(zh),
+  :lang(zh-CN),
+  :lang(zh-TW),
+  :lang(zh-HK),
+  :lang(ja),
+  :lang(ko) {
+    --cjk-line-height: 1.8;
+  }
+  :root {
+    --cjk-line-height: 1.625;
+  }
+
   /* Subtle scrollbar that doesn't fight the dark background. */
   .scrollbar-thin {
     scrollbar-width: thin;