From 5ec26f0c093c801e777f51cb46b97b297591a4b4 Mon Sep 17 00:00:00 2001
From: Mohamed Boudra <boudra.moha@gmail.com>
Date: Mon, 17 Aug 2026 22:34:54 +0200
Subject: [PATCH] feat(app): align interface typography to base size

Treat the appearance setting as the rendered base size so the type ramp scales predictably. Native starts one pixel larger while web and desktop preserve the authored 14px base, with legacy values migrated on load.
---
 docs/design.md                                |  8 ++-
 .../settings/agent-profile-edit-modal.tsx     |  6 +-
 .../settings/agent-profile-row.tsx            |  4 +-
 .../settings/agent-profiles-section.tsx       |  2 +-
 .../agent-stream/chat-outline/rail.web.tsx    |  2 +-
 packages/app/src/app/_layout.tsx              |  4 +-
 packages/app/src/app/pair-scan.tsx            |  2 +-
 .../app/src/assistant-file-links/link.tsx     |  2 +-
 .../app/src/command-center/command-center.tsx | 16 ++---
 .../src/components/adaptive-modal-sheet.tsx   |  6 +-
 .../src/components/add-host-method-modal.tsx  |  2 +-
 .../app/src/components/add-host-modal.tsx     |  8 +--
 .../app/src/components/add-project-flow.tsx   | 16 ++---
 packages/app/src/components/agent-list.tsx    | 22 +++----
 .../src/components/app-diagnostic-sheet.tsx   |  2 +-
 .../components/appearance-style-boundary.tsx  |  1 -
 .../src/components/archived-agent-callout.tsx |  2 +-
 .../src/components/assistant-fork-menu.tsx    |  2 +-
 .../src/components/attachment-lightbox.tsx    |  2 +-
 .../app/src/components/attachment-pill.tsx    |  4 +-
 .../app/src/components/branch-switcher.tsx    |  4 +-
 .../components/combined-model-selector.tsx    |  4 +-
 .../src/components/context-window-meter.tsx   | 14 ++---
 .../app/src/components/dictation-controls.tsx |  8 +--
 packages/app/src/components/diff-stat.tsx     |  4 +-
 packages/app/src/components/diff-viewer.tsx   |  2 +-
 .../app/src/components/download-toast.tsx     |  4 +-
 .../app/src/components/explorer-sidebar.tsx   |  2 +-
 .../app/src/components/file-explorer-pane.tsx | 20 +++----
 .../headers/header-toggle-button.tsx          |  2 +-
 .../app/src/components/hosts/host-filter.tsx  |  2 +-
 .../src/components/import-session-sheet.tsx   | 10 ++--
 .../components/keyboard-shortcuts-dialog.tsx  | 10 ++--
 packages/app/src/components/left-sidebar.tsx  |  8 +--
 .../app/src/components/markdown/renderer.tsx  |  2 +-
 packages/app/src/components/message.tsx       | 26 ++++-----
 packages/app/src/components/model-browser.tsx | 14 ++---
 .../app/src/components/pair-link-modal.tsx    |  6 +-
 packages/app/src/components/plan-card.tsx     |  2 +-
 .../src/components/provider-catalog-list.tsx  | 12 ++--
 .../components/provider-diagnostic-sheet.tsx  | 14 ++---
 .../app/src/components/question-form-card.tsx |  8 +--
 .../app/src/components/quitting-overlay.tsx   |  2 +-
 packages/app/src/components/rename-modal.tsx  |  2 +-
 .../app/src/components/rewind/rewind-menu.tsx |  4 +-
 .../src/components/root-error-boundary.tsx    |  6 +-
 .../components/schedules/cadence-editor.tsx   |  4 +-
 .../schedules/schedule-form-sheet.tsx         |  4 +-
 .../src/components/schedules/schedule-row.tsx |  2 +-
 .../app/src/components/settings-textarea.tsx  |  2 +-
 .../app/src/components/sidebar-callout.tsx    |  6 +-
 .../src/components/sidebar-workspace-list.tsx | 22 +++----
 .../sidebar/pinned-section-header.tsx         |  2 +-
 .../sidebar/sidebar-group-toggle-row.tsx      |  4 +-
 .../components/sidebar/sidebar-header-row.tsx |  2 +-
 .../components/sidebar/sidebar-help-menu.tsx  |  2 +-
 .../sidebar/sidebar-status-list.tsx           |  2 +-
 .../sidebar/sidebar-workspace-row-content.tsx |  4 +-
 .../sidebar/sidebar-workspace-row.tsx         |  2 +-
 .../sidebar/workspace-meta-row/index.tsx      | 18 +++---
 .../sidebar/workspace-trailing/index.tsx      |  2 +-
 .../app/src/components/split-container.tsx    |  2 +-
 packages/app/src/components/task-list-row.tsx |  2 +-
 .../terminal-copy-paste-actions.tsx           |  4 +-
 packages/app/src/components/terminal-pane.tsx |  6 +-
 packages/app/src/components/toast-host.tsx    |  2 +-
 .../app/src/components/tool-call-details.tsx  |  8 +--
 .../app/src/components/tool-call-sheet.tsx    |  2 +-
 packages/app/src/components/ui/alert.tsx      |  4 +-
 .../app/src/components/ui/autocomplete.tsx    | 16 ++---
 packages/app/src/components/ui/combobox.tsx   | 10 ++--
 .../components/ui/control-geometry.test.ts    | 18 +++---
 .../app/src/components/ui/control-geometry.ts | 14 ++---
 .../app/src/components/ui/external-link.tsx   |  6 +-
 packages/app/src/components/ui/form-field.tsx | 10 ++--
 .../app/src/components/ui/menu/menu-item.tsx  | 10 ++--
 .../app/src/components/ui/menu/menu-sub.tsx   |  2 +-
 .../app/src/components/ui/search-field.tsx    |  2 +-
 packages/app/src/components/ui/shortcut.tsx   |  2 +-
 .../app/src/components/ui/status-badge.tsx    |  2 +-
 .../app/src/components/welcome-screen.tsx     |  8 +--
 .../src/components/workspace-hover-card.tsx   | 12 ++--
 .../src/components/workspace-setup-dialog.tsx |  4 +-
 .../src/composer/agent-controls/control.tsx   |  6 +-
 .../app/src/composer/agent-controls/index.tsx |  6 +-
 .../composer/agent-controls/mode-control.tsx  |  4 +-
 .../composer/agent-controls/model-sheet.tsx   |  4 +-
 packages/app/src/composer/index.tsx           |  6 +-
 packages/app/src/composer/input/input.tsx     | 10 ++--
 .../desktop/browser/pane/index.electron.tsx   | 16 ++---
 .../app/src/desktop/browser/pane/index.tsx    |  6 +-
 .../src/desktop/browser/pane/index.web.tsx    |  6 +-
 .../components/desktop-permission-row.tsx     |  4 +-
 .../components/desktop-updates-section.tsx    |  8 +--
 .../components/integrations-section.tsx       |  2 +-
 .../components/pair-device-section.tsx        | 16 ++---
 packages/app/src/file-pane/bar.tsx            |  8 +--
 packages/app/src/file-pane/conflict-alert.tsx |  4 +-
 packages/app/src/file-pane/editor/view.tsx    |  2 +-
 .../src/file-pane/markdown-preview/index.tsx  |  4 +-
 packages/app/src/file-pane/pane.tsx           |  8 +--
 packages/app/src/git/actions-split-button.tsx |  4 +-
 .../src/git/commits-section/commit-row.tsx    |  6 +-
 .../git/commits-section/commits-section.tsx   |  8 +--
 packages/app/src/git/diff-folder-row.tsx      |  2 +-
 packages/app/src/git/diff-pane.tsx            | 12 ++--
 packages/app/src/git/diff-too-large-state.tsx |  2 +-
 packages/app/src/git/file-header.tsx          |  6 +-
 packages/app/src/git/forges/gitlab.view.tsx   |  4 +-
 .../git/pull-request-panel/checks-section.tsx |  6 +-
 .../src/git/pull-request-panel/pane-error.tsx |  2 +-
 .../git/pull-request-panel/pane-skeleton.tsx  |  2 +-
 .../app/src/git/pull-request-panel/pane.tsx   | 24 ++++----
 .../git/pull-request-panel/section-kit.tsx    | 18 +++---
 packages/app/src/hooks/use-settings/index.ts  | 12 ++--
 .../src/hooks/use-settings/storage.test.ts    | 58 ++++++++++++++++---
 .../app/src/hooks/use-settings/storage.ts     | 43 ++++++++++----
 packages/app/src/hosts/host-badge.tsx         |  2 +-
 packages/app/src/hosts/host-chooser.tsx       |  6 +-
 packages/app/src/i18n/resources/ar.ts         |  4 +-
 packages/app/src/i18n/resources/en.ts         |  4 +-
 packages/app/src/i18n/resources/es.ts         |  4 +-
 packages/app/src/i18n/resources/fr.ts         |  4 +-
 packages/app/src/i18n/resources/ja.ts         |  4 +-
 packages/app/src/i18n/resources/ko.ts         |  4 +-
 packages/app/src/i18n/resources/pt-BR.ts      |  4 +-
 packages/app/src/i18n/resources/ru.ts         |  4 +-
 packages/app/src/i18n/resources/zh-CN.ts      |  4 +-
 .../agent-route-resolution-view.tsx           |  6 +-
 .../new-workspace-launch/launch-control.tsx   |  8 +--
 .../src/panels/provider-subagent-panel.tsx    |  2 +-
 packages/app/src/panels/setup-panel.tsx       | 12 ++--
 packages/app/src/plugins/surface-screen.tsx   |  2 +-
 .../app/src/provider-usage/balance-bar.tsx    |  4 +-
 packages/app/src/provider-usage/card.tsx      | 14 ++---
 .../src/provider-usage/settings-section.tsx   |  2 +-
 .../src/provider-usage/tooltip-section.tsx    |  8 +--
 .../app/src/provider-usage/window-bar.tsx     |  4 +-
 packages/app/src/review/surface.tsx           |  8 +--
 .../app/src/screens/new-workspace-screen.tsx  | 10 ++--
 .../app/src/screens/open-project-screen.tsx   |  2 +-
 .../src/screens/project-settings-screen.tsx   | 20 +++----
 packages/app/src/screens/projects-screen.tsx  |  6 +-
 packages/app/src/screens/schedules-screen.tsx |  6 +-
 packages/app/src/screens/sessions-screen.tsx  |  6 +-
 packages/app/src/screens/settings-screen.tsx  | 14 ++---
 .../appearance/appearance-section.tsx         | 50 ++++++++--------
 .../appearance/apply-appearance.test.ts       | 48 ++++++++-------
 .../settings/appearance/apply-appearance.ts   | 16 ++---
 .../settings/host-appearance-section.tsx      |  6 +-
 .../app/src/screens/settings/host-page.tsx    | 12 ++--
 .../settings/keyboard-shortcuts-section.tsx   |  8 +--
 .../settings/metadata-generation-page.tsx     |  4 +-
 .../app/src/screens/settings/plugins-page.tsx | 10 ++--
 .../screens/settings/providers-section.tsx    |  8 +--
 .../src/screens/settings/settings-group.tsx   |  4 +-
 .../settings/terminal-profile-edit-modal.tsx  |  2 +-
 .../app/src/screens/startup-splash-screen.tsx |  4 +-
 .../workspace/workspace-desktop-tabs-row.tsx  |  8 +--
 .../workspace-open-in-editor-button.tsx       |  6 +-
 .../workspace/workspace-route-state-views.tsx |  8 +--
 .../screens/workspace/workspace-screen.tsx    | 19 +++---
 .../workspace/workspace-scripts-button.tsx    | 12 ++--
 .../workspace/workspace-tab-presentation.tsx  |  2 +-
 .../workspace-tab-trailing-accessory.tsx      |  2 +-
 .../app/src/styles/markdown-styles.test.ts    |  8 +--
 packages/app/src/styles/markdown-styles.ts    | 36 ++++++------
 packages/app/src/styles/settings.ts           |  8 +--
 packages/app/src/styles/theme.test.ts         | 16 +++++
 packages/app/src/styles/theme.ts              | 15 +++--
 packages/app/src/subagents/track.tsx          |  6 +-
 171 files changed, 709 insertions(+), 645 deletions(-)

diff --git a/docs/design.md b/docs/design.md
index af1bdfb93..99954a1c8 100644
--- a/docs/design.md
+++ b/docs/design.md
@@ -28,11 +28,13 @@ Before adding a new component, read `components/ui/`. The primitive usually exis
 
 ## 3. Hierarchy
 
-Hierarchy is conveyed through weight and color, not size. Most interface text is `fontSize.sm`; compact metadata and hints use `fontSize.xs`. The distinction between a row's primary line and its secondary line is `foreground` versus `foregroundMuted`.
+Hierarchy is conveyed through weight and color, not size. Most interface text is `fontSize.base`; compact metadata and hints use `fontSize.sm`. The distinction between a row's primary line and its secondary line is `foreground` versus `foregroundMuted`.
+
+The authored ramp uses a 14px base. New native installs default to 15px; web and desktop default to 14px. The Appearance **Base size** setting is the rendered `fontSize.base` value and scales the rest of the UI ramp proportionally. Code size remains independent.
 
 Weight has three tiers, applied by role:
 
-- **Screen titles** — the title at the top of a screen — use `<ScreenTitle>` (`packages/app/src/components/headers/screen-title.tsx`), which renders `fontSize.base` at weight `400` on compact and `300` on desktop. Top-of-screen titles are lighter on desktop, not heavier. The workspace header overrides the size to `fontSize.sm` so its title, project name, tabs, pane chrome, conversation text, and composer share the desktop working-surface scale (`packages/app/src/screens/workspace/workspace-screen.tsx`).
+- **Screen titles** — the title in app chrome — use `<ScreenTitle>` (`packages/app/src/components/headers/screen-title.tsx`), which renders `fontSize.base` at weight `400` on compact and `300` on desktop. The New workspace hero is the only larger product title; it uses `fontSize["2xl"]` (`packages/app/src/screens/new-workspace-screen.tsx`).
 - **Structural labels** use `fontWeight.medium`. This applies to section labels above a stack of rows (`packages/app/src/components/agent-list.tsx:519-523`, `packages/app/src/components/keyboard-shortcuts-dialog.tsx:63-67`), form field labels above an input inside a modal (`packages/app/src/components/add-host-modal.tsx:19-23`, `packages/app/src/components/pair-link-modal.tsx:24-28`), the title at the top of a modal/sheet/dialog (`packages/app/src/components/adaptive-modal-sheet.tsx:90-94`, `packages/app/src/components/ui/combobox.tsx:1607-1611`, `packages/app/src/components/welcome-screen.tsx:48-53`), action button labels in tight components such as the sidebar callout actions (`packages/app/src/components/sidebar-callout.tsx:218-221`), and inline data emphasis on dense metadata rows (`packages/app/src/components/git-diff-pane.tsx:2322-2327`, `packages/app/src/components/file-explorer-pane.tsx:1115-1122`).
 - **Content** uses `fontWeight.normal`. This applies to settings rows (`packages/app/src/styles/settings.ts`), sidebar primary list-item titles (`packages/app/src/components/sidebar-workspace-list.tsx:2680-2686`, `packages/app/src/components/agent-list.tsx:572-578`), `<Button>` text (`packages/app/src/components/ui/button.tsx:80-84`), `<StatusBadge>` text (`packages/app/src/components/ui/status-badge.tsx:56-60`), and `<SidebarCallout>` titles (`packages/app/src/components/sidebar-callout.tsx:175-180`).
 
@@ -64,7 +66,7 @@ The button is `<Button>` (`packages/app/src/components/ui/button.tsx`). It has f
 
 Sizes: `xs` for ultra-tight inline triggers. `sm` for any button sitting in a row. `md` is the page default. `lg` is reserved for large standalone CTAs.
 
-Sizes are a shared contract across control kinds, defined once in `control-geometry.ts`: `xs` = 28px tall with `fontSize.xs` labels, `sm` = 32px with `fontSize.sm`, `md`/`lg` = 44px with `fontSize.sm`. `<SegmentedControl>` (`packages/app/src/components/ui/segmented-control.tsx`) takes the same `xs`/`sm`/`md` sizes — a segmented control next to a `<Button>` of the same size always matches in height, label size, and corner radius. Its segments run one padding step tighter than a button, because the gap between segments already reads as padding. The selected segment is a `surface3` fill with `foreground` text, not an inverted one — inverting it inside thin chrome puts a white slab in the toolbar. Thin chrome such as the file toolbar uses `xs`; settings rows use `sm`. Never shrink a control's font or padding locally to fit a context — if the context needs a smaller control, the size tier is missing or the wrong one is in use.
+Sizes are a shared contract across control kinds, defined once in `control-geometry.ts`: `xs` = 28px tall with `fontSize.sm` labels, `sm` = 32px with `fontSize.base`, `md`/`lg` = 44px with `fontSize.base`. `<SegmentedControl>` (`packages/app/src/components/ui/segmented-control.tsx`) takes the same `xs`/`sm`/`md` sizes — a segmented control next to a `<Button>` of the same size always matches in height, label size, and corner radius. Its segments run one padding step tighter than a button, because the gap between segments already reads as padding. The selected segment is a `surface3` fill with `foreground` text, not an inverted one — inverting it inside thin chrome puts a white slab in the toolbar. Thin chrome such as the file toolbar uses `xs`; settings rows use `sm`. Never shrink a control's font or padding locally to fit a context — if the context needs a smaller control, the size tier is missing or the wrong one is in use.
 
 A `<Pressable>` wrapping a `<Text>` is a sixth variant. It is wrong. `<Button>` accepts `style`, `textStyle`, `leftIcon`, `disabled`, `size`, and `variant`.
 
diff --git a/packages/app/src/agent-profiles/settings/agent-profile-edit-modal.tsx b/packages/app/src/agent-profiles/settings/agent-profile-edit-modal.tsx
index c4e63a847..b4a9cd81e 100644
--- a/packages/app/src/agent-profiles/settings/agent-profile-edit-modal.tsx
+++ b/packages/app/src/agent-profiles/settings/agent-profile-edit-modal.tsx
@@ -523,11 +523,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   featureLabel: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   featureDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   notesInput: {
     minHeight: 88,
@@ -535,7 +535,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   submitError: {
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   actions: {
     flexDirection: "row",
diff --git a/packages/app/src/agent-profiles/settings/agent-profile-row.tsx b/packages/app/src/agent-profiles/settings/agent-profile-row.tsx
index e8da19219..c2686d1a1 100644
--- a/packages/app/src/agent-profiles/settings/agent-profile-row.tsx
+++ b/packages/app/src/agent-profiles/settings/agent-profile-row.tsx
@@ -168,7 +168,7 @@ const styles = StyleSheet.create((theme) => ({
   summary: {
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   notes: {
     flexDirection: "row",
@@ -179,7 +179,7 @@ const styles = StyleSheet.create((theme) => ({
   notesText: {
     flex: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   rowActions: {
     flexDirection: "row",
diff --git a/packages/app/src/agent-profiles/settings/agent-profiles-section.tsx b/packages/app/src/agent-profiles/settings/agent-profiles-section.tsx
index 52cb5ba02..9bed2e6f6 100644
--- a/packages/app/src/agent-profiles/settings/agent-profiles-section.tsx
+++ b/packages/app/src/agent-profiles/settings/agent-profiles-section.tsx
@@ -213,7 +213,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
 }));
diff --git a/packages/app/src/agent-stream/chat-outline/rail.web.tsx b/packages/app/src/agent-stream/chat-outline/rail.web.tsx
index e72d2be0f..3cb79f108 100644
--- a/packages/app/src/agent-stream/chat-outline/rail.web.tsx
+++ b/packages/app/src/agent-stream/chat-outline/rail.web.tsx
@@ -249,7 +249,7 @@ const styles = StyleSheet.create((theme) => ({
     ...theme.shadow.md,
   },
   previewText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foreground,
   },
 }));
diff --git a/packages/app/src/app/_layout.tsx b/packages/app/src/app/_layout.tsx
index 19fd2e547..1f3442e2e 100644
--- a/packages/app/src/app/_layout.tsx
+++ b/packages/app/src/app/_layout.tsx
@@ -684,7 +684,7 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
     applyAppearance({
       uiFontFamily: settings.uiFontFamily,
       monoFontFamily: settings.monoFontFamily,
-      uiFontSize: settings.uiFontSize,
+      uiBaseFontSize: settings.uiBaseFontSize,
       codeFontSize: settings.codeFontSize,
       syntaxTheme: settings.syntaxTheme,
     });
@@ -692,7 +692,7 @@ function ProvidersWrapper({ children }: { children: ReactNode }) {
     settingsLoading,
     settings.uiFontFamily,
     settings.monoFontFamily,
-    settings.uiFontSize,
+    settings.uiBaseFontSize,
     settings.codeFontSize,
     settings.syntaxTheme,
   ]);
diff --git a/packages/app/src/app/pair-scan.tsx b/packages/app/src/app/pair-scan.tsx
index 4408ef33c..63f01a7b2 100644
--- a/packages/app/src/app/pair-scan.tsx
+++ b/packages/app/src/app/pair-scan.tsx
@@ -90,7 +90,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   permissionTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
   },
   permissionBody: {
diff --git a/packages/app/src/assistant-file-links/link.tsx b/packages/app/src/assistant-file-links/link.tsx
index 4ea6bcc61..31f6d719d 100644
--- a/packages/app/src/assistant-file-links/link.tsx
+++ b/packages/app/src/assistant-file-links/link.tsx
@@ -238,7 +238,7 @@ function preventAnchorNavigation(event: MouseEvent<HTMLAnchorElement>): void {
 const styles = StyleSheet.create((theme) => ({
   tooltipPath: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
 }));
diff --git a/packages/app/src/command-center/command-center.tsx b/packages/app/src/command-center/command-center.tsx
index b0272300a..c1ac5e000 100644
--- a/packages/app/src/command-center/command-center.tsx
+++ b/packages/app/src/command-center/command-center.tsx
@@ -867,14 +867,14 @@ const styles = StyleSheet.create((theme) => ({
   },
   scopeChipLabel: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "500",
   },
   results: { flex: 1 },
   sectionLabel: {
     paddingHorizontal: theme.spacing[4],
     paddingBottom: theme.spacing[2],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   sectionDivider: {
@@ -902,14 +902,14 @@ const styles = StyleSheet.create((theme) => ({
   textContent: { flex: 1, minWidth: 0 },
   title: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 18,
     flexShrink: 1,
   },
-  fileLine: { flex: 1, minWidth: 0, fontSize: theme.fontSize.sm, lineHeight: 20 },
+  fileLine: { flex: 1, minWidth: 0, fontSize: theme.fontSize.base, lineHeight: 20 },
   fileName: { color: theme.colors.foreground },
   filePath: { color: theme.colors.foregroundMuted },
-  subtitle: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.xs, lineHeight: 16 },
+  subtitle: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.sm, lineHeight: 16 },
   iconSlot: { width: 16, height: 20, alignItems: "center", justifyContent: "center" },
   rowShortcut: { flexShrink: 0 },
   breadcrumb: {
@@ -927,7 +927,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   breadcrumbGroup: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
     flexShrink: 0,
   },
@@ -936,7 +936,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[6],
     textAlign: "center",
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorText: {
     paddingHorizontal: theme.spacing[4],
@@ -944,7 +944,7 @@ const styles = StyleSheet.create((theme) => ({
     borderBottomWidth: 1,
     borderBottomColor: theme.colors.border,
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   sheetBackground: { backgroundColor: theme.colors.surface0 },
   sheetHandle: { backgroundColor: theme.colors.palette.zinc[600] },
diff --git a/packages/app/src/components/adaptive-modal-sheet.tsx b/packages/app/src/components/adaptive-modal-sheet.tsx
index 9a487aa49..45eb325a6 100644
--- a/packages/app/src/components/adaptive-modal-sheet.tsx
+++ b/packages/app/src/components/adaptive-modal-sheet.tsx
@@ -112,7 +112,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
   },
   title: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   headerActions: {
@@ -157,7 +157,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   inlineTitle: {
     flex: 1,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foreground,
   },
@@ -165,7 +165,7 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     paddingVertical: theme.spacing[2],
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   desktopScrollContainer: {
     flexShrink: 1,
diff --git a/packages/app/src/components/add-host-method-modal.tsx b/packages/app/src/components/add-host-method-modal.tsx
index 2834fc29f..4a9bba5d6 100644
--- a/packages/app/src/components/add-host-method-modal.tsx
+++ b/packages/app/src/components/add-host-method-modal.tsx
@@ -25,7 +25,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   optionSubtext: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     marginTop: theme.spacing[1],
   },
   optionBody: {
diff --git a/packages/app/src/components/add-host-modal.tsx b/packages/app/src/components/add-host-modal.tsx
index 6bd72e2ad..ce7a16bac 100644
--- a/packages/app/src/components/add-host-modal.tsx
+++ b/packages/app/src/components/add-host-modal.tsx
@@ -51,7 +51,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   input: {
@@ -120,7 +120,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   advancedText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   actions: {
@@ -130,11 +130,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   helper: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   error: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
 
diff --git a/packages/app/src/components/add-project-flow.tsx b/packages/app/src/components/add-project-flow.tsx
index 99fe6c2e9..a4cdc6a64 100644
--- a/packages/app/src/components/add-project-flow.tsx
+++ b/packages/app/src/components/add-project-flow.tsx
@@ -1008,14 +1008,14 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
   hostContext: {
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
   input: {
@@ -1043,11 +1043,11 @@ const styles = StyleSheet.create((theme) => ({
   disabled: { opacity: theme.opacity[50] },
   iconSlot: { width: 18, alignItems: "center" },
   rowText: { flex: 1, minWidth: 0 },
-  rowTitle: { color: theme.colors.foreground, fontSize: theme.fontSize.sm },
-  rowSubtitle: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.xs, marginTop: 2 },
+  rowTitle: { color: theme.colors.foreground, fontSize: theme.fontSize.base },
+  rowSubtitle: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.sm, marginTop: 2 },
   preview: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingHorizontal: theme.spacing[4],
     paddingVertical: theme.spacing[2],
   },
@@ -1059,7 +1059,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorText: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     paddingHorizontal: theme.spacing[4],
     paddingVertical: theme.spacing[3],
   },
@@ -1081,10 +1081,10 @@ const styles = StyleSheet.create((theme) => ({
   },
   footerKeyText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   footerAction: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/components/agent-list.tsx b/packages/app/src/components/agent-list.tsx
index 00f9f2d9b..5083d6391 100644
--- a/packages/app/src/components/agent-list.tsx
+++ b/packages/app/src/components/agent-list.tsx
@@ -259,8 +259,8 @@ function SessionRow({
   );
 
   const archivedIcon = useMemo(
-    () => <Archive size={theme.fontSize.xs} color={theme.colors.foregroundMuted} />,
-    [theme.fontSize.xs, theme.colors.foregroundMuted],
+    () => <Archive size={theme.fontSize.sm} color={theme.colors.foregroundMuted} />,
+    [theme.fontSize.sm, theme.colors.foregroundMuted],
   );
   const showDesktopAttention =
     !isMobile && showAttentionIndicator && Boolean(agent.requiresAttention);
@@ -617,7 +617,7 @@ const styles = StyleSheet.create((theme) => ({
     marginBottom: theme.spacing[2],
   },
   sectionTitle: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
   },
@@ -655,7 +655,7 @@ const styles = StyleSheet.create((theme) => ({
   workspaceTitleText: {
     flexShrink: 0,
     maxWidth: 220,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   rowMetaRow: {
@@ -680,7 +680,7 @@ const styles = StyleSheet.create((theme) => ({
   sessionTitle: {
     flexShrink: 1,
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "400",
     color: theme.colors.foreground,
     opacity: 0.86,
@@ -690,11 +690,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   sessionMetaText: {
     maxWidth: "100%",
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   sessionMetaSeparator: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     opacity: 0.7,
   },
@@ -705,20 +705,20 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[3],
   },
   columnMeta: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
     width: 132,
   },
   columnMetaFixed: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
     width: 72,
     textAlign: "right" as const,
   },
   columnMetaHost: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
     width: 120,
@@ -754,7 +754,7 @@ const styles = StyleSheet.create((theme) => ({
     opacity: 0.3,
   },
   sheetTitle: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     color: theme.colors.foreground,
     textAlign: "center",
diff --git a/packages/app/src/components/app-diagnostic-sheet.tsx b/packages/app/src/components/app-diagnostic-sheet.tsx
index 72e9d990c..9cf74a932 100644
--- a/packages/app/src/components/app-diagnostic-sheet.tsx
+++ b/packages/app/src/components/app-diagnostic-sheet.tsx
@@ -339,7 +339,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   mutedText: {
     flex: 1,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   headerActions: {
diff --git a/packages/app/src/components/appearance-style-boundary.tsx b/packages/app/src/components/appearance-style-boundary.tsx
index 5e6c31ed3..80c54c73e 100644
--- a/packages/app/src/components/appearance-style-boundary.tsx
+++ b/packages/app/src/components/appearance-style-boundary.tsx
@@ -15,7 +15,6 @@ const appearanceStyleBoundaryMapping = (theme: Theme): Partial<AppearanceStyleBo
   appearanceKey: [
     theme.fontFamily.ui,
     theme.fontFamily.mono,
-    theme.fontSize.xs,
     theme.fontSize.sm,
     theme.fontSize.base,
     theme.fontSize.lg,
diff --git a/packages/app/src/components/archived-agent-callout.tsx b/packages/app/src/components/archived-agent-callout.tsx
index fb04bab62..8982f6e06 100644
--- a/packages/app/src/components/archived-agent-callout.tsx
+++ b/packages/app/src/components/archived-agent-callout.tsx
@@ -116,7 +116,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   errorText: {
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
 })) as unknown as Record<string, object>;
diff --git a/packages/app/src/components/assistant-fork-menu.tsx b/packages/app/src/components/assistant-fork-menu.tsx
index a934125b9..b8c2bc0f0 100644
--- a/packages/app/src/components/assistant-fork-menu.tsx
+++ b/packages/app/src/components/assistant-fork-menu.tsx
@@ -138,6 +138,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/components/attachment-lightbox.tsx b/packages/app/src/components/attachment-lightbox.tsx
index 473278229..d916bddd2 100644
--- a/packages/app/src/components/attachment-lightbox.tsx
+++ b/packages/app/src/components/attachment-lightbox.tsx
@@ -160,7 +160,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   closeButton: {
     width: 32,
diff --git a/packages/app/src/components/attachment-pill.tsx b/packages/app/src/components/attachment-pill.tsx
index 86639d387..4bf702252 100644
--- a/packages/app/src/components/attachment-pill.tsx
+++ b/packages/app/src/components/attachment-pill.tsx
@@ -174,11 +174,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   labelTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   labelSubtitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   thumbnail: {
     width: ATTACHMENT_CONTENT_HEIGHT,
diff --git a/packages/app/src/components/branch-switcher.tsx b/packages/app/src/components/branch-switcher.tsx
index 131e98519..c1663cbdc 100644
--- a/packages/app/src/components/branch-switcher.tsx
+++ b/packages/app/src/components/branch-switcher.tsx
@@ -150,13 +150,13 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface1,
   },
   branchLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     fontWeight: theme.fontWeight.normal,
     flexShrink: 1,
   },
   tooltipText: {
     color: theme.colors.popoverForeground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/components/combined-model-selector.tsx b/packages/app/src/components/combined-model-selector.tsx
index 5053e138d..ff8905a49 100644
--- a/packages/app/src/components/combined-model-selector.tsx
+++ b/packages/app/src/components/combined-model-selector.tsx
@@ -298,7 +298,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   customTriggerWrapper: {
@@ -322,6 +322,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   sheetLoadingText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/components/context-window-meter.tsx b/packages/app/src/components/context-window-meter.tsx
index 1046d11e9..6fe837562 100644
--- a/packages/app/src/components/context-window-meter.tsx
+++ b/packages/app/src/components/context-window-meter.tsx
@@ -261,12 +261,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   percentageLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   skeletonLabel: {
     width: 22,
-    height: theme.fontSize.sm,
+    height: theme.fontSize.base,
     borderRadius: theme.borderRadius.full,
     backgroundColor: theme.colors.surface3,
   },
@@ -276,16 +276,16 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.4,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.4,
   },
   tooltipDetail: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.4,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.4,
   },
 }));
diff --git a/packages/app/src/components/dictation-controls.tsx b/packages/app/src/components/dictation-controls.tsx
index fb2c4ad8e..06311ec80 100644
--- a/packages/app/src/components/dictation-controls.tsx
+++ b/packages/app/src/components/dictation-controls.tsx
@@ -288,7 +288,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   timerText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     fontVariant: ["tabular-nums"],
   },
@@ -326,7 +326,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   statusLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.semibold,
   },
 }));
@@ -367,12 +367,12 @@ const overlayStyles = StyleSheet.create((theme) => ({
     gap: theme.spacing[4],
   },
   timerText: {
-    fontSize: theme.fontSize.xl,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     fontVariant: ["tabular-nums"],
   },
   transcriptText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     textAlign: "center",
     paddingHorizontal: theme.spacing[2],
diff --git a/packages/app/src/components/diff-stat.tsx b/packages/app/src/components/diff-stat.tsx
index 6db05f6af..c8c9bf947 100644
--- a/packages/app/src/components/diff-stat.tsx
+++ b/packages/app/src/components/diff-stat.tsx
@@ -34,12 +34,12 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 0,
   },
   additions: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusSuccess,
   },
   deletions: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusDanger,
   },
diff --git a/packages/app/src/components/diff-viewer.tsx b/packages/app/src/components/diff-viewer.tsx
index 2362363b9..8d14effdc 100644
--- a/packages/app/src/components/diff-viewer.tsx
+++ b/packages/app/src/components/diff-viewer.tsx
@@ -271,7 +271,7 @@ const styles = StyleSheet.create((theme) => {
       justifyContent: "center" as const,
     },
     emptyText: {
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       color: theme.colors.foregroundMuted,
     },
   };
diff --git a/packages/app/src/components/download-toast.tsx b/packages/app/src/components/download-toast.tsx
index 69aa42fdc..300b37536 100644
--- a/packages/app/src/components/download-toast.tsx
+++ b/packages/app/src/components/download-toast.tsx
@@ -130,12 +130,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   fileName: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
   },
   status: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   progressBar: {
     height: 3,
diff --git a/packages/app/src/components/explorer-sidebar.tsx b/packages/app/src/components/explorer-sidebar.tsx
index 0fdd48e6e..e3ad0e2fa 100644
--- a/packages/app/src/components/explorer-sidebar.tsx
+++ b/packages/app/src/components/explorer-sidebar.tsx
@@ -543,7 +543,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surfaceSidebarHover,
   },
   tabText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
diff --git a/packages/app/src/components/file-explorer-pane.tsx b/packages/app/src/components/file-explorer-pane.tsx
index cc9661c5a..6f2e71d0d 100644
--- a/packages/app/src/components/file-explorer-pane.tsx
+++ b/packages/app/src/components/file-explorer-pane.tsx
@@ -1684,7 +1684,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   sortTriggerText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   headerActions: {
@@ -1714,7 +1714,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   loadingText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorText: {
     color: theme.colors.destructive,
@@ -1730,7 +1730,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   retryButtonText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
   },
   errorActions: {
@@ -1745,7 +1745,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   binaryMetaText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   entryInfo: {
     flex: 1,
@@ -1764,13 +1764,13 @@ const styles = StyleSheet.create((theme) => ({
   entryName: {
     flex: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     userSelect: "none",
   },
   draftInput: {
     flex: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingVertical: 0,
     paddingHorizontal: 0,
   },
@@ -1788,12 +1788,12 @@ const styles = StyleSheet.create((theme) => ({
     paddingHorizontal: theme.spacing[3],
   },
   contextMetaLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
   },
   contextMetaValue: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
     fontWeight: theme.fontWeight.medium,
     flex: 1,
@@ -1803,7 +1803,7 @@ const styles = StyleSheet.create((theme) => ({
   previewHeaderText: {
     flex: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   iconButton: {
@@ -1870,7 +1870,7 @@ const styles = StyleSheet.create((theme) => ({
     borderBottomColor: theme.colors.border,
   },
   sheetTitle: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     color: theme.colors.foreground,
     flex: 1,
diff --git a/packages/app/src/components/headers/header-toggle-button.tsx b/packages/app/src/components/headers/header-toggle-button.tsx
index 39bea613a..d6ac94d35 100644
--- a/packages/app/src/components/headers/header-toggle-button.tsx
+++ b/packages/app/src/components/headers/header-toggle-button.tsx
@@ -85,7 +85,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   shortcut: {},
diff --git a/packages/app/src/components/hosts/host-filter.tsx b/packages/app/src/components/hosts/host-filter.tsx
index 2f5dbafde..4456bac22 100644
--- a/packages/app/src/components/hosts/host-filter.tsx
+++ b/packages/app/src/components/hosts/host-filter.tsx
@@ -115,7 +115,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   filterTriggerText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
 }));
diff --git a/packages/app/src/components/import-session-sheet.tsx b/packages/app/src/components/import-session-sheet.tsx
index fedb19961..21b81b27d 100644
--- a/packages/app/src/components/import-session-sheet.tsx
+++ b/packages/app/src/components/import-session-sheet.tsx
@@ -583,7 +583,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   filterTriggerText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   list: {
@@ -629,16 +629,16 @@ const styles = StyleSheet.create((theme) => ({
   },
   rowMeta: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   rowPreview: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
   rowCwd: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   statusRow: {
     flexDirection: "row",
@@ -648,7 +648,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   emptyState: {
     alignItems: "center",
diff --git a/packages/app/src/components/keyboard-shortcuts-dialog.tsx b/packages/app/src/components/keyboard-shortcuts-dialog.tsx
index 6e2e6db26..0dfd634d8 100644
--- a/packages/app/src/components/keyboard-shortcuts-dialog.tsx
+++ b/packages/app/src/components/keyboard-shortcuts-dialog.tsx
@@ -103,7 +103,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   sectionTitle: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
   },
@@ -128,12 +128,12 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
   },
   rowLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   rowNote: {
     marginTop: 2,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   rowShortcut: {
@@ -143,13 +143,13 @@ const styles = StyleSheet.create((theme) => ({
   // same state the same way.
   rowUnassigned: {
     alignSelf: "flex-start",
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   empty: {
     paddingVertical: theme.spacing[6],
     textAlign: "center",
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
 }));
diff --git a/packages/app/src/components/left-sidebar.tsx b/packages/app/src/components/left-sidebar.tsx
index 39c9a5c8c..64df674d2 100644
--- a/packages/app/src/components/left-sidebar.tsx
+++ b/packages/app/src/components/left-sidebar.tsx
@@ -1044,7 +1044,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   workspacesSectionTitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
   workspacesSectionActions: {
@@ -1118,7 +1118,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.accentForeground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
   sidebarFooter: {
@@ -1153,7 +1153,7 @@ const styles = StyleSheet.create((theme) => ({
   footerAddProjectLabel: {
     minWidth: 0,
     flexShrink: 1,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
@@ -1174,7 +1174,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
 }));
diff --git a/packages/app/src/components/markdown/renderer.tsx b/packages/app/src/components/markdown/renderer.tsx
index d9b0cc2be..61505326b 100644
--- a/packages/app/src/components/markdown/renderer.tsx
+++ b/packages/app/src/components/markdown/renderer.tsx
@@ -756,7 +756,7 @@ const detailsStyles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     lineHeight: 18,
   },
diff --git a/packages/app/src/components/message.tsx b/packages/app/src/components/message.tsx
index ab76854ef..0535f5785 100644
--- a/packages/app/src/components/message.tsx
+++ b/packages/app/src/components/message.tsx
@@ -194,7 +194,7 @@ let webToolCallShimmerRegistered = false;
 const SCROLL_EDGE_EPSILON = 0.5;
 
 // Font size for stream metadata (timestamps, durations, live elapsed timer).
-// Lives between theme.fontSize.xs (12) and theme.fontSize.sm (14); no token.
+// Lives between theme.fontSize.sm (12) and theme.fontSize.base (14); no token.
 export const STREAM_METADATA_FONT_SIZE = 13;
 type ScrollAxis = "x" | "y";
 
@@ -354,9 +354,9 @@ const userMessageStylesheet = StyleSheet.create((theme) => ({
   },
   text: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     ...(isWeb
-      ? { lineHeight: Math.round(theme.fontSize.sm * 1.4), overflowWrap: "anywhere" as const }
+      ? { lineHeight: Math.round(theme.fontSize.base * 1.4), overflowWrap: "anywhere" as const }
       : {}),
   },
   imagePreviewContainer: {
@@ -787,7 +787,7 @@ export const assistantMessageStylesheet = StyleSheet.create((theme) => ({
   },
   imageErrorText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
 }));
@@ -1095,7 +1095,7 @@ const expandableBadgeStylesheet = StyleSheet.create((theme) => ({
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     flexShrink: 0,
   },
@@ -1110,7 +1110,7 @@ const expandableBadgeStylesheet = StyleSheet.create((theme) => ({
     flexShrink: 1,
     minWidth: 0,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     marginLeft: theme.spacing[2],
   },
@@ -1119,7 +1119,7 @@ const expandableBadgeStylesheet = StyleSheet.create((theme) => ({
   },
   shimmerText: {
     color: "transparent",
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   spacer: {
@@ -1952,14 +1952,14 @@ const speakMessageStylesheet = StyleSheet.create((theme) => ({
   },
   headerLabel: {
     fontFamily: theme.fontFamily.ui,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
   text: {
     fontFamily: theme.fontFamily.ui,
-    fontSize: theme.fontSize.sm,
-    lineHeight: Math.round(theme.fontSize.sm * 1.4),
+    fontSize: theme.fontSize.base,
+    lineHeight: Math.round(theme.fontSize.base * 1.4),
     color: theme.colors.foreground,
   },
 }));
@@ -2044,7 +2044,7 @@ const activityLogStylesheet = StyleSheet.create((theme) => ({
     flex: 1,
   },
   messageText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
   detailsRow: {
@@ -2054,7 +2054,7 @@ const activityLogStylesheet = StyleSheet.create((theme) => ({
   },
   detailsText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginRight: theme.spacing[1],
   },
   metadataContainer: {
@@ -2262,7 +2262,7 @@ const todoListCardStylesheet = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
 
diff --git a/packages/app/src/components/model-browser.tsx b/packages/app/src/components/model-browser.tsx
index 1b476c911..6c330d6ba 100644
--- a/packages/app/src/components/model-browser.tsx
+++ b/packages/app/src/components/model-browser.tsx
@@ -1270,7 +1270,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   sectionHeadingText: {
     flex: 1,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
@@ -1314,17 +1314,17 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   browserRowLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
     flexShrink: 0,
   },
   browserRowLabelMuted: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
   },
   browserRowDescription: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
@@ -1345,7 +1345,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   drillDownCount: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   rowStateInline: {
@@ -1377,11 +1377,11 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   emptyStateText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   tooltipText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foreground,
   },
   virtualizedModelList: {
diff --git a/packages/app/src/components/pair-link-modal.tsx b/packages/app/src/components/pair-link-modal.tsx
index 57169ee09..48b1233ea 100644
--- a/packages/app/src/components/pair-link-modal.tsx
+++ b/packages/app/src/components/pair-link-modal.tsx
@@ -17,14 +17,14 @@ const FLEX_ONE_STYLE = { flex: 1 } as const;
 const styles = StyleSheet.create((theme) => ({
   helper: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   field: {
     gap: theme.spacing[2],
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   input: {
@@ -38,7 +38,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   error: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   actions: {
     flexDirection: "row",
diff --git a/packages/app/src/components/plan-card.tsx b/packages/app/src/components/plan-card.tsx
index 0f17b0852..f2064f2ad 100644
--- a/packages/app/src/components/plan-card.tsx
+++ b/packages/app/src/components/plan-card.tsx
@@ -243,7 +243,7 @@ const styles = StyleSheet.create((theme) => ({
     lineHeight: 22,
   },
   description: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
   footer: {
diff --git a/packages/app/src/components/provider-catalog-list.tsx b/packages/app/src/components/provider-catalog-list.tsx
index a31e45be0..bd1ab4781 100644
--- a/packages/app/src/components/provider-catalog-list.tsx
+++ b/packages/app/src/components/provider-catalog-list.tsx
@@ -202,7 +202,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     paddingVertical: theme.spacing[3],
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   list: {
     borderRadius: theme.borderRadius.lg,
@@ -240,18 +240,18 @@ const styles = StyleSheet.create((theme) => ({
   },
   name: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     flexShrink: 1,
   },
   version: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     flexShrink: 0,
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   installLink: {
     alignSelf: "flex-start",
@@ -262,7 +262,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   installLinkText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   actionButton: {
     width: 92,
@@ -281,6 +281,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   stateText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/components/provider-diagnostic-sheet.tsx b/packages/app/src/components/provider-diagnostic-sheet.tsx
index e77d20e3f..00e1f6ca2 100644
--- a/packages/app/src/components/provider-diagnostic-sheet.tsx
+++ b/packages/app/src/components/provider-diagnostic-sheet.tsx
@@ -731,7 +731,7 @@ export function ProviderDiagnosticSheet({
 
 const sheetStyles = StyleSheet.create((theme) => ({
   mutedText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   monoHint: {
@@ -742,11 +742,11 @@ const sheetStyles = StyleSheet.create((theme) => ({
   },
   descriptionInline: {
     flex: 1,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   errorText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.destructive,
   },
   formInput: {
@@ -757,7 +757,7 @@ const sheetStyles = StyleSheet.create((theme) => ({
     color: theme.colors.foreground,
     borderWidth: 1,
     borderColor: theme.colors.border,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   iconButton: {
     width: 28,
@@ -804,7 +804,7 @@ const sheetStyles = StyleSheet.create((theme) => ({
   },
   modelTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     flexShrink: 0,
   },
   modelRowFiller: {
@@ -828,7 +828,7 @@ const sheetStyles = StyleSheet.create((theme) => ({
   },
   footerMeta: {
     flex: 1,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   compactFooterMeta: {
@@ -849,7 +849,7 @@ const sheetStyles = StyleSheet.create((theme) => ({
     gap: theme.spacing[3],
   },
   formLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foreground,
   },
diff --git a/packages/app/src/components/question-form-card.tsx b/packages/app/src/components/question-form-card.tsx
index a1c19df69..4c9bc32f9 100644
--- a/packages/app/src/components/question-form-card.tsx
+++ b/packages/app/src/components/question-form-card.tsx
@@ -651,7 +651,7 @@ const styles = StyleSheet.create((theme) => ({
     borderWidth: theme.borderWidth[1],
   },
   questionNavText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   optionItem: {
@@ -680,7 +680,7 @@ const styles = StyleSheet.create((theme) => ({
     lineHeight: 22,
   },
   optionDescription: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
   selectionControl: {
@@ -707,7 +707,7 @@ const styles = StyleSheet.create((theme) => ({
     borderRadius: theme.borderRadius.lg,
     paddingHorizontal: theme.spacing[3],
     paddingVertical: theme.spacing[3],
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   actionsContainer: {
     gap: theme.spacing[2],
@@ -730,6 +730,6 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   actionText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/components/quitting-overlay.tsx b/packages/app/src/components/quitting-overlay.tsx
index f0c55dff0..51b13534a 100644
--- a/packages/app/src/components/quitting-overlay.tsx
+++ b/packages/app/src/components/quitting-overlay.tsx
@@ -64,6 +64,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   detail: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/components/rename-modal.tsx b/packages/app/src/components/rename-modal.tsx
index 2ccbf021f..eea388862 100644
--- a/packages/app/src/components/rename-modal.tsx
+++ b/packages/app/src/components/rename-modal.tsx
@@ -185,7 +185,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   actions: {
     flexDirection: "row",
diff --git a/packages/app/src/components/rewind/rewind-menu.tsx b/packages/app/src/components/rewind/rewind-menu.tsx
index 47df8b681..ca13d0ad2 100644
--- a/packages/app/src/components/rewind/rewind-menu.tsx
+++ b/packages/app/src/components/rewind/rewind-menu.tsx
@@ -161,7 +161,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   warningHeader: {
     paddingHorizontal: theme.spacing[3],
@@ -170,6 +170,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   warningText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/components/root-error-boundary.tsx b/packages/app/src/components/root-error-boundary.tsx
index aa70749d6..1ed3de670 100644
--- a/packages/app/src/components/root-error-boundary.tsx
+++ b/packages/app/src/components/root-error-boundary.tsx
@@ -128,13 +128,13 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xl,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
   body: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
     textAlign: "center",
   },
@@ -144,7 +144,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   detailsLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
   detailsSurface: {
diff --git a/packages/app/src/components/schedules/cadence-editor.tsx b/packages/app/src/components/schedules/cadence-editor.tsx
index d3593d619..02603ec17 100644
--- a/packages/app/src/components/schedules/cadence-editor.tsx
+++ b/packages/app/src/components/schedules/cadence-editor.tsx
@@ -132,11 +132,11 @@ const styles = StyleSheet.create((theme) => ({
     fontFamily: theme.fontFamily.mono,
   },
   preview: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   error: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.palette.red[300],
   },
 }));
diff --git a/packages/app/src/components/schedules/schedule-form-sheet.tsx b/packages/app/src/components/schedules/schedule-form-sheet.tsx
index 7931b9548..819d3c1b3 100644
--- a/packages/app/src/components/schedules/schedule-form-sheet.tsx
+++ b/packages/app/src/components/schedules/schedule-form-sheet.tsx
@@ -1056,7 +1056,7 @@ const styles = StyleSheet.create((theme) => {
       color: theme.colors.foreground,
     },
     readonlyTextSm: {
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
     },
     readonlyTextMd: {
       fontSize: theme.fontSize.base,
@@ -1077,7 +1077,7 @@ const styles = StyleSheet.create((theme) => {
     },
     submitError: {
       color: theme.colors.palette.red[300],
-      fontSize: theme.fontSize.xs,
+      fontSize: theme.fontSize.sm,
     },
     providerIcon: {
       color: theme.colors.foregroundMuted,
diff --git a/packages/app/src/components/schedules/schedule-row.tsx b/packages/app/src/components/schedules/schedule-row.tsx
index 8c2e50ba8..f2799fcf5 100644
--- a/packages/app/src/components/schedules/schedule-row.tsx
+++ b/packages/app/src/components/schedules/schedule-row.tsx
@@ -400,7 +400,7 @@ const styles = StyleSheet.create((theme) => ({
   target: {
     marginTop: theme.spacing[1],
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   trailing: {
     flexDirection: "row",
diff --git a/packages/app/src/components/settings-textarea.tsx b/packages/app/src/components/settings-textarea.tsx
index 1e19d35cf..b464aef91 100644
--- a/packages/app/src/components/settings-textarea.tsx
+++ b/packages/app/src/components/settings-textarea.tsx
@@ -49,7 +49,7 @@ export function SettingsTextAreaCard(props: SettingsTextAreaProps) {
 const styles = StyleSheet.create((theme) => ({
   input: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingVertical: theme.spacing[3],
     paddingHorizontal: theme.spacing[4],
     minHeight: 96,
diff --git a/packages/app/src/components/sidebar-callout.tsx b/packages/app/src/components/sidebar-callout.tsx
index de379a63e..3a6a8942a 100644
--- a/packages/app/src/components/sidebar-callout.tsx
+++ b/packages/app/src/components/sidebar-callout.tsx
@@ -183,12 +183,12 @@ const styles = StyleSheet.create((theme) => ({
   title: {
     flexShrink: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   descriptionSlot: {
     flexShrink: 1,
@@ -224,7 +224,7 @@ const styles = StyleSheet.create((theme) => ({
     opacity: 0.5,
   },
   actionLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
   actionLabelPrimary: {
diff --git a/packages/app/src/components/sidebar-workspace-list.tsx b/packages/app/src/components/sidebar-workspace-list.tsx
index 7c9c14d0f..f0a180b5c 100644
--- a/packages/app/src/components/sidebar-workspace-list.tsx
+++ b/packages/app/src/components/sidebar-workspace-list.tsx
@@ -407,7 +407,7 @@ const prBadgeStyles = StyleSheet.create((theme) => ({
     opacity: 0.82,
   },
   text: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     lineHeight: 14,
     color: theme.colors.foregroundMuted,
@@ -2548,12 +2548,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   newWorkspaceGhostText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     minWidth: 0,
     flexShrink: 1,
   },
   newWorkspaceGhostTextHovered: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foreground,
@@ -2571,13 +2571,13 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   projectRow: {
@@ -2623,7 +2623,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   projectTitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "400",
     minWidth: 0,
     flexShrink: 1,
@@ -2642,7 +2642,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   projectActionButtonText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   projectIconActionButton: {
     width: 24,
@@ -2695,7 +2695,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   projectActionTooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   projectActionTooltipShortcut: {},
   projectShortcutBadgeOverlay: {
@@ -2777,12 +2777,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   workspaceArchivingText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: "600",
   },
   workspaceBranchText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "400",
     lineHeight: 20,
     opacity: 0.76,
@@ -2803,7 +2803,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   workspaceCreatingText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     flexShrink: 0,
   },
   kebabButton: {
diff --git a/packages/app/src/components/sidebar/pinned-section-header.tsx b/packages/app/src/components/sidebar/pinned-section-header.tsx
index cf04aaf54..9dc2c9fdb 100644
--- a/packages/app/src/components/sidebar/pinned-section-header.tsx
+++ b/packages/app/src/components/sidebar/pinned-section-header.tsx
@@ -58,7 +58,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
 }));
diff --git a/packages/app/src/components/sidebar/sidebar-group-toggle-row.tsx b/packages/app/src/components/sidebar/sidebar-group-toggle-row.tsx
index 5b458ae71..f67bd738b 100644
--- a/packages/app/src/components/sidebar/sidebar-group-toggle-row.tsx
+++ b/packages/app/src/components/sidebar/sidebar-group-toggle-row.tsx
@@ -114,13 +114,13 @@ const styles = StyleSheet.create((theme) => ({
   },
   text: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     minWidth: 0,
     flexShrink: 1,
   },
   textHovered: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     minWidth: 0,
     flexShrink: 1,
   },
diff --git a/packages/app/src/components/sidebar/sidebar-header-row.tsx b/packages/app/src/components/sidebar/sidebar-header-row.tsx
index b04c2903c..22d48c2c4 100644
--- a/packages/app/src/components/sidebar/sidebar-header-row.tsx
+++ b/packages/app/src/components/sidebar/sidebar-header-row.tsx
@@ -149,7 +149,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surfaceSidebarHover,
   },
   label: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
diff --git a/packages/app/src/components/sidebar/sidebar-help-menu.tsx b/packages/app/src/components/sidebar/sidebar-help-menu.tsx
index 9d7acbaf9..eb00df6e1 100644
--- a/packages/app/src/components/sidebar/sidebar-help-menu.tsx
+++ b/packages/app/src/components/sidebar/sidebar-help-menu.tsx
@@ -194,7 +194,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingHorizontal: theme.spacing[1],
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   versionList: {
diff --git a/packages/app/src/components/sidebar/sidebar-status-list.tsx b/packages/app/src/components/sidebar/sidebar-status-list.tsx
index 15c912902..5bd155b15 100644
--- a/packages/app/src/components/sidebar/sidebar-status-list.tsx
+++ b/packages/app/src/components/sidebar/sidebar-status-list.tsx
@@ -1095,7 +1095,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusGroupTitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "400",
     minWidth: 0,
     flexShrink: 1,
diff --git a/packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx b/packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx
index 39f3c2607..c70afc072 100644
--- a/packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx
+++ b/packages/app/src/components/sidebar/sidebar-workspace-row-content.tsx
@@ -301,7 +301,7 @@ export const sidebarWorkspaceRowStyles = StyleSheet.create((theme) => ({
   },
   shortcutBadgeText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     lineHeight: 14,
   },
@@ -500,7 +500,7 @@ const styles = StyleSheet.create((theme) => ({
   // to the meta row, so it takes the full width the trailing slot leaves behind.
   workspaceBranchText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "400",
     lineHeight: 20,
     opacity: 0.76,
diff --git a/packages/app/src/components/sidebar/sidebar-workspace-row.tsx b/packages/app/src/components/sidebar/sidebar-workspace-row.tsx
index 192c6f64d..3bd8dc70a 100644
--- a/packages/app/src/components/sidebar/sidebar-workspace-row.tsx
+++ b/packages/app/src/components/sidebar/sidebar-workspace-row.tsx
@@ -539,7 +539,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   workspaceCreatingText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     flexShrink: 0,
   },
 }));
diff --git a/packages/app/src/components/sidebar/workspace-meta-row/index.tsx b/packages/app/src/components/sidebar/workspace-meta-row/index.tsx
index 9240575fb..98a4b62c0 100644
--- a/packages/app/src/components/sidebar/workspace-meta-row/index.tsx
+++ b/packages/app/src/components/sidebar/workspace-meta-row/index.tsx
@@ -310,7 +310,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   identityText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 1,
   },
@@ -319,7 +319,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   separator: {
     color: theme.colors.foregroundExtraMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
@@ -333,44 +333,44 @@ const styles = StyleSheet.create((theme) => ({
   },
   serviceName: {
     color: theme.colors.statusSuccess,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 1,
   },
   serviceNameUnhealthy: {
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 1,
   },
   prText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
   prTextHovered: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
   // Matches the indicator — see COLOR_MAPPINGS in check-indicator.tsx.
   checksTextPassed: {
     color: theme.colors.statusSuccess,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
   checksTextFailed: {
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
   checksTextRunning: {
     color: theme.colors.statusWarning,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 0,
   },
diff --git a/packages/app/src/components/sidebar/workspace-trailing/index.tsx b/packages/app/src/components/sidebar/workspace-trailing/index.tsx
index 1ecf6f077..ed573b2bf 100644
--- a/packages/app/src/components/sidebar/workspace-trailing/index.tsx
+++ b/packages/app/src/components/sidebar/workspace-trailing/index.tsx
@@ -76,7 +76,7 @@ const styles = StyleSheet.create((theme) => ({
     height: 20,
     lineHeight: 20,
     color: theme.colors.foregroundExtraMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     flexShrink: 0,
   },
diff --git a/packages/app/src/components/split-container.tsx b/packages/app/src/components/split-container.tsx
index c25e8c106..85d5ab038 100644
--- a/packages/app/src/components/split-container.tsx
+++ b/packages/app/src/components/split-container.tsx
@@ -1349,7 +1349,7 @@ const styles = StyleSheet.create((theme) => ({
     maxWidth: 200,
   },
   dragOverlayLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     flexShrink: 1,
   },
 }));
diff --git a/packages/app/src/components/task-list-row.tsx b/packages/app/src/components/task-list-row.tsx
index 7517afffa..a4b55b903 100644
--- a/packages/app/src/components/task-list-row.tsx
+++ b/packages/app/src/components/task-list-row.tsx
@@ -58,7 +58,7 @@ const styles = StyleSheet.create((theme) => ({
     flexBasis: "auto",
     minWidth: 0,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   runningText: {
     color: theme.colors.foreground,
diff --git a/packages/app/src/components/terminal-copy-paste-actions.tsx b/packages/app/src/components/terminal-copy-paste-actions.tsx
index ce0ac833d..26bba48aa 100644
--- a/packages/app/src/components/terminal-copy-paste-actions.tsx
+++ b/packages/app/src/components/terminal-copy-paste-actions.tsx
@@ -119,7 +119,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   keyButtonText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
@@ -134,7 +134,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   floatingButtonText: {
     color: "#f5f5f5",
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
diff --git a/packages/app/src/components/terminal-pane.tsx b/packages/app/src/components/terminal-pane.tsx
index 04827c8ac..3e9879903 100644
--- a/packages/app/src/components/terminal-pane.tsx
+++ b/packages/app/src/components/terminal-pane.tsx
@@ -1151,7 +1151,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusError: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   keyboardContainer: {
     borderTopWidth: 1,
@@ -1189,7 +1189,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   keyButtonText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
@@ -1204,7 +1204,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   stateText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
 }));
diff --git a/packages/app/src/components/toast-host.tsx b/packages/app/src/components/toast-host.tsx
index e275f0bb0..14ee1b656 100644
--- a/packages/app/src/components/toast-host.tsx
+++ b/packages/app/src/components/toast-host.tsx
@@ -339,7 +339,7 @@ const styles = StyleSheet.create((theme) => ({
   message: {
     flexShrink: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   messageError: {
diff --git a/packages/app/src/components/tool-call-details.tsx b/packages/app/src/components/tool-call-details.tsx
index 41006c4f2..62e455134 100644
--- a/packages/app/src/components/tool-call-details.tsx
+++ b/packages/app/src/components/tool-call-details.tsx
@@ -793,7 +793,7 @@ const styles = StyleSheet.create((theme) => {
     },
     groupHeaderText: {
       color: theme.colors.foregroundMuted,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       fontWeight: theme.fontWeight.normal,
     },
     section: {
@@ -812,14 +812,14 @@ const styles = StyleSheet.create((theme) => {
     },
     sectionTitle: {
       color: theme.colors.foregroundMuted,
-      fontSize: theme.fontSize.xs,
+      fontSize: theme.fontSize.sm,
       fontWeight: theme.fontWeight.semibold,
       textTransform: "uppercase",
       letterSpacing: 0.5,
     },
     rangeText: {
       color: theme.colors.foregroundMuted,
-      fontSize: theme.fontSize.xs,
+      fontSize: theme.fontSize.sm,
     },
     diffContainer: {
       borderWidth: theme.borderWidth[1],
@@ -916,7 +916,7 @@ const styles = StyleSheet.create((theme) => {
     },
     emptyStateText: {
       color: theme.colors.foregroundMuted,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       fontStyle: "italic",
     },
     loadingContainer: {
diff --git a/packages/app/src/components/tool-call-sheet.tsx b/packages/app/src/components/tool-call-sheet.tsx
index 788da80ec..dc746f663 100644
--- a/packages/app/src/components/tool-call-sheet.tsx
+++ b/packages/app/src/components/tool-call-sheet.tsx
@@ -193,7 +193,7 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
   },
   headerTitle: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     color: theme.colors.foreground,
     flex: 1,
diff --git a/packages/app/src/components/ui/alert.tsx b/packages/app/src/components/ui/alert.tsx
index ef0f3e248..674f0cb06 100644
--- a/packages/app/src/components/ui/alert.tsx
+++ b/packages/app/src/components/ui/alert.tsx
@@ -102,12 +102,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   descriptionSlot: {
     flexShrink: 1,
diff --git a/packages/app/src/components/ui/autocomplete.tsx b/packages/app/src/components/ui/autocomplete.tsx
index c6f3af60c..0fce6e8d4 100644
--- a/packages/app/src/components/ui/autocomplete.tsx
+++ b/packages/app/src/components/ui/autocomplete.tsx
@@ -301,17 +301,17 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   detailLabel: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   detailDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
   detailHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
   container: {
@@ -363,22 +363,22 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   itemLabel: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   itemDetail: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   itemDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: 2,
   },
   itemDescriptionInline: {
     flex: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   emptyItem: {
     paddingHorizontal: theme.spacing[3],
@@ -386,6 +386,6 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 })) as unknown as Record<string, object>;
diff --git a/packages/app/src/components/ui/combobox.tsx b/packages/app/src/components/ui/combobox.tsx
index da9dc2e19..c145b7c65 100644
--- a/packages/app/src/components/ui/combobox.tsx
+++ b/packages/app/src/components/ui/combobox.tsx
@@ -1683,7 +1683,7 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     paddingVertical: theme.spacing[3],
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   comboboxItem: {
     flexDirection: "row",
@@ -1744,12 +1744,12 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   comboboxItemLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
     flexShrink: 0,
   },
   comboboxItemDescription: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
@@ -1757,7 +1757,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingHorizontal: theme.spacing[3],
     paddingVertical: theme.spacing[2],
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   footer: {
     borderTopWidth: 1,
@@ -1768,7 +1768,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[2],
   },
   comboboxTitle: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "left",
   },
diff --git a/packages/app/src/components/ui/control-geometry.test.ts b/packages/app/src/components/ui/control-geometry.test.ts
index 7a022861c..d62455aef 100644
--- a/packages/app/src/components/ui/control-geometry.test.ts
+++ b/packages/app/src/components/ui/control-geometry.test.ts
@@ -21,9 +21,9 @@ const theme = {
     borderAccent: "#2F3534",
   },
   fontSize: {
-    xs: 12,
-    sm: 14,
-    base: 16,
+    xs: 10,
+    sm: 12,
+    base: 14,
   },
   opacity: {
     50: 0.5,
@@ -78,12 +78,12 @@ describe("control geometry", () => {
 
     expect(geometry.fieldTextSm.fontSize).toBe(14);
     expect(geometry.fieldTextSm.lineHeight).toBe(20);
-    expect(geometry.fieldTextMd.fontSize).toBe(16);
-    expect(geometry.fieldTextMd.lineHeight).toBe(22);
+    expect(geometry.fieldTextMd.fontSize).toBe(14);
+    expect(geometry.fieldTextMd.lineHeight).toBe(20);
     expect(geometry.formTextInputSm.fontSize).toBe(14);
     expect(geometry.formTextInputSm.lineHeight).toBe(20);
-    expect(geometry.formTextInputMd.fontSize).toBe(16);
-    expect(geometry.formTextInputMd.lineHeight).toBe(22);
+    expect(geometry.formTextInputMd.fontSize).toBe(14);
+    expect(geometry.formTextInputMd.lineHeight).toBe(20);
   });
 
   it("derives field padding from line height without changing the control height", () => {
@@ -96,13 +96,13 @@ describe("control geometry", () => {
     );
 
     expect(geometry.fieldControlMd.minHeight).toBe(44);
-    expect(geometry.fieldControlMd.paddingVertical).toBe(11);
+    expect(geometry.fieldControlMd.paddingVertical).toBe(12);
     expect(geometry.fieldTextMd.lineHeight + geometry.fieldControlMd.paddingVertical * 2).toBe(
       geometry.fieldControlMd.minHeight,
     );
 
     expect(geometry.formTextInputSm.paddingVertical).toBe(6);
-    expect(geometry.formTextInputMd.paddingVertical).toBe(11);
+    expect(geometry.formTextInputMd.paddingVertical).toBe(12);
   });
 
   it("keeps segmented controls ghost with button-radius segments in a button-sized track", () => {
diff --git a/packages/app/src/components/ui/control-geometry.ts b/packages/app/src/components/ui/control-geometry.ts
index e88911989..526f52862 100644
--- a/packages/app/src/components/ui/control-geometry.ts
+++ b/packages/app/src/components/ui/control-geometry.ts
@@ -111,7 +111,7 @@ export function resolveControlInteractionStyles(
 }
 
 export function createControlGeometry(theme: Theme) {
-  const fieldTextSmLineHeight = fieldLineHeight(theme.fontSize.sm);
+  const fieldTextSmLineHeight = fieldLineHeight(theme.fontSize.base);
   const fieldTextMdLineHeight = fieldLineHeight(theme.fontSize.base);
   const fieldControlSm = {
     minHeight: CONTROL_HEIGHTS.compact,
@@ -126,7 +126,7 @@ export function createControlGeometry(theme: Theme) {
     borderRadius: theme.borderRadius.lg,
   };
   const fieldTextSm = {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: fieldTextSmLineHeight,
   };
   const fieldTextMd = {
@@ -160,10 +160,10 @@ export function createControlGeometry(theme: Theme) {
       borderRadius: theme.borderRadius.xl,
     },
     buttonText: {
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
     },
     buttonTextXs: {
-      fontSize: theme.fontSize.xs,
+      fontSize: theme.fontSize.sm,
     },
     formTextInputSm: {
       ...fieldControlSm,
@@ -232,13 +232,13 @@ export function createControlGeometry(theme: Theme) {
       borderRadius: theme.borderRadius.lg,
     },
     segmentedLabelXs: {
-      fontSize: theme.fontSize.xs,
+      fontSize: theme.fontSize.sm,
     },
     segmentedLabelSm: {
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
     },
     segmentedLabelMd: {
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
     },
   };
 }
diff --git a/packages/app/src/components/ui/external-link.tsx b/packages/app/src/components/ui/external-link.tsx
index 057aa197c..02e48cc44 100644
--- a/packages/app/src/components/ui/external-link.tsx
+++ b/packages/app/src/components/ui/external-link.tsx
@@ -66,12 +66,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     maxWidth: 280,
-    lineHeight: theme.fontSize.sm * 1.4,
+    lineHeight: theme.fontSize.base * 1.4,
   },
 }));
diff --git a/packages/app/src/components/ui/form-field.tsx b/packages/app/src/components/ui/form-field.tsx
index d63d9a0a1..824f3c6a7 100644
--- a/packages/app/src/components/ui/form-field.tsx
+++ b/packages/app/src/components/ui/form-field.tsx
@@ -226,18 +226,18 @@ const styles = StyleSheet.create((theme) => ({
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   hintText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    lineHeight: Math.round(theme.fontSize.xs * 1.4),
+    fontSize: theme.fontSize.sm,
+    lineHeight: Math.round(theme.fontSize.sm * 1.4),
   },
   errorText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
-    lineHeight: Math.round(theme.fontSize.xs * 1.4),
+    fontSize: theme.fontSize.sm,
+    lineHeight: Math.round(theme.fontSize.sm * 1.4),
   },
 }));
 
diff --git a/packages/app/src/components/ui/menu/menu-item.tsx b/packages/app/src/components/ui/menu/menu-item.tsx
index 28745b592..e3b9f53d9 100644
--- a/packages/app/src/components/ui/menu/menu-item.tsx
+++ b/packages/app/src/components/ui/menu/menu-item.tsx
@@ -314,7 +314,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[1],
   },
   labelText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   // `border` sits between surface1 and surface2, which put it within a hair of the hover fill and
@@ -343,12 +343,12 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   hintText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   // The fill is inset from the surface's edges and rounded, so a hovered row reads as a chip
@@ -392,7 +392,7 @@ const styles = StyleSheet.create((theme) => ({
     opacity: 0.72,
   },
   itemText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: MENU_ITEM_LINE_HEIGHT,
     color: theme.colors.foreground,
     fontWeight: theme.fontWeight.normal,
@@ -408,7 +408,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   itemDescription: {
     marginTop: 2,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   checkSlot: {
diff --git a/packages/app/src/components/ui/menu/menu-sub.tsx b/packages/app/src/components/ui/menu/menu-sub.tsx
index 76ef9fe15..d07a02074 100644
--- a/packages/app/src/components/ui/menu/menu-sub.tsx
+++ b/packages/app/src/components/ui/menu/menu-sub.tsx
@@ -131,7 +131,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1.5],
   },
   valueText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
diff --git a/packages/app/src/components/ui/search-field.tsx b/packages/app/src/components/ui/search-field.tsx
index 242b84761..07ccb9885 100644
--- a/packages/app/src/components/ui/search-field.tsx
+++ b/packages/app/src/components/ui/search-field.tsx
@@ -108,6 +108,6 @@ const styles = StyleSheet.create((theme) => ({
     // native, so this needs neither a cast nor a platform branch.
     outlineWidth: 0,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/components/ui/shortcut.tsx b/packages/app/src/components/ui/shortcut.tsx
index 95be52a97..dc654cddd 100644
--- a/packages/app/src/components/ui/shortcut.tsx
+++ b/packages/app/src/components/ui/shortcut.tsx
@@ -72,7 +72,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   text: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
diff --git a/packages/app/src/components/ui/status-badge.tsx b/packages/app/src/components/ui/status-badge.tsx
index d792a1dc6..28035d929 100644
--- a/packages/app/src/components/ui/status-badge.tsx
+++ b/packages/app/src/components/ui/status-badge.tsx
@@ -42,7 +42,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: 3,
   },
   pillText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
diff --git a/packages/app/src/components/welcome-screen.tsx b/packages/app/src/components/welcome-screen.tsx
index b4f4e9d46..5fdfa7854 100644
--- a/packages/app/src/components/welcome-screen.tsx
+++ b/packages/app/src/components/welcome-screen.tsx
@@ -49,13 +49,13 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xl,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     textAlign: "center",
   },
   subtitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   copyBlock: {
@@ -99,12 +99,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   setupLinkText: {
     color: theme.colors.accent,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   versionLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     textAlign: "center",
     marginTop: theme.spacing[6],
   },
diff --git a/packages/app/src/components/workspace-hover-card.tsx b/packages/app/src/components/workspace-hover-card.tsx
index 7d2464478..c1c71274f 100644
--- a/packages/app/src/components/workspace-hover-card.tsx
+++ b/packages/app/src/components/workspace-hover-card.tsx
@@ -600,7 +600,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   cardTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     flex: 1,
     minWidth: 0,
@@ -616,7 +616,7 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
   cardInfoTextHovered: {
@@ -638,7 +638,7 @@ const styles = StyleSheet.create((theme) => ({
     minHeight: 28,
   },
   checksSummaryLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
@@ -658,17 +658,17 @@ const styles = StyleSheet.create((theme) => ({
     gap: 3,
   },
   checksStatusTextFailed: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusDanger,
   },
   checksStatusTextPending: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusWarning,
   },
   checksStatusTextPassed: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusSuccess,
   },
diff --git a/packages/app/src/components/workspace-setup-dialog.tsx b/packages/app/src/components/workspace-setup-dialog.tsx
index 0ca4b2f8b..aa64d0e40 100644
--- a/packages/app/src/components/workspace-setup-dialog.tsx
+++ b/packages/app/src/components/workspace-setup-dialog.tsx
@@ -466,7 +466,7 @@ const styles = StyleSheet.create((theme) => ({
     fontSize: 9,
   },
   projectTitle: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   section: {
@@ -475,7 +475,7 @@ const styles = StyleSheet.create((theme) => ({
     marginVertical: -theme.spacing[2],
   },
   errorText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.destructive,
     lineHeight: 20,
   },
diff --git a/packages/app/src/composer/agent-controls/control.tsx b/packages/app/src/composer/agent-controls/control.tsx
index bef4bc891..64b8b3910 100644
--- a/packages/app/src/composer/agent-controls/control.tsx
+++ b/packages/app/src/composer/agent-controls/control.tsx
@@ -116,7 +116,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   sheetRow: {
@@ -144,7 +144,7 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   sheetValue: {
@@ -152,7 +152,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   hovered: {
diff --git a/packages/app/src/composer/agent-controls/index.tsx b/packages/app/src/composer/agent-controls/index.tsx
index 267e07f1f..652564262 100644
--- a/packages/app/src/composer/agent-controls/index.tsx
+++ b/packages/app/src/composer/agent-controls/index.tsx
@@ -1926,13 +1926,13 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.4,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.4,
   },
   combinedSheetControls: {
     gap: theme.spacing[1],
diff --git a/packages/app/src/composer/agent-controls/mode-control.tsx b/packages/app/src/composer/agent-controls/mode-control.tsx
index 6acd2dec1..59fb515ce 100644
--- a/packages/app/src/composer/agent-controls/mode-control.tsx
+++ b/packages/app/src/composer/agent-controls/mode-control.tsx
@@ -317,7 +317,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.4,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.4,
   },
 }));
diff --git a/packages/app/src/composer/agent-controls/model-sheet.tsx b/packages/app/src/composer/agent-controls/model-sheet.tsx
index 36564db4b..05164b5f6 100644
--- a/packages/app/src/composer/agent-controls/model-sheet.tsx
+++ b/packages/app/src/composer/agent-controls/model-sheet.tsx
@@ -363,7 +363,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   triggerLabels: {
@@ -376,7 +376,7 @@ const styles = StyleSheet.create((theme) => ({
   triggerThinking: {
     flexShrink: 0,
     color: theme.colors.foregroundExtraMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   providerIcon: {
diff --git a/packages/app/src/composer/index.tsx b/packages/app/src/composer/index.tsx
index 0ca81ab81..dc2547d4e 100644
--- a/packages/app/src/composer/index.tsx
+++ b/packages/app/src/composer/index.tsx
@@ -2430,7 +2430,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
     gap: theme.spacing[2],
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   buttonDisabled: {
@@ -2455,7 +2455,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
   queueText: {
     flex: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   queueActions: {
     flexDirection: "row",
@@ -2475,7 +2475,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
   },
   sendErrorText: {
     color: theme.colors.palette.red[500],
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 })) as unknown as Record<string, object>;
 
diff --git a/packages/app/src/composer/input/input.tsx b/packages/app/src/composer/input/input.tsx
index ed48866d8..12af092f6 100644
--- a/packages/app/src/composer/input/input.tsx
+++ b/packages/app/src/composer/input/input.tsx
@@ -1966,16 +1966,16 @@ const styles = StyleSheet.create((theme: Theme) => ({
     position: "absolute",
     top: 0,
     right: 0,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     opacity: 0.5,
   },
   textInput: {
     width: "100%",
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
-    lineHeight: theme.fontSize.sm * 1.4,
+    lineHeight: theme.fontSize.base * 1.4,
     ...(isWeb
       ? ({
           outlineStyle: "none",
@@ -2050,7 +2050,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
     borderRadius: theme.borderRadius.full,
   },
   sendButtonLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.accentForeground,
   },
@@ -2063,7 +2063,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
     gap: theme.spacing[2],
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   buttonDisabled: {
diff --git a/packages/app/src/desktop/browser/pane/index.electron.tsx b/packages/app/src/desktop/browser/pane/index.electron.tsx
index 589aa0ad8..4a7634991 100644
--- a/packages/app/src/desktop/browser/pane/index.electron.tsx
+++ b/packages/app/src/desktop/browser/pane/index.electron.tsx
@@ -1738,7 +1738,7 @@ const styles = StyleSheet.create((theme) => ({
   urlInput: {
     flex: 1,
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingVertical: 0,
     paddingHorizontal: 0,
   },
@@ -1750,7 +1750,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface0,
   },
   metaError: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   webviewWrap: {
     flex: 1,
@@ -1771,7 +1771,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   toolbarTooltipText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.popoverForeground,
   },
   annotationOverlay: {
@@ -1803,7 +1803,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   annotationTitle: {
     flex: 1,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: "600",
     color: theme.colors.foreground,
   },
@@ -1815,13 +1815,13 @@ const styles = StyleSheet.create((theme) => ({
     borderRadius: theme.borderRadius.md,
   },
   annotationElement: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     marginBottom: theme.spacing[2],
   },
   annotationInput: {
     minHeight: 64,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
     borderRadius: theme.borderRadius.md,
     borderWidth: 1,
@@ -1844,10 +1844,10 @@ const styles = StyleSheet.create((theme) => ({
     gap: 8,
   },
   unavailableTitle: {
-    fontSize: 16,
+    fontSize: theme.fontSize.base,
     fontWeight: "600",
   },
   unavailableSubtitle: {
-    fontSize: 12,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/desktop/browser/pane/index.tsx b/packages/app/src/desktop/browser/pane/index.tsx
index 67887b674..8f560a048 100644
--- a/packages/app/src/desktop/browser/pane/index.tsx
+++ b/packages/app/src/desktop/browser/pane/index.tsx
@@ -32,7 +32,7 @@ export function BrowserPane({ browserId }: BrowserPaneProps) {
   );
 }
 
-const styles = StyleSheet.create(() => ({
+const styles = StyleSheet.create((theme) => ({
   container: {
     flex: 1,
     alignItems: "center",
@@ -41,10 +41,10 @@ const styles = StyleSheet.create(() => ({
     padding: 16,
   },
   title: {
-    fontSize: 16,
+    fontSize: theme.fontSize.base,
     fontWeight: "600",
   },
   subtitle: {
-    fontSize: 12,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/desktop/browser/pane/index.web.tsx b/packages/app/src/desktop/browser/pane/index.web.tsx
index 27dd88ac3..b2c376fc8 100644
--- a/packages/app/src/desktop/browser/pane/index.web.tsx
+++ b/packages/app/src/desktop/browser/pane/index.web.tsx
@@ -33,7 +33,7 @@ export function BrowserPane({ browserId }: BrowserPaneProps) {
   );
 }
 
-const styles = StyleSheet.create(() => ({
+const styles = StyleSheet.create((theme) => ({
   container: {
     flex: 1,
     alignItems: "center",
@@ -42,10 +42,10 @@ const styles = StyleSheet.create(() => ({
     padding: 16,
   },
   title: {
-    fontSize: 16,
+    fontSize: theme.fontSize.base,
     fontWeight: "600",
   },
   subtitle: {
-    fontSize: 12,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/desktop/components/desktop-permission-row.tsx b/packages/app/src/desktop/components/desktop-permission-row.tsx
index 950d9c6c1..a03a3a63d 100644
--- a/packages/app/src/desktop/components/desktop-permission-row.tsx
+++ b/packages/app/src/desktop/components/desktop-permission-row.tsx
@@ -89,12 +89,12 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   permissionStatusText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   permissionDetailText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     maxWidth: 220,
     textAlign: "right",
   },
diff --git a/packages/app/src/desktop/components/desktop-updates-section.tsx b/packages/app/src/desktop/components/desktop-updates-section.tsx
index c9047f79b..b904c628e 100644
--- a/packages/app/src/desktop/components/desktop-updates-section.tsx
+++ b/packages/app/src/desktop/components/desktop-updates-section.tsx
@@ -489,11 +489,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   valueText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   valueSubtext: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   warningCard: {
     marginTop: theme.spacing[3],
@@ -506,7 +506,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   warningText: {
     color: theme.colors.palette.amber[500],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   modalBody: {
     gap: theme.spacing[3],
@@ -514,7 +514,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   logOutput: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontFamily: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace",
     lineHeight: 18,
   },
diff --git a/packages/app/src/desktop/components/integrations-section.tsx b/packages/app/src/desktop/components/integrations-section.tsx
index 5ed198015..c3d3847c9 100644
--- a/packages/app/src/desktop/components/integrations-section.tsx
+++ b/packages/app/src/desktop/components/integrations-section.tsx
@@ -322,7 +322,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   mutedText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   actionsRow: {
     flexDirection: "row",
diff --git a/packages/app/src/desktop/components/pair-device-section.tsx b/packages/app/src/desktop/components/pair-device-section.tsx
index 674302039..0c897356d 100644
--- a/packages/app/src/desktop/components/pair-device-section.tsx
+++ b/packages/app/src/desktop/components/pair-device-section.tsx
@@ -280,7 +280,7 @@ function PairingQr({ svg, isError }: { svg: string | null; isError: boolean }) {
 const styles = StyleSheet.create((theme) => ({
   stateLine: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
     paddingVertical: theme.spacing[6],
   },
@@ -309,8 +309,8 @@ const styles = StyleSheet.create((theme) => ({
   },
   consentDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.5,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.5,
   },
   actions: {
     flexDirection: "row",
@@ -331,15 +331,15 @@ const styles = StyleSheet.create((theme) => ({
   directHint: {
     flex: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.5,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.5,
   },
   offer: {
     gap: theme.spacing[4],
   },
   offerHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   qrTile: {
@@ -375,13 +375,13 @@ const styles = StyleSheet.create((theme) => ({
   linkInput: {
     color: theme.colors.foregroundMuted,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     paddingVertical: theme.spacing[2],
     paddingHorizontal: theme.spacing[3],
     outlineStyle: "none",
   } as object,
   hint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/file-pane/bar.tsx b/packages/app/src/file-pane/bar.tsx
index b674cc200..a380cbc5c 100644
--- a/packages/app/src/file-pane/bar.tsx
+++ b/packages/app/src/file-pane/bar.tsx
@@ -139,9 +139,9 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "center",
     gap: theme.spacing[2],
   },
-  secondary: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.xs },
-  whisper: { color: theme.colors.foregroundExtraMuted, fontSize: theme.fontSize.xs },
-  error: { color: theme.colors.palette.red[300], fontSize: theme.fontSize.xs },
+  secondary: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.sm },
+  whisper: { color: theme.colors.foregroundExtraMuted, fontSize: theme.fontSize.sm },
+  error: { color: theme.colors.palette.red[300], fontSize: theme.fontSize.sm },
   dirtyDot: {
     width: 6,
     height: 6,
@@ -157,6 +157,6 @@ const styles = StyleSheet.create((theme) => ({
   vim: {
     color: theme.colors.foregroundMuted,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/file-pane/conflict-alert.tsx b/packages/app/src/file-pane/conflict-alert.tsx
index 6cc26ec01..12354f18f 100644
--- a/packages/app/src/file-pane/conflict-alert.tsx
+++ b/packages/app/src/file-pane/conflict-alert.tsx
@@ -73,12 +73,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.palette.amber[500],
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   actions: {
     flexShrink: 0,
diff --git a/packages/app/src/file-pane/editor/view.tsx b/packages/app/src/file-pane/editor/view.tsx
index 086128637..8c27bbd8b 100644
--- a/packages/app/src/file-pane/editor/view.tsx
+++ b/packages/app/src/file-pane/editor/view.tsx
@@ -32,5 +32,5 @@ export function FileEditorView(_props: {
 
 const styles = StyleSheet.create((theme) => ({
   container: { flex: 1, alignItems: "center", justifyContent: "center" },
-  text: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.sm },
+  text: { color: theme.colors.foregroundMuted, fontSize: theme.fontSize.base },
 }));
diff --git a/packages/app/src/file-pane/markdown-preview/index.tsx b/packages/app/src/file-pane/markdown-preview/index.tsx
index 1e8a3bfbd..f1247f1c9 100644
--- a/packages/app/src/file-pane/markdown-preview/index.tsx
+++ b/packages/app/src/file-pane/markdown-preview/index.tsx
@@ -84,12 +84,12 @@ const styles = StyleSheet.create((theme) => ({
   frontMatterKey: {
     color: theme.colors.foregroundMuted,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
   frontMatterValue: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 20,
   },
 }));
diff --git a/packages/app/src/file-pane/pane.tsx b/packages/app/src/file-pane/pane.tsx
index c412504e0..9c1c7fb49 100644
--- a/packages/app/src/file-pane/pane.tsx
+++ b/packages/app/src/file-pane/pane.tsx
@@ -852,22 +852,22 @@ const styles = StyleSheet.create((theme) => ({
   loadingText: {
     marginTop: theme.spacing[2],
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorText: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   binaryMetaText: {
     marginTop: theme.spacing[2],
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   previewScrollContainer: {
     flex: 1,
diff --git a/packages/app/src/git/actions-split-button.tsx b/packages/app/src/git/actions-split-button.tsx
index cd8537a29..04f806e20 100644
--- a/packages/app/src/git/actions-split-button.tsx
+++ b/packages/app/src/git/actions-split-button.tsx
@@ -228,8 +228,8 @@ const styles = StyleSheet.create((theme) => ({
     opacity: 0.6,
   },
   splitButtonText: {
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.5,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.5,
     color: theme.colors.foreground,
     fontWeight: theme.fontWeight.normal,
   },
diff --git a/packages/app/src/git/commits-section/commit-row.tsx b/packages/app/src/git/commits-section/commit-row.tsx
index 9c6126eef..092651b52 100644
--- a/packages/app/src/git/commits-section/commit-row.tsx
+++ b/packages/app/src/git/commits-section/commit-row.tsx
@@ -77,7 +77,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   shortSha: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontFamily: theme.fontFamily.mono,
     color: theme.colors.foregroundMuted,
     width: 70,
@@ -86,12 +86,12 @@ const styles = StyleSheet.create((theme) => ({
   subject: {
     flex: 1,
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   timestamp: {
     flexShrink: 0,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   caret: {
diff --git a/packages/app/src/git/commits-section/commits-section.tsx b/packages/app/src/git/commits-section/commits-section.tsx
index bd95a3db4..eaf579b17 100644
--- a/packages/app/src/git/commits-section/commits-section.tsx
+++ b/packages/app/src/git/commits-section/commits-section.tsx
@@ -180,11 +180,11 @@ const styles = StyleSheet.create((theme) => ({
     transform: [{ rotate: "90deg" }],
   },
   title: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   count: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flex: 1,
   },
@@ -203,11 +203,11 @@ const styles = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[2],
   },
   noWorkspaceCommitsText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   errorRow: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.statusDanger,
     paddingLeft: theme.spacing[2],
     paddingRight: theme.spacing[3],
diff --git a/packages/app/src/git/diff-folder-row.tsx b/packages/app/src/git/diff-folder-row.tsx
index 34628228c..9772ba382 100644
--- a/packages/app/src/git/diff-folder-row.tsx
+++ b/packages/app/src/git/diff-folder-row.tsx
@@ -214,7 +214,7 @@ const styles = StyleSheet.create((theme: Theme) => ({
     gap: theme.spacing[1],
   },
   folderName: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foreground,
     flexShrink: 1,
diff --git a/packages/app/src/git/diff-pane.tsx b/packages/app/src/git/diff-pane.tsx
index 2774e19ef..bfaf570ff 100644
--- a/packages/app/src/git/diff-pane.tsx
+++ b/packages/app/src/git/diff-pane.tsx
@@ -1540,8 +1540,8 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   diffStatusText: {
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.25,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.25,
     color: theme.colors.foregroundMuted,
   },
   diffStatusIconHidden: {
@@ -1588,7 +1588,7 @@ const styles = StyleSheet.create((theme) => ({
   actionErrorText: {
     paddingHorizontal: theme.spacing[3],
     paddingBottom: theme.spacing[1],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.destructive,
   },
   forgeSetupCallout: {
@@ -1602,7 +1602,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface1,
   },
   forgeSetupCalloutText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   diffContainer: {
@@ -1651,11 +1651,11 @@ const styles = StyleSheet.create((theme) => ({
     paddingTop: theme.spacing[16],
   },
   emptyText: {
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   tooltipText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foreground,
   },
 }));
diff --git a/packages/app/src/git/diff-too-large-state.tsx b/packages/app/src/git/diff-too-large-state.tsx
index d47812597..cca9b97f3 100644
--- a/packages/app/src/git/diff-too-large-state.tsx
+++ b/packages/app/src/git/diff-too-large-state.tsx
@@ -43,7 +43,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     textAlign: "center",
   },
 }));
diff --git a/packages/app/src/git/file-header.tsx b/packages/app/src/git/file-header.tsx
index 8492b7323..2e3441519 100644
--- a/packages/app/src/git/file-header.tsx
+++ b/packages/app/src/git/file-header.tsx
@@ -382,7 +382,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   name: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foreground,
     flexShrink: 1,
@@ -390,7 +390,7 @@ const styles = StyleSheet.create((theme) => ({
     userSelect: "none",
   },
   directory: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
     flex: 1,
@@ -398,5 +398,5 @@ const styles = StyleSheet.create((theme) => ({
     userSelect: "none",
   },
   directorySpacer: { flex: 1, minWidth: 0 },
-  tooltip: { color: theme.colors.popoverForeground, fontSize: theme.fontSize.sm },
+  tooltip: { color: theme.colors.popoverForeground, fontSize: theme.fontSize.base },
 }));
diff --git a/packages/app/src/git/forges/gitlab.view.tsx b/packages/app/src/git/forges/gitlab.view.tsx
index d88ade1f9..acbc02e0e 100644
--- a/packages/app/src/git/forges/gitlab.view.tsx
+++ b/packages/app/src/git/forges/gitlab.view.tsx
@@ -294,7 +294,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   approvalsText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   hoverable: {
@@ -309,7 +309,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[1],
   },
   pipelineStageName: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
     textTransform: "uppercase",
diff --git a/packages/app/src/git/pull-request-panel/checks-section.tsx b/packages/app/src/git/pull-request-panel/checks-section.tsx
index 142fc4650..80521602a 100644
--- a/packages/app/src/git/pull-request-panel/checks-section.tsx
+++ b/packages/app/src/git/pull-request-panel/checks-section.tsx
@@ -253,12 +253,12 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[0.5],
   },
   headline: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foreground,
   },
   detail: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   list: {
@@ -276,7 +276,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingBottom: theme.spacing[1],
   },
   groupLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
   },
diff --git a/packages/app/src/git/pull-request-panel/pane-error.tsx b/packages/app/src/git/pull-request-panel/pane-error.tsx
index 1e3cef516..51eb7bbfd 100644
--- a/packages/app/src/git/pull-request-panel/pane-error.tsx
+++ b/packages/app/src/git/pull-request-panel/pane-error.tsx
@@ -32,7 +32,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surfaceSidebar,
   },
   message: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     textAlign: "center",
   },
diff --git a/packages/app/src/git/pull-request-panel/pane-skeleton.tsx b/packages/app/src/git/pull-request-panel/pane-skeleton.tsx
index 12e78dc16..f2716dd1a 100644
--- a/packages/app/src/git/pull-request-panel/pane-skeleton.tsx
+++ b/packages/app/src/git/pull-request-panel/pane-skeleton.tsx
@@ -82,7 +82,7 @@ const styles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[2],
   },
   sectionTitle: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
     paddingHorizontal: theme.spacing[3],
diff --git a/packages/app/src/git/pull-request-panel/pane.tsx b/packages/app/src/git/pull-request-panel/pane.tsx
index ed6434084..a093cacef 100644
--- a/packages/app/src/git/pull-request-panel/pane.tsx
+++ b/packages/app/src/git/pull-request-panel/pane.tsx
@@ -1202,27 +1202,27 @@ const styles = StyleSheet.create((theme) => ({
     minHeight: 16,
   },
   stateLabelOpen: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusSuccess,
   },
   stateLabelDraft: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
   stateLabelMerged: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusMerged,
   },
   stateLabelClosed: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusDanger,
   },
   repoRef: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
     marginLeft: theme.spacing[1],
@@ -1299,7 +1299,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   filterHiddenCount: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   eventRow: {
@@ -1330,7 +1330,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   authorText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foreground,
     flexShrink: 1,
@@ -1341,19 +1341,19 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   verbMuted: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   verbSuccess: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.statusSuccess,
   },
   verbDanger: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.statusDanger,
   },
   ageText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   kebabSlot: {
@@ -1407,7 +1407,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface1,
   },
   threadPath: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontFamily: theme.fontFamily.mono,
     color: theme.colors.foreground,
     flexShrink: 1,
diff --git a/packages/app/src/git/pull-request-panel/section-kit.tsx b/packages/app/src/git/pull-request-panel/section-kit.tsx
index 702d40865..9cd394054 100644
--- a/packages/app/src/git/pull-request-panel/section-kit.tsx
+++ b/packages/app/src/git/pull-request-panel/section-kit.tsx
@@ -101,7 +101,7 @@ export const sectionKitStyles = StyleSheet.create((theme) => ({
     paddingVertical: theme.spacing[2],
   },
   sectionTitle: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
   },
@@ -120,27 +120,27 @@ export const sectionKitStyles = StyleSheet.create((theme) => ({
     gap: 3,
   },
   summaryPillSuccessText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusSuccess,
   },
   summaryPillDangerText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusDanger,
   },
   summaryPillWarningText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.statusWarning,
   },
   summaryPillMutedText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
   },
   emptyText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     paddingHorizontal: theme.spacing[3],
     paddingVertical: theme.spacing[2],
@@ -157,13 +157,13 @@ export const sectionKitStyles = StyleSheet.create((theme) => ({
     height: CONTROL_HEIGHTS.compact,
   },
   checkName: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foreground,
     flexShrink: 1,
   },
   checkWorkflow: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
@@ -174,7 +174,7 @@ export const sectionKitStyles = StyleSheet.create((theme) => ({
     gap: theme.spacing[2],
   },
   checkDuration: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
 }));
diff --git a/packages/app/src/hooks/use-settings/index.ts b/packages/app/src/hooks/use-settings/index.ts
index 9836aa202..df9f96e2a 100644
--- a/packages/app/src/hooks/use-settings/index.ts
+++ b/packages/app/src/hooks/use-settings/index.ts
@@ -17,13 +17,13 @@ import {
   DEFAULT_CLIENT_SETTINGS,
   DEFAULT_CODE_FONT_SIZE,
   DEFAULT_TERMINAL_SCROLLBACK_LINES,
-  DEFAULT_UI_FONT_SIZE,
+  DEFAULT_UI_BASE_FONT_SIZE,
   MAX_CODE_FONT_SIZE,
   MAX_TERMINAL_SCROLLBACK_LINES,
-  MAX_UI_FONT_SIZE,
+  MAX_UI_BASE_FONT_SIZE,
   MIN_CODE_FONT_SIZE,
   MIN_TERMINAL_SCROLLBACK_LINES,
-  MIN_UI_FONT_SIZE,
+  MIN_UI_BASE_FONT_SIZE,
   loadAppSettingsFromStorage as loadAppSettingsFromStoragePure,
   loadSettingsFromStorage as loadSettingsFromStoragePure,
   normalizeAppSettings,
@@ -49,13 +49,13 @@ export {
   DEFAULT_CLIENT_SETTINGS,
   DEFAULT_CODE_FONT_SIZE,
   DEFAULT_TERMINAL_SCROLLBACK_LINES,
-  DEFAULT_UI_FONT_SIZE,
+  DEFAULT_UI_BASE_FONT_SIZE,
   MAX_CODE_FONT_SIZE,
   MAX_TERMINAL_SCROLLBACK_LINES,
-  MAX_UI_FONT_SIZE,
+  MAX_UI_BASE_FONT_SIZE,
   MIN_CODE_FONT_SIZE,
   MIN_TERMINAL_SCROLLBACK_LINES,
-  MIN_UI_FONT_SIZE,
+  MIN_UI_BASE_FONT_SIZE,
   parseClampedFontSize,
   parseTerminalScrollbackLines,
   sanitizeFontFamily,
diff --git a/packages/app/src/hooks/use-settings/storage.test.ts b/packages/app/src/hooks/use-settings/storage.test.ts
index 0bce6a7a9..58cb8c0b7 100644
--- a/packages/app/src/hooks/use-settings/storage.test.ts
+++ b/packages/app/src/hooks/use-settings/storage.test.ts
@@ -6,7 +6,8 @@ import {
   DEFAULT_APP_SETTINGS,
   DEFAULT_CLIENT_SETTINGS,
   DEFAULT_CODE_FONT_SIZE,
-  DEFAULT_UI_FONT_SIZE,
+  DEFAULT_UI_BASE_FONT_SIZE,
+  defaultUiBaseFontSize,
   loadAppSettingsFromStorage,
   loadSettingsFromStorage,
   parseClampedFontSize,
@@ -387,7 +388,7 @@ describe("appearance settings", () => {
 
     expect(result.uiFontFamily).toBe("");
     expect(result.monoFontFamily).toBe("");
-    expect(result.uiFontSize).toBe(DEFAULT_UI_FONT_SIZE);
+    expect(result.uiBaseFontSize).toBe(DEFAULT_UI_BASE_FONT_SIZE);
     expect(result.codeFontSize).toBe(DEFAULT_CODE_FONT_SIZE);
     expect(result.syntaxTheme).toBe("one");
     expect(result.toolCallDetailLevel).toBe("detailed");
@@ -436,27 +437,66 @@ describe("appearance settings", () => {
     expect((await loadAppSettingsFromStorage(deps)).sidebarChecksDisplay).toBe("icon");
   });
 
-  it("clamps the UI font size into range and rejects non-numeric values", async () => {
+  it("uses a 15px mobile base and a 14px web base", () => {
+    expect(defaultUiBaseFontSize(true)).toBe(15);
+    expect(defaultUiBaseFontSize(false)).toBe(14);
+  });
+
+  it.each([
+    { legacySize: 16, baseSize: 14 },
+    { legacySize: 17, baseSize: 15 },
+    { legacySize: 18, baseSize: 16 },
+  ])(
+    "migrates legacy interface size $legacySize to base size $baseSize",
+    async ({ legacySize, baseSize }) => {
+      const deps = makeDeps({
+        storage: createInMemoryKeyValueStorage({
+          [APP_SETTINGS_KEY]: JSON.stringify({ uiFontSize: legacySize }),
+        }),
+      });
+
+      const result = await loadAppSettingsFromStorage(deps);
+      const persisted = JSON.parse(deps.storage.entries.get(APP_SETTINGS_KEY) ?? "null");
+
+      expect(result.uiBaseFontSize).toBe(baseSize);
+      expect(persisted).toMatchObject({ uiBaseFontSize: baseSize });
+      expect(persisted).not.toHaveProperty("uiFontSize");
+    },
+  );
+
+  it("lets an explicit base size win over the legacy interface scale", async () => {
     const deps = makeDeps({
       storage: createInMemoryKeyValueStorage({
-        [APP_SETTINGS_KEY]: JSON.stringify({ uiFontSize: 999 }),
+        [APP_SETTINGS_KEY]: JSON.stringify({ uiBaseFontSize: 16, uiFontSize: 17 }),
       }),
     });
-    expect((await loadAppSettingsFromStorage(deps)).uiFontSize).toBe(24);
+
+    expect((await loadAppSettingsFromStorage(deps)).uiBaseFontSize).toBe(16);
+  });
+
+  it("clamps the UI base font size into range and rejects non-numeric values", async () => {
+    const deps = makeDeps({
+      storage: createInMemoryKeyValueStorage({
+        [APP_SETTINGS_KEY]: JSON.stringify({ uiBaseFontSize: 999 }),
+      }),
+    });
+    expect((await loadAppSettingsFromStorage(deps)).uiBaseFontSize).toBe(21);
 
     const low = makeDeps({
       storage: createInMemoryKeyValueStorage({
-        [APP_SETTINGS_KEY]: JSON.stringify({ uiFontSize: 8 }),
+        [APP_SETTINGS_KEY]: JSON.stringify({ uiBaseFontSize: 8 }),
       }),
     });
-    expect((await loadAppSettingsFromStorage(low)).uiFontSize).toBe(11);
+    expect((await loadAppSettingsFromStorage(low)).uiBaseFontSize).toBe(10);
 
     const bogus = makeDeps({
       storage: createInMemoryKeyValueStorage({
-        [APP_SETTINGS_KEY]: JSON.stringify({ uiFontSize: "abc" }),
+        [APP_SETTINGS_KEY]: JSON.stringify({ uiBaseFontSize: "abc" }),
       }),
     });
-    expect((await loadAppSettingsFromStorage(bogus)).uiFontSize).toBe(DEFAULT_UI_FONT_SIZE);
+    expect((await loadAppSettingsFromStorage(bogus)).uiBaseFontSize).toBe(
+      DEFAULT_UI_BASE_FONT_SIZE,
+    );
   });
 
   it("clamps the code font size into range and rejects non-numeric values", async () => {
diff --git a/packages/app/src/hooks/use-settings/storage.ts b/packages/app/src/hooks/use-settings/storage.ts
index 43a09ec87..368592e6f 100644
--- a/packages/app/src/hooks/use-settings/storage.ts
+++ b/packages/app/src/hooks/use-settings/storage.ts
@@ -14,7 +14,8 @@ import {
   parseSidebarRowItems,
   type SidebarRowItems,
 } from "@/components/sidebar/display-preferences/row-items";
-import { THEME_OPTIONS, type ThemePreference } from "@/styles/theme";
+import { isNative } from "@/constants/platform";
+import { FONT_SIZE, THEME_OPTIONS, type ThemePreference } from "@/styles/theme";
 import { z } from "zod";
 import { readValidatedJson } from "@/storage/validated-storage";
 
@@ -43,9 +44,13 @@ const VALID_TOOL_CALL_DETAIL_LEVELS = new Set<ToolCallDetailLevel>(["overview",
 export const DEFAULT_TERMINAL_SCROLLBACK_LINES = 10_000;
 export const MIN_TERMINAL_SCROLLBACK_LINES = 0;
 export const MAX_TERMINAL_SCROLLBACK_LINES = 1_000_000;
-export const DEFAULT_UI_FONT_SIZE = 16; // == FONT_SIZE.base
-export const MIN_UI_FONT_SIZE = 11;
-export const MAX_UI_FONT_SIZE = 24;
+export function defaultUiBaseFontSize(native: boolean): number {
+  return native ? 15 : FONT_SIZE.base;
+}
+
+export const DEFAULT_UI_BASE_FONT_SIZE = defaultUiBaseFontSize(isNative);
+export const MIN_UI_BASE_FONT_SIZE = 10;
+export const MAX_UI_BASE_FONT_SIZE = 21;
 export const DEFAULT_CODE_FONT_SIZE = 12; // == FONT_SIZE.code
 export const MIN_CODE_FONT_SIZE = 9;
 export const MAX_CODE_FONT_SIZE = 22; // line-height 1.5×22=33 stays safe
@@ -60,7 +65,7 @@ export interface AppSettings {
   useLegacyTerminalRenderer: boolean;
   uiFontFamily: string; // "" = platform default UI stack
   monoFontFamily: string; // "" = platform default mono stack
-  uiFontSize: number; // clamped px, default 16
+  uiBaseFontSize: number; // clamped px, platform default 14 or 15
   codeFontSize: number; // clamped px, default 12
   syntaxTheme: SyntaxThemeId; // default "one"
   workspaceTitleSource: WorkspaceTitleSource;
@@ -99,6 +104,8 @@ const StoredAppSettingsSchema = z.strictObject({
   useLegacyTerminalRenderer: z.boolean().optional(),
   uiFontFamily: z.string().optional(),
   monoFontFamily: z.string().optional(),
+  uiBaseFontSize: z.union([z.number(), z.string()]).optional(),
+  // COMPAT(uiFontSizeScale): replaced by the literal base size in v0.4, remove after 2027-08-17.
   uiFontSize: z.union([z.number(), z.string()]).optional(),
   codeFontSize: z.union([z.number(), z.string()]).optional(),
   syntaxTheme: z.string().refine(isSyntaxThemeId).optional(),
@@ -129,7 +136,7 @@ export const DEFAULT_CLIENT_SETTINGS: AppSettings = {
   useLegacyTerminalRenderer: false,
   uiFontFamily: "",
   monoFontFamily: "",
-  uiFontSize: DEFAULT_UI_FONT_SIZE,
+  uiBaseFontSize: DEFAULT_UI_BASE_FONT_SIZE,
   codeFontSize: DEFAULT_CODE_FONT_SIZE,
   syntaxTheme: "one",
   workspaceTitleSource: "title",
@@ -186,7 +193,11 @@ export async function loadAppSettingsFromStorage(deps: SettingsDeps): Promise<Ap
   try {
     const stored = await readValidatedJson(deps.storage, APP_SETTINGS_KEY, StoredAppSettingsSchema);
     if (stored) {
-      return normalizeAppSettings(stored);
+      const normalized = normalizeAppSettings(stored);
+      if (stored.uiBaseFontSize === undefined && stored.uiFontSize !== undefined) {
+        await deps.storage.setItem(APP_SETTINGS_KEY, JSON.stringify(normalized));
+      }
+      return normalized;
     }
 
     const legacyStored = await readValidatedJson(
@@ -354,12 +365,20 @@ function pickAppSettings(stored: StoredAppSettings): Partial<AppSettings> {
   if (monoFontFamily !== null) {
     result.monoFontFamily = monoFontFamily;
   }
-  const uiFontSize = parseClampedFontSize(stored.uiFontSize, {
-    min: MIN_UI_FONT_SIZE,
-    max: MAX_UI_FONT_SIZE,
+  const uiBaseFontSize = parseClampedFontSize(stored.uiBaseFontSize, {
+    min: MIN_UI_BASE_FONT_SIZE,
+    max: MAX_UI_BASE_FONT_SIZE,
   });
-  if (uiFontSize !== null) {
-    result.uiFontSize = uiFontSize;
+  if (uiBaseFontSize !== null) {
+    result.uiBaseFontSize = uiBaseFontSize;
+  } else {
+    const legacyUiFontSize = parseClampedFontSize(stored.uiFontSize, {
+      min: 11,
+      max: 24,
+    });
+    if (legacyUiFontSize !== null) {
+      result.uiBaseFontSize = Math.round((FONT_SIZE.base * legacyUiFontSize) / 16);
+    }
   }
   const codeFontSize = parseClampedFontSize(stored.codeFontSize, {
     min: MIN_CODE_FONT_SIZE,
diff --git a/packages/app/src/hosts/host-badge.tsx b/packages/app/src/hosts/host-badge.tsx
index 7258d9ab6..b316e4a7b 100644
--- a/packages/app/src/hosts/host-badge.tsx
+++ b/packages/app/src/hosts/host-badge.tsx
@@ -101,7 +101,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   label: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 16,
     flexShrink: 1,
     minWidth: 0,
diff --git a/packages/app/src/hosts/host-chooser.tsx b/packages/app/src/hosts/host-chooser.tsx
index d0724e9cf..ce50e0085 100644
--- a/packages/app/src/hosts/host-chooser.tsx
+++ b/packages/app/src/hosts/host-chooser.tsx
@@ -316,7 +316,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   input: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     padding: 0,
     outlineStyle: "none",
   } as object,
@@ -353,11 +353,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   rowSubtitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingHorizontal: theme.spacing[4],
     paddingVertical: theme.spacing[3],
   },
diff --git a/packages/app/src/i18n/resources/ar.ts b/packages/app/src/i18n/resources/ar.ts
index e06d32360..d60837219 100644
--- a/packages/app/src/i18n/resources/ar.ts
+++ b/packages/app/src/i18n/resources/ar.ts
@@ -1983,8 +1983,8 @@ export const ar: TranslationResources = {
         interfaceFont: "خط الواجهة",
         interfaceFontHint: "تستخدم عبر التطبيق. اتركه فارغًا للإعداد الافتراضي للنظام",
         interfaceFontAccessibility: "عائلة خطوط الواجهة",
-        interfaceSize: "حجم الواجهة",
-        interfaceSizeAccessibility: "حجم الخط في الواجهة",
+        baseSize: "الحجم الأساسي",
+        baseSizeAccessibility: "حجم الخط الأساسي",
         codeFont: "خط الكود",
         codeFontHint:
           "تستخدم في الكود والاختلافات والمخرجات الطرفية. اتركه فارغًا للإعداد الافتراضي للنظام",
diff --git a/packages/app/src/i18n/resources/en.ts b/packages/app/src/i18n/resources/en.ts
index 91ced0cab..24c8901cf 100644
--- a/packages/app/src/i18n/resources/en.ts
+++ b/packages/app/src/i18n/resources/en.ts
@@ -2047,8 +2047,8 @@ export const en = {
         interfaceFont: "Interface font",
         interfaceFontHint: "Used across the app. Leave empty for the system default",
         interfaceFontAccessibility: "Interface font family",
-        interfaceSize: "Interface size",
-        interfaceSizeAccessibility: "Interface font size",
+        baseSize: "Base size",
+        baseSizeAccessibility: "Base font size",
         codeFont: "Code font",
         codeFontHint:
           "Used in code, diffs, and the terminal output. Leave empty for the system default",
diff --git a/packages/app/src/i18n/resources/es.ts b/packages/app/src/i18n/resources/es.ts
index 7fd41c150..b5b97aa19 100644
--- a/packages/app/src/i18n/resources/es.ts
+++ b/packages/app/src/i18n/resources/es.ts
@@ -2031,8 +2031,8 @@ export const es: TranslationResources = {
         interfaceFontHint:
           "Utilizado en toda la aplicación. Déjelo vacío para el valor predeterminado del sistema.",
         interfaceFontAccessibility: "Familia de fuentes de interfaz",
-        interfaceSize: "Tamaño de la interfaz",
-        interfaceSizeAccessibility: "Tamaño de fuente de la interfaz",
+        baseSize: "Tamaño base",
+        baseSizeAccessibility: "Tamaño base de la fuente",
         codeFont: "Fuente de código",
         codeFontHint:
           "Se utiliza en código, diferencias y salida del terminal. Déjelo vacío para el valor predeterminado del sistema.",
diff --git a/packages/app/src/i18n/resources/fr.ts b/packages/app/src/i18n/resources/fr.ts
index 19553dece..51bbc620d 100644
--- a/packages/app/src/i18n/resources/fr.ts
+++ b/packages/app/src/i18n/resources/fr.ts
@@ -2035,8 +2035,8 @@ export const fr: TranslationResources = {
         interfaceFontHint:
           "Utilisé dans toute l'application. Laisser vide pour la valeur par défaut du système",
         interfaceFontAccessibility: "Famille de polices d'interface",
-        interfaceSize: "Taille de l'interface",
-        interfaceSizeAccessibility: "Taille de la police de l'interface",
+        baseSize: "Taille de base",
+        baseSizeAccessibility: "Taille de base de la police",
         codeFont: "Police de code",
         codeFontHint:
           "Utilisé dans le code, les différences et la sortie du terminal. Laisser vide pour la valeur par défaut du système",
diff --git a/packages/app/src/i18n/resources/ja.ts b/packages/app/src/i18n/resources/ja.ts
index 4432c0c1a..9778459eb 100644
--- a/packages/app/src/i18n/resources/ja.ts
+++ b/packages/app/src/i18n/resources/ja.ts
@@ -2000,8 +2000,8 @@ export const ja: TranslationResources = {
         interfaceFontHint:
           "アプリ全体で使用されます。システムデフォルトにするには空のままにしてください",
         interfaceFontAccessibility: "インターフェースフォントファミリー",
-        interfaceSize: "インターフェースサイズ",
-        interfaceSizeAccessibility: "インターフェースフォントサイズ",
+        baseSize: "基本サイズ",
+        baseSizeAccessibility: "基本フォントサイズ",
         codeFont: "コードフォント",
         codeFontHint:
           "コード、差分、ターミナル出力で使用されます。システムデフォルトにするには空のままにしてください",
diff --git a/packages/app/src/i18n/resources/ko.ts b/packages/app/src/i18n/resources/ko.ts
index 041270caa..65af64469 100644
--- a/packages/app/src/i18n/resources/ko.ts
+++ b/packages/app/src/i18n/resources/ko.ts
@@ -1994,8 +1994,8 @@ export const ko: TranslationResources = {
         interfaceFont: "인터페이스 글꼴",
         interfaceFontHint: "앱 전체에 사용됩니다. 시스템 기본값을 사용하려면 비워 두세요",
         interfaceFontAccessibility: "인터페이스 글꼴 패밀리",
-        interfaceSize: "인터페이스 크기",
-        interfaceSizeAccessibility: "인터페이스 글꼴 크기",
+        baseSize: "기본 크기",
+        baseSizeAccessibility: "기본 글꼴 크기",
         codeFont: "코드 글꼴",
         codeFontHint:
           "코드, diff, 터미널 출력에 사용됩니다. 시스템 기본값을 사용하려면 비워 두세요",
diff --git a/packages/app/src/i18n/resources/pt-BR.ts b/packages/app/src/i18n/resources/pt-BR.ts
index c66576b70..92ff52afe 100644
--- a/packages/app/src/i18n/resources/pt-BR.ts
+++ b/packages/app/src/i18n/resources/pt-BR.ts
@@ -2014,8 +2014,8 @@ export const ptBR: TranslationResources = {
         interfaceFont: "Fonte da interface",
         interfaceFontHint: "Usada em todo o app. Deixe vazio para usar o padrão do sistema",
         interfaceFontAccessibility: "Família da fonte da interface",
-        interfaceSize: "Tamanho da interface",
-        interfaceSizeAccessibility: "Tamanho da fonte da interface",
+        baseSize: "Tamanho base",
+        baseSizeAccessibility: "Tamanho base da fonte",
         codeFont: "Fonte de código",
         codeFontHint:
           "Usada em código, diffs e saída do terminal. Deixe vazio para usar o padrão do sistema",
diff --git a/packages/app/src/i18n/resources/ru.ts b/packages/app/src/i18n/resources/ru.ts
index d044cdf51..b1573bfa4 100644
--- a/packages/app/src/i18n/resources/ru.ts
+++ b/packages/app/src/i18n/resources/ru.ts
@@ -2021,8 +2021,8 @@ export const ru: TranslationResources = {
         interfaceFontHint:
           "Используется во всем приложении. Оставьте пустым для системного значения по умолчанию.",
         interfaceFontAccessibility: "Семейство интерфейсных шрифтов",
-        interfaceSize: "Размер интерфейса",
-        interfaceSizeAccessibility: "Размер шрифта интерфейса",
+        baseSize: "Базовый размер",
+        baseSizeAccessibility: "Базовый размер шрифта",
         codeFont: "Шрифт кода",
         codeFontHint:
           "Используется в коде, различиях и выводе терминала. Оставьте пустым для системного значения по умолчанию.",
diff --git a/packages/app/src/i18n/resources/zh-CN.ts b/packages/app/src/i18n/resources/zh-CN.ts
index af111f1d9..046b6fc8a 100644
--- a/packages/app/src/i18n/resources/zh-CN.ts
+++ b/packages/app/src/i18n/resources/zh-CN.ts
@@ -1960,8 +1960,8 @@ export const zhCN: TranslationResources = {
         interfaceFont: "界面字体",
         interfaceFontHint: "用于整个应用。留空则使用系统默认",
         interfaceFontAccessibility: "界面字体族",
-        interfaceSize: "界面字号",
-        interfaceSizeAccessibility: "界面字号",
+        baseSize: "基础字号",
+        baseSizeAccessibility: "基础字号",
         codeFont: "代码字体",
         codeFontHint: "用于代码、diff 和终端输出。留空则使用系统默认",
         codeFontAccessibility: "代码字体族",
diff --git a/packages/app/src/navigation/agent-route-resolution-view.tsx b/packages/app/src/navigation/agent-route-resolution-view.tsx
index b875e0bef..4518285b8 100644
--- a/packages/app/src/navigation/agent-route-resolution-view.tsx
+++ b/packages/app/src/navigation/agent-route-resolution-view.tsx
@@ -128,13 +128,13 @@ const styles = StyleSheet.create((theme) => ({
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   error: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
-    lineHeight: Math.round(theme.fontSize.sm * 1.4),
+    fontSize: theme.fontSize.base,
+    lineHeight: Math.round(theme.fontSize.base * 1.4),
     textAlign: "center",
   },
   actions: {
diff --git a/packages/app/src/new-workspace-launch/launch-control.tsx b/packages/app/src/new-workspace-launch/launch-control.tsx
index ea7d5cc4e..785cfb56a 100644
--- a/packages/app/src/new-workspace-launch/launch-control.tsx
+++ b/packages/app/src/new-workspace-launch/launch-control.tsx
@@ -241,21 +241,21 @@ const styles = StyleSheet.create((theme) => ({
   },
   label: {
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   profileName: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundExtraMuted,
   },
   command: {
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
 }));
diff --git a/packages/app/src/panels/provider-subagent-panel.tsx b/packages/app/src/panels/provider-subagent-panel.tsx
index 9aa6170a7..a5b4f54cf 100644
--- a/packages/app/src/panels/provider-subagent-panel.tsx
+++ b/packages/app/src/panels/provider-subagent-panel.tsx
@@ -222,7 +222,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   subtitleText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   unsupported: { flex: 1, alignItems: "center", justifyContent: "center", padding: 24 },
   unsupportedText: { color: theme.colors.foregroundMuted, textAlign: "center" },
diff --git a/packages/app/src/panels/setup-panel.tsx b/packages/app/src/panels/setup-panel.tsx
index 5087cf365..789f02e50 100644
--- a/packages/app/src/panels/setup-panel.tsx
+++ b/packages/app/src/panels/setup-panel.tsx
@@ -485,7 +485,7 @@ const styles = StyleSheet.create((theme) => ({
     gap: theme.spacing[3],
   },
   waitingText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   emptyContainer: {
@@ -494,7 +494,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   emptyText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   commandList: {
@@ -530,11 +530,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   commandText: {
     flex: 1,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   commandDuration: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     flexShrink: 0,
   },
@@ -560,7 +560,7 @@ const styles = StyleSheet.create((theme) => ({
     color: theme.colors.foreground,
   },
   emptyLogText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     fontStyle: "italic",
   },
@@ -569,7 +569,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.palette.red[100],
   },
   errorText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.palette.red[800],
   },
 }));
diff --git a/packages/app/src/plugins/surface-screen.tsx b/packages/app/src/plugins/surface-screen.tsx
index b77abf31f..ad735156b 100644
--- a/packages/app/src/plugins/surface-screen.tsx
+++ b/packages/app/src/plugins/surface-screen.tsx
@@ -272,6 +272,6 @@ const styles = StyleSheet.create((theme) => ({
   hostSwitcherText: {
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/provider-usage/balance-bar.tsx b/packages/app/src/provider-usage/balance-bar.tsx
index bd430b7a3..dbf18bea8 100644
--- a/packages/app/src/provider-usage/balance-bar.tsx
+++ b/packages/app/src/provider-usage/balance-bar.tsx
@@ -82,11 +82,11 @@ const styles = StyleSheet.create((theme) => ({
   label: {
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   value: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
   reset: {
diff --git a/packages/app/src/provider-usage/card.tsx b/packages/app/src/provider-usage/card.tsx
index d6c47ba1f..10ef161fc 100644
--- a/packages/app/src/provider-usage/card.tsx
+++ b/packages/app/src/provider-usage/card.tsx
@@ -140,7 +140,7 @@ const styles = StyleSheet.create((theme) => ({
   name: {
     flexShrink: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   headerSpacer: {
     flex: 1,
@@ -164,7 +164,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   bars: {
     gap: theme.spacing[3],
@@ -180,19 +180,19 @@ const styles = StyleSheet.create((theme) => ({
   detailLabel: {
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   detailValue: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   error: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.4,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.4,
   },
   footer: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/provider-usage/settings-section.tsx b/packages/app/src/provider-usage/settings-section.tsx
index 51da2d710..cb8e8f6b5 100644
--- a/packages/app/src/provider-usage/settings-section.tsx
+++ b/packages/app/src/provider-usage/settings-section.tsx
@@ -89,6 +89,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/provider-usage/tooltip-section.tsx b/packages/app/src/provider-usage/tooltip-section.tsx
index 2a94a9652..6a5a89630 100644
--- a/packages/app/src/provider-usage/tooltip-section.tsx
+++ b/packages/app/src/provider-usage/tooltip-section.tsx
@@ -64,12 +64,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   detail: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.4,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.4,
   },
   error: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.4,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.4,
   },
 }));
diff --git a/packages/app/src/provider-usage/window-bar.tsx b/packages/app/src/provider-usage/window-bar.tsx
index c3e379391..0bd198521 100644
--- a/packages/app/src/provider-usage/window-bar.tsx
+++ b/packages/app/src/provider-usage/window-bar.tsx
@@ -72,11 +72,11 @@ const styles = StyleSheet.create((theme) => ({
   label: {
     flexShrink: 1,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   value: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.medium,
   },
   reset: {
diff --git a/packages/app/src/review/surface.tsx b/packages/app/src/review/surface.tsx
index 4d254bd81..f4fbb1c55 100644
--- a/packages/app/src/review/surface.tsx
+++ b/packages/app/src/review/surface.tsx
@@ -604,8 +604,8 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minWidth: 0,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.4,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.4,
   },
   commentActions: {
     flexDirection: "row",
@@ -653,8 +653,8 @@ const styles = StyleSheet.create((theme) => ({
     borderRadius: theme.borderRadius.md,
     paddingHorizontal: theme.spacing[3],
     paddingVertical: theme.spacing[2],
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.4,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.4,
     textAlignVertical: "top",
     ...(isWeb
       ? {
diff --git a/packages/app/src/screens/new-workspace-screen.tsx b/packages/app/src/screens/new-workspace-screen.tsx
index ec24e88d2..ca3c9136f 100644
--- a/packages/app/src/screens/new-workspace-screen.tsx
+++ b/packages/app/src/screens/new-workspace-screen.tsx
@@ -2385,12 +2385,12 @@ const styles = StyleSheet.create((theme) => ({
     paddingRight: theme.spacing[4],
   },
   composerTitle: {
-    fontSize: theme.fontSize.xl,
+    fontSize: theme.fontSize["2xl"],
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foreground,
   },
   errorText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.destructive,
     lineHeight: 20,
   },
@@ -2453,16 +2453,16 @@ const styles = StyleSheet.create((theme) => ({
   },
   badgeText: {
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   refDivergenceLabel: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
     fontVariant: ["tabular-nums"],
   },
diff --git a/packages/app/src/screens/open-project-screen.tsx b/packages/app/src/screens/open-project-screen.tsx
index c5cffe933..11e90136b 100644
--- a/packages/app/src/screens/open-project-screen.tsx
+++ b/packages/app/src/screens/open-project-screen.tsx
@@ -250,7 +250,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   tileDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     lineHeight: 18,
   },
   communityRow: {
diff --git a/packages/app/src/screens/project-settings-screen.tsx b/packages/app/src/screens/project-settings-screen.tsx
index ae5e7e1ef..e3ae143bb 100644
--- a/packages/app/src/screens/project-settings-screen.tsx
+++ b/packages/app/src/screens/project-settings-screen.tsx
@@ -1131,7 +1131,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   noTargetText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   body: {
     padding: theme.spacing[4],
@@ -1153,7 +1153,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   projectTitle: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     flexShrink: 1,
   },
@@ -1161,7 +1161,7 @@ const styles = StyleSheet.create((theme) => ({
     padding: theme.spacing[1],
   },
   titleIconFallbackText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   iconColor: {
@@ -1178,7 +1178,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyScripts: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   scriptRow: {
     flexDirection: "row",
@@ -1217,11 +1217,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   modalLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   modalInput: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingVertical: theme.spacing[2],
     paddingHorizontal: theme.spacing[3],
     borderRadius: theme.borderRadius.md,
@@ -1231,7 +1231,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   modalMultilineInput: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     paddingVertical: theme.spacing[2],
     paddingHorizontal: theme.spacing[3],
     borderRadius: theme.borderRadius.md,
@@ -1249,7 +1249,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   fieldError: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   serviceToggleRow: {
     flexDirection: "row",
@@ -1263,12 +1263,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   serviceToggleLabel: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
   },
   modalHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   placeholderColor: {
     color: theme.colors.foregroundMuted,
diff --git a/packages/app/src/screens/projects-screen.tsx b/packages/app/src/screens/projects-screen.tsx
index 146307475..4f89253a2 100644
--- a/packages/app/src/screens/projects-screen.tsx
+++ b/packages/app/src/screens/projects-screen.tsx
@@ -180,7 +180,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorsBanner: {
     borderWidth: 1,
@@ -192,7 +192,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorsBannerText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   row: {
     gap: theme.spacing[3],
@@ -217,7 +217,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   iconFallbackText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   spinnerColor: {
     color: theme.colors.foregroundMuted,
diff --git a/packages/app/src/screens/schedules-screen.tsx b/packages/app/src/screens/schedules-screen.tsx
index 76498053a..ce2f8b9df 100644
--- a/packages/app/src/screens/schedules-screen.tsx
+++ b/packages/app/src/screens/schedules-screen.tsx
@@ -408,7 +408,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorsBannerText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   filterEmpty: {
     flexGrow: 1,
@@ -439,12 +439,12 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyDescription: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   message: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   // Static color holder read by the spinner; keeps the muted token without
diff --git a/packages/app/src/screens/sessions-screen.tsx b/packages/app/src/screens/sessions-screen.tsx
index d5e0cc7ea..b063e042a 100644
--- a/packages/app/src/screens/sessions-screen.tsx
+++ b/packages/app/src/screens/sessions-screen.tsx
@@ -244,7 +244,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
   },
   loadingContainer: {
     flex: 1,
@@ -257,7 +257,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   footerHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorsBannerWrap: {
     paddingHorizontal: {
@@ -275,6 +275,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   errorsBannerText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/screens/settings-screen.tsx b/packages/app/src/screens/settings-screen.tsx
index 9bcd60071..28ab67cc6 100644
--- a/packages/app/src/screens/settings-screen.tsx
+++ b/packages/app/src/screens/settings-screen.tsx
@@ -1582,7 +1582,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   loadingText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.lg,
+    fontSize: theme.fontSize.base,
   },
   container: {
     flex: 1,
@@ -1600,14 +1600,14 @@ const styles = StyleSheet.create((theme) => ({
   },
   aboutValue: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   aboutVersionMismatch: {
     color: theme.colors.palette.amber[500],
   },
   aboutErrorText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
   aboutCommunity: {
@@ -1630,7 +1630,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   themeTriggerText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   terminalScrollbackInput: {
     width: 112,
@@ -1642,7 +1642,7 @@ const styles = StyleSheet.create((theme) => ({
     borderColor: theme.colors.border,
     backgroundColor: theme.colors.surface2,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "right",
   },
   placeholder: {
@@ -1653,7 +1653,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   placeholderText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
 
@@ -1693,7 +1693,7 @@ const sidebarStyles = StyleSheet.create((theme) => ({
     gap: theme.spacing[1],
   },
   groupLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.medium,
     color: theme.colors.foregroundMuted,
     paddingHorizontal: theme.spacing[2],
diff --git a/packages/app/src/screens/settings/appearance/appearance-section.tsx b/packages/app/src/screens/settings/appearance/appearance-section.tsx
index 72a5577af..8a9977ac0 100644
--- a/packages/app/src/screens/settings/appearance/appearance-section.tsx
+++ b/packages/app/src/screens/settings/appearance/appearance-section.tsx
@@ -20,9 +20,9 @@ import { Switch } from "@/components/ui/switch";
 import { SettingsSection } from "@/screens/settings/settings-section";
 import {
   MAX_CODE_FONT_SIZE,
-  MAX_UI_FONT_SIZE,
+  MAX_UI_BASE_FONT_SIZE,
   MIN_CODE_FONT_SIZE,
-  MIN_UI_FONT_SIZE,
+  MIN_UI_BASE_FONT_SIZE,
   parseClampedFontSize,
   sanitizeFontFamily,
   useAppSettings,
@@ -470,13 +470,13 @@ export function AppearanceSection() {
 
   const [uiFontDraft, setUiFontDraft] = useState(settings.uiFontFamily);
   const [monoFontDraft, setMonoFontDraft] = useState(settings.monoFontFamily);
-  const [uiSizeDraft, setUiSizeDraft] = useState(String(settings.uiFontSize));
+  const [uiBaseSizeDraft, setUiBaseSizeDraft] = useState(String(settings.uiBaseFontSize));
   const [codeSizeDraft, setCodeSizeDraft] = useState(String(settings.codeFontSize));
 
   // Resync numeric drafts when the committed value changes elsewhere.
   useEffect(() => {
-    setUiSizeDraft(String(settings.uiFontSize));
-  }, [settings.uiFontSize]);
+    setUiBaseSizeDraft(String(settings.uiBaseFontSize));
+  }, [settings.uiBaseFontSize]);
   useEffect(() => {
     setCodeSizeDraft(String(settings.codeFontSize));
   }, [settings.codeFontSize]);
@@ -546,25 +546,25 @@ export function AppearanceSection() {
     [settings.monoFontFamily, updateSettings],
   );
 
-  const handleUiSizeChange = useCallback((value: string) => {
-    setUiSizeDraft(value.replace(/[^\d]/g, ""));
+  const handleUiBaseSizeChange = useCallback((value: string) => {
+    setUiBaseSizeDraft(value.replace(/[^\d]/g, ""));
   }, []);
 
   const handleCodeSizeChange = useCallback((value: string) => {
     setCodeSizeDraft(value.replace(/[^\d]/g, ""));
   }, []);
 
-  const commitUiSize = useCallback(() => {
-    const parsed = parseClampedFontSize(uiSizeDraft, {
-      min: MIN_UI_FONT_SIZE,
-      max: MAX_UI_FONT_SIZE,
+  const commitUiBaseSize = useCallback(() => {
+    const parsed = parseClampedFontSize(uiBaseSizeDraft, {
+      min: MIN_UI_BASE_FONT_SIZE,
+      max: MAX_UI_BASE_FONT_SIZE,
     });
-    const next = parsed ?? settings.uiFontSize;
-    setUiSizeDraft(String(next));
-    if (next !== settings.uiFontSize) {
-      void updateSettings({ uiFontSize: next });
+    const next = parsed ?? settings.uiBaseFontSize;
+    setUiBaseSizeDraft(String(next));
+    if (next !== settings.uiBaseFontSize) {
+      void updateSettings({ uiBaseFontSize: next });
     }
-  }, [settings.uiFontSize, uiSizeDraft, updateSettings]);
+  }, [settings.uiBaseFontSize, uiBaseSizeDraft, updateSettings]);
 
   const commitCodeSize = useCallback(() => {
     const parsed = parseClampedFontSize(codeSizeDraft, {
@@ -630,12 +630,12 @@ export function AppearanceSection() {
             />
           ) : null}
           <FontSizeRow
-            title={t("settings.appearance.fonts.interfaceSize")}
-            accessibilityLabel={t("settings.appearance.fonts.interfaceSizeAccessibility")}
-            draft={uiSizeDraft}
+            title={t("settings.appearance.fonts.baseSize")}
+            accessibilityLabel={t("settings.appearance.fonts.baseSizeAccessibility")}
+            draft={uiBaseSizeDraft}
             withBorder={showInterfaceFontFamilyRow}
-            onChangeDraft={handleUiSizeChange}
-            onCommit={commitUiSize}
+            onChangeDraft={handleUiBaseSizeChange}
+            onCommit={commitUiBaseSize}
           />
           <FontFamilyRow
             title={t("settings.appearance.fonts.codeFont")}
@@ -697,7 +697,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   triggerText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   swatch: {
     width: ICON_SIZE.md,
@@ -718,7 +718,7 @@ const styles = StyleSheet.create((theme) => ({
     borderColor: theme.colors.border,
     backgroundColor: theme.colors.surface2,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "left",
   },
   sizeField: {
@@ -736,12 +736,12 @@ const styles = StyleSheet.create((theme) => ({
     borderColor: theme.colors.border,
     backgroundColor: theme.colors.surface2,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "right",
   },
   unit: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   placeholderColor: {
     color: theme.colors.foregroundMuted,
diff --git a/packages/app/src/screens/settings/appearance/apply-appearance.test.ts b/packages/app/src/screens/settings/appearance/apply-appearance.test.ts
index 3ce041fbd..0d5d30ba0 100644
--- a/packages/app/src/screens/settings/appearance/apply-appearance.test.ts
+++ b/packages/app/src/screens/settings/appearance/apply-appearance.test.ts
@@ -26,7 +26,6 @@ interface FakeTheme {
   colorScheme: "light" | "dark";
   fontFamily: { ui: string; mono: string };
   fontSize: {
-    xs: number;
     code: number;
     sm: number;
     base: number;
@@ -45,15 +44,14 @@ function makeFakeTheme(): FakeTheme {
     colorScheme: "dark",
     fontFamily: { ui: "seed-ui-stack", mono: "seed-mono-stack" },
     fontSize: {
-      xs: 12,
       code: 12,
-      sm: 14,
-      base: 16,
-      lg: 18,
-      xl: 20,
-      "2xl": 22,
-      "3xl": 26,
-      "4xl": 34,
+      sm: 12,
+      base: 14,
+      lg: 16,
+      xl: 18,
+      "2xl": 20,
+      "3xl": 22,
+      "4xl": 26,
     },
     lineHeight: { diff: 22 },
     colors: { foreground: "#fff", syntax: {} },
@@ -64,7 +62,7 @@ function makeInput(overrides: Partial<AppearanceInput> = {}): AppearanceInput {
   return {
     uiFontFamily: "",
     monoFontFamily: "",
-    uiFontSize: 16,
+    uiBaseFontSize: 14,
     codeFontSize: 12,
     syntaxTheme: "one",
     ...overrides,
@@ -93,7 +91,7 @@ describe("applyAppearance", () => {
   it("patches the active theme before inactive registry entries", () => {
     runtime.themeName = "darkPureBlack";
 
-    applyAppearance(makeInput({ uiFontSize: 17 }));
+    applyAppearance(makeInput({ uiBaseFontSize: 15 }));
 
     expect(updateTheme.mock.calls.map((call) => call[0])).toEqual([
       "darkPureBlack",
@@ -114,25 +112,24 @@ describe("applyAppearance", () => {
   });
 
   it("scales the whole UI ramp proportionally while preserving ratios", () => {
-    applyAppearance(makeInput({ uiFontSize: 14 }));
+    applyAppearance(makeInput({ uiBaseFontSize: 15 }));
 
     const { fontSize } = runCapturedUpdater();
-    // r = 14 / 16 = 0.875
-    expect(fontSize.base).toBe(14); // round(16 * 0.875)
-    expect(fontSize.lg).toBe(16); // round(18 * 0.875) = round(15.75)
-    expect(fontSize.xs).toBe(11); // round(12 * 0.875) = round(10.5)
-    expect(fontSize["4xl"]).toBe(30); // round(34 * 0.875) = round(29.75)
+    expect(fontSize.base).toBe(15);
+    expect(fontSize.sm).toBe(13);
+    expect(fontSize.lg).toBe(17);
+    expect(fontSize.xl).toBe(19);
+    expect(fontSize["4xl"]).toBe(28);
   });
 
   it("derives the UI ramp from the canonical sizes, not the live theme (no compounding)", () => {
-    applyAppearance(makeInput({ uiFontSize: 14 }));
+    applyAppearance(makeInput({ uiBaseFontSize: 15 }));
 
     // Simulate a theme whose fontSize was already scaled by a prior apply; the
     // updater must ignore it and rebuild from the authored FONT_SIZE ramp.
     const updater = updateTheme.mock.calls[0]?.[1] as unknown as ThemeUpdater;
     const alreadyScaled = makeFakeTheme();
     alreadyScaled.fontSize = {
-      xs: 4,
       code: 4,
       sm: 4,
       base: 4,
@@ -144,21 +141,22 @@ describe("applyAppearance", () => {
     };
 
     const { fontSize } = updater(alreadyScaled);
-    expect(fontSize.base).toBe(14); // not 4 * 0.875 — rebuilt from FONT_SIZE
-    expect(fontSize.lg).toBe(16);
+    expect(fontSize.base).toBe(15); // rebuilt from FONT_SIZE, not the live value of 4
+    expect(fontSize.lg).toBe(17);
   });
 
   it("leaves the UI ramp at authored sizes when only the code size changes", () => {
-    applyAppearance(makeInput({ uiFontSize: 16, codeFontSize: 10 }));
+    applyAppearance(makeInput({ uiBaseFontSize: 14, codeFontSize: 10 }));
 
     const { fontSize } = runCapturedUpdater();
-    expect(fontSize.base).toBe(16);
-    expect(fontSize.sm).toBe(14);
+    expect(fontSize.base).toBe(14);
+    expect(fontSize.lg).toBe(16);
+    expect(fontSize.sm).toBe(12);
     expect(fontSize.code).toBe(10);
   });
 
   it("sets fontSize.code to codeFontSize regardless of the UI font size", () => {
-    applyAppearance(makeInput({ uiFontSize: 14, codeFontSize: 18 }));
+    applyAppearance(makeInput({ uiBaseFontSize: 14, codeFontSize: 18 }));
 
     expect(runCapturedUpdater().fontSize.code).toBe(18);
   });
diff --git a/packages/app/src/screens/settings/appearance/apply-appearance.ts b/packages/app/src/screens/settings/appearance/apply-appearance.ts
index 9f469d5c8..a7c64b3bc 100644
--- a/packages/app/src/screens/settings/appearance/apply-appearance.ts
+++ b/packages/app/src/screens/settings/appearance/apply-appearance.ts
@@ -11,30 +11,26 @@ import { applyRootUiFont } from "./apply-root-font";
 
 const ALL_THEME_KEYS = Object.keys(REGISTERED_THEMES) as (keyof typeof REGISTERED_THEMES)[];
 
-// The UI font size at which the FONT_SIZE ramp is authored (1.0 scale factor).
-const BASE_UI_REFERENCE = FONT_SIZE.base; // 16
-
 export interface AppearanceInput {
   uiFontFamily: string; // "" -> default stack
   monoFontFamily: string; // "" -> default stack
-  uiFontSize: number; // already clamped
+  uiBaseFontSize: number; // already clamped
   codeFontSize: number; // already clamped
   syntaxTheme: SyntaxThemeId;
 }
 
 /**
  * Build the font-size ramp from the canonical `FONT_SIZE` ramp, scaled
- * proportionally by `uiSize / 16` so the type hierarchy is preserved at non-default
+ * proportionally from the requested base size so the type hierarchy is preserved
  * sizes. Deriving from the authored ramp — NOT the live (possibly already-scaled)
  * theme — makes `applyAppearance` idempotent: repeated applies never compound, and a
- * code-size change (uiSize unchanged) leaves the UI ramp at its authored values.
+ * code-size change (base size unchanged) leaves the UI ramp at its authored values.
  * `code` is set absolutely to `codeSize`, never scaled by the UI factor — a separate
  * control on a separate semantic axis (mono/diff text).
  */
-function scaleFontSize(uiSize: number, codeSize: number): Theme["fontSize"] {
-  const r = uiSize / BASE_UI_REFERENCE;
+function scaleFontSize(uiBaseSize: number, codeSize: number): Theme["fontSize"] {
+  const r = uiBaseSize / FONT_SIZE.base;
   return {
-    xs: Math.round(FONT_SIZE.xs * r),
     sm: Math.round(FONT_SIZE.sm * r),
     base: Math.round(FONT_SIZE.base * r),
     lg: Math.round(FONT_SIZE.lg * r),
@@ -72,7 +68,7 @@ export function applyAppearance(input: AppearanceInput): void {
   for (const key of themeKeys) {
     UnistylesRuntime.updateTheme(key, (t) => {
       const fontFamily = { ui, mono };
-      const fontSize = scaleFontSize(input.uiFontSize, input.codeFontSize);
+      const fontSize = scaleFontSize(input.uiBaseFontSize, input.codeFontSize);
       const lineHeight = { ...t.lineHeight, diff: diffLineHeight };
       if (t.colorScheme === "light") {
         return {
diff --git a/packages/app/src/screens/settings/host-appearance-section.tsx b/packages/app/src/screens/settings/host-appearance-section.tsx
index 50f172582..037be657d 100644
--- a/packages/app/src/screens/settings/host-appearance-section.tsx
+++ b/packages/app/src/screens/settings/host-appearance-section.tsx
@@ -327,7 +327,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   triggerText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   swatch: {
     width: ICON_SIZE.md,
@@ -348,7 +348,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   nameText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     flexShrink: 1,
   },
   preview: {
@@ -363,7 +363,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   previewTitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     flexShrink: 1,
   },
 }));
diff --git a/packages/app/src/screens/settings/host-page.tsx b/packages/app/src/screens/settings/host-page.tsx
index f0b65fbca..38637d80b 100644
--- a/packages/app/src/screens/settings/host-page.tsx
+++ b/packages/app/src/screens/settings/host-page.tsx
@@ -1793,7 +1793,7 @@ const terminalProfileStyles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
 }));
@@ -1840,23 +1840,23 @@ const styles = StyleSheet.create((theme) => ({
     maxWidth: 200,
   },
   badgeText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
     color: theme.colors.foregroundMuted,
     flexShrink: 1,
   },
   errorText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginBottom: theme.spacing[2],
   },
   connectionLatency: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     marginRight: theme.spacing[2],
   },
   confirmText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   confirmActions: {
     flexDirection: "row",
@@ -1875,7 +1875,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
 
diff --git a/packages/app/src/screens/settings/keyboard-shortcuts-section.tsx b/packages/app/src/screens/settings/keyboard-shortcuts-section.tsx
index d0171cfe8..bba32cfa9 100644
--- a/packages/app/src/screens/settings/keyboard-shortcuts-section.tsx
+++ b/packages/app/src/screens/settings/keyboard-shortcuts-section.tsx
@@ -505,7 +505,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   rowLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
     flexShrink: 1,
   },
@@ -535,11 +535,11 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface3,
   },
   capturingText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   unassignedText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
   separator: {
@@ -550,7 +550,7 @@ const styles = StyleSheet.create((theme) => ({
     padding: theme.spacing[4],
   },
   mobileText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foregroundMuted,
   },
 }));
diff --git a/packages/app/src/screens/settings/metadata-generation-page.tsx b/packages/app/src/screens/settings/metadata-generation-page.tsx
index 3576c2383..aed2d3cbb 100644
--- a/packages/app/src/screens/settings/metadata-generation-page.tsx
+++ b/packages/app/src/screens/settings/metadata-generation-page.tsx
@@ -166,8 +166,8 @@ export function MetadataGenerationPage({ serverId }: { serverId: string }) {
 const styles = StyleSheet.create((theme) => ({
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
-    lineHeight: theme.fontSize.xs * 1.45,
+    fontSize: theme.fontSize.sm,
+    lineHeight: theme.fontSize.sm * 1.45,
     marginHorizontal: theme.spacing[1],
   },
   loading: {
diff --git a/packages/app/src/screens/settings/plugins-page.tsx b/packages/app/src/screens/settings/plugins-page.tsx
index ac05dd817..8ff4ccc27 100644
--- a/packages/app/src/screens/settings/plugins-page.tsx
+++ b/packages/app/src/screens/settings/plugins-page.tsx
@@ -451,11 +451,11 @@ const styles = StyleSheet.create((theme) => ({
   },
   pluginTitle: { flexDirection: "row", alignItems: "center", gap: theme.spacing[2] },
   actions: { flexDirection: "row", flexWrap: "wrap", gap: theme.spacing[2] },
-  error: { color: theme.colors.statusDanger, fontSize: theme.fontSize.xs },
+  error: { color: theme.colors.statusDanger, fontSize: theme.fontSize.sm },
   empty: { padding: theme.spacing[4], alignItems: "center" },
   logsState: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
     paddingVertical: theme.spacing[6],
   },
@@ -469,16 +469,16 @@ const styles = StyleSheet.create((theme) => ({
   logStdout: {
     color: theme.colors.foregroundMuted,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   logStderr: {
     color: theme.colors.statusDanger,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   logMessage: {
     color: theme.colors.foreground,
     fontFamily: theme.fontFamily.mono,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/screens/settings/providers-section.tsx b/packages/app/src/screens/settings/providers-section.tsx
index 78d142fcf..5c44244e3 100644
--- a/packages/app/src/screens/settings/providers-section.tsx
+++ b/packages/app/src/screens/settings/providers-section.tsx
@@ -483,7 +483,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   emptyText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   row: {
     gap: theme.spacing[3],
@@ -522,15 +522,15 @@ const styles = StyleSheet.create((theme) => ({
   },
   statusLabel: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   separator: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   errorText: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
   trailingControls: {
diff --git a/packages/app/src/screens/settings/settings-group.tsx b/packages/app/src/screens/settings/settings-group.tsx
index 036ab7bac..d6dee9dab 100644
--- a/packages/app/src/screens/settings/settings-group.tsx
+++ b/packages/app/src/screens/settings/settings-group.tsx
@@ -89,8 +89,8 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     maxWidth: 280,
-    lineHeight: theme.fontSize.sm * 1.4,
+    lineHeight: theme.fontSize.base * 1.4,
   },
 }));
diff --git a/packages/app/src/screens/settings/terminal-profile-edit-modal.tsx b/packages/app/src/screens/settings/terminal-profile-edit-modal.tsx
index 7155e461e..ff4b442c6 100644
--- a/packages/app/src/screens/settings/terminal-profile-edit-modal.tsx
+++ b/packages/app/src/screens/settings/terminal-profile-edit-modal.tsx
@@ -254,6 +254,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   submitError: {
     color: theme.colors.palette.red[300],
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
 }));
diff --git a/packages/app/src/screens/startup-splash-screen.tsx b/packages/app/src/screens/startup-splash-screen.tsx
index abf73797f..1f12d9046 100644
--- a/packages/app/src/screens/startup-splash-screen.tsx
+++ b/packages/app/src/screens/startup-splash-screen.tsx
@@ -223,7 +223,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   title: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize["3xl"],
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.semibold,
     textAlign: "left",
   },
@@ -240,7 +240,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   logsMeta: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   logsContainer: {
     height: 200,
diff --git a/packages/app/src/screens/workspace/workspace-desktop-tabs-row.tsx b/packages/app/src/screens/workspace/workspace-desktop-tabs-row.tsx
index 2bc8c5291..b730c4767 100644
--- a/packages/app/src/screens/workspace/workspace-desktop-tabs-row.tsx
+++ b/packages/app/src/screens/workspace/workspace-desktop-tabs-row.tsx
@@ -1928,7 +1928,7 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 1,
     minWidth: 0,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     userSelect: "none",
   },
@@ -2013,7 +2013,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   newTabTooltipText: {
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   newTabTooltipRow: {
     flexDirection: "row",
@@ -2028,10 +2028,10 @@ const styles = StyleSheet.create((theme) => ({
   },
   tooltipAgentId: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   menuItemHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/screens/workspace/workspace-open-in-editor-button.tsx b/packages/app/src/screens/workspace/workspace-open-in-editor-button.tsx
index 75e5e0893..ee10fd626 100644
--- a/packages/app/src/screens/workspace/workspace-open-in-editor-button.tsx
+++ b/packages/app/src/screens/workspace/workspace-open-in-editor-button.tsx
@@ -312,8 +312,8 @@ const styles = StyleSheet.create((theme) => ({
     opacity: 0.6,
   },
   splitButtonText: {
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.5,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.5,
     color: theme.colors.foreground,
     fontWeight: theme.fontWeight.normal,
   },
@@ -322,7 +322,7 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "center",
     justifyContent: "center",
     gap: theme.spacing[2],
-    minHeight: theme.fontSize.sm * 1.5,
+    minHeight: theme.fontSize.base * 1.5,
   },
   splitButtonSpinnerOnly: {
     transform: [{ scale: 0.8 }],
diff --git a/packages/app/src/screens/workspace/workspace-route-state-views.tsx b/packages/app/src/screens/workspace/workspace-route-state-views.tsx
index d7fcb32a8..364816114 100644
--- a/packages/app/src/screens/workspace/workspace-route-state-views.tsx
+++ b/packages/app/src/screens/workspace/workspace-route-state-views.tsx
@@ -300,18 +300,18 @@ const styles = StyleSheet.create((theme) => ({
   },
   description: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     textAlign: "center",
   },
   error: {
     color: theme.colors.destructive,
-    fontSize: theme.fontSize.sm,
-    lineHeight: Math.round(theme.fontSize.sm * 1.4),
+    fontSize: theme.fontSize.base,
+    lineHeight: Math.round(theme.fontSize.base * 1.4),
     textAlign: "center",
   },
   errorTooltip: {
     color: theme.colors.popoverForeground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     maxWidth: 420,
   },
   actions: {
diff --git a/packages/app/src/screens/workspace/workspace-screen.tsx b/packages/app/src/screens/workspace/workspace-screen.tsx
index 520c683e7..8ec07a704 100644
--- a/packages/app/src/screens/workspace/workspace-screen.tsx
+++ b/packages/app/src/screens/workspace/workspace-screen.tsx
@@ -1249,9 +1249,7 @@ function WorkspaceHeaderTitleBar({
         </View>
       ) : (
         <View style={styles.headerTitleTextGroup}>
-          <ScreenTitle testID="workspace-header-title" style={styles.headerTitle}>
-            {title}
-          </ScreenTitle>
+          <ScreenTitle testID="workspace-header-title">{title}</ScreenTitle>
           <WorkspaceHeaderProjectRow
             subtitle={subtitle}
             isSubtitleDistinct={isSubtitleDistinct}
@@ -3932,9 +3930,6 @@ const styles = StyleSheet.create((theme) => ({
     flex: 1,
     minHeight: 0,
   },
-  headerTitle: {
-    fontSize: theme.fontSize.sm,
-  },
   headerTitleContainer: {
     flex: 1,
     flexShrink: 1,
@@ -3982,15 +3977,15 @@ const styles = StyleSheet.create((theme) => ({
   headerProjectTitle: {
     color: theme.colors.foregroundMuted,
     fontSize: {
-      xs: theme.fontSize.xs,
-      md: theme.fontSize.sm,
+      xs: theme.fontSize.sm,
+      md: theme.fontSize.base,
     },
     flexShrink: 1,
     minWidth: 0,
   },
   headerProjectSeparator: {
     color: theme.colors.foregroundExtraMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     flexShrink: 0,
   },
   headerTitleSkeleton: {
@@ -4055,7 +4050,7 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   newTabTooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
   newTabTooltipRow: {
@@ -4093,7 +4088,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
     flex: 1,
     color: theme.colors.foreground,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
   },
   headerMenuProfileIconWrapper: {
     width: 16,
@@ -4157,7 +4152,7 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 1,
     minWidth: 0,
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
   },
   tabLabelWithCloseButton: {
diff --git a/packages/app/src/screens/workspace/workspace-scripts-button.tsx b/packages/app/src/screens/workspace/workspace-scripts-button.tsx
index 2f859a999..a814e14c4 100644
--- a/packages/app/src/screens/workspace/workspace-scripts-button.tsx
+++ b/packages/app/src/screens/workspace/workspace-scripts-button.tsx
@@ -774,8 +774,8 @@ const styles = StyleSheet.create((theme) => ({
     backgroundColor: theme.colors.surface2,
   },
   splitButtonText: {
-    fontSize: theme.fontSize.sm,
-    lineHeight: theme.fontSize.sm * 1.5,
+    fontSize: theme.fontSize.base,
+    lineHeight: theme.fontSize.base * 1.5,
     color: theme.colors.foreground,
     fontWeight: theme.fontWeight.normal,
   },
@@ -784,7 +784,7 @@ const styles = StyleSheet.create((theme) => ({
     alignItems: "center",
     justifyContent: "center",
     gap: theme.spacing[1.5],
-    minHeight: theme.fontSize.sm * 1.5,
+    minHeight: theme.fontSize.base * 1.5,
   },
   scriptList: {
     paddingVertical: theme.spacing[1],
@@ -803,7 +803,7 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 0,
   },
   scriptName: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     fontWeight: theme.fontWeight.normal,
     lineHeight: 18,
     flexShrink: 1,
@@ -838,7 +838,7 @@ const styles = StyleSheet.create((theme) => ({
   },
   hostLabel: {
     flexShrink: 1,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     lineHeight: 14,
     color: theme.colors.foregroundMuted,
   },
@@ -881,7 +881,7 @@ const styles = StyleSheet.create((theme) => ({
     minWidth: 0,
   },
   tooltipText: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.popoverForeground,
   },
 }));
diff --git a/packages/app/src/screens/workspace/workspace-tab-presentation.tsx b/packages/app/src/screens/workspace/workspace-tab-presentation.tsx
index 762a3cb98..56aaf889c 100644
--- a/packages/app/src/screens/workspace/workspace-tab-presentation.tsx
+++ b/packages/app/src/screens/workspace/workspace-tab-presentation.tsx
@@ -332,7 +332,7 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 1,
   },
   optionLabel: {
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   optionTrailingSlot: {
diff --git a/packages/app/src/screens/workspace/workspace-tab-trailing-accessory.tsx b/packages/app/src/screens/workspace/workspace-tab-trailing-accessory.tsx
index fe224dae9..b4f2a9bb7 100644
--- a/packages/app/src/screens/workspace/workspace-tab-trailing-accessory.tsx
+++ b/packages/app/src/screens/workspace/workspace-tab-trailing-accessory.tsx
@@ -137,6 +137,6 @@ const styles = StyleSheet.create((theme) => ({
   },
   menuItemHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
 }));
diff --git a/packages/app/src/styles/markdown-styles.test.ts b/packages/app/src/styles/markdown-styles.test.ts
index 59e5721ce..149361c3c 100644
--- a/packages/app/src/styles/markdown-styles.test.ts
+++ b/packages/app/src/styles/markdown-styles.test.ts
@@ -5,18 +5,18 @@ import { darkTheme } from "./theme";
 describe("createMarkdownStyles", () => {
   it("uses the standard interface size for conversation prose and list markers", () => {
     const styles = createMarkdownStyles(darkTheme);
-    const proseLineHeight = Math.round(darkTheme.fontSize.sm * 1.4);
+    const proseLineHeight = Math.round(darkTheme.fontSize.base * 1.4);
 
     expect(styles.body).toMatchObject({
-      fontSize: darkTheme.fontSize.sm,
+      fontSize: darkTheme.fontSize.base,
       lineHeight: proseLineHeight,
     });
     expect(styles.bullet_list_icon).toMatchObject({
-      fontSize: darkTheme.fontSize.sm,
+      fontSize: darkTheme.fontSize.base,
       lineHeight: proseLineHeight,
     });
     expect(styles.ordered_list_icon).toMatchObject({
-      fontSize: darkTheme.fontSize.sm,
+      fontSize: darkTheme.fontSize.base,
       lineHeight: proseLineHeight,
     });
   });
diff --git a/packages/app/src/styles/markdown-styles.ts b/packages/app/src/styles/markdown-styles.ts
index 0cd5cec6a..ff368cc01 100644
--- a/packages/app/src/styles/markdown-styles.ts
+++ b/packages/app/src/styles/markdown-styles.ts
@@ -19,10 +19,10 @@ export function createMarkdownStyles(theme: Theme) {
     body: {
       ...webSelectableTextStyle,
       color: theme.colors.foreground,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       // Prose line-height scales with the UI ramp, not the
       // code-size-coupled lineHeight.diff token used by code/diff surfaces.
-      lineHeight: Math.round(theme.fontSize.sm * 1.4),
+      lineHeight: Math.round(theme.fontSize.base * 1.4),
       flexShrink: 1,
       minWidth: 0,
       width: "100%" as const,
@@ -53,7 +53,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading1: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize["3xl"],
+      fontSize: theme.fontSize["4xl"],
       fontWeight: theme.fontWeight.bold,
       color: theme.colors.foreground,
       marginTop: theme.spacing[6],
@@ -66,7 +66,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading2: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize["2xl"],
+      fontSize: theme.fontSize["3xl"],
       fontWeight: theme.fontWeight.bold,
       color: theme.colors.foreground,
       marginTop: theme.spacing[6],
@@ -79,7 +79,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading3: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize.xl,
+      fontSize: theme.fontSize["2xl"],
       fontWeight: theme.fontWeight.semibold,
       color: theme.colors.foreground,
       marginTop: theme.spacing[4],
@@ -89,7 +89,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading4: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize.lg,
+      fontSize: theme.fontSize.xl,
       fontWeight: theme.fontWeight.semibold,
       color: theme.colors.foreground,
       marginTop: theme.spacing[4],
@@ -99,7 +99,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading5: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize.base,
+      fontSize: theme.fontSize.lg,
       fontWeight: theme.fontWeight.semibold,
       color: theme.colors.foreground,
       marginTop: theme.spacing[3],
@@ -109,7 +109,7 @@ export function createMarkdownStyles(theme: Theme) {
 
     heading6: {
       ...webSelectableTextStyle,
-      fontSize: theme.fontSize.base,
+      fontSize: theme.fontSize.lg,
       fontWeight: theme.fontWeight.semibold,
       color: theme.colors.foregroundMuted,
       marginTop: theme.spacing[3],
@@ -227,7 +227,7 @@ export function createMarkdownStyles(theme: Theme) {
       backgroundColor: theme.colors.surface2,
       fontWeight: theme.fontWeight.semibold,
       color: theme.colors.foreground,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       textAlign: "left" as const,
     },
 
@@ -243,7 +243,7 @@ export function createMarkdownStyles(theme: Theme) {
       borderRightWidth: 1,
       borderColor: theme.colors.border,
       color: theme.colors.foreground,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       flex: 1,
     },
 
@@ -282,17 +282,17 @@ export function createMarkdownStyles(theme: Theme) {
       ...webSelectableTextStyle,
       color: theme.colors.foregroundMuted,
       marginRight: 4,
-      fontSize: theme.fontSize.sm,
-      lineHeight: Math.round(theme.fontSize.sm * 1.4),
+      fontSize: theme.fontSize.base,
+      lineHeight: Math.round(theme.fontSize.base * 1.4),
     },
 
     ordered_list_icon: {
       ...webSelectableTextStyle,
       color: theme.colors.foregroundMuted,
       marginRight: 4,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       fontWeight: theme.fontWeight.normal,
-      lineHeight: Math.round(theme.fontSize.sm * 1.4),
+      lineHeight: Math.round(theme.fontSize.base * 1.4),
       minWidth: 12,
     },
 
@@ -357,13 +357,13 @@ export function createCompactMarkdownStyles(theme: Theme) {
 
     body: {
       ...baseStyles.body,
-      fontSize: theme.fontSize.sm,
+      fontSize: theme.fontSize.base,
       lineHeight: 20,
     },
 
     heading1: {
       ...baseStyles.heading1,
-      fontSize: theme.fontSize.xl,
+      fontSize: theme.fontSize["2xl"],
       marginTop: theme.spacing[4],
       marginBottom: theme.spacing[2],
       lineHeight: 26,
@@ -371,7 +371,7 @@ export function createCompactMarkdownStyles(theme: Theme) {
 
     heading2: {
       ...baseStyles.heading2,
-      fontSize: theme.fontSize.lg,
+      fontSize: theme.fontSize.xl,
       marginTop: theme.spacing[3],
       marginBottom: theme.spacing[2],
       lineHeight: 24,
@@ -379,7 +379,7 @@ export function createCompactMarkdownStyles(theme: Theme) {
 
     heading3: {
       ...baseStyles.heading3,
-      fontSize: theme.fontSize.base,
+      fontSize: theme.fontSize.lg,
       marginTop: theme.spacing[3],
       marginBottom: theme.spacing[1],
       lineHeight: 22,
diff --git a/packages/app/src/styles/settings.ts b/packages/app/src/styles/settings.ts
index 2e5d514c0..4f6d377b3 100644
--- a/packages/app/src/styles/settings.ts
+++ b/packages/app/src/styles/settings.ts
@@ -13,7 +13,7 @@ export const settingsStyles = StyleSheet.create((theme) => ({
   },
   sectionHeaderTitle: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     fontWeight: theme.fontWeight.normal,
   },
   sectionHeaderLink: {
@@ -23,7 +23,7 @@ export const settingsStyles = StyleSheet.create((theme) => ({
   },
   sectionHeaderLinkText: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
   },
   card: {
     backgroundColor: theme.colors.surface1,
@@ -53,12 +53,12 @@ export const settingsStyles = StyleSheet.create((theme) => ({
   },
   rowHint: {
     color: theme.colors.foregroundMuted,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
   rowError: {
     color: theme.colors.statusDanger,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     marginTop: theme.spacing[1],
   },
 }));
diff --git a/packages/app/src/styles/theme.test.ts b/packages/app/src/styles/theme.test.ts
index fed915b76..cee2287e7 100644
--- a/packages/app/src/styles/theme.test.ts
+++ b/packages/app/src/styles/theme.test.ts
@@ -2,11 +2,27 @@ import { describe, expect, it } from "vitest";
 import {
   darkPureBlackTheme,
   darkTheme,
+  FONT_SIZE,
   getNextThemePreference,
   lightTheme,
   THEME_OPTIONS,
 } from "./theme";
 
+describe("Typography scale", () => {
+  it("names 14px as the default interface tier", () => {
+    expect(FONT_SIZE).toEqual({
+      code: 12,
+      sm: 12,
+      base: 14,
+      lg: 16,
+      xl: 18,
+      "2xl": 20,
+      "3xl": 22,
+      "4xl": 26,
+    });
+  });
+});
+
 describe("Theme catalog", () => {
   it("owns the picker and shortcut order", () => {
     expect(THEME_OPTIONS.map((option) => option.name)).toEqual([
diff --git a/packages/app/src/styles/theme.ts b/packages/app/src/styles/theme.ts
index c8a8305d0..a5a7205d1 100644
--- a/packages/app/src/styles/theme.ts
+++ b/packages/app/src/styles/theme.ts
@@ -512,15 +512,14 @@ export const SPACING = {
 } as const;
 
 export const FONT_SIZE = {
-  xs: 12,
   code: 12,
-  sm: 14,
-  base: 16,
-  lg: 18,
-  xl: 20,
-  "2xl": 22,
-  "3xl": 26,
-  "4xl": 34,
+  sm: 12,
+  base: 14,
+  lg: 16,
+  xl: 18,
+  "2xl": 20,
+  "3xl": 22,
+  "4xl": 26,
 } as const;
 
 export const LINE_HEIGHT = {
diff --git a/packages/app/src/subagents/track.tsx b/packages/app/src/subagents/track.tsx
index 23e6b1d2f..a98f70ae3 100644
--- a/packages/app/src/subagents/track.tsx
+++ b/packages/app/src/subagents/track.tsx
@@ -338,7 +338,7 @@ const styles = StyleSheet.create((theme) => ({
     flexShrink: 1,
     flexBasis: "auto",
     minWidth: 0,
-    fontSize: theme.fontSize.sm,
+    fontSize: theme.fontSize.base,
     color: theme.colors.foreground,
   },
   // Trailing metadata — provider context on a subagent row, progress on the archive row. No width
@@ -347,7 +347,7 @@ const styles = StyleSheet.create((theme) => ({
   rowTrailing: {
     flexShrink: 2,
     minWidth: 0,
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foregroundMuted,
   },
   actionClusterVisible: {
@@ -368,7 +368,7 @@ const styles = StyleSheet.create((theme) => ({
     justifyContent: "center",
   },
   tooltipText: {
-    fontSize: theme.fontSize.xs,
+    fontSize: theme.fontSize.sm,
     color: theme.colors.foreground,
   },
 }));