Outcome of an agent-driven UI/UX review on `nekrut:notebook-rewire-pure-md`. Plan is to land 6 phases as separate commits, ordered by impact and shipability. Each phase independent — pause between any two without leaving the branch in a broken state.

Phase 1 — Theme integrity

Highest visual impact. Modal buttons today fall back to native OS controls because `.plan-btn` has no base style; brand colors leak blue in several places.

• Add base `.plan-btn` rule in `styles.css` near line 1525 with `.primary` / `.execute` / `.danger` variants
• Drop hard-coded blue fallbacks (lines 1736, 1801, 1880, 1901)
• Fix focused-input box-shadow at lines 1313, 1513 (blue → gold)
• Replace `color: gold` literals at 626, 1452 with `var(--accent)`
• Replace `#c8a200` at 950 with `var(--galaxy-gold-dark)`
• Drop unused `--state-ok-border` / `--state-error-border` (lines 50–53)

~50 lines, one file.

Phase 2 — Modal escape hatches + Galaxy validation + UX traps

Stop alpha testers from getting stuck or persisting half-filled config.

• Welcome screen: add "Skip — set up later" button + Esc binding
• Galaxy form: require both URL+key or neither; disable Save (block) when half-filled
• Skills "Remove": wrap in `confirm(...)`
• Replace `addUserMessage("[system] Preferences saved...")` with `addInfoMessage`
• `agent-status` badge: clickable when stuck `connecting…` or `error`, opens Preferences

~55 lines.

Phase 3 — Activity-tab + chat ergonomics

• `revealActivityForTurn`: only auto-switch tab when pane was collapsed; if expanded with non-default tab, leave alone
• `/cost` and `/summarize`: leading info card so tester sees something queued
• `#input` placeholder → "Ask for a plan, drop a file path, or type / for commands"
• Merge three quick info cards after `/new` into one
• proc-monitor `` initial "(no data yet)" row
• `#switch-dir-link` listener stacking: switch to event delegation on `messagesEl`

~35 lines.

Phase 4 — Responsive layout (validate breakpoints first)

Resize Orbit live to find right breakpoints, then:

• `@media (max-width: ~900 px)` auto-applies `body.files-collapsed`
• `@media (max-width: ~700 px)` auto-applies `body.artifact-collapsed`
• `.pane-tab` `min-width: 0` + `.pane-tab-label` ellipsis
• Empty-state padding inside `#notebook-view` (drop conflict between 16 px pane padding + 40 px empty padding)
• `.pane-tabs` left-align (was `justify-content: center`)
• `.pane-tab-close` 16px → 20px hit target
• `.prompt-num` `min-width: 28px` for 5-digit overflow
• `#proc-monitor-count` hide/grey at zero

~45 lines CSS.

Phase 5 — Accessibility

• `aria-label` on icon-only buttons (`#send-btn`, `#abort-btn`, `#files-toggle`, `#artifact-toggle`, `#cwd-change`, `#galaxy-status`)
• Convert `#galaxy-status` from `
  ` to ``
• Slash popup ARIA: rows get unique ids; textarea `aria-activedescendant` updates on highlight change
• Queued-indicator `↓` arrow wrapped in `<span aria-hidden="true">`
• Global `:focus-visible` rule (gold outline, 2px, offset 2px); remove `outline: none` at 401, 1307, 1506, 1581, 1879, 2188 unless paired with a visible replacement

~30 lines.

Phase 6 — Documentation polish + emoji+svg fallback

• Drop unused Atkinson Hyperlegible font import (`index.html` 7–9)
• Notebook empty-state wording (`/notebook` does NOT refresh)
• Welcome "Start fresh" warning: drop the brittle `git show HEAD~1` reference
• `` → `` in welcome warning
• Tab-label case consistency
• Notification emoji prefix (`⚠️`/`❌`): keep emoji, add SVG as redundant visual; class on container so the platform-bad-emoji case still shows the right color/icon
• `SLASH_COMMANDS` and welcome chat tip share descriptions