Collapse an extended FAB to a FAB while the page scrolls

Plan step 22, actions.md § Missing (FAB to extended FAB scroll collapse):
M3 has an extended FAB collapse to a FAB on scroll-down and re-extend on
scroll-up, and `<x-button fab>` only swapped on window width.

`<x-fab collapse-on-scroll>` (extended, with an icon) takes a
`materialFab` flag from the new resources/js/fab.js, which reads the
window's scroll once a frame, ignores moves under 8px and extends again
near the top. The morph is CSS in actions.css: the label sits in a grid
track that closes to zero, the gap and minimum width follow on the
default spatial spring, and the label fades on the effects one; reduced
motion swaps outright through the motion tokens. The label is clipped, not
removed, so the collapsed FAB keeps its accessible name.

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

resources/views/showcase/sections/buttons.blade.php

@@ -155,6 +155,11 @@
             <x-fab icon="add" label="New share" />
             <x-fab icon="upload" label="Upload" size="md" variant="filled" />
             BLADE,
+        'An extended FAB that collapses on scroll (scroll the page)' => <<<'BLADE'
+            <x-fab icon="edit" label="Compose" collapse-on-scroll />
+            <x-fab icon="upload" label="Upload" size="md" color="secondary" collapse-on-scroll />
+            <x-fab icon="add" label="New share" size="lg" color="tertiary" collapse-on-scroll />
+            BLADE,
         'FAB menu' => <<<'BLADE'
             <div class="flex h-72 w-full items-end justify-end">
                 <x-fab-menu label="New">