Match only the scaffold's own main, and correct its header

Plan step 36, navigation review. `[data-md-scaffold] main` carried only
step 35's `--md-layout-margin`; the rewrite added the region's flex,
padding and overflow clip to it, which would also land on a <main> an
application nests in the page. It is `[data-md-scaffold-content] > main`
now. The header said panes read `--material-margin` (only the region
does), that the bar wrapper carries `--material-bottom-bar` (the root
does), and that the old utility and the hidden-bar override both sit in
material.components (the scaffold's is material.layout).

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

resources/css/layout/scaffold.css

@@ -6,10 +6,11 @@
  * Tailwind; `data-md-scaffold-fab` and the content region's `--md-layout-margin` are step 35's,
  * unchanged below.
  *
- * `--material-margin` is M3's window margin, read by a pane and the canonical layouts wherever
+ * `--material-margin` is M3's window margin, which the content region pads itself with and an
- * `--md-layout-margin` has not already zeroed it: 16px below `medium`, 24px from it
+ * application's own rules can read: 16px below `medium`, 24px from it
  * (docs/reference/m3/foundations-supplement.md § Breakpoints), the same two spacing tokens
- * layout/pane.css reads for its own margin.
+ * layout/pane.css draws its own margin from. `--md-layout-margin: 0px` on the region tells a pane
+ * or canonical layout inside that the margin is already drawn.
  *
  * `[data-md-skip-link]` hides the way `md-visually-hidden` does at rest (text.css) — duplicated
  * here rather than shared, because a class cannot be un-applied on `:focus` — and reveals itself
@@ -31,19 +32,19 @@
  * the actions row can never be the rail element itself.
  *
  * `[data-md-scaffold-bar]` pins the navigation bar to the window's bottom edge below `medium`, at
- * the navigation bar's own stacking layer (z-index 30: over the page, under a scrim or the
+ * z-index 30: over the page, under the rail's scrim (40) and the snackbar (50, toast.css). While a
- * snackbar — navigation-bar.css and toast.css agree on the number). It also carries
+ * bar is there, the scaffold's root publishes `--material-bottom-bar` below `medium` — the bar's
- * `--material-bottom-bar`, which everything the bar would otherwise cover reads: the FAB
+ * 64px or, tall, 80px (`NavigationBarTokens.ContainerHeight` and `TallContainerHeight`, the bar's
- * (`[data-md-scaffold-fab]`, below), the snackbar host (toast.css) and the content region's own
+ * own dimensions rather than the spacing scale), the bottom safe area and `--material-bottom-extra`
- * bottom padding, all through `max()`/`var()` with a `0px` fallback, so nothing below `medium`, or
+ * — which everything the bar would otherwise cover reads: the FAB (below), the snackbar host
- * once the bar itself is absent, reads a stale height. It stayed a Tailwind utility
+ * (toast.css), a placed toolbar (toolbar.css) and the content region's bottom padding. Without a
- * (`max-medium:[--material-bottom-bar:…]`, unlayered so it could win over `navigation-bar.css`'s
+ * bar, or from `medium`, the scaffold publishes nothing and each reader falls back to 0px. A bar that has slid
- * own override) until this rewrite; now both live in `material.components`
+ * away on scroll drops its own height from the variable (navigation-bar.css); that rule wins
- * (`navigation-bar.css`'s own header explains why that layer, not this one, is enough) and this
+ * because `material.components` comes after this file's `material.layout`, where before this
- * declaration only has to beat `main`'s own `0px` fallback inside the very same layer, which normal
+ * rewrite the variable was a Tailwind utility and the override had to sit outside every layer.
- * cascade order already does. 64px and 80px are `NavigationBarTokens.ContainerHeight` and
+ *
- * `TallContainerHeight`, the bar's own dimensions, not the spacing scale — the number
+ * The content region's `<main>` is matched as the content wrapper's own child, so a `<main>` an
- * navigation-bar.css itself draws the bar at, kept literal here for the same reason.
+ * application nests inside the page takes none of the region's padding or clipping.
  *
  * Imports the stylesheets of every component this view renders: the adaptive rail and its item and
  * section, the navigation bar and its item, and the snackbar host.
@@ -171,7 +172,7 @@
         }
     }
 
-    [data-md-scaffold] main {
+    [data-md-scaffold-content] > main {
         --md-layout-margin: 0px;
 
         min-inline-size: 0;

tests/Feature/Components/ScaffoldTest.php

@@ -265,7 +265,9 @@ it('places the FAB at the bottom-end corner, clear of the bar and of a snackbar,
         ->toContain('+ var(--material-snackbar-height, 0px)')
         ->toContain('+ min(var(--material-snackbar-height, 0px), var(--md-sys-measurement-space200))')
         // The content region already has the window margin, so a pane inside draws none.
-        ->toContain("[data-md-scaffold] main {\n        --md-layout-margin: 0px;")
+        // Only the region's own <main>: one an application nests in the page takes none of this.
+        ->toContain("[data-md-scaffold-content] > main {\n        --md-layout-margin: 0px;")
+        ->not->toContain('[data-md-scaffold] main')
         ->and((string) file_get_contents(__DIR__.'/../../../resources/css/layout.css'))->toContain("@import './layout/scaffold.css';");
 });