feat: add UI customization and model management features (#60)

* feat: add UI customization and model management features

Add comprehensive UI customization options and enhanced model selection:

- **Favorite & Recent Models**: Star models for quick access, track 5 most recent
  - Add favorite/recent sections to model dropdowns
  - Persist preferences in local storage
  - Works in ModelControls and ModelSelector components

- **Tool Call Expansion Settings**: Control default expansion state for tool outputs
  - Three modes: collapsed, activity (summary), detailed
  - Applies to activity groups and individual tool calls
  - Configurable in Appearance Settings

- **Font Size & Spacing Controls**: Adjustable typography and layout density
  - Font size: 50-200% scaling of all semantic typography
  - Spacing/padding: 50-200% scaling of margins, gaps, line heights
  - Real-time preview with reset buttons
  - Settings in Appearance Settings

- **VSCode Extension Settings View**: Full settings access in VSCode extension
  - Add settings navigation and view type
  - Settings button in header
  - Navigate between sessions, chat, and settings

Technical changes:
- Enhanced useUIStore with new state management
- Dynamic CSS variable scaling for typography and spacing
- Typography helper functions for variable access
- ThemeProvider integration for auto-applying scales

* fix: hide theme mode in VSCode and fix detailed tool expansion

- Hide "Theme Mode" setting in VSCode extension settings as VSCode
  dynamically applies its own theme to the extension
- Fix bug where tools from subsequent messages in a turn weren't
  expanded when "Detailed" mode was selected
- Now correctly aggregates all tool IDs from turnGroupingContext when
  calculating effective expanded tools for progressive groups

packages/vscode/webview/App.tsx

@@ -263,7 +263,13 @@ export function VSCodeApp() {
     <div className="flex flex-col h-full bg-background text-foreground">
       <ConnectionStatusBanner status={status} error={error} onRetry={connect} />
       <div className="flex-1 min-h-0">
-        {currentView === 'sessions' ? <SessionsList /> : <ChatPanel />}
+        {currentView === 'sessions' ? (
+          <SessionsList />
+        ) : currentView === 'settings' ? (
+          <SettingsView />
+        ) : (
+          <ChatPanel />
+        )}
       </div>
     </div>
   );

packages/vscode/webview/hooks/useNavigation.ts

@@ -1,12 +1,13 @@
 import { create } from 'zustand';
 
-export type ViewType = 'sessions' | 'chat';
+export type ViewType = 'sessions' | 'chat' | 'settings';
 
 interface NavigationState {
   currentView: ViewType;
   navigateTo: (view: ViewType) => void;
   goToChat: () => void;
   goToSessions: () => void;
+  goToSettings: () => void;
 }
 
 export const useNavigation = create<NavigationState>((set) => ({
@@ -14,4 +15,5 @@ export const useNavigation = create<NavigationState>((set) => ({
   navigateTo: (view) => set({ currentView: view }),
   goToChat: () => set({ currentView: 'chat' }),
   goToSessions: () => set({ currentView: 'sessions' }),
+  goToSettings: () => set({ currentView: 'settings' }),
 }));