Draw the toolbar without Tailwind

Plan step 36 (navigation group, second stream): <x-toolbar>'s class
lists move into resources/css/components/toolbar.css, keyed on
data-md-toolbar (data-md-variant/-vertical/-vibrant/-rounded/
-toolbar-place) and data-md-toolbar-group/-toolbar-fab. The docked
form with a FAB (N-02's --material-bottom-bar clearance), the vertical
24dp margin (N-12), the standard toolbar's primary icon buttons
(N-13), and the rounded large-screen form with dividers from 840px
were all already correct; only their hooks, units and layer needed to
change. The file no longer sits outside every layer: button.css and
fab.css now draw their own ink through data-md-* attributes rather
than a Tailwind utility, so a toolbar's more specific selector always
beats their single base color/background-color/box-shadow declaration
without needing to escape the cascade layers.

Sizes stay px (64px row, 40px divider); spacing goes through the
measurement tokens where one matches the value (4px leading/trailing
gap, 16/32px docked spread, 8px floating ends, 16/24px placed
margins).

Hooks renamed: every unprefixed data-toolbar* attribute to data-md-*,
updated in tests/Feature/Components/{AppBarTest,ToolbarTest}.php and
tests/Browser/BarsTest.php. toolbar.js needed no change: it reads the
bar through $root and role="toolbar", not by hook name.

Carry-over from the app-bar step: layout/pane.css now imports
app-bar.css and button.css for the pane's own top app bar and back
button, now that both are rewritten. That import crosses into
material.components for the first time from a layout file, so
tests/Feature/StylesheetsTest.php's two layout-shape checks now skip
non-`layout/` files reached through it — each already covered by its
own group's stylesheet test.

Added the owed browser tests (docs/plans/material-3-browser-tests.md):
a docked toolbar clear of the navigation bar below medium, and the
rounded form with its divider height from 840px, clear of the
window's edges.

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

tests/Feature/StylesheetsTest.php

@@ -381,8 +381,16 @@ it('opens every layout stylesheet with a header, the layer statement and plain i
 });
 
 it('keeps every layout rule in material.layout, and the visibility props in material.visibility', function () {
+    // layoutStylesheets() follows every @import, so it now reaches component stylesheets a layout
+    // file draws on (pane.css: app-bar.css and button.css, for its own top app bar and back
+    // button) — each already checked, in material.components, by its own group's stylesheet test.
     foreach (layoutStylesheets() as $file) {
         $name = stylesheetName($file);
+
+        if (! str_starts_with($name, 'layout/')) {
+            continue;
+        }
+
         $css = File::get($file);
         $layer = match ($name) {
             'layout/visibility.css' => 'material.visibility',
@@ -405,8 +413,15 @@ it('keeps every layout rule in material.layout, and the visibility props in mate
 it('writes no Tailwind in the layout stylesheets, and media queries only at M3\'s breakpoints, in px', function () {
     $queries = 0;
 
+    // Component stylesheets reached through a layout file (see the test above) are not layout
+    // stylesheets themselves, and keep their own group's rules (a hover query included).
     foreach (layoutStylesheets() as $file) {
         $name = stylesheetName($file);
+
+        if (! str_starts_with($name, 'layout/')) {
+            continue;
+        }
+
         $css = stylesheetWithoutComments(File::get($file));
 
         expect($css)