Comprehensive UX polish: fix 19 friction points across all pages

Addresses broken interactions (notification bell, browser dialogs),
missing feedback states (disabled buttons, pricing changes, paused
indicator), unclear affordances (research queue, model tuning, funding
requirements), and navigation gaps (hash routing, keyboard shortcuts,
clickable dashboard cards, sidebar grouping, tutorial hints).

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

apps/web/src/hooks/useHashRouter.ts

@@ -0,0 +1,38 @@
+import { useEffect } from 'react';
+import { useGameStore, type ActivePage } from '@/store';
+
+const VALID_PAGES = new Set<ActivePage>([
+  'dashboard', 'infrastructure', 'research', 'models',
+  'market', 'talent', 'data', 'competitors',
+  'finance', 'achievements', 'leaderboard', 'settings',
+]);
+
+export function useHashRouter() {
+  const activePage = useGameStore((s) => s.activePage);
+  const setActivePage = useGameStore((s) => s.setActivePage);
+
+  useEffect(() => {
+    const hash = window.location.hash.slice(1) as ActivePage;
+    if (hash && VALID_PAGES.has(hash) && hash !== activePage) {
+      setActivePage(hash);
+    }
+  }, []);
+
+  useEffect(() => {
+    const current = window.location.hash.slice(1);
+    if (current !== activePage) {
+      window.history.pushState(null, '', `#${activePage}`);
+    }
+  }, [activePage]);
+
+  useEffect(() => {
+    const handler = () => {
+      const hash = window.location.hash.slice(1) as ActivePage;
+      if (hash && VALID_PAGES.has(hash)) {
+        setActivePage(hash);
+      }
+    };
+    window.addEventListener('hashchange', handler);
+    return () => window.removeEventListener('hashchange', handler);
+  }, [setActivePage]);
+}

apps/web/src/hooks/useKeyboardShortcuts.ts

@@ -0,0 +1,34 @@
+import { useEffect } from 'react';
+import { useGameStore } from '@/store';
+import type { GameSpeed } from '@ai-tycoon/shared';
+
+export function useKeyboardShortcuts() {
+  useEffect(() => {
+    const handler = (e: KeyboardEvent) => {
+      const target = e.target as HTMLElement;
+      if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.tagName === 'SELECT') return;
+
+      const store = useGameStore.getState();
+
+      switch (e.key) {
+        case ' ':
+          e.preventDefault();
+          store.togglePause();
+          break;
+        case '1':
+          store.setGameSpeed(1 as GameSpeed);
+          break;
+        case '2':
+          store.setGameSpeed(2 as GameSpeed);
+          break;
+        case '3':
+          store.setGameSpeed(5 as GameSpeed);
+          break;
+        case 'Escape':
+          break;
+      }
+    };
+    window.addEventListener('keydown', handler);
+    return () => window.removeEventListener('keydown', handler);
+  }, []);
+}