docs: rewrite "How it works" with detailed architecture and data flow

[Copilot]

The existing "How it works" section was a vague 4-line paragraph that didn't explain the actual architecture or data flow. It also contained a typo (__REACT_GLOBAL_DEVTOOLS_HOOK__ → __REACT_DEVTOOLS_GLOBAL_HOOK__).

Replaced with:

• Architecture diagram — ASCII visual showing the three-layer communication: MCP Client ↔ Vite Dev Server (SSE/HTTP) ↔ Browser (HMR WebSocket)
• Step-by-step walkthrough covering:
  • Babel AST pass collecting user-defined component names at transform time
  • Browser-side injection: bippy's __REACT_DEVTOOLS_GLOBAL_HOOK__, fiber root tracking, window.__VITE_REACT_MCP_TOOLS__ registry, and HMR listeners
  • MCP server SSE transport (/sse + /messages endpoints) with Zod-derived JSON Schema tool advertisements
  • Full tool call lifecycle: JSON-RPC request → schema validation → HMR custom event → browser execution against live fiber tree → HMR response → SSE stream back
  • Custom tools following the same WebSocket round-trip via dynamic import() registration