Show both symbol cuts in the showcase icon search

The search draws its 4,135 symbols as CSS masks through the symbol route, so
the route learned `?optical=20` — the 24 cut otherwise, as on <x-icon> — and
the section got a checkbox that switches the cut and draws the grid at 20px,
where the difference in stroke weight is the point.

Plan step 10; finding C16.

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9

src/Http/Controllers/ShowcaseSymbolController.php

@@ -3,6 +3,7 @@
 namespace NoNameWeb\LivewireMaterial\Http\Controllers;
 
 use Illuminate\Http\JsonResponse;
+use Illuminate\Http\Request;
 use Illuminate\Http\Response;
 use Illuminate\View\ComponentAttributeBag;
 use InvalidArgumentException;
@@ -20,12 +21,16 @@ class ShowcaseSymbolController
         return response()->json(SvgFile::symbolNames())->setMaxAge(86400)->setPublic();
     }
 
-    public function show(string $style, string $name): Response
+    /**
+     * The standard 24 cut, or the 20 one with `?optical=20`; any other value is the 24 cut,
+     * as it is on `<x-icon>`.
+     */
+    public function show(Request $request, string $style, string $name): Response
     {
         abort_unless(in_array($style, ['outlined', 'filled'], true), 404);
 
         try {
-            $svg = SvgFile::symbol($name, $style === 'filled', new ComponentAttributeBag);
+            $svg = SvgFile::symbol($name, $style === 'filled', new ComponentAttributeBag, $request->integer('optical', 24));
         } catch (InvalidArgumentException) {
             abort(404);
         }