| 1 | # TASK (Codex): make Darwin chat full-bleed like Odysseus |
| 2 | |
| 3 | File to edit: `/shared/projects/darwin/face/src/app/page.tsx` |
| 4 | |
| 5 | ## Problem |
| 6 | Zion's complaint: the chat "stays boxed and squared up" and does not fill the screen, |
| 7 | while the older Odysseus cockpit lets chat fill the width. The chat component (AskBox) is |
| 8 | already fluid (`w-full`). The boxing comes from the DESKTOP surface container in page.tsx: |
| 9 | 1. A wrapper caps the whole surface at `max-w-screen-xl` and centers it (`mx-auto`). |
| 10 | 2. A grid wedges the chat (AskBox, the center `1fr` column) between a 320px AgentTree pane |
| 11 | and a 320px HitsInbox pane, so chat only gets the squeezed leftover middle strip. |
| 12 | |
| 13 | ## Make EXACTLY these changes (layout only - do NOT touch colors, fonts, or logic) |
| 14 | 1. Find the DesktopSurface wrapper `<div className="max-w-screen-xl mx-auto">` (around line 324). |
| 15 | Change its className: remove `max-w-screen-xl mx-auto`, replace with `w-full`. |
| 16 | (Keep any other classes on that div intact.) |
| 17 | |
| 18 | 2. Find the grid `<div className="grid grid-cols-1 lg:grid-cols-[320px_1fr_320px] gap-5 min-h-[700px]">` |
| 19 | (around line 334). Change the large-screen template: |
| 20 | `lg:grid-cols-[320px_1fr_320px]` -> `lg:grid-cols-[280px_minmax(0,1fr)_280px]` |
| 21 | The `minmax(0,1fr)` is important so the center chat column takes all remaining width and is |
| 22 | never squeezed by its content. Keep `grid-cols-1` (mobile) and gap/min-h as-is. |
| 23 | |
| 24 | 3. In AskBox (the answer/message rendering, `src/components/surface/AskBox.tsx`): ensure the |
| 25 | AI/assistant answer block fills the width (`w-full` / `max-w-full`). Mirror Odysseus's pattern: |
| 26 | assistant/agent messages 100% width; only the USER's own message bubble is capped (~90%, |
| 27 | right-aligned with `ml-auto`). If the assistant block is already `w-full`, leave it; only add the |
| 28 | user-bubble cap if user messages are currently full-width too. Do not add fixed pixel max-widths |
| 29 | to assistant messages. |
| 30 | |
| 31 | ## Constraints |
| 32 | - Layout/width only. No color/font/spacing redesign. No new dependencies. |
| 33 | - Preserve all existing functionality, props, and the mobile single-column path (around line 400) untouched. |
| 34 | - After editing, print the exact unified diff of every change you made. |