Draw the FAB menu's trigger and items from the interaction classes

Plan step 36 ("Interaction is the shared classes", the user, 2026-09-14).
The trigger button (fab-menu.css) and each item (fab-menu-item.css)
hand-rolled md-state-layer and md-focus-ring; both now render the classes
and keep only their own colour, shape and motion. Neither needs
md-touch-target: the trigger and every item draw at 56px.

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

resources/views/components/fab-menu-item.blade.php

@@ -32,7 +32,7 @@
         'target' => $isLink && $external ? '_blank' : null,
         'rel' => $isLink && $external ? 'noopener' : null,
         'wire:navigate' => $isLink && ! $external && ! $attributes->has('wire:navigate') ? true : null,
-    ], fn ($value): bool => $value !== null));
+    ], fn ($value): bool => $value !== null))->class(['md-state-layer', 'md-focus-ring']);
 @endphp
 
 <{{ $tag }} {{ $attributes }}>

resources/views/components/fab-menu.blade.php

@@ -53,7 +53,7 @@
         x-on:keydown.down.prevent="open('first')"
         x-on:keydown.up.prevent="open('last')"
     >
-        <button type="button" aria-label="{{ $label }}" data-md-fab-menu-trigger data-md-color="{{ $color }}">
+        <button type="button" class="md-state-layer md-focus-ring" aria-label="{{ $label }}" data-md-fab-menu-trigger data-md-color="{{ $color }}">
             <x-livewire-material::icon :name="$icon" filled data-md-fab-menu-icon />
             <x-livewire-material::icon name="close" filled size="20" data-md-fab-menu-close-icon />
         </button>