Merge 1d49e045db into e0318d9da8

* docs: apply style guide to TEA Lite quickstart

- Remove duplicate H1 header (frontmatter provides title)
- Remove horizontal rules throughout
- Convert Prerequisites to admonition
- Add Quick Path TL;DR admonition
- Convert Key Takeaway to tip admonition
- Convert TEA Workflows list to Quick Reference table
- Convert Troubleshooting to Common Questions FAQ format
- Rename Need Help to Getting Help section
- Remove redundant Feedback section

Also adds missing @clack/prompts dependency from upstream merge.

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* docs: spell out acronyms in TEA Lite quickstart

- MCP → Model Context Protocol
- E2E → End-to-end (also fix missing article)
- CI/CD → Continuous integration/continuous deployment
- ATDD → Acceptance Test-Driven Development
- TDD → Test-Driven Development
- NFR → non-functional requirements
- Remove inaccurate CRUD reference

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* docs: spell out TDD in ATDD link text

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: update branding with new wordmark logo and banner

- Add banner image to README header
- Replace website logo with wordmark, hiding title text
- Left-align logo with sidebar by reducing header padding

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* docs: update README banner to new design with waveform

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: add banner to docs website welcome page

- Revert README to original banner
- Add waveform banner to docs site welcome page

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: use waveform banner as website header logo

- Remove banner from welcome page content
- Update header logo to use banner-bmad-method2.png

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: add separate logo for dark mode

Use banner-bmad-method-dark.png in dark mode for better blending

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: update header logos for light and dark modes

- Light mode: bmad-light.png (dark blue background with lightning)
- Dark mode: bmad-dark.png (light background variant)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* chore: clean up unused banner images and add readme2

- Remove unused banner-bmad-method2.png and bmad-wordmark.png
- Add readme2.md with upcoming features section
- Update banner-bmad-method-dark.png

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* chore: remove unused banner image variants

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

* feat: finalize header logo graphics

- Rename bmad-light2.png to bmad-light.png as final version
- Remove readme2.md draft

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
Co-authored-by: Brian <bmadcode@gmail.com>

.github/workflows/bundle-latest.yaml

@@ -10,6 +10,7 @@ permissions:
 
 jobs:
   bundle-and-publish:
+    if: ${{ false }} # Temporarily disabled while web bundles are paused.
     runs-on: ubuntu-latest
     steps:
       - name: Checkout BMAD-METHOD

.gitignore

@@ -48,6 +48,7 @@ CLAUDE.local.md
 
 # Bundler temporary files and generated bundles
 .bundler-temp/
+web-bundles/
 
 # Generated web bundles (built by CI, not committed)
 src/modules/bmm/sub-modules/
@@ -60,6 +61,7 @@ _bmad-output
 .claude
 .codex
 .github/chatmodes
+.github/agents
 .agent
 .agentvibes/
 .kiro/

README.md

@@ -1,4 +1,4 @@
-# BMad Method
+![BMad Method](banner-bmad-method.png)
 
 [![Version](https://img.shields.io/npm/v/bmad-method?color=blue&label=version)](https://www.npmjs.com/package/bmad-method)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)

docs/tutorials/getting-started/tea-lite-quickstart.md

@@ -1,11 +1,9 @@
 ---
-title: "Getting Started with TEA (Test Architect) - TEA Lite"
+title: "Getting Started with Test Architect"
-description: Learn TEA fundamentals by generating and running tests for an existing demo app in 30 minutes
+description: Learn Test Architect fundamentals by generating and running tests for an existing demo app in 30 minutes
 ---
 
-# Getting Started with TEA (Test Architect) - TEA Lite
+Welcome! **Test Architect (TEA) Lite** is the simplest way to get started with TEA - just use `*automate` to generate tests for existing features. Perfect for beginners who want to learn TEA fundamentals quickly.
-
-Welcome! **TEA Lite** is the simplest way to get started with TEA - just use `*automate` to generate tests for existing features. Perfect for beginners who want to learn TEA fundamentals quickly.
 
 ## What You'll Build
 
@@ -14,11 +12,15 @@ By the end of this 30-minute tutorial, you'll have:
 - Your first risk-based test plan
 - Passing tests for an existing demo app feature
 
-## Prerequisites
+:::note[Prerequisites]
-
+- Node.js installed (v20 or later)
-- Node.js installed (v18 or later)
 - 30 minutes of focused time
-- We'll use TodoMVC (<https://todomvc.com/examples/react/dist/>) as our demo app
+- We'll use TodoMVC (<https://todomvc.com/examples/react/>) as our demo app
+:::
+
+:::tip[Quick Path]
+Load TEA (`*tea`) → scaffold framework (`*framework`) → create test plan (`*test-design`) → generate tests (`*automate`) → run with `npx playwright test`.
+:::
 
 ## TEA Approaches Explained
 
@@ -30,8 +32,6 @@ Before we start, understand the three ways to use TEA:
 
 This tutorial focuses on **TEA Lite** - the fastest way to see TEA in action.
 
----
-
 ## Step 0: Setup (2 minutes)
 
 We'll test TodoMVC, a standard demo app used across testing documentation.
@@ -45,8 +45,6 @@ No installation needed - TodoMVC runs in your browser. Open the link above and:
 
 You've just explored the features we'll test!
 
----
-
 ## Step 1: Install BMad and Scaffold Framework (10 minutes)
 
 ### Install BMad Method
@@ -60,7 +58,7 @@ When prompted:
 - **Planning artifacts folder:** Keep default
 - **Implementation artifacts folder:** Keep default
 - **Project knowledge folder:** Keep default
-- **Enable TEA Playwright MCP enhancements?** Choose "No" for now (we'll explore this later)
+- **Enable TEA Playwright Model Context Protocol (MCP) enhancements?** Choose "No" for now (we'll explore this later)
 - **Using playwright-utils?** Choose "No" for now (we'll explore this later)
 
 BMad is now installed! You'll see a `_bmad/` folder in your project.
@@ -92,9 +90,9 @@ A: "We're testing a React web application (TodoMVC)"
 A: "Playwright"
 
 **Q: Testing scope?**
-A: "E2E testing for web application"
+A: "End-to-end (E2E) testing for a web application"
 
-**Q: CI/CD platform?**
+**Q: Continuous integration/continuous deployment (CI/CD) platform?**
 A: "GitHub Actions" (or your preference)
 
 TEA will generate:
@@ -113,8 +111,6 @@ npx playwright install
 
 You now have a production-ready test framework!
 
----
-
 ## Step 2: Your First Test Design (5 minutes)
 
 Test design is where TEA shines - risk-based planning before writing tests.
@@ -131,7 +127,7 @@ In your chat with TEA, run:
 A: "Epic-level - I want to test TodoMVC's basic functionality"
 
 **Q: What feature are you testing?**
-A: "TodoMVC's core CRUD operations - creating, completing, and deleting todos"
+A: "TodoMVC's core operations - creating, completing, and deleting todos"
 
 **Q: Any specific risks or concerns?**
 A: "We want to ensure the filter buttons (All, Active, Completed) work correctly"
@@ -156,8 +152,6 @@ TEA will analyze and create `test-design-epic-1.md` with:
 
 **Review the test design file** - notice how TEA provides a systematic approach to what needs testing and why.
 
----
-
 ## Step 3: Generate Tests for Existing Features (5 minutes)
 
 Now the magic happens - TEA generates tests based on your test design.
@@ -288,8 +282,6 @@ test('should mark todo as complete', async ({ page, apiRequest }) => {
 
 See [Integrate Playwright Utils](/docs/how-to/customization/integrate-playwright-utils.md) to enable this.
 
----
-
 ## Step 4: Run and Validate (5 minutes)
 
 Time to see your tests in action!
@@ -334,16 +326,18 @@ You used **TEA Lite** to:
 
 All in 30 minutes!
 
----
-
 ## What You Learned
 
 Congratulations! You've completed the TEA Lite tutorial. You learned:
 
-### TEA Workflows
+### Quick Reference
-- `*framework` - Scaffold test infrastructure
+
-- `*test-design` - Risk-based test planning
+| Command        | Purpose                              |
-- `*automate` - Generate tests for existing features
+| -------------- | ------------------------------------ |
+| `*tea`         | Load the TEA agent                   |
+| `*framework`   | Scaffold test infrastructure         |
+| `*test-design` | Risk-based test planning             |
+| `*automate`    | Generate tests for existing features |
 
 ### TEA Principles
 - **Risk-based testing** - Depth scales with impact (P0 vs P3)
@@ -351,15 +345,9 @@ Congratulations! You've completed the TEA Lite tutorial. You learned:
 - **Network-first patterns** - Tests wait for actual responses (no hard waits)
 - **Production-ready from day one** - Not toy examples
 
-### Key Takeaway
+:::tip[Key Takeaway]
-
+TEA Lite (just `*automate`) is perfect for beginners learning TEA fundamentals, testing existing applications, quick test coverage expansion, and teams wanting fast results.
-TEA Lite (just `*automate`) is perfect for:
+:::
-- Beginners learning TEA fundamentals
-- Testing existing applications
-- Quick test coverage expansion
-- Teams wanting fast results
-
----
 
 ## Understanding ATDD vs Automate
 
@@ -370,14 +358,12 @@ This tutorial used `*automate` to generate tests for **existing features** (test
 - Want to add test coverage
 - Tests should pass on first run
 
-**When to use `*atdd`:**
+**When to use `*atdd` (Acceptance Test-Driven Development):**
-- Feature doesn't exist yet (TDD workflow)
+- Feature doesn't exist yet (Test-Driven Development workflow)
 - Want failing tests BEFORE implementation
 - Following red → green → refactor cycle
 
-See [How to Run ATDD](/docs/how-to/workflows/run-atdd.md) for the TDD approach.
+See [How to Run ATDD](/docs/how-to/workflows/run-atdd.md) for the test-drive development (TDD) approach.
-
----
 
 ## Next Steps
 
@@ -411,21 +397,22 @@ See [TEA Overview](/docs/explanation/features/tea-overview.md) for engagement mo
 ### Go Full TEA Integrated
 
 Want the complete quality operating model? Try TEA Integrated with BMad Method:
-- Phase 2: Planning with NFR assessment
+- Phase 2: Planning with non-functional requirements (NFR) assessment
 - Phase 3: Architecture testability review
 - Phase 4: Per-epic test design → ATDD → automate
 - Release Gate: Coverage traceability and gate decisions
 
 See [BMad Method Documentation](/) for the full workflow.
 
----
+## Common Questions
 
-## Troubleshooting
+- [Why can't my tests find elements?](#why-cant-my-tests-find-elements)
+- [How do I fix network timeouts?](#how-do-i-fix-network-timeouts)
 
-### Tests Failing?
+### Why can't my tests find elements?
+
+TodoMVC doesn't use test IDs or accessible roles consistently. The selectors in this tutorial use CSS classes that match TodoMVC's actual structure:
 
-**Problem:** Tests can't find elements
-**Solution:** TodoMVC doesn't use test IDs or accessible roles consistently. The selectors in this tutorial use CSS classes that match TodoMVC's actual structure:
 ```typescript
 // TodoMVC uses these CSS classes:
 page.locator('.new-todo')      // Input field
@@ -438,26 +425,20 @@ page.getByRole('listitem')
 page.getByRole('checkbox')
 ```
 
-**Note:** In production code, use accessible selectors (`getByRole`, `getByLabel`, `getByText`) for better resilience. TodoMVC is used here for learning, not as a selector best practice example.
+In production code, use accessible selectors (`getByRole`, `getByLabel`, `getByText`) for better resilience. TodoMVC is used here for learning, not as a selector best practice example.
+
+### How do I fix network timeouts?
+
+Increase timeout in `playwright.config.ts`:
 
-**Problem:** Network timeout
-**Solution:** Increase timeout in `playwright.config.ts`:
 ```typescript
 use: {
   timeout: 30000, // 30 seconds
 }
 ```
 
-### Need Help?
+## Getting Help
 
 - **Documentation:** <https://docs.bmad-method.org>
 - **GitHub Issues:** <https://github.com/bmad-code-org/bmad-method/issues>
 - **Discord:** Join the BMAD community
-
----
-
-## Feedback
-
-Found this tutorial helpful? Have suggestions? Open an issue on GitHub!
-
-Generated with [BMad Method](https://bmad-method.org) - TEA (Test Architect)

website/astro.config.mjs

@@ -38,8 +38,10 @@ export default defineConfig({
       tagline: 'AI-driven agile development with specialized agents and workflows that scale from bug fixes to enterprise platforms.',
 
       logo: {
-        src: './public/img/logo.svg',
+        light: './public/img/bmad-light.png',
-        alt: 'BMAD Logo',
+        dark: './public/img/bmad-dark.png',
+        alt: 'BMAD Method',
+        replacesTitle: true,
       },
       favicon: '/favicon.ico',
 

website/src/styles/custom.css

@@ -222,6 +222,8 @@ header.header .header.sl-flex {
 
 .site-title {
   font-weight: 700;
+  margin-left: 0;
+  padding-left: 0;
 }
 
 /* Logo sizing - constrain to reasonable size */
@@ -470,14 +472,14 @@ footer {
 /* Responsive padding on navbar row only - banner stays full-width */
 @media (min-width: 50rem) {
   header.header .header.sl-flex {
-    padding-left: 2.5rem;
+    padding-left: 1rem;
     padding-right: 2.5rem;
   }
 }
 
 @media (min-width: 72rem) {
   header.header .header.sl-flex {
-    padding-left: 3rem;
+    padding-left: 1rem;
     padding-right: 3rem;
   }
 }