Ease a collapse open, which its own comment already promised

Plan step 19, containment.md C-24. `interpolate-size: allow-keywords`
was set and nothing transitioned, so the content snapped open. A new
resources/css/components/collapse.css transitions `block-size` on
`::details-content` over the fast spatial spring, with
`content-visibility` `allow-discrete` beside it so the section stays
rendered while it closes. The `<details>` carries `data-collapse` for
the rule to find.

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

resources/css/components/collapse.css

@@ -0,0 +1,30 @@
+/*
+ * `<x-collapse>`'s height, eased open.
+ *
+ * The native `<details>` opens and closes by itself; what it cannot do on its own is animate, so
+ * the component sets `interpolate-size: allow-keywords` (which makes `0` → `auto` an animatable
+ * pair) and this transitions `block-size` on `::details-content`, the pseudo-element that holds
+ * everything after the `<summary>`. `content-visibility` goes with it, `allow-discrete`, so the
+ * content stays rendered while it closes rather than vanishing on the first frame.
+ *
+ * The fast spatial spring, as the chevron beside it: M3's spatial track is for anything that
+ * changes size or position. Under reduced motion the duration token is zero
+ * (resources/css/tokens/motion.css), so the section snaps open with nothing else to do.
+ *
+ * Not an M3 component — M3 has expandable list items and menu expansion, no standalone disclosure
+ * — so the geometry is the library's and only the motion tokens are M3's.
+ */
+
+@layer components {
+    [data-collapse]::details-content {
+        block-size: 0;
+        overflow: hidden;
+        transition:
+            block-size var(--md-sys-motion-spatial-fast-duration) var(--md-sys-motion-spatial-fast),
+            content-visibility var(--md-sys-motion-spatial-fast-duration) allow-discrete;
+    }
+
+    [data-collapse][open]::details-content {
+        block-size: auto;
+    }
+}

resources/css/material.css

@@ -22,6 +22,7 @@
 @import './tokens/state.css';
 @import './components/groups.css';
 @import './components/list.css';
+@import './components/collapse.css';
 @import './components/field.css';
 @import './components/menu.css';
 @import './components/selection.css';