Teach the ink classes and lines on the Colour page again

Plan step 38 review: the Colour section dropped its "Ink and lines"
group with the retired Tailwind ink names and put nothing in its
place, so no page showed the md-ink-* classes that replaced them or
how to draw a line. A new "Ink and lines" example writes md-ink,
md-ink-variant and md-ink-quiet with their roles, the state inks, and
a line as <x-divider> and an edge as <x-surface outlined>.

Doc comments teach too: the Icons intro showed optical="20" alone for
a 20px icon, where <x-icon size="20"> picks the cut itself; icon's
header still spoke of a caller's size-5 class, the navigation rail's
usage wrapped it in flex/min-w-0 utilities, and the menu item's
icon-class example named a Tailwind-style text- class.

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

resources/views/components/navigation-rail.blade.php

@@ -1,9 +1,9 @@
 {{-- M3 Expressive's navigation rail: destinations down the start edge of a `medium` or wider
      window, collapsed (96px, icon over label) or expanded (icon beside label in a full-width pill).
 
-         <div class="flex min-h-dvh">
+         <x-row align="stretch" style="min-height: 100dvh">
              <x-navigation-rail mode="collapsible">
-                 <x-slot:brand><span class="type-title-lg">Mail</span></x-slot:brand>
+                 <x-slot:brand><span class="md-type-title-lg">Mail</span></x-slot:brand>
                  <x-slot:header>
                      <x-fab label="Compose" icon="edit" />
                  </x-slot:header>
@@ -18,8 +18,8 @@
                  </x-slot:footer>
              </x-navigation-rail>
 
-             <main class="min-w-0 flex-1">…</main>
-         </div>
+             <main style="flex: 1; min-width: 0">…</main>
+         </x-row>
 
      `mode` says what decides its width:
      - `collapsed` — always collapsed; `expanded` — always expanded.