Draw the scaffold without Tailwind

Plan step 36 (navigation group, third batch): <x-scaffold>'s own
styling moves into resources/css/layout/scaffold.css (the content
region, the bar and rail row, the banner, the actions row and its
rail-collapsed column layout, --material-bottom-bar and
--material-margin publishing, the skip link) alongside step 35's FAB
and content-margin rules already there. Every data-app-shell* hook
becomes data-md-scaffold-* (data-app-shell-bar, -actions, -banner);
the skip link is data-md-skip-link; data-app-shell itself is dropped,
data-md-scaffold already named the root.

The actions row's rail-collapsed:flex-col is written out branch for
branch as the navigation rail's own rewrite did for its internal
parts: the three width-independent conditions in one :where() group,
the four width-gated ones each in their own @media block. With that
gone, resources/css/tailwind.css's rail-collapsed custom-variant
shim (its last use) is removed; tailwind.css now carries only
tokens/theme.css and tokens/utilities.css, which the showcase still
needs until step 38.

navigation-bar.css's hide-on-scroll rule reading --material-bottom-bar
stayed unlayered only because <x-scaffold> published that variable
through a Tailwind utility, which no layered rule could outrank; now
scaffold.css sets it itself in material.layout, a layer
navigation-bar.css's own material.components always beats, so the
rule moves into the layer and the file fits one
@layer material.components block like every other navigation
stylesheet. navigation-bar rejoins NavigationStylesheetsTest.php's
dataset and NavigationBarTest.php's own duplicate shape test is
retired in favour of it.

Browser tests added (docs/plans/material-3-browser-tests.md): the
scaffold's FAB dropping the bar's own height once hide-bar-on-scroll
slides it away, at the trailing edge in a right-to-left document, and
clearing a safe area an application sets on its inline-end and bottom
edges.

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

resources/css/components/navigation-bar.css

@@ -73,19 +73,21 @@
         [data-md-navigation-bar]:not([data-md-tall]) [data-md-navigation-bar-items]:has(> :last-child:nth-child(5)) { --navigation-bar-count: 5; }
         [data-md-navigation-bar]:not([data-md-tall]) [data-md-navigation-bar-items]:has(> :last-child:nth-child(6)) { --navigation-bar-count: 6; }
     }
-}
 
-/*
- * A bar that has slid off the bottom of the window is no longer there to clear, so the offset
- * everything pinned to the bottom reads drops to the bottom safe area and whatever the application
- * has docked on the bar — a `fab` button, the snackbar and the page's own bottom padding all follow
- * it down and come back up with it. Unlayered on purpose, still: <x-scaffold> (its own rewrite is a
- * later batch) publishes --material-bottom-bar with a Tailwind utility
- * (`max-medium:[--material-bottom-bar:…]`), and a rule in any layer loses to an unlayered utility
- * regardless of specificity — unlike toolbar.css's and fab.css's overrides, which only have to beat
- * another `material.components` rule. Keyed on `data-md-scaffold`, the hook the scaffold already
- * renders, not `data-app-shell`, which belongs to that later rewrite.
- */
-[data-md-scaffold]:has([data-md-navigation-bar][data-md-hide-on-scroll][data-md-hidden]) {
-    --material-bottom-bar: calc(var(--material-safe-bottom, env(safe-area-inset-bottom)) + var(--material-bottom-extra, 0px));
+    /*
+     * A bar that has slid off the bottom of the window is no longer there to clear, so the offset
+     * everything pinned to the bottom reads drops to the bottom safe area and whatever the
+     * application has docked on the bar — a `fab` button, the snackbar and the page's own bottom
+     * padding all follow it down and come back up with it. Layered now, unlike before this
+     * rewrite: <x-scaffold> used to publish --material-bottom-bar with a Tailwind utility, which
+     * no rule in any layer could outrank regardless of specificity; now scaffold.css publishes it
+     * itself in `material.layout` (layout/scaffold.css), a layer this file's own
+     * `material.components` always outranks by declaration order alone — the same reason
+     * toolbar.css's and fab.css's overrides only have to beat another `material.components` rule,
+     * not chase a Tailwind utility out of the cascade. Keyed on `data-md-scaffold`, the hook the
+     * scaffold renders on its root, not `data-app-shell`, which that rewrite also retired.
+     */
+    [data-md-scaffold]:has([data-md-navigation-bar][data-md-hide-on-scroll][data-md-hidden]) {
+        --material-bottom-bar: calc(var(--material-safe-bottom, env(safe-area-inset-bottom)) + var(--material-bottom-extra, 0px));
+    }
 }