feat: add per-project font override settings

Add font selectors that allow per-project font customization for both
sans and mono fonts, independent of theme selection. Uses system fonts.

- Add fontFamilySans and fontFamilyMono to ProjectSettings and Project types
- Create ui-font-options.ts config with system font options
- Add store actions: setProjectFontSans, setProjectFontMono, getEffectiveFontSans, getEffectiveFontMono
- Apply font CSS variables in root component
- Add font selector UI in project-theme-section (Project Settings → Theme)

apps/ui/src/routes/__root.tsx

@@ -158,6 +158,8 @@ function RootLayoutContent() {
     projectHistory,
     upsertAndSetCurrentProject,
     getEffectiveTheme,
+    getEffectiveFontSans,
+    getEffectiveFontMono,
     skipSandboxWarning,
     setSkipSandboxWarning,
     fetchCodexModels,
@@ -248,6 +250,10 @@ function RootLayoutContent() {
   // Defer the theme value to keep UI responsive during rapid hover changes
   const deferredTheme = useDeferredValue(effectiveTheme);
 
+  // Get effective fonts for the current project
+  const effectiveFontSans = getEffectiveFontSans();
+  const effectiveFontMono = getEffectiveFontMono();
+
   useEffect(() => {
     setIsMounted(true);
   }, []);
@@ -727,6 +733,23 @@ function RootLayoutContent() {
     }
   }, [deferredTheme]);
 
+  // Apply font CSS variables for project-specific font overrides
+  useEffect(() => {
+    const root = document.documentElement;
+
+    if (effectiveFontSans) {
+      root.style.setProperty('--font-sans', effectiveFontSans);
+    } else {
+      root.style.removeProperty('--font-sans');
+    }
+
+    if (effectiveFontMono) {
+      root.style.setProperty('--font-mono', effectiveFontMono);
+    } else {
+      root.style.removeProperty('--font-mono');
+    }
+  }, [effectiveFontSans, effectiveFontMono]);
+
   // Show sandbox rejection screen if user denied the risk warning
   if (sandboxStatus === 'denied') {
     return <SandboxRejectionScreen />;