Remove material.css, the 1.x single-import shortcut

Plan step 37: an application on 1.x-style imports now imports
foundation.css before @import 'tailwindcss' and tailwind.css after it,
the way foundation.css's own header has described since Phase F
started — material.css only ever saved writing those two lines.
Updates every place that named it: tailwind.css's and
foundation/hidden.css's and tokens/utilities.css's header comments,
the development skill's install snippet and Tokens section, README.md's
install snippet, and a new line in UPGRADE.md's migration notes.

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

resources/css/foundation/hidden.css

@@ -7,9 +7,10 @@
  * `hidden="until-found"` is left to the browser, which keeps such content searchable.
  * `[x-cloak]` hides what Alpine has not started yet; Alpine removes the attribute when it has.
  *
- * Only a layered `!important` could outrank these, and the package writes none. The file is
- * apart from reset.css because material.css, which stays for applications importing it after
- * Tailwind, needs `[x-cloak]` without the reset.
+ * Only a layered `!important` could outrank these, and the package writes none. The file is apart
+ * from reset.css because these two rules are unlayered while reset.css's are in `material.reset`;
+ * foundation.css is the only file that imports it, so every entry — `all.css` and an application's
+ * own — reaches it once, through the foundation.
  */
 
 @layer material.reset, material.tokens, material.base, material.layout, material.components, material.text, material.visibility;

resources/css/material.css

@@ -1,38 +0,0 @@
-/*
- * Livewire Material on 1.x-style imports — the one stylesheet an application imports, after
- * Tailwind, followed by the scheme `php artisan material:scheme` wrote for it:
- *
- *   @import 'tailwindcss';
- *   @import '../../vendor/nonameweb/livewire-material/resources/css/material.css';
- *   @import './material-scheme.css';
- *   @source '../../vendor/nonameweb/livewire-material/resources/views';
- *   @source '../../vendor/nonameweb/livewire-material/src';
- *
- * tokens/scheme.css is the package's own default (M3's baseline purple), so an application
- * renders before it has a scheme; the application's file declares the same roles, unlayered, and
- * wins over the default in `material.tokens`.
- *
- * It brings the tokens, the two hiding rules and tailwind.css, but not foundation.css: imported
- * after Tailwind, the foundation's reset would land in a layer above Tailwind's utilities and
- * undo them. An application moving to 2.0.0's vocabulary imports foundation.css before
- * `@import 'tailwindcss'` and tailwind.css after it, instead of this file.
- */
-
-@import './tokens/scheme.css';
-@import './tokens/shape.css';
-@import './tokens/elevation.css';
-@import './tokens/motion.css';
-@import './tokens/type.css';
-@import './tokens/font.css';
-@import './tokens/state.css';
-@import './foundation/hidden.css';
-@import './layout.css';
-@import './components.css';
-@import './tailwind.css';
-
-@layer base {
-    html {
-        background-color: var(--md-sys-color-surface);
-        color: var(--md-sys-color-on-surface);
-    }
-}

resources/css/tailwind.css

@@ -1,7 +1,9 @@
 /*
- * Livewire Material's Tailwind half: the theme that turns the tokens into utilities, the token
- * utilities, and the component stylesheets still written for Tailwind (`@utility`, `@variant`,
- * `@layer components`). It goes when the last component leaves Tailwind.
+ * Livewire Material's Tailwind half: the theme that turns the tokens into utilities and the token
+ * utilities themselves (`state-layer`, `focus-ring`, `touch-target`, `link`, `type-*`), for a view
+ * that still writes Tailwind classes — the showcase until step 38, and an application's own views
+ * until it drops Tailwind. Every component stylesheet is plain CSS (plan step 36) and needs
+ * nothing from here. This file goes when the last Tailwind class leaves (step 39).
  *
  * It carries no tokens, so it can sit behind the foundation without declaring them twice — the
  * Workbench imports it that way, after Tailwind:
@@ -10,8 +12,8 @@
  *   @import 'tailwindcss' source(none);
  *   @import '../../../resources/css/tailwind.css';
  *
- * An application on 1.x-style imports keeps importing material.css, which brings the tokens and
- * this file together.
+ * An application still building Tailwind imports the same way, `foundation.css` then `tailwindcss`
+ * then this file, in place of the 1.x `material.css` shortcut, which is gone.
  */
 
 @import './tokens/theme.css';

resources/css/tokens/utilities.css

@@ -2,7 +2,7 @@
  * The token utilities, for the components still written in Tailwind.
  *
  * Tailwind's side of tokens/state.css and tokens/type.css, kept apart so that the token files the
- * foundation imports carry no Tailwind directive. material.css imports this file after Tailwind;
+ * foundation imports carry no Tailwind directive. tailwind.css imports this file after Tailwind;
  * it goes when the last component leaves Tailwind. New markup uses the plain-CSS classes instead,
  * which carry the same declarations: `md-state-layer`, `md-focus-ring`, `md-touch-target` and
  * `md-link` (foundation/interaction.css), and `md-type-*` (text.css).