style(desktop): 12px button text, drop sparkle decoration + redundant settings titles

- Button base font down to 12px (text-xs) for the dense desktop scale.
- Remove the decorative Sparkles glyph from the model "Apply" button (keep the
  spinner while applying).
- Drop the page-level section titles that just restate the left nav ("Main
  model", "Appearance", "MCP servers") — the sidebar already labels the pane.
  Sub-section headings (Auxiliary models, LLM providers, etc.) stay.

apps/desktop/src/app/settings/appearance-settings.tsx

@@ -1,7 +1,7 @@
 import { useStore } from '@nanostores/react'
 
 import { triggerHaptic } from '@/lib/haptics'
-import { Check, Palette } from '@/lib/icons'
+import { Check } from '@/lib/icons'
 import { cn } from '@/lib/utils'
 import { $toolViewMode, setToolViewMode } from '@/store/tool-view'
 import { useTheme } from '@/themes/context'
@@ -9,7 +9,7 @@ import { BUILTIN_THEMES } from '@/themes/presets'
 
 import { MODE_OPTIONS } from './constants'
 import { prettyName } from './helpers'
-import { Pill, SectionHeading, SettingsContent } from './primitives'
+import { Pill, SettingsContent } from './primitives'
 
 function ThemePreview({ name }: { name: string }) {
   const t = BUILTIN_THEMES[name]
@@ -60,7 +60,6 @@ export function AppearanceSettings() {
     <SettingsContent>
       <div className="space-y-5">
         <div>
-          <SectionHeading icon={Palette} title="Appearance" />
           <p className="max-w-2xl text-[length:var(--conversation-caption-font-size)] leading-(--conversation-caption-line-height) text-(--ui-text-tertiary)">
             These are desktop-only display preferences. Mode controls brightness; theme controls the accent palette and
             chat surface styling.

apps/desktop/src/app/settings/mcp-settings.tsx

@@ -5,13 +5,13 @@ import { OverlayActionButton, OverlayCard } from '@/app/overlays/overlay-chrome'
 import { Input } from '@/components/ui/input'
 import { Textarea } from '@/components/ui/textarea'
 import { getHermesConfigRecord, type HermesGateway, saveHermesConfig } from '@/hermes'
-import { Package, Wrench } from '@/lib/icons'
+import { Wrench } from '@/lib/icons'
 import { notify, notifyError } from '@/store/notifications'
 import { $activeSessionId } from '@/store/session'
 import type { HermesConfigRecord } from '@/types/hermes'
 
 import { includesQuery } from './helpers'
-import { EmptyState, LoadingState, Pill, SectionHeading, SettingsContent } from './primitives'
+import { EmptyState, LoadingState, Pill, SettingsContent } from './primitives'
 import type { SearchProps } from './types'
 
 interface McpSettingsProps extends SearchProps {
@@ -188,8 +188,7 @@ export function McpSettings({ gateway, onConfigSaved, query }: McpSettingsProps)
 
   return (
     <SettingsContent>
-      <div className="mb-4 flex items-center justify-between gap-3">
-        <SectionHeading icon={Package} meta={`${names.length} configured`} title="MCP servers" />
+      <div className="mb-4 flex items-center justify-end gap-3">
         <div className="flex items-center gap-2">
           <OverlayActionButton onClick={() => setSelected(null)}>New server</OverlayActionButton>
           <OverlayActionButton disabled={reloading} onClick={() => void reloadMcp()}>

apps/desktop/src/app/settings/model-settings.tsx

@@ -10,7 +10,7 @@ import {
 } from '@/components/ui/select'
 import { getAuxiliaryModels, getGlobalModelInfo, getGlobalModelOptions, setModelAssignment } from '@/hermes'
 import type { AuxiliaryModelsResponse, ModelOptionProvider } from '@/hermes'
-import { Cpu, Loader2, Sparkles } from '@/lib/icons'
+import { Cpu, Loader2 } from '@/lib/icons'
 import { cn } from '@/lib/utils'
 
 import { CONTROL_TEXT } from './constants'
@@ -204,11 +204,6 @@ export function ModelSettings({ onMainModelChanged }: ModelSettingsProps) {
   return (
     <div className="grid gap-6">
       <section>
-        <SectionHeading
-          icon={Sparkles}
-          meta={mainModel ? `${mainModel.provider} / ${mainModel.model}` : undefined}
-          title="Main model"
-        />
         <p className="mb-3 text-xs text-muted-foreground">
           Applies to new sessions. Use the model picker in the composer to hot-swap the active chat.
         </p>
@@ -238,7 +233,7 @@ export function ModelSettings({ onMainModelChanged }: ModelSettingsProps) {
             </SelectContent>
           </Select>
           <Button disabled={!selectedProvider || !selectedModel || applying} onClick={() => void applyMainModel()} size="sm">
-            {applying ? <Loader2 className="size-3.5 animate-spin" /> : <Sparkles className="size-3.5" />}
+            {applying && <Loader2 className="size-3.5 animate-spin" />}
             {applying ? 'Applying...' : 'Apply'}
           </Button>
         </div>

apps/desktop/src/components/ui/button.tsx

@@ -8,7 +8,7 @@ import { cn } from '@/lib/utils'
 // fixed heights — so they stay snug and scale with content. Only icon buttons
 // (inherently square) carry the shared 4px radius.
 const buttonVariants = cva(
-  "inline-flex shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-none text-[0.8125rem] leading-5 font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[0.1875rem] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
+  "inline-flex shrink-0 cursor-pointer items-center justify-center gap-1.5 rounded-none text-xs leading-4 font-medium whitespace-nowrap transition-all outline-none focus-visible:border-ring focus-visible:ring-[0.1875rem] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-default disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
   {
     variants: {
       variant: {