Add Anthropic prompt caching, pluggable storage, and CORS proxy support

Storage Architecture:
- New pluggable storage system with backends (LocalStorage, ChromeStorage, IndexedDB)
- SettingsRepository for app settings (proxy config, etc.)
- ProviderKeysRepository for API key management
- AppStorage with global accessors (getAppStorage, setAppStorage, initAppStorage)

Transport Refactoring:
- Renamed DirectTransport → ProviderTransport (calls LLM providers with optional CORS proxy)
- Renamed ProxyTransport → AppTransport (uses app server with user auth)
- Updated TransportMode: "direct" → "provider", "proxy" → "app"

CORS Proxy Integration:
- ProviderTransport checks proxy.enabled/proxy.url from storage
- When enabled, modifies model baseUrl to route through proxy: {proxyUrl}/?url={originalBaseUrl}
- ProviderKeyInput test function also honors proxy settings
- Settings dialog with Proxy tab (Switch toggle, URL input, explanatory description)

Anthropic Prompt Caching:
- System prompt cached with cache_control markers (both OAuth and regular API keys)
- Last user message cached to cache conversation history
- Saves 90% on input tokens for cached content (10x cost reduction)

Settings Dialog Improvements:
- Configurable tab system with SettingsTab base class
- ApiKeysTab and ProxyTab as custom elements
- Switch toggle for proxy enable (instead of Checkbox)
- Explanatory paragraphs for each tab
- ApiKeyPromptDialog reuses ProviderKeyInput component

Removed:
- Deprecated ApiKeysDialog (replaced by ProviderKeyInput in SettingsDialog)
- Old storage-adapter and key-store (replaced by new storage architecture)

packages/web-ui/src/ChatPanel.ts

@@ -23,6 +23,7 @@ export class ChatPanel extends LitElement {
 	@property({ type: String }) systemPrompt = "You are a helpful AI assistant.";
 	@property({ type: Array }) additionalTools: AgentTool<any, any>[] = [];
 	@property({ attribute: false }) sandboxUrlProvider?: () => string;
+	@property({ attribute: false }) onApiKeyRequired?: (provider: string) => Promise<boolean>;
 
 	private resizeHandler = () => {
 		this.windowWidth = window.innerWidth;
@@ -121,7 +122,7 @@ export class ChatPanel extends LitElement {
 		this.session = new AgentSession({
 			initialState,
 			authTokenProvider: async () => getAuthToken(),
-			transportMode: "direct", // Use direct mode by default (API keys from KeyStore)
+			transportMode: "provider", // Use provider mode by default (API keys from storage, optional CORS proxy)
 		});
 
 		// Reconstruct artifacts panel from initial messages (session must exist first)
@@ -170,6 +171,7 @@ export class ChatPanel extends LitElement {
 							.enableThinking=${true}
 							.showThemeToggle=${false}
 							.showDebugToggle=${false}
+							.onApiKeyRequired=${this.onApiKeyRequired}
 						></agent-interface>
 					</div>