Fleet rollout: adopt @mind-studio/ui brand refresh (weave logo + per-app wordmark + typography + ./brand) across all consumers #29

🎯 Goal

Roll the @mind-studio/ui brand refresh — the interlocking-weave logo, the typography role redefinition (serif h1–h3, mono kbd), and the new React-free ./brand export — out to all 15 remaining consumer apps. Landing is already done (#26); this issue tracks the fleet.

➕ Added requirement (see 🏷️ Per-app wordmark): the in-app logo lockup must show the product name beside the mark (mark + "Drive"), not "Mind". This needs a small ui <Logo> enhancement and a new release on top of 0.6.0.

📦 What 0.6.0 ships (the payload)

• Logo — the canonical interlocking-weave mark replaces every old per-app placeholder.
• Typography roles — base-layer rule sets h1–h3 → var(--font-serif) (Fraunces), kbd → mono; h4–h6 stay sans.
• ./brand subpath — React-free export of MIND_MARK_SVG, MIND_MARK_VIEWBOX, MIND_GREEN, monoMarkSvg, MIND_CONSTRUCTION_SVG. Safe to import from plain Node build scripts → favicons/app-icons/OG/manifests authored from one source of truth instead of vendoring a copy that drifts.

🏷️ Per-app wordmark

Each app's in-app lockup keeps the shared weave mark but labels itself with its own product name, set in the same Fraunces serif, weight, and size as the wordmark:

• Brand / host (landing, shell) → mark + "Mind"
• Product app (drive) → mark + "Drive" · slides → "Slides" · chat → "Chat" · etc.

Today <Logo> hardcodes the wordmark to theme.label ("Mind"). The product name is an app-level fact, not a brand/theme fact, so it should be a prop — not a per-app theme fork.

ui enhancement (new release, e.g. 0.6.1):

• Add optional label?: string to <Logo> in src/components/brand.tsx; default to theme.label (backward compatible). It overrides only the wordmark text, rendered with the existing font-serif font-semibold text-2xl leading-none tracking-tight. The mark/symbol still comes from the active theme — unchanged.
• Accessible name follows the label (e.g. "Drive"); symbol stays aria-hidden. symbolOnly still drops the word.
• Test: <Logo label="Drive" /> renders "Drive" in the serif wordmark and still renders the theme symbol; <Logo /> still renders "Mind".
• Release → consumers adopting the lockup target this release.

Scope note: label affects only the in-app <Logo> lockup. Favicons / app-icons / OG / manifest stay mark-only (no word), so the ./brand gen-icons pass below is unaffected.

🔌 How it propagates (this is why most of the work is small)

1. Typography → automatic. Every consumer already @imports @mind-studio/ui/dist/styles.css in globals.css. The serif rule resolves --font-serif → --mind-font-serif → var(--font-fraunces) inside the package, so headings flip to Fraunces on bump — provided the app exposes a --font-fraunces variable (they all load Fraunces today; just confirm the variable name).
2. Component logos → automatic. Anywhere the app renders the ui <Symbol>/<Logo> component, the weave arrives on bump (only projects does this today). The product wordmark needs the new label prop (above).
3. Static brand assets → manual. Favicons/app-icons/manifests/OG images are local files; they must be regenerated from ./brand. This is the only large per-app effort, and only for user-facing apps.

📐 Reference implementation: landing — scripts/gen-icons.mjs (imports @mind-studio/ui/brand) → src/app/{icon.svg, apple-icon.png, manifest.ts, opengraph-image.tsx}.

🗺️ Fleet state (survey, 2026-06-21)

All 15 are Next.js 16 app-router + Tailwind v4 (shell also Tauri), all already import the ui stylesheet. No conflicting h1–h3 CSS overrides found anywhere — clean adopters.

🚦 Rollout plan

Tier 0 — ui enabling release ⛔ prerequisite for the wordmark work

• Land the <Logo label> enhancement above; cut a release (e.g. 0.6.1). This becomes the bump target for any app adopting the in-app lockup.

Tier 1 — Universal bump (all 15) ✅ delivers typography + state tokens + auto logos

• Bump @mind-studio/ui → the new release, reinstall, pnpm build && pnpm typecheck green. (projects 0.3.0 and the 0.4.0 cohort also pick up the 0.5.0 semantic-state tokens in the same jump.)

Tier 2 — Typography QA (all 15, cheap)

• Confirm each app exposes --font-fraunces so h1–h3 render Fraunces, not system serif; alias where the variable is named differently (dock/photos/product/codespaces use --mind-font-* bridges — verify the chain reaches --font-fraunces).
• Visually confirm headings serif / body sans / kbd mono; drop now-redundant manual .font-display on headings.

Tier 3 — In-app lockup 🏷️ (mark + product name)

• Replace each app's text/placeholder logo in nav/header with <Logo label="<Product>" /> per the table; landing/shell stay <Logo /> → "Mind".
• dock — swap the ✦ BrandMark in src/components/TopBar.tsx for <Logo>.

Tier 4 — Static brand assets, user-facing apps 🎨 (builder, calendar, chat, drive, slides, videos, shell)

Per app, port landing's pattern (mark-only, no wordmark):

• Add scripts/gen-icons.mjs importing @mind-studio/ui/brand; wire a gen:icons script.
• Replace the old placeholder src/app/icon.svg with the gradient weave (legible to 16px).
• Add apple-icon.png (180×180, white mono mark on brand-green, 22% radius).
• Add manifest.ts (theme-color: #16B88A, 192/512 maskable green icons).
• Add opengraph-image.tsx rendering the real mark.
• shell only: regenerate the Tauri desktop bundle icons from the same source.

Tier 5 — Internal-tool assets (product, notes, photos, whiteboard) — optional / deferred

• No user-facing favicon/OG today. Bump (Tier 1) is enough; author brand assets only if/when they go user-facing.

🧰 DS enhancement (recommended, avoids 7× copy-paste drift)

• Ship a reusable gen-icons helper from ui (e.g. @mind-studio/ui/scripts/gen-icons or a documented snippet) so the asset-pass apps consume one script instead of vendoring gen-icons.mjs seven times — same anti-drift rationale as the ./brand export.

✅ Acceptance criteria

• ui ships <Logo label>; released; consumers on that version.
• All 15 consumers build + typecheck green on the new release.
• Headings render Fraunces serif, body sans, kbd mono across the fleet.
• Every in-app lockup shows the weave mark + its product name in Fraunces serif (drive → "Drive", etc.); landing/shell show "Mind". No old placeholder marks remain; dock chrome and projects show the weave.
• User-facing apps (builder, calendar, chat, drive, slides, videos, shell) ship favicon + apple-touch + manifest + OG authored from ./brand (mark-only); shell homescreen/desktop icon is the green app icon.
• No vendored mark copies; static assets trace to @mind-studio/ui/brand.

🔗 Related

• Ship logo + typography to landing (release 0.6.0 → bump → icons) #26 — landing rollout (the reference implementation)
• Verify & close — design-system remediation #21 — prior cross-repo design-system closeout (house style for fleet trackers)

Suggested execution: land Tier 0 (<Logo label> + release) → bump fleet (Tier 1) → lockup + asset passes per repo. File a per-repo sub-issue (ready-for-agent) from each table row. Conventional Commits, no JIRA id.