# PROMPT 01 — THE SCAFFOLD (Free Sample)
### From the Mission Control Build-Prompt Kit · missioncontrol kit by REI Transaction Mastery

This is the real first prompt from the vault. Paste everything inside the box below into **Claude Code, Manus, Hermes, or ChatGPT** (any AI builder that can create files), opened on an **empty folder**. In a few minutes you'll have your own branded command-center shell running in your browser.

The full kit continues from here: 40+ prompts that add lead radar, deal analysis, skip tracing, CRM, and 30 more modules onto this exact shell.
→ Get the full vault: https://mcc-prompts-offer.vercel.app

---

## PASTE EVERYTHING BELOW THIS LINE

```
You are building the SHELL of a single-page real-estate command center web app
called "MISSION CONTROL" (I may rebrand it later — keep branding centralized).

Create exactly three files in this folder: index.html, styles.css, app.js.
Vanilla HTML/CSS/JS only — no frameworks, no build step. It must work by
opening index.html directly in a browser.

BRAND TOKENS — define ALL of these as CSS custom properties in :root and use
them everywhere (I will swap these to my brand later; no hard-coded colors
anywhere else in the CSS):
  --bg: #0a0026        (page background — near-black)
  --panel: #130244     (sidebar/panel surface)
  --card: #1b0a55      (card surface)
  --line: #2a1170      (borders)
  --accent: #9b30ff    (primary accent)
  --accent-2: #c07bff  (hover/highlight accent)
  --ink: #f3edff       (primary text)
  --muted: #a99cc9     (secondary text)
  --good: #34d399      (positive numbers)
  --bad: #f87171       (negative numbers)
Font: system UI stack; monospace for all numbers.

LAYOUT:
1. Fixed left sidebar (240px, --panel): app name "MISSION CONTROL" at top,
   then a nav list with these items (icons optional, text required):
   Dashboard, Leads, Deals, Analyzer, Contacts, Settings.
   The active item gets a left accent bar and brighter text.
   On screens under 900px the sidebar collapses to a top bar with a menu button.
2. Main area: a header row (page title + a fake user chip "Operator"), then
   a content region that swaps between SECTIONS (one per nav item) with no
   page reload — plain JS show/hide, hash-based routing (#/dashboard etc.)
   so the back button works.

SECTIONS (placeholder content for now — later prompts replace these):
- Dashboard: a 4-tile stat row (Leads Today, Active Deals, Offers Out,
  Est. Pipeline $) with big mono numbers (hardcode sample values), plus an
  empty "Recent Activity" card with 3 sample rows.
- Leads / Deals / Analyzer / Contacts: each a card saying
  "[Module name] — installs with a later prompt" plus one sample table with
  3 rows of fake data so the styling is visible.
- Settings: a card with a "Brand" form — text inputs for App Name and Accent
  Color; on save, write to localStorage and apply live (change the CSS
  variable and the sidebar title). This proves the app is rebrandable.

QUALITY BAR:
- Responsive at 375px, 768px, 1280px — no horizontal scroll anywhere.
- All state in one plain JS object; localStorage persistence for settings.
- Zero console errors. Semantic HTML. Every interactive element keyboard-usable.
- Add a tiny footer line: "Built with the Mission Control Kit".

VERIFY BEFORE FINISHING (do these yourself and fix anything that fails):
1. Open index.html — sidebar, header, and dashboard tiles render on the
   dark theme with accent colors from the tokens.
2. Click every nav item — the section swaps and the URL hash changes.
3. Refresh on #/deals — the Deals section is active on load.
4. In Settings, change App Name to "TEST HQ" and pick a new accent color —
   the sidebar title and accents update immediately and survive a refresh.
5. Narrow the window to phone width — the sidebar collapses and everything
   remains usable with no horizontal scroll.

When all five checks pass, print "SCAFFOLD COMPLETE" and list the files you
created. Do not add any extra features — later prompts install the modules.
```

## PASTE EVERYTHING ABOVE THIS LINE

---

**What just happened?** You built the foundation every other module snaps into. The full vault's next prompts add, in order: Supabase logins + cloud sync, the deal pipeline, the analyzer with real MAO math, scored distressed-lead feeds for Maryland/DC/Virginia, the heat map, skip tracing, and 28 more.

**Ready for the rest?** → https://mcc-prompts-offer.vercel.app

© REI Transaction Mastery · Powered by Scale AI Pros™ · Personal business use; resale of the prompts is not licensed.
