Cut the badge's example glyph at 20 too

A 12px icon beside a status label came from the 24px cut in every place the
library shows one off. Plan step 18, the optical-size pass behind actions.md.

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

resources/views/components/badge.blade.php

@@ -24,7 +24,7 @@
        caller's classes paint it: `<x-badge value="Run" tonal color="plain" class="bg-tertiary-container text-on-tertiary-container" />`.
 
      The value is `value`, or the slot, which renders as HTML — an icon beside the word:
-     `<x-badge tonal><x-icon name="bolt" class="size-3" /> Pro</x-badge>`. With neither it is a dot.
+     `<x-badge tonal><x-icon name="bolt" optical="20" class="size-3" /> Pro</x-badge>`. With neither it is a dot.
 
      A count or dot says nothing to a screen reader on its own: give the icon's control a label
      that includes it ("Notifications, 4 new"), or pass `label` here. --}}

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

@@ -12,7 +12,7 @@
             <x-badge value="Draft" color="neutral" tonal />
             <x-badge value="Archived" color="neutral" outline />
             <span class="relative inline-flex"><x-icon name="chat" /><x-badge value="2" color="neutral" floating /></span>
-            <x-badge tonal color="tertiary"><x-icon name="bolt" filled class="size-3" /> Pro</x-badge>
+            <x-badge tonal color="tertiary"><x-icon name="bolt" filled optical="20" class="size-3" /> Pro</x-badge>
             <x-badge value="Beta" tonal color="plain" class="bg-primary-fixed text-on-primary-fixed" />
             BLADE,
         'Snackbars' => <<<'BLADE'