Add the feed canonical layout

Plan step 35: <x-feed min-item gap>, following the reference's feed rules
- one column below medium, then as many equal columns of at least the
minimum item width as the feed has room for, 24px apart from medium,
items in their source order.

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

resources/boost/skills/livewire-material-development/SKILL.md

@@ -850,6 +850,22 @@ M3's supporting-pane canonical layout, for content that only means something bes
 - Below `expanded`: `compact="below"` (default) stacks it under the focus pane; `compact="sheet"` docks it to the bottom of the window as a bottom sheet (surface-container-low, extra-large top corners), shown as its drag handle and `label` until the handle — a button with `aria-expanded` — opens it; open, it scrolls within half the window, and Escape inside it closes it and returns focus to the handle. It clears the navigation bar and the bottom safe area and never covers the end of the focus pane.
 - `label` names the supporting `<aside>` and the sheet's handle.
 
+#### `<x-feed>`
+
+M3's feed canonical layout: cards or items to browse, in columns that multiply as the room grows.
+
+```blade
+<x-feed min-item="280px">
+    @foreach ($posts as $post)
+        <x-card wire:key="post-{{ $post->id }}" :title="$post->title">…</x-card>
+    @endforeach
+</x-feed>
+```
+
+- One column below `medium` (M3: one card per row, full width). From `medium`, as many equal columns of at least `min-item` as fit (`240px` default; `280px`, `18rem`, `20ch`, or a number of px) — more on a wider window. It follows the feed's own width, so a feed in a narrow pane stays sensible.
+- The gap is M3's spacer, 16px below `medium` and 24px from it, unless `gap` names a spacing token.
+- Items keep their order, which M3 makes the reading order. A card that should span two columns says so in its own `style`.
+
 #### `<x-surface>`
 
 A tonal region: `<x-surface level="surface-container-low" padding="space300" corner="lg" outlined>…</x-surface>`.