feat: add core PWA screens (auth, dashboard, purchases, products, alerts, settings)

Build all 8 primary screens for CAR-33 on top of the Phase 1 scaffold:
- Auth: login, register, forgot password with JWT flow and mock fallback
- Dashboard: triggered alerts banner, spending stats, price trend sparklines (Recharts), recent purchases
- Purchase History: store filter chips, paginated list with item previews
- Purchase Detail: receipt view with line items linking to product pages
- Products: search with instant filter, store price comparison badges
- Product Detail: 90-day price history chart (Recharts), store comparison table
- Store Comparison: ranked store cards with savings banner
- Price Alerts: triggered/watching sections, create form, progress bars, delete
- Coupons: expiration warnings, copy-to-clipboard coupon codes
- Account Linking: connect Meijer/Kroger/Target with status indicators
- Settings: profile, connected stores, notification toggles, theme switcher, sign out

Also adds:
- Mock data layer (src/lib/mock-data.ts) for demo/screenshot use
- StoreIcon component with store brand colors
- Code-split Recharts chunk (initial JS: 117KB, Recharts lazy: 498KB)
- All 48px+ touch targets, mobile-first Tailwind layout

Co-Authored-By: Paperclip <noreply@paperclip.ing>

src/hooks/useApi.ts

@@ -0,0 +1,55 @@
+import { useQuery } from '@tanstack/react-query'
+import { api } from '../lib/api.ts'
+import type { Purchase, Product, Coupon, PriceAlert, PriceHistory } from '../types/api.ts'
+
+export function usePurchases() {
+  return useQuery({
+    queryKey: ['purchases'],
+    queryFn: () => api.get<Purchase[]>('/purchases'),
+  })
+}
+
+export function usePurchase(id: string) {
+  return useQuery({
+    queryKey: ['purchases', id],
+    queryFn: () => api.get<Purchase>(`/purchases/${id}`),
+    enabled: !!id,
+  })
+}
+
+export function useProducts(search?: string) {
+  return useQuery({
+    queryKey: ['products', search],
+    queryFn: () => api.get<Product[]>(`/products${search ? `?q=${encodeURIComponent(search)}` : ''}`),
+  })
+}
+
+export function useProduct(id: string) {
+  return useQuery({
+    queryKey: ['products', id],
+    queryFn: () => api.get<Product>(`/products/${id}`),
+    enabled: !!id,
+  })
+}
+
+export function usePriceHistory(productId: string) {
+  return useQuery({
+    queryKey: ['priceHistory', productId],
+    queryFn: () => api.get<PriceHistory[]>(`/products/${productId}/price-history`),
+    enabled: !!productId,
+  })
+}
+
+export function useCoupons() {
+  return useQuery({
+    queryKey: ['coupons'],
+    queryFn: () => api.get<Coupon[]>('/coupons'),
+  })
+}
+
+export function usePriceAlerts() {
+  return useQuery({
+    queryKey: ['priceAlerts'],
+    queryFn: () => api.get<PriceAlert[]>('/price-alerts'),
+  })
+}