Add cards, lists, dialogs, sheets and the rest of M3's containment

<x-card> (filled, elevated, outlined), <x-list> and <x-list-item>
(plain or M3 Expressive's segmented list), <x-divider>, <x-collapse> on
<details>, <x-modal> on the native <dialog>, <x-drawer> as a side sheet or
list-detail pane, and <x-bottom-sheet> with drag to dismiss. Dialogs and
sheets bind to a Livewire flag or id and write back false or null on close,
or use the surrounding Alpine scope. Rows open from anywhere on them through
data-list-row and data-list-open. DesignGuard now also reports Blade
directives written inside a component tag, where they do not compile.

Browser test helpers wait for a complete document with Alpine and Livewire
running: in Firefox, networkidle alone could return before a repeated visit
had loaded.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01V9NnLxnPp8vaaurb3Z1MFy

docs/plans/livewire-material.md

@@ -391,6 +391,32 @@ tokens, `training-row`, `map-shell`, `map-chip`, `product-shot`, `star-rating`,
     `tooltip`, `alert` (tinted container, icon, actions slot), `stat` (figure with
     `x-figure`), `empty-state`.
 
+**Phase 4 is done (2026-09-13).** What changed from the steps above:
+
+- **`<x-progress>` was built by a separate agent** from Compose's `ProgressIndicator.kt` and
+  `WavyProgressIndicator.kt`: server-rendered SVG first frame, then an Alpine component that ports
+  the drawing and keyframes and animates only while something moves and it is on screen; the SVG
+  is `wire:ignore` and a MutationObserver on the root's `data-value` turns a morph or a `bind`
+  expression into motion. Flat circular indeterminate has no track, as in Compose.
+- **`<x-toast>` listens from the moment `snackbar.js` loads**, not on its Alpine component, and holds
+  toasts until the host registers — a toast dispatched before Alpine starts is shown, not lost.
+  `@persist` keeps the host across `wire:navigate`.
+- **`<x-badge>` is M3's dot and count** (`floating` pins it to an icon) **plus a status label**
+  (`tonal`, `outline`), which M3 lacks and every app needs. `<x-alert>`, `<x-stat>` and
+  `<x-empty-state>` are built from M3's parts; `<x-rich-tooltip>` is transient or `persistent`.
+- **A commit went out broken and was fixed forward:** `648ad8e` staged `material.js` and the
+  showcase index while they held the progress agent's temporary lines, without its files.
+  **With agents in the same tree, stage by explicit path and read the diff of shared files first.**
+- **Browser test lessons (all three engines, locally):**
+  - `waitForEvent('networkidle')` can return before a repeated visit has loaded in Firefox (an
+    empty document, then a page still streaming in). Every helper now also asserts
+    `document.readyState === 'complete'` and that Alpine and Livewire exist; assertions retry.
+  - Firefox runs Playwright's evaluate in a sandbox: an event built there has a `detail` the page
+    cannot read, and assignments to Alpine's reactive proxies do not trigger. Go through the page's
+    realm with `window.eval("…")` (or `Livewire.dispatch`).
+  - Pest retries a failing `assertScript`; a script that changes state must not be written so
+    that a retry starts from the changed state.
+
 ### Phase 5 — Containment
 
 24. `card` (elevated, filled, outlined; `title`, `subtitle`, `actions` slot; clickable row