Use Inter for app typography

Author: klopez4212

desktop/package.json

@@ -26,6 +26,7 @@
     "@dnd-kit/utilities": "^3.2.2",
     "@emoji-mart/data": "^1.2.1",
     "@emoji-mart/react": "^1.1.1",
+    "@fontsource-variable/inter": "^5.2.8",
     "@radix-ui/react-alert-dialog": "^1.1.15",
     "@radix-ui/react-avatar": "^1.1.11",
     "@radix-ui/react-checkbox": "^1.3.3",

desktop/src-tauri/src/mesh_llm/preset.rs

@@ -34,8 +34,8 @@ pub fn agent_preset(request: MeshAgentPresetRequest) -> Result<MeshAgentPreset,
         return Err("modelId is required".to_string());
     }
     // Run on sprout-agent, not the global default (goose). Source command +
-    // MCP from the catalog so this can't drift from the provider definition.
-    let sprout_agent = crate::managed_agents::known_acp_provider_exact(MESH_AGENT_PROVIDER_ID);
+    // MCP from the catalog so this can't drift from the runtime definition.
+    let sprout_agent = crate::managed_agents::known_acp_runtime_exact(MESH_AGENT_PROVIDER_ID);
     let agent_command = sprout_agent
         .and_then(|p| p.commands.first().copied())
         .unwrap_or(MESH_AGENT_PROVIDER_ID)

desktop/src/main.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
 import { App } from "@/app/App";
+import "@fontsource-variable/inter/wght.css";
 import "@/shared/styles/globals.css";
 import { UpdaterProvider } from "@/features/settings/hooks/UpdaterProvider";
 import { WorkspacesProvider } from "@/features/workspaces/useWorkspaces";

desktop/src/shared/styles/globals.css

@@ -306,7 +306,7 @@
 
   body {
     @apply bg-background text-foreground antialiased;
-    font-family: "Geist", "Avenir Next", "Segoe UI", sans-serif;
+    font-family: "Inter Variable", Inter, "Avenir Next", "Segoe UI", sans-serif;
   }
 
   /*

desktop/tailwind.config.js

@@ -7,6 +7,15 @@ export default {
         md: "calc(var(--radius) - 2px)",
         sm: "calc(var(--radius) - 4px)",
       },
+      fontFamily: {
+        sans: [
+          '"Inter Variable"',
+          "Inter",
+          '"Avenir Next"',
+          '"Segoe UI"',
+          "sans-serif",
+        ],
+      },
       colors: {
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",

pnpm-lock.yaml

@@ -16,6 +16,7 @@
     "test:e2e:smoke": "pnpm build && playwright test --project=smoke"
   },
   "dependencies": {
+    "@fontsource-variable/inter": "^5.2.8",
     "@isomorphic-git/lightning-fs": "^4.6.2",
     "@radix-ui/react-slot": "^1.2.4",
     "@radix-ui/react-tooltip": "^1.2.8",
@@ -37,12 +38,12 @@
   },
   "devDependencies": {
     "@playwright/test": "^1.58.2",
+    "@tailwindcss/postcss": "^4.3.0",
     "@tanstack/router-plugin": "^1.167.12",
     "@tanstack/virtual-file-routes": "^1.161.7",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
     "@vitejs/plugin-react": "^6.0.0",
-    "@tailwindcss/postcss": "^4.3.0",
     "postcss": "^8.5.8",
     "tailwindcss": "^4.3.0",
     "tw-animate-css": "^1.4.0",

web/package.json

@@ -2,6 +2,7 @@ import React from "react";
 import ReactDOM from "react-dom/client";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { App } from "@/app/App";
+import "@fontsource-variable/inter/wght.css";
 import "@/shared/styles/globals.css";
 import { ThemeProvider } from "@/shared/theme/ThemeProvider";
 import { Toaster } from "@/shared/ui/sonner";

web/src/main.tsx

@@ -95,6 +95,6 @@
 
   body {
     @apply bg-background text-foreground antialiased;
-    font-family: "Geist", "Avenir Next", "Segoe UI", sans-serif;
+    font-family: "Inter Variable", Inter, "Avenir Next", "Segoe UI", sans-serif;
   }
 }

web/src/shared/styles/globals.css

@@ -7,6 +7,15 @@ export default {
         md: "calc(var(--radius) - 2px)",
         sm: "calc(var(--radius) - 4px)",
       },
+      fontFamily: {
+        sans: [
+          '"Inter Variable"',
+          "Inter",
+          '"Avenir Next"',
+          '"Segoe UI"',
+          "sans-serif",
+        ],
+      },
       colors: {
         background: "hsl(var(--background))",
         foreground: "hsl(var(--foreground))",