<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>VibeCoder-Standalone Refinement Plan (9 steps)</title>
<style>
body { font-family: -apple-system, 'Inter', 'Segoe UI', sans-serif; max-width: 780px; margin: 40px auto; padding: 0 24px; color: #1a1a1a; line-height: 1.6; }
h1 { font-size: 28px; margin-bottom: 4px; }
h2 { font-size: 20px; margin-top: 32px; border-bottom: 1px solid #ddd; padding-bottom: 6px; }
.lead { color: #555; font-size: 15px; margin-bottom: 24px; }
pre { background: #f5f5f5; padding: 12px; border-radius: 6px; overflow-x: auto; font-size: 13px; }
.tag { display: inline-block; padding: 2px 8px; border-radius: 4px; background: #eef; color: #335; font-size: 12px; margin-right: 6px; }
.meta { color: #888; font-size: 13px; }
</style>
</head>
<body>
<h1>VibeCoder-Standalone Refinement Plan</h1>
<p class="lead">
Premise (corrected from pact, not from old guesses): VibeCoder is a sovereign workspace (one of 4: Origin, VibeCoder, VibeScope, FreshCards). Two layouts: Vibe (Stencil + Preview + Inspector) and Coder (code editor + VSIL execution + Logs). Co-equal, not 'main + sidekick'. Centre pane IS the Monaco code editor per the pact. Externalize it for build size, do NOT replace it.
</p>
<p class="meta">Plan composed 2026-07-29 18:24 BST. 9 steps. 12-13h total. 9 deploys.</p>
<h2>Step 1 — Build foundation</h2>
<p>Externalize monaco-editor (one vite config line + CDN script tag), add prebuild hash-stamp hook, wire MAVIS_BYPASS_TOKEN lookup. 30 min. Zero risk.</p>
<h2>Step 2 — Pact corrections</h2>
<p>Rename right surface per layout (Vibe -> Inspector, Coder -> Logs), add DNA + lineage hooks, finish ⌘K command palette, enforce 3-tab Inner Card limit toast. 1.5h. Medium risk.</p>
<h2>Step 3 — Parked: dynamic daily-notes date</h2>
<p>Replace hardcoded date string with <code>new Date().toLocaleDateString('en', {dateStyle:'full'})</code>. 15 min. Zero risk.</p>
<h2>Step 4 — Parked: file-tree filter/sort/search</h2>
<p>Search input + sort dropdown (name/modified/type) for FileTreeRail. Spec'd in vibe-card-variant.md §2 but never implemented. 45 min. Low risk.</p>
<h2>Step 5 — Parked: responsive inspector / mobile collapse</h2>
<p>Breakpoint ~768px, right rail -> slide-out drawer, left rail -> hamburger. 1.5h. Low risk.</p>
<h2>Step 6 — Parked: property editor for workspace settings</h2>
<p>Modal: theme (light/dark/auto), default layout (1/2/3-col/stacked/quad-grid), surface visibility toggles. Reads/writes perWorkspaceState from StudioContext. 2h. Medium risk.</p>
<h2>Step 7 — Parked: replace simple-git stub with real git (project clone)</h2>
<p>"Clone from URL" action in file tree context menu (per vibe-card-variant §2). Real simple-git on desktop, stub fallback on web. 2h. Medium risk.</p>
<h2>Step 8 — Parked: real TypeScript LSP for editor (Coder Layout only)</h2>
<p>Wire typescript-language-server real adapter. Coder Layout only (Vibe Layout has no code). go-to-def, hover, autocomplete. 2-3h. Medium risk (proven in FVS Phase 4.4).</p>
<h2>Step 9 — Final: invariant sweep + drift-check + screenshot</h2>
<p>Drift-check, Playwright screenshot at 1440x900 + 375x667 (mobile), commit MAVIS-WORKFLOW.md, update memory. 1h. Zero risk.</p>
<h2>Decisions needed from operator</h2>
<ol>
<li>Step 1 (build foundation) - go ahead? Pure config, zero risk.</li>
<li>Step 2 (pact corrections) - is the layout naming right? "Vibe Layout" and "Coder Layout" as the two co-equal layouts?</li>
<li>All 8 in sequence, or pick which to do first?</li>
<li>Real AI integration (Vibe Layout Stencil + chat) - in scope for standalone, or is Vibe Layout just inspector + preview with no AI?</li>
<li>Vibe Chat (Studio-level per §24) - does the standalone need it? Or pure VibeCoder with no Vibe Chat?</li>
</ol>
</body>
</html>