diff --git a/docs/superpowers/specs/2026-03-19-apply-split-pane-design.md b/docs/superpowers/specs/2026-03-19-apply-split-pane-design.md
new file mode 100644
index 0000000..bfdc84b
--- /dev/null
+++ b/docs/superpowers/specs/2026-03-19-apply-split-pane-design.md
@@ -0,0 +1,181 @@
+# Apply View — Desktop Split-Pane Design
+
+**Date:** 2026-03-19
+**Status:** Approved — ready for implementation planning
+
+---
+
+## Goal
+
+Refactor the Apply view for desktop: replace the centered 760px list → full-page-navigation pattern with a persistent master-detail split pane. The left column holds a compact job list; clicking a job expands the cover letter workspace inline to the right. Mobile layout is unchanged.
+
+---
+
+## Decisions Made
+
+| Decision | Choice | Future option |
+|---|---|---|
+| Split ratio | 28% list / 72% workspace (fixed) | Resizable drag handle (Option C) |
+| Panel open animation | Expand from list divider edge (~200ms) | — |
+| URL routing | Local state only — URL stays at `/apply` | URL-synced selection for deep linking |
+| List row density | Option A: title + company + score badge, truncated | C (company+score only), D (wrapped/taller) via future layout selector |
+
+---
+
+## Layout
+
+### Desktop (≥ 768px)
+
+```
+┌──────────────────────────────────────────────────────────────────┐
+│ [NAV 220px] │ List (28%) │ Workspace (72%) │
+│ │ ─────────────────── │ ──────────────────────── │
+│ │ 25 jobs │ Sr. Software Engineer │
+│ │ ▶ Sr. SWE Acme 87% │ Acme Corp │
+│ │ FS Dev Globex 72% │ │
+│ │ Backend Init 58% │ [Cover letter editor] │
+│ │ ... │ [Actions: Generate / PDF] │
+└──────────────────────────────────────────────────────────────────┘
+```
+
+- App nav sidebar (220px fixed, existing) + split pane fills the remainder
+- No job selected → right panel shows a warm empty state: `← Select a job to open the workspace`
+- The `max-width: 760px` constraint on `.apply-list` is removed for desktop; it remains (full-width) on mobile
+
+### Mobile (< 768px)
+
+No changes. Existing styles, full-width list, `RouterLink` navigation to `/apply/:id`.
+
+---
+
+## Component Architecture
+
+### Current
+
+```
+ApplyView.vue → list only, RouterLink to /apply/:id
+ApplyWorkspaceView.vue → full page, reads :id from route params
+```
+
+### New
+
+```
+ApplyView.vue → split pane (desktop) OR list (mobile)
+ ├─ [left] NarrowJobList (inline, not a separate component — kept in ApplyView)
+ └─ [right] ApplyWorkspace.vue (new component, accepts :jobId prop)
+
+ApplyWorkspaceView.vue → unchanged route wrapper; renders
+```
+
+**Why extract `ApplyWorkspace.vue`?** The workspace is now rendered in two contexts: the split pane (inline) and the existing `/apply/:id` route (for mobile and any future deep-link support). Extracting it as a prop-driven component avoids duplication.
+
+---
+
+## Narrow Job List (left panel)
+
+**Row layout — Option A:**
+
+```
+┌─────────────────────────────────────┐
+│ Sr. Software Engineer [87%]│ ← title truncated, score right-aligned
+│ Acme Corp │ ← company truncated
+└─────────────────────────────────────┘
+```
+
+- Score badge color-coded: green ≥ 70%, blue 50–69%, yellow 30–49%, red < 30%
+- `has_cover_letter` shown as a subtle `✓` prefix on the company line (no separate badge — space is tight)
+- Selected row: `border-left: 3px solid var(--app-primary)` accent + tinted background (`color-mix(in srgb, var(--app-primary) 8%, var(--color-surface-raised))`)
+- Hover: same border-left treatment at lower opacity
+- `salary`, `location`, `is_remote` badge moved to the workspace header — not shown in the narrow list
+- List scrolls independently; workspace panel is sticky
+
+---
+
+## Panel Open Animation
+
+CSS Grid column transition — most reliable cross-browser approach for "grow from divider" effect:
+
+```css
+.apply-split {
+ display: grid;
+ grid-template-columns: 28% 0fr; /* collapsed: panel has 0 width */
+ transition: grid-template-columns 200ms ease-out;
+}
+.apply-split.has-selection {
+ grid-template-columns: 28% 1fr; /* expanded */
+}
+```
+
+The panel column itself has `overflow: hidden`, so content is clipped during expansion. A `opacity: 0 → 1` fade on the panel content (100ms delay, 150ms duration) layers on top so content doesn't flash half-rendered mid-expand.
+
+`prefers-reduced-motion`: skip the grid transition and opacity fade; panel appears instantly.
+
+---
+
+## Empty State (no job selected)
+
+Shown in the right panel when `selectedJobId === null`:
+
+```
+ 🦅
+ Select a job to open
+ the workspace
+```
+
+Centered vertically, subdued text color, small bird emoji. Disappears the moment a job is selected (no transition needed — the panel content crossfades in).
+
+---
+
+## Easter Eggs
+
+All four easter eggs are scoped to `ApplyView.vue` / `ApplyWorkspace.vue`:
+
+### 1. Speed Demon 🦅
+- **Trigger:** User clicks 5+ different jobs in under 3 seconds
+- **Effect:** A `