Draw the menu item without Tailwind

<x-menu-item> renders data-md-menu-item, data-md-description and its
aria-* state, with data-md-keep-open renamed from data-keep-open;
menu-item.css draws SegmentedMenuTokens' 48px row, 16px sides, 12px
gaps, 4/12px corners, the selected/current colours and the shared
--md-menu-item-ink icon-class outranks except when disabled
(ACT-11/19/27/28); a submenu's popover shares its container colour
with the menu it opens from and menu.js follows the rename (plan
step 36, actions).

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

tests/Feature/Components/AppBarTest.php

@@ -76,7 +76,7 @@ it('keeps two trailing icon buttons below medium and four from it, the rest in a
         ->and(preg_match_all('/role="menu"\s+data-menu\s+aria-label="More options"/', $html))->toBe(2)
         // Below medium: all but the first.
         ->and($compact)
-        ->toMatch('/<a role="menuitem" tabindex="-1" href="\/shares\/1\/share"/')
+        ->toMatch('/<a data-md-menu-item[^>]*role="menuitem" tabindex="-1" href="\/shares\/1\/share"/')
         ->toMatch('/role="menuitemcheckbox" aria-checked="true"[^>]*wire:click="star"/')
         ->toMatch('/role="menuitem"[^>]*wire:click="archive"/')
         ->toMatch('/role="menuitem" aria-disabled="true"/')