The homebase for every mockup. Tabs below are the same chrome as design-foundations.html — not a second system. Cards open the HTML next to this hub. On a phone, Desktop 1180 shrinks to fit the screen as a slide deck — swipe between whole screens. On a computer it stays full size. Portrait still opens the 375 frames so you can scroll. Size buttons still override. Nothing builds without a mockup, your sign-off, and a pixel review against it.
Ritual, layout tiers, and the system file. Pixel tokens live in design-foundations.html · Core 0 is the V3 contract.
/design (STRICT ritual — every non-trivial design task)
┌──────────────────────────────────────────────────────────────────────────────┐
│ 1 PRE-FLIGHT read kit decisions+lessons · foundations · canon · archetypes │
│ 2 FRAME intent · principle · constraints │
│ 2b BRIEFS Chief Product + Chief Researcher (+ domain agent) │
│ ≤10-line insight briefs — insights land BEFORE pixels │
│ 3-4 OPTIONS Chief Designer (Fable) sketches → Peyton picks │
│ 4b MOCKUP Chief Designer authors/updates the HTML mockup here │
│ GATE mobile + tablet + desktop, every state → Peyton signs off │
│ ── nothing builds without it ── │
│ 5 BUILD Platform Frontend Dev (Sonnet) implements the mockup verbatim │
│ 6 SCREENSHOTS 375px first → tablet → desktop, scored vs the mockup frames │
│ 6b REVIEW Chief Designer (Fable) reviews rendered pixels — blockers stop │
│ 7 MEMORY decisions → kit ledger · misses → kit lessons │
└──────────────────────────────────┬───────────────────────────────────────────┘
▼
/ship gate 4.4d (every UI-surface PR)
Chief Designer (Fable) BLOCKING review — screenshots vs mockup;
no mockup coverage = automatic blocker · then quality/security/CTO
· Hierarchy: Peyton (CPO) owns every sign-off →
Chief Designer (Fable) owns design judgment, mockup authorship, both review gates →
Chief Product + Chief Researcher feed briefs → Platform Frontend Dev (Sonnet) executes, never designs
· Scope changes update the SAME mockup first, republish at the same URL, then build
· Written version: docs/design/design-artifacts/README.md · docs/architecture/agents/agent-orchestration.md §5
· Passes desktop but fails a smaller tier = FAIL, not a partial pass
· Every artifact carries mobile + desktop frames · tablet frames landing progressively, required in all NEW mockups
These three are samples along a continuum, not the only sizes that exist. Content — spacing, type, card widths, gaps — scales smoothly at every width in between, the way a photo scales rather than jumps. Structure is different: a rail collapsing into a drawer, a row turning into a stack, a grid losing a column — those have no in-between state, so they change only at a few fixed, deliberate widths and never drift anywhere else.
The drawable kit is authored once, in the foundations file. This hub does not redraw it.
MF-Platform · dark-glass dialect · frames in docs/design/design-artifacts/ · reviewed against design-canon.md · tabbed walkthrough, same chrome as Brain.
#f34 / #f34-in / #f34-walk / #f1 1b / Share J2). On the long researching page the books sit above the playbook edit rows. Our read tab is her two books (or the deck) once they exist — examples demote to the hairline. The founder’s knowledge page: import → recognize → customer-ready → teach the inside → live. Share anything and Teach your Brain more use the same AttachmentChip rows and one Save to my Brain (brain.html #f15 · #f15-lots · #f1f · #f28 · #f28-share). Playbook is her words as a book; Our read is ours as a full-page deck. Review tabs are Import · Playbook · Our read · More (Ready and Live retired 2026-08-24 — those frames ride Playbook; Share loop folded under Playbook 2026-08-24 — it is part of building the playbook). Import splits into Brain Research (web) · Brain Research (teach) · Research-Confirmation · Start. 27l: Teach unread well — We couldn't open that page. Add what's on it, or a file. (silent sales_channel_urls write is not a share inbox). 27k: Teach sheet copy C — what you do and sell; save / research or keep; Type, paste, or drop a file. 27j: Add to your Brain eyebrow retired. 27i: Research · Web is the site-read spine; Research · Teach is Teach your Brain (share → research → confirm → playbook + Our read). Brain Research (`#phase-research`) is the start-new web walk (empty → filled → slide-door Quick check during the read → which-business before the paid read → paid / IR2 rail → first playbook / IR3); Research-Confirmation is the confirm walk after that pick (2026-08-26v) — Not quite / Re-find → the read running (`#f-ir-2c`, twin of IR2; IR2 stays the research spine) → Our read under a standing info tape (this is what we read — nothing saves until she confirms) → one save-this-read decision on This read (`#f-ir-2d`, NEW PRD debt amending AC-BRAIN-22; field confirm stays on drafts) → the saved copy (`#f-ir-2e`) → later, one door: tell us what to fix (`#f-ir-2f`) → scoped Share anything (`#f-ir-2g`, only the parts she names; a full site read is last-line opt-in) → same v1 updated (`#f-ir-2h`). Historical S1 start stays on Import → Start. The Playbook tab's review chrome splits into seven sub-tabs — Your book · Share loop · Examples · Customer Q&A · Shelf & doors · How you sound · Co-edit (review chrome only, not a product split). Chapter edit sheets review on Playbook → Co-edit. How you look in the book still reviews on Your book (#f36 / #f37) — not on Shelf & doors. Branding is one chapter: the left pane always nests 1. How you look / 2. How you sound. Co-edit ‹ › walks the chapter sheets only — official names on the pager. How you sound Refine / Saved are the action forms from that sheet. Field-kit scraps and book-over peekers stay in the file, off this walk. Share splits only on the full /brain stage; inside a Brain pane it stacks. Playbook field lock (2026-08-21): Your business carries about + website + Instagram, Your story is a quiet optional row, Direction shows Coming soon, Where to find you adds a Maps fact, and Customer Q&A merges FAQs with a read-only policies tail. f32 Customer Q&A approved to build (2026-08-22, simplification S1, AC-BRAIN-108) — builder kill list: both duplicate suggested-question chip rows, the floating “N to answer →” counter, and the icon empty-state all retire. Activity re-home (2026-08-21, Peyton lock): Activity is outside generated content — the object is art only with a quiet vN chip, Save to Google Doc lives under it (playbook + Our read: no Copy all), and a ≤5-row Activity preview with See all → opens Pulse's Activity tab. 2026-08-23: the book is 10 chapters ending at Direction (How you show up lives in Our Read). Share from a form row docks that row left — Option B Pick at #f28-share, sign-off before any remount. Share anything as gap guidance (specified-not-built, AC-BRAIN-109..118): after the first dump the left pane is the missing brief — frames #f15-guide / #f15-guide-m. Full Option 1 journey (Peyton pick 1, siblings): Playbook → **Share loop** (`#phase-share`) walks empty → researching → playbook + missing → share open → two-step apply → after confirm → Add → type → form-door contrast → missing = 0. Work rail (2026-08-23): Teach, resume, confirm, missing, and the share-next hint live in one right column (`#f15-loop-j3` · `#f15-loop-j3c` · `#f15-loop-j3r` · `#f15-loop-j9`); left is the playbook to read. At 375, Example playbooks · 5 → sits under the two-book shelf, then the work stack. Brain doors never scare on charges (2026-08-23): ✦ is the paid mark; no wallet line on the door; header balance and empty-wallet honesty stay. Playbook drafts-land (#f4 / 2.1) keeps the same example shelf as 9a / Import / Share J2 — playbooks slide, Our read stands; no founder books until she confirms (9b). Couldn’t-read inventory sits on that rail when open (2026-08-24) — compact rows between confirm and missing, drawn at `#f-ir-3` / `#f15-loop-j3` / `#f15-loop-j3c`. IR2 researching (#f-ir-2 / #f-ir-2-m) keeps the IR1 example shelf under the live checklist — no empty chapter rows and no missing list until IR3. 2.3-over (#f33-over) shows the book on top of a dimmed Brain peek — not a dark veil over the whole frame. Empty Playbook 9a puts the example shelf above the Your playbook heading — books first, same order as researching; populated 9b is unchanged. The work rail first mounts at Brain Research IR2 (Teach · What we couldn’t read) once a live read hits something unreadable or she teaches a file — empty Import 1.3-in and IR1 stay intake-only. Where you stand and Activity wait for IR3. 2026-08-25: Co-edit splits Branding — look is #f33e-look (f36 hierarchy); sound is #f33e-voice / #13-form-brand on the same hierarchy (Line · Talk · Words · Place + Together). The old quote-stack and look-under-sound paint are retired on this shelf. Preview Size remaps #f36-m ↔ #f36 so Desktop 1180 on a mobile hash opens the How you look sheet, not the nearest book slide. Playbook How you look doors go to #f36 (2.11a), not superseded #f24. How you look in the book is on the /brain preview: Playbook → Your book → #f36 / #f37, or the Size-bar How you look → door. Chapter sheets: Playbook → Co-edit. 2026-08-25 lock (26s, kept through 26v): How you look is one cream paper card — colours → The vibe (moodboard) → quieter web line → type → feel (#f36 / #13-form-look / #f33e-look / #f37 / #f35). Book interiors stop at confirmed moodboard (no web guess). BrandSignal stays under the card. 2026-08-24: signed-in start (#f34-in) taps Share anything over the full start page (#f34-share), then a staged beat for screenshot + PDF + Google Doc (#f34-share-staged). Saved / proposals stay at #f15. Guests still hit #f2b. 2026-08-24: Start is the no-website share flow — desktop guidance LEFT / composer RIGHT (#f34-share); Instagram profile + posts is a first-class start on that one door. 2026-08-25: that left list names moodboard at row 3 (Photos and your moodboard — colors and look); PDF takes menu/flyer; Google Doc is business guidelines. Review build 26q on live 26p. No second door. 2026-08-26: when How you look is empty, Where you stand / What’s missing adds Add a moodboard with Share anything → (same sheet; not counted in /8; not under What we couldn’t read). Frames #f-ir-3 · #f15-loop-j9 · #f34-walk-next. Review build 26u on live 26t. #f34-in, Teach #f15, and 1.6–1.9 left Start. 1.4 on Start is after Save — same IR2 researching path, source is what they shared (#f34-share-next). No #3129 wire — drawn sheet primary stays Save to my Brain. 2026-08-25: playbook Branding interiors match that story — Your book #f33, Examples Clay Room #f35, and the index How you look row (chips + live faces). Not four equal bands. Not “Earthy neutrals, film-grain photos.” Review build 26e: live 26c miss path (RC-none / RC-kept) plus Co-edit chapter sheets (Option B · official pager · kit wrapper hide). Letter beats open #4080’s 26d (no Co-edit). Review build 25y: Co-edit Option B is on the shared preview — Playbook → Co-edit → Q&A from How you run. Beats live 25x so the Co-edit tab is reviewable. 13 desktop sheets + Q&A from How you run confirm + How you sound Refine / Saved; official pager names; kit scraps and 33e peekers off the walk. Branding still nests two subs. How you sound extraction (tone · exact words · Refine · Save is final) sits on the designed card. 25i hours collapse (hidden on Online only) stays. 2026-08-24: live preview overlay — `deploy-design-preview.sh` overlays every live preview file this checkout should not win (not only /brain). 2026-08-25: How you run → Customer Q&A Option B — confirm guest phrasing before guests hear it. Frames #13-form-faq-confirm (+ t/m) on Co-edit; live tail on #13-form-faq. Specified-not-built. Do not slap rewritten on today’s raw tail. Review build 24u: Teach first; unread under What we couldn’t read; deck ends at 17; `#f22v` How you sound restored so a persist does not drop #4005. 2026-08-26x: Import Research IR2 work rail (#f-ir-2 / #f-ir-2-m / #f34-share-next) adds How you look · Add a moodboard with Share anything → — not unread, not counted in /8. Where you stand at IR3 still holds the same row. 2026-08-27: the identity-gate editor (#f1f) gains a fourth editable line, Location · optional, seated between Founder full name and read-only Contact — a second reputation-search disambiguation string (refine.location), same never-blocks-confirm rules as the founder-name line; AC-BRAIN-75 scope guard raised 3→4 editable lines (Peyton ruling, 2026-08-27).#XYZ chips (last 3 of display_id — never the full ASST-… dump); 375 chip-omit retired; frames 1c / 3-t are drawn 768 shells (collapsed 64px rail, 2×2 KPI).shell.html: form, sent (Seal), guest (Mark). Thread under the title. Header is Private Beta + Feedback. Do not use feedback.html.The master structure first, then each public assistant that has a full-flow mockup. Filter the flow cards by what the assistant does (type) and who it serves (persona) — chips combine, and the untagged placeholder card always stays visible.
#sec-4a). Share from Connect stays inside the Brain pane — stacked, not a nested 40/60.Letter gallery in Brand System V3 chrome. Dialect pixels also live on the Email tab of design-foundations.html.
mystflo-website · full-token dialect, the parity reference · same core, page-flow mockups arrive as website design work goes mockup-first
Seal states, reduced-motion holds, and earned motion — authored in the foundations file.
Feed-legible mono-card dialect + deck treatment · direction-level today — detail earns its spec when those surfaces mature