CRITICAL REDESIGN REQUIRED. The current Tessera frontend is dark-mode-only and not user-friendly. Implement these changes: ## 1. LIGHT MODE AS DEFAULT Rewrite the theme system. shadcn/ui supports light/dark via CSS variables. - Remove forced `className="dark"` from HTML element in layout.tsx - Add ThemeProvider (install next-themes: bun add next-themes) - Light mode is DEFAULT. Dark mode via toggle. - Use shadcn/ui's built-in CSS variable system (already in globals.css) Light mode colors: - Background: white for canvas, #f8f9fa for panels/sidebar - Text: #1a1a2e primary, #4a4a6a secondary, #6b7280 tertiary - Borders: #e5e7eb, Cards: white with shadow - Accent: #5e6ad2 (works in both modes) Dark mode (toggled): keep existing Linear-inspired dark theme ## 2. BETTER FONT - Primary: 'Inter' from next/font/google with font-feature-settings: 'cv01' 1, 'ss03' 1 (geometric Linear-like character) - Monospace: 'JetBrains Mono' for ticket IDs, code, config - Headings: tighter letter-spacing (-0.02em) - Body: 15px base, line-height 1.5 ## 3. UX IMPROVEMENTS ### Ticket list (page.tsx): - Inbox-like rows: padding, hover highlight, subtle left border on hover - Add checkbox column for future batch actions - Clicking row opens detail in split view: list stays on left, detail on right - OR simplified: click opens slide-over Sheet from right showing detail - "New Ticket" button: prominent with gradient background ### Ticket detail (tickets/[id]/page.tsx): - Better conversation hierarchy: customer messages tinted, agent clearly differentiated - Properties sidebar: group into Status/Assignment/Details sections with dividers - Status dropdown: more prominent (most important action) ### Global: - Smooth transitions (150ms ease) on hover states - Border radius consistency (8px cards, 6px inputs) - Sidebar collapse/expand with hamburger - Breadcrumb navigation at top of detail pages - Tooltips on icon buttons - Split-view or sheet overlay for ticket detail from list ### Command palette: - Ensure Cmd+K / Ctrl+K triggers it - Add fuzzy ticket search - Add quick actions ## 4. IMPLEMENTATION - Read current files first - Modify existing files, don't delete - Preserve api.ts and types.ts - Use next-themes for theme switching - shadcn/ui CSS variables already in globals.css ## 5. VERIFY - `cd web && bun run build` — zero TypeScript errors - Both light and dark mode work - Font has OpenType features applied - Ticket list is inbox-like