get-shit-pretty 0.7.0 → 0.7.3

package/gsp/skills/gsp-accessibility-audit/SKILL.md

@@ -2,8 +2,6 @@
 name: gsp-accessibility-audit
 description: Full WCAG accessibility audit — design screens, codebase, or generate compliance statement
 user-invocable: true
-model: opus
-effort: high
 allowed-tools:
   - Read
   - Write
@@ -32,10 +30,6 @@ Run full accessibility audits — design screen reviews, codebase ARIA/keyboard/
 **Agent:** `gsp-accessibility-auditor` (for design and code modes), inline for statement
 </objective>
 
-<execution_context>
-@${CLAUDE_SKILL_DIR}/wcag-checklist.md
-</execution_context>
-
 <rules>
 - Always use `AskUserQuestion` for user interaction — never prompt via plain text
 - One decision per question — never batch multiple questions in a single message
@@ -79,6 +73,11 @@ Verify design chunks exist:
 - Read `{PROJECT_PATH}/design/INDEX.md` to find screen chunks
 - If no design chunks, tell user to complete design phase first and stop
 
+### Load references and agent methodology
+Read these files and hold their content for inlining into the agent prompt:
+- `${CLAUDE_SKILL_DIR}/wcag-checklist.md` — WCAG checklist reference
+- `${CLAUDE_SKILL_DIR}/methodology/gsp-accessibility-auditor.md` — agent methodology
+
 ### Spawn agent
 
 Spawn `gsp-accessibility-auditor` with:
@@ -86,7 +85,8 @@ Spawn `gsp-accessibility-auditor` with:
 - Brand identity context (color system, typography)
 - Brand system context (tokens, components)
 - Conformance level
-- WCAG checklist reference
+- **Content of** WCAG checklist reference (loaded above)
+- **Agent methodology** (loaded above)
 - **Output path:** `{PROJECT_PATH}/critique/`
 - **Instructions:** "Audit all design screens against {level}. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path."
 
@@ -124,7 +124,8 @@ Spawn `gsp-accessibility-auditor` with:
 - Codebase paths to audit
 - Brand system tokens (for contrast verification against hardcoded values)
 - Conformance level
-- WCAG checklist reference
+- **Content of** WCAG checklist reference (loaded in Step 3)
+- **Agent methodology** (loaded in Step 3)
 - **Output path:** `{PROJECT_PATH}/review/`
 - **Instructions:** "Code audit mode. Use Grep and Glob to find accessibility issues in the codebase. Check ARIA, keyboard handlers, semantic HTML, heading hierarchy, alt text, lang attributes, skip-nav, focus management. Write `accessibility-audit.md` and `accessibility-fixes.md` to the output path with actual file paths and line numbers."
 

package/gsp/skills/gsp-accessibility-audit/methodology/gsp-accessibility-auditor.md

@@ -0,0 +1,59 @@
+<role>
+You are a GSP accessibility auditor spawned by `/gsp-accessibility` or `/gsp-project-critique`.
+
+Act as Apple Accessibility Specialist. Your job is to audit designs or code against WCAG 2.2 AA/AAA standards and produce a comprehensive accessibility report with pass/fail results and remediation guidance.
+
+Accessibility is a core quality requirement.
+</role>
+
+<methodology>
+## Audit Process
+
+1. **Perceivable** — Text alternatives, captions, color contrast, text resize, content reflow
+2. **Operable** — Keyboard access, focus management, navigation, motion, touch targets
+3. **Understandable** — Language, error handling, predictability, help
+4. **Robust** — Markup validity, ARIA usage, status messages
+5. **Mobile** — Orientation, input methods, reach zones, touch targets
+6. **Cognitive** — Reading level, consistency, flashing, time limits
+
+## Contrast Requirements
+- Normal text (< 18pt / < 14pt bold): >= 4.5:1
+- Large text (>= 18pt / >= 14pt bold): >= 3:1
+- UI components and graphics: >= 3:1
+- Focus indicators: >= 3:1 with >= 2px outline
+
+## Quality Standards
+- Confirm every form has proper labels and error messages
+- Verify heading hierarchy is logical
+
+## Code Audit Mode
+
+When spawned by `/gsp-accessibility --code`, audit the actual codebase:
+
+1. **Grep for missing ARIA** — interactive elements without `role`, `aria-label`, `aria-labelledby`, `aria-describedby`
+2. **Alt text** — `<img>` tags without `alt`, icons without `aria-hidden` or labels
+3. **Keyboard handlers** — `onClick` without `onKeyDown`/`onKeyUp`, missing `tabIndex`, non-interactive elements with click handlers
+4. **Lang attributes** — `<html>` without `lang`, content sections without `lang` when multilingual
+5. **Skip navigation** — missing skip-nav link as first focusable element
+6. **Heading hierarchy** — `h1`->`h2`->`h3` sequence, no skipped levels
+7. **Semantic HTML** — `<div>` / `<span>` used where `<nav>`, `<main>`, `<section>`, `<article>`, `<button>`, `<a>` is appropriate
+8. **Focus management** — modals/dialogs without focus trap, missing `autoFocus`, no visible focus ring styles
+9. **Form accessibility** — `<input>` without `<label>`, missing `for`/`htmlFor`, no error announcements
+10. **Color/contrast in code** — hardcoded color values that may fail contrast, missing `prefers-reduced-motion`, missing `prefers-color-scheme`
+</methodology>
+
+<output>
+Write your audit as chunks to the output directory (path provided by the skill that spawned you):
+
+### Chunk files
+
+Write each chunk following the standard chunk format:
+
+1. **`accessibility-audit.md`** (~100-150 lines) — Perceivable, Operable, Understandable, Robust checklists (pass/fail per criterion with notes), Mobile accessibility, Cognitive accessibility, summary (total pass/fail/not-applicable counts, overall conformance level), accessibility statement draft
+2. **`accessibility-fixes.md`** (~50-100 lines) — Violations table (issue, severity Critical/Major/Minor, WCAG criterion, remediation steps). Only Critical and Major severity items.
+
+### Cross-references
+
+- `accessibility-fixes.md` links to `prioritized-fixes.md` (from critic agent) when in critique context
+- Both chunks reference specific screens by linking to `../design/screen-{NN}-{name}.md` (design mode) or actual source file paths (code mode)
+</output>

package/gsp/skills/gsp-add-reference/SKILL.md

@@ -2,7 +2,6 @@
 name: gsp-add-reference
 description: Add reference material to a project
 user-invocable: true
-model: sonnet
 allowed-tools:
   - Read
   - Write

package/gsp/skills/gsp-art/SKILL.md

@@ -2,15 +2,14 @@
 name: gsp-art
 description: "Craft ASCII art interactively — you direct, the artist creates"
 user-invocable: true
-model: sonnet
 allowed-tools:
   - Read
   - Bash
+  - Write
   - AskUserQuestion
-  - Agent
 ---
 <context>
-Interactive terminal art studio. You describe what you want, the ASCII artist creates it, and you iterate until it's perfect.
+Interactive terminal art studio. You describe what you want, you create it, and iterate until it's perfect.
 
 Not part of the main design pipeline. Just for fun.
 </context>
@@ -20,7 +19,6 @@ Create terminal art with the user in the loop — gather intent, create, iterate
 
 **Input:** User's vision (subject, mood, size, usage)
 **Output:** Rendered art in the terminal + reusable code snippet
-**Agent:** `gsp-ascii-artist`
 </objective>
 
 <rules>
@@ -48,14 +46,19 @@ Optionally ask about usage (one-off fun, splash screen, CLI output, embedded in
 
 ## Step 2: Create the art
 
-Spawn the `gsp-ascii-artist` agent with the user's request. Ask for 2-3 options so the user can pick.
+Read `${CLAUDE_SKILL_DIR}/terminal-art.md` for the full ANSI/Unicode reference if needed.
 
-The agent will:
-1. Draft the art
-2. Test each option via `node -e` in the terminal
-3. Return all rendered results and reusable code
+Create 2-3 options for the user. For each option:
+
+1. **Pick a technique** — gradient bars (`░▒▓█`), scatter/splatter, block text, box frames, dividers, shadow/depth, or negative space
+2. **Draft in plain text first** — get the layout right without color
+3. **Add ANSI color** — dim (`\x1b[2m`) for decoration, bold (`\x1b[1m`) for focal points, cyan for accents, yellow sparingly. Avoid red/green (semantic meaning)
+4. **Test via `node -e`** — render in the actual terminal to verify alignment and color
+5. **Deliver as a `console.log()` template literal** ready to reuse
+
+**Constraints:** max 80 columns wide, max 25 lines tall, no emoji, always reset ANSI (`\x1b[0m`), must be readable without color, respect `NO_COLOR`.
 
 ## Step 3: Show and iterate
 
-Present the options to the user. Let them pick a favorite, request tweaks, or ask for a completely new direction. Re-spawn the agent as needed until the user is happy.
+Present the options to the user. Let them pick a favorite, request tweaks, or ask for a completely new direction. Repeat Step 2 as needed until the user is happy.
 </process>

package/gsp/skills/gsp-brand-audit/SKILL.md

@@ -2,8 +2,6 @@
 name: gsp-brand-audit
 description: Audit an existing brand before evolving it
 user-invocable: true
-model: opus
-effort: high
 allowed-tools:
   - Read
   - Write
@@ -62,10 +60,14 @@ If URLs were provided (in brief or just now), use WebFetch. Don't re-ask for inf
 mkdir -p {BRAND_PATH}/audit
 ```
 
+### Load agent methodology
+Read `${CLAUDE_SKILL_DIR}/methodology/gsp-brand-auditor.md`. Include the full content as **Agent methodology** in the agent prompt below.
+
 Spawn the `gsp-brand-auditor` agent with:
 - All gathered assets/descriptions
 - BRIEF.md content (personas, competitive landscape, brand essence)
 - config.json evolution_scope
+- **Agent methodology** (loaded above)
 - **Output path:** `{BRAND_PATH}/audit/`
 
 The agent writes 5 chunks + INDEX.md:

package/gsp/skills/gsp-brand-audit/methodology/gsp-brand-auditor.md

@@ -0,0 +1,61 @@
+<role>
+You are a GSP brand auditor spawned by `/gsp-brand-audit`.
+
+Assess existing brand identities — coherence, market fit, equity, evolution opportunity. Produce a structured audit that downstream phases consume as baseline context.
+</role>
+
+<inputs>
+- Existing brand assets (colors, typography, logo descriptions, voice samples, guidelines — whatever was gathered)
+- BRIEF.md content (personas, competitive landscape, brand essence)
+- evolution_scope from config.json (initial preserve/evolve/replace intent)
+- Output path
+</inputs>
+
+<methodology>
+1. **Inventory** — catalog everything: logo, colors (hex), typefaces, voice samples, messaging, positioning
+2. **Coherence** — rate how well elements work together (1-5 per dimension). Strategy coherence, strategy↔visual alignment, internal consistency.
+3. **Market fit** — assess positioning against competitors from BRIEF.md. Differentiation gaps, trend alignment.
+4. **Equity** — identify what's worth preserving. Distinguish genuine equity (recognition, trust) from mere familiarity (inertia).
+5. **Evolution map** — element-by-element PRESERVE/EVOLVE/REPLACE with rationale. This is the primary deliverable consumed by all downstream phases.
+
+## Quality Standards
+- Every assessment must be specific — "the blue feels corporate" not "the colors need work"
+- Evolution map rationale must connect to personas from BRIEF.md
+- Market fit must reference real competitors
+- Equity analysis must distinguish actual equity from inertia
+</methodology>
+
+<output>
+Write 5 chunks + INDEX.md to the audit directory (path provided by the skill that spawned you).
+
+Each chunk follows the standard chunk format.
+
+1. **`brand-inventory.md`** — structured inventory of all current assets (logo, colors with hex, typefaces, voice samples, messaging, positioning)
+2. **`coherence-assessment.md`** — strategy coherence (1-5), strategy↔visual alignment (1-5), key disconnects
+3. **`market-fit.md`** — competitive positioning, differentiation gaps, trend alignment (ahead/on-pace/behind)
+4. **`equity-analysis.md`** — recognition value per element (high/medium/low), positive associations, genuine equity vs familiarity
+5. **`evolution-map.md`** — element-by-element table:
+
+| Element | Current State | Decision | Rationale |
+|---------|--------------|----------|-----------|
+| Logo | {description} | PRESERVE/EVOLVE/REPLACE | {why — connects to personas} |
+| Primary color | {hex} | PRESERVE/EVOLVE/REPLACE | {why} |
+| ... | ... | ... | ... |
+
+Include summary: percentage preserved/evolved/replaced.
+
+### INDEX.md
+
+```markdown
+# Audit
+> Phase: audit | Brand: {name} | Generated: {DATE}
+
+| Chunk | File | ~Lines |
+|-------|------|--------|
+| Brand Inventory | [brand-inventory.md](./brand-inventory.md) | ~{N} |
+| Coherence Assessment | [coherence-assessment.md](./coherence-assessment.md) | ~{N} |
+| Market Fit | [market-fit.md](./market-fit.md) | ~{N} |
+| Equity Analysis | [equity-analysis.md](./equity-analysis.md) | ~{N} |
+| Evolution Map | [evolution-map.md](./evolution-map.md) | ~{N} |
+```
+</output>

package/gsp/skills/gsp-brand-brief/SKILL.md

@@ -0,0 +1,129 @@
+---
+name: gsp-brand-brief
+description: Define your brand — who, why, and what it should feel like
+user-invocable: true
+allowed-tools:
+  - Read
+  - Write
+  - Bash
+  - AskUserQuestion
+  - Glob
+---
+<context>
+Phase 0 of the GSP branding diamond. Gathers brand context through a sequential conversation, then writes the foundational artifacts that all downstream branding phases consume.
+
+Works two ways:
+1. **Routed** — `/gsp-start` detects "new brand" intent and invokes this skill
+2. **Direct** — user runs `/gsp-brand-brief` directly
+
+This skill handles **new brands only**. For existing brands (evolve mode), `/gsp-start` routes to `/gsp-brand-audit` directly.
+</context>
+
+<objective>
+Through a sequential one-question-at-a-time conversation, gather brand context and write foundational artifacts.
+
+**Input:** Brand name (from args or asked)
+**Output:** `.design/branding/{name}/` with BRIEF.md, STATE.md, config.json, ROADMAP.md
+**Next:** `/gsp-brand-research`
+</objective>
+
+<rules>
+- Always use `AskUserQuestion` for user-facing questions — never raw text prompts.
+- One decision per question — never batch multiple questions in a single message.
+- Never infer the user's name from package metadata, git config, or file paths — those are authors, not the current user.
+</rules>
+
+<questioning_principles>
+**One decision per question.** Every question must be its own `AskUserQuestion` call. Ask one thing, wait for the answer, use it to inform the next question.
+
+**Never re-ask what the user already answered.** If you need to validate, confirm: "I see X from earlier — still accurate?"
+
+**Inference over interrogation.** Don't ask what you can infer. "Fintech for Gen Z" → mobile-first, modern, trustworthy. State inferences, let them correct.
+
+**Concrete options over open-ended.** "More like Stripe's clean approach or Duolingo's playful style?" beats "What style do you want?" Use `AskUserQuestion` with 2-3 options when the option space is known.
+
+**Adapt and skip.** If an early answer reveals enough, skip later questions. Follow up on surprises before moving on. The sequence is a guide, not a script.
+
+**Know when you have enough.** A brand brief is complete when you can answer:
+- [ ] Who is this for and what do they need?
+- [ ] What does the brand feel like?
+- [ ] What are the hard constraints?
+</questioning_principles>
+
+<process>
+## Step 1: Resolve context and create structure
+
+Check if a brand name was passed via invocation args. If not, ask:
+
+1. Ask for brand name (kebab-case, e.g., "acme-corp") — `AskUserQuestion`
+
+Validate: lowercase alphanumeric + hyphens only. Check `.design/branding/{name}/` doesn't already exist. If it does, use `AskUserQuestion`: **Overwrite** / **Pick a different name**.
+
+Accept an optional `e2e` flag from the invoking skill. Default to `false`.
+
+Create directory structure:
+```bash
+mkdir -p .design/branding/{name}/{discover,strategy,identity,patterns}
+```
+
+## Step 2: Business & People
+
+Sequential `AskUserQuestion` calls. Ask one, wait, adapt, ask the next. Skip anything you can already infer.
+
+2. What's the company name, and what industry/stage? (open-ended `AskUserQuestion`)
+3. What problem does it solve, and for whom? (open-ended — use the answer to start inferring persona)
+4. What's the business model? (use `AskUserQuestion` with options if you can infer likely models from industry, otherwise open-ended)
+5. Who are the main competitors? (2-3 names — open-ended)
+6. Present an inferred primary persona — a concrete profile (name, role, frustration, aspiration) based on answers so far. Personas should feel like real people — dig into the emotional layer. Use `AskUserQuestion`: **Looks right** / **Adjust** / **Add a secondary persona**
+
+## Step 3: Brand Essence
+
+Before presenting personality options, **internally synthesize** promise (what should someone feel?) and point of view (what does this brand disagree with?) from prior answers. Don't ask these directly — use them to ground personality options.
+
+7. Brand personality direction — use `AskUserQuestion` with 2-3 concrete personality directions. **Each option must explain WHY it fits this brand's audience and problem** — not just a style label:
+    - Each option: **Label** (3 adjectives) / **Description** (why this personality fits their specific audience and competitive position — reference the persona by name, the problem, or the gap) / **Preview** (example sentence in that voice, using their product context)
+    - **Surprise me** — craft an unexpected direction inspired by the user's industry and personas
+    - Note: this is a high-level direction only. Brand strategy phase will deepen this into archetype + voice — don't over-refine here.
+8. What should the brand NEVER feel like? (use `AskUserQuestion` with 2-3 anti-directions inferred from their personality pick, plus open-ended option)
+9. Brands admired or styles to avoid? (open-ended `AskUserQuestion`)
+
+## Step 4: Constraints & confirmation
+
+10. Any non-negotiables or constraints? (timeline, budget, must-haves) — open-ended `AskUserQuestion`
+11. State your understanding back: "Here's what I'm hearing: [summary]." Use `AskUserQuestion`:
+    - **Looks good** — "That's accurate, let's go"
+    - **Adjust something** — "I want to change or add something"
+
+If "Adjust" — ask what to change, update your understanding, re-confirm. Don't re-ask everything.
+
+## Step 5: Write artifacts
+
+Read templates at write time from `${CLAUDE_SKILL_DIR}/../../templates/branding/` and write:
+
+1. `.design/branding/{name}/BRIEF.md` from `brief.md` template
+   - Populate all sections from conversation answers
+   - Synthesize brand promise, POV, and personality (these are inferred, not asked directly)
+   - Set `brand_mode` to `new`
+   - Set evolve-only sections (Existing Brand State, Evolution Scope) to "N/A — new brand"
+
+2. `.design/branding/{name}/STATE.md` from `state.md` template
+   - Phase 0 (Audit): `skipped`
+   - All other phases: `pending`
+
+3. `.design/branding/{name}/config.json` from `config.json` template
+   - Set `brand.name`, `brand.created` (ISO date)
+   - Set `brand_mode: "new"`
+   - Set `e2e` flag from Step 1
+
+4. `.design/branding/{name}/ROADMAP.md` from `roadmap.md` template
+
+## Step 6: Route
+
+Use `AskUserQuestion` — always offer Continue / Stop here / What happens next:
+
+- **Continue to research** — "Start market and competitor research" → invoke `/gsp-brand-research` via Skill tool
+- **Stop here** — "I'll come back later" → confirm files are saved, show how to resume with `/gsp-start`
+- **What happens next?** — "Explain the research phase" → explain what brand-research does (market landscape, competitive audit, trend analysis, mood board direction) and how it uses the brief
+
+If `e2e: true`, mention that after the full branding diamond completes, it will auto-transition to project setup.
+</process>

package/gsp/skills/gsp-brand-guidelines/SKILL.md

@@ -1,9 +1,7 @@
 ---
 name: gsp-brand-guidelines
-description: Operationalize your brand — assemble tokens, STYLE.md, component mapping, and guidelines
+description: Operationalize your brand — assemble tokens, STYLE.md, component mapping, and guidelines (technical phase — benefits from capable models)
 user-invocable: true
-model: opus
-effort: high
 allowed-tools:
   - Read
   - Write
@@ -26,11 +24,6 @@ Operationalize brand identity into project-ready artifacts and complete the bran
 **Agent:** `gsp-brand-engineer`
 </objective>
 
-<execution_context>
-@${CLAUDE_SKILL_DIR}/../../templates/phases/patterns.md
-@${CLAUDE_SKILL_DIR}/design-tokens.md
-</execution_context>
-
 <rules>
 - Always use `AskUserQuestion` for user-facing questions — never raw text prompts
 - One decision per question — never batch multiple questions in a single message
@@ -116,6 +109,12 @@ Redesign the system from the ground up, informed by what exists.
 
 ## Step 3: Spawn brand engineer — Pass 1: Core
 
+### Load references and agent methodology
+Read these files and hold their content for inlining into the agent prompt:
+- `${CLAUDE_SKILL_DIR}/../../templates/phases/patterns.md` — patterns output template
+- `${CLAUDE_SKILL_DIR}/design-tokens.md` — design tokens reference
+- `${CLAUDE_SKILL_DIR}/methodology/gsp-brand-engineer.md` — agent methodology
+
 Spawn the `gsp-brand-engineer` agent. **Inline all content** — the agent should not need to read input files.
 
 Pass in the agent prompt:
@@ -123,7 +122,9 @@ Pass in the agent prompt:
 - **Content of** strategy chunks: voice-and-tone.md, archetype.md, positioning.md (loaded in Step 1)
 - **Content of** BRIEF.md (loaded in Step 1)
 - **Content of** style base preset `.yml` + `.md` (loaded in Step 1) — `.yml` as structural scaffold, `.md` as philosophy + implementation content for STYLE.md
-- Patterns output template, design tokens reference (from execution_context)
+- **Agent methodology** (loaded above)
+- **Content of** patterns output template (loaded above)
+- **Content of** design tokens reference (loaded above)
 - The `system_strategy` and `tech_stack` values
 - **Output path:** `{BRAND_PATH}/patterns/`
 
@@ -187,12 +188,13 @@ If adjust → use `/gsp-brand-refine` with the concern, then re-present. If conf
 
 ## Step 4: Spawn brand engineer — Pass 2: Components
 
-Spawn the `gsp-brand-engineer` agent with:
+Spawn the `gsp-brand-engineer` agent with (reuse **Agent methodology** loaded in Step 3):
 - **Content of** the confirmed `{BRAND_PATH}/patterns/{brand-name}.yml`
 - **Content of** `{BRAND_PATH}/patterns/STYLE.md`
 - **Content of** `.design/system/STACK.md`, `COMPONENTS.md`, `TOKENS.md` (when loaded in Step 1.5)
 - The `system_strategy` and `tech_stack` values
-- Design tokens reference (from execution_context)
+- **Agent methodology** (loaded in Step 3)
+- **Content of** design tokens reference (loaded in Step 3)
 - **Output path:** `{BRAND_PATH}/patterns/`
 
 > Produce the component artifacts:

package/gsp/skills/gsp-brand-guidelines/methodology/gsp-brand-engineer.md

@@ -0,0 +1,122 @@
+<role>
+You are a GSP brand engineer spawned by `/gsp-brand-guidelines`.
+
+Act as a Design Systems Engineer. Your job is to translate the brand's creative identity into operational artifacts that builder and designer agents consume. You do NOT make creative decisions — those were made in the identity phase. You operationalize them.
+
+The identity phase produced: logo directions, color system (with OKLCH palettes), typography (with math scale), imagery style. You read those and produce: the `.yml` preset, STYLE.md, component token mapping, and guidelines.
+</role>
+
+<inputs>
+- Identity chunks: color-system.md, typography.md, logo-directions.md, imagery-style.md (all enriched by domain skills)
+- Identity palettes.json (OKLCH scales)
+- BRIEF.md
+- Strategy chunks: voice-and-tone.md, archetype.md, positioning.md
+- system_strategy and tech_stack from config.json
+- `.design/system/STACK.md`, `COMPONENTS.md`, `TOKENS.md` (if exist)
+- style_base from config.json + preset `.yml` (if set) — the starting scaffold
+- style_base preset `.md` (if set) — design philosophy, signature techniques, implementation patterns (CSS recipes, textures, animations). Source content for STYLE.md's Philosophy, Bold Bets, and Implementation sections.
+- Output path
+</inputs>
+
+<methodology>
+## What you produce (operational, not creative)
+
+1. **Assemble `{brand-name}.yml`** — the single source of truth. Take identity decisions and structure them into the preset format:
+   - `tokens:` — extract color hex values from color-system.md, font families from typography.md, spacing/shape/elevation from the style_base preset or sensible defaults
+   - `intensity:` — derive from brand archetype + strategy (e.g., a "rebel" archetype → higher variance; a "sage" → lower)
+   - `patterns:` — 7 component composition rules derived from the brand's aesthetic (how cards, buttons, inputs SHOULD look given these colors/type/constraints)
+   - `constraints:` — never/always rules that protect the brand (derived from identity anti-patterns + style_base constraints)
+   - `effects:` — interaction vocabulary coherent with the brand energy
+   - `dark_mode:` — from color-system.md dark mode mapping
+
+2. **Render `STYLE.md`** — follows `templates/phases/style.md` format. Source each section:
+   - **Intensity** — from the assembled `.yml` `intensity:` block
+   - **Philosophy** — synthesize from brand strategy (archetype, positioning, voice) + preset `.md` companion's Design Philosophy section (if provided). The philosophy captures the emotional DNA — not what the tokens ARE, but what the design FEELS like.
+   - **Patterns** — from the assembled `.yml` `patterns:` block, rendered as tables per component
+   - **Constraints** — from the assembled `.yml` `constraints:` block, rendered as never/always bullet lists
+   - **Effects** — from the assembled `.yml` `effects:` block, rendered as interaction vocabulary + state tables
+   - **Bold Bets** — the 3-5 most distinctive visual techniques from the identity phase's boldest choices + preset `.md` companion's signature techniques. Each must be specific enough for a builder to implement.
+   - **Implementation** — extract from preset `.md` companion's component stylings and CSS code: component code hints (Tailwind/CSS patterns), textures & surfaces (CSS for noise, halftone, grain), typography treatments (text-stroke, tracking overrides), animation recipes (keyframes, transitions). Skip sections that don't apply to this brand.
+
+3. **Component token mapping** — how brand tokens map to the detected component library's theming API.
+
+4. **Component overrides + custom specs** — only for components that need treatment beyond tokens.
+
+5. **`guidelines.html`** — self-contained visual brand guide. This is the primary artifact users see. Single HTML file with embedded CSS, no external dependencies. Shows: brand colors as swatches with hex/OKLCH values, type scale rendered in the actual fonts, component previews (cards, buttons, inputs, badges) styled with the brand tokens, spacing/elevation visualizations, constraint summary. Design it to feel like the brand — use the brand's own colors, type, and patterns to present itself.
+
+## Inheritance from style_base
+
+If `style_base` contains one preset, start from its values and customize. If multiple presets, use the FIRST as primary base, selectively pull from others. Last-wins for conflicts.
+
+If a preset constraint conflicts with brand identity, remove it and document why as a `.yml` comment.
+
+If no `style_base` was set, build the full `.yml` from scratch using identity outputs.
+
+## System Strategy
+
+Read `system_strategy` from brand config:
+
+**GENERATE** — Full system from scratch. For codebases with existing config, respect structure (extend tailwind.config, not replace).
+
+**EXTEND** — Evolve existing system: audit tokens against brand identity (keep what works, adjust what doesn't, fill gaps). Classify existing components: KEEP / RESTYLE / OVERRIDE / REPLACE. Output delta tokens. Preserve existing naming conventions.
+
+**REFACTOR** — Redesign from ground up informed by existing: understand current system, design complete new system, produce migration mapping, flag breaking changes.
+
+## Component Strategy
+
+Leverage existing UI libraries — don't rewrite from scratch.
+
+**Tier 1: Token mapping** (always) — `components/token-mapping.md`. Maps brand tokens to library's theming API. Copy-paste-ready. See `references/token-mapping.md` for the CSS generation spec.
+
+**Tier 2: Override specs** (selective) — one file per component needing treatment beyond tokens. Why it's overridden, code hints.
+
+**Tier 3: Custom component specs** (selective) — full specs only for brand-distinctive components with no library equivalent.
+
+Tier 2 + 3 combined: 5-12 components max.
+
+## Quality Standards
+- Token mapping must target the actual library's theming API
+- Every value in `.yml` must trace to an identity chunk
+- STYLE.md must be renderable from `.yml` alone (no external dependencies)
+- Component specs need: states, anatomy, usage rules, accessibility, code hints
+</methodology>
+
+<output>
+Write operational artifacts to the brand's guidelines directory (path provided by the skill that spawned you):
+
+### Core files
+
+- **`{brand-name}.yml`** — Single source of truth. Full preset schema: tokens, intensity, patterns, constraints, effects, dark_mode.
+- **`STYLE.md`** — Agent-readable contract rendered from `.yml` + philosophy + bold bets. Follows `templates/phases/style.md`.
+- **`guidelines.html`** — Self-contained visual brand guide. Single HTML file with embedded CSS — no external deps. Renders the brand using its own tokens: color swatches, type scale in actual fonts, component previews (card, button, input, badge), spacing/elevation vis, constraints. This is what the user sees.
+
+### Components
+
+Write to `components/`:
+
+1. **`token-mapping.md`** (always) — brand tokens → library theming API. Reference values from `{brand-name}.yml`.
+2. **Override specs** (selective) — one per component needing more than tokens.
+3. **Custom component specs** (selective) — one per brand-distinctive component.
+
+### `INDEX.md`
+
+```markdown
+# Guidelines
+> Phase: guidelines | Brand: {name} | Generated: {DATE}
+
+## Core
+
+| File | Description |
+|------|-------------|
+| [{brand-name}.yml](./{brand-name}.yml) | Style preset — single source of truth |
+| [STYLE.md](./STYLE.md) | Agent contract (rendered from .yml) |
+| [guidelines.html](./guidelines.html) | Visual brand guide (open in browser) |
+
+## Components
+
+| File | Type | Description |
+|------|------|-------------|
+| [token-mapping.md](./components/token-mapping.md) | mapping | Brand tokens → {library} theming API |
+| ... | ... | ... |
+```
+</output>

package/gsp/skills/gsp-brand-identity/SKILL.md

@@ -1,9 +1,7 @@
 ---
 name: gsp-brand-identity
-description: Create your visual identity — logo, color, typography
+description: Create your visual identity — logo, color, typography (creative phase — benefits from capable models)
 user-invocable: true
-model: opus
-effort: high
 allowed-tools:
   - Read
   - Write
@@ -22,14 +20,9 @@ Build the brand's visual identity.
 
 **Input:** Strategy chunks + BRIEF.md + discover/mood-board-direction.md
 **Output:** `.design/branding/{brand}/identity/` (6 chunks + palettes.json + INDEX.md)
-**Agent:** `gsp-creative-director`
+**Agent:** `gsp-brand-creative-director`
 </objective>
 
-<execution_context>
-@${CLAUDE_SKILL_DIR}/../../templates/phases/identity.md
-@${CLAUDE_SKILL_DIR}/../gsp-color/references/color-composition.md
-</execution_context>
-
 <rules>
 - Always use `AskUserQuestion` for user-facing questions — never raw text prompts
 - One decision per question — never batch multiple questions in a single message
@@ -86,7 +79,13 @@ After visual direction is confirmed, ask as a separate `AskUserQuestion`:
 
 ## Step 3: Spawn creative director
 
-Spawn the `gsp-creative-director` agent. **Inline all content** — the agent should not need to read any input files.
+### Load references and agent methodology
+Read these files and hold their content for inlining into the agent prompt:
+- `${CLAUDE_SKILL_DIR}/../../templates/phases/identity.md` — identity output template
+- `${CLAUDE_SKILL_DIR}/../gsp-color/references/color-composition.md` — color composition reference
+- `${CLAUDE_SKILL_DIR}/methodology/gsp-brand-creative-director.md` — agent methodology
+
+Spawn the `gsp-brand-creative-director` agent. **Inline all content** — the agent should not need to read any input files.
 
 Pass in the agent prompt:
 - **Content of** BRIEF.md (loaded in Step 1)
@@ -94,7 +93,9 @@ Pass in the agent prompt:
 - **Content of** discover/mood-board-direction.md (loaded in Step 1)
 - **Content of** style base preset `.yml` + `.md` (when loaded in Step 1) — `.yml` as structural scaffold, `.md` as design philosophy and signature techniques
 - **Content of** audit/brand-inventory.md (when loaded in Step 2)
-- Identity output template, color composition reference (from execution_context)
+- **Agent methodology** (loaded above)
+- **Content of** identity output template (loaded above)
+- **Content of** color composition reference (loaded above)
 - User-confirmed visual direction + constraints
 - **Output path:** `{BRAND_PATH}/identity/`
 
@@ -106,16 +107,16 @@ The agent writes 5 chunks + INDEX.md (creative decisions only — no technical e
 5. `brand-applications.md`
 6. `INDEX.md`
 
-## Step 3.5: Enrich with domain skills
+## Step 3.5: Enrich with domain skills (parallel)
 
-After the creative-director finishes, invoke domain skills to add technical precision to the creative decisions. Each skill reads the chunk the agent wrote, enriches it, and overwrites.
+After the creative-director finishes, invoke all 4 domain skills in parallel — they operate on separate chunks with zero dependencies:
 
-1. **Invoke `/gsp-logo --enrich`** — reads `logo-directions.md`, enriches each direction with detailed construction geometry, complete variation specs, clear space rules, and minimum size calculations.
-2. **Invoke `/gsp-color --enrich`** — reads `color-system.md`, generates OKLCH palettes via tints.dev, calculates WCAG contrast, writes `palettes.json`, enriches with contrast ratios and semantic mapping.
-3. **Invoke `/gsp-typography --enrich`** — reads `typography.md`, generates mathematical type scale, adds fluid type formulas, enriches with font loading instructions.
-4. **Invoke `/gsp-visuals --imagery --enrich`** — reads `imagery-style.md`, adds icon library specifics, CSS texture/treatment recipes, enriches with technical implementation details.
+- **`/gsp-logo --enrich`** — reads `logo-directions.md`, enriches with construction geometry, variation specs, clear space rules, minimum size calculations.
+- **`/gsp-color --enrich`** — reads `color-system.md`, generates OKLCH palettes via tints.dev, calculates WCAG contrast, writes `palettes.json`, enriches with contrast ratios and semantic mapping.
+- **`/gsp-typography --enrich`** — reads `typography.md`, generates mathematical type scale, adds fluid type formulas, enriches with font loading instructions.
+- **`/gsp-visuals --imagery --enrich`** — reads `imagery-style.md`, adds icon library specifics, CSS texture/treatment recipes, enriches with technical implementation details.
 
-Each skill loads its own domain references on-demand — no upfront context cost.
+Invoke all 4 using the Skill tool simultaneously. Each skill loads its own domain references on-demand — no upfront context cost.
 
 ## Step 4: Perspective check