Draw the search bar and its view as the contained style

Expressive deprecates the divided style, so the results lose their
divider; the full-screen layout takes its own surface-container-low, one
step from the docked one; the docked view opens over a scrim, as M3's
variants table says it does; and the bar is bounded at M3's 720px, grows
to that width while focused, and rests with the 24px leading and trailing
padding the specs table gives an unfocused bar. --search-width sets the
resting width for M3's 360px bar.

Plan step 20, findings IN-07, IN-08, IN-09, IN-20 and IN-21.

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

tests/Feature/Components/SearchTest.php

@@ -16,6 +16,7 @@ it('draws a search bar whose combobox controls the view', function () {
         ->toContain('wire:model.live.debounce.300ms="query"')
         ->toContain('id="find-view"')
         ->toContain('data-search-clear')
+        ->toContain('data-search-scrim')
         ->toContain('aria-label="Back"')
         ->toContain('materialSearch(false,')
         ->not->toContain('data-search-results');