Say how M3 wants a checkbox group laid out at expanded

M3 § Checkbox, Behaviour asks that from expanded (840px) related checkboxes be
gathered into a contained region rather than left as one long column. That is a
rule about the page around the control, not about the control, so it is written
down rather than built: the component's header and its SKILL.md entry now say
it, and the showcase lays a group out in an `expanded:grid-cols-2` card (plan
step 24, audit docs/audits/m3-alignment/inputs.md § Missing).

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

tests/Feature/Components/SelectionTest.php

@@ -37,6 +37,29 @@ it('gives a selection control without a label a 48px target', function () {
         ->and((string) $this->blade('<x-radio :options="[[\'id\' => \'a\', \'name\' => \'A\']]" />'))->not->toContain('touch-target');
 });
 
+it('leaves a checkbox group to the caller and says how M3 wants it laid out', function () {
+    $html = (string) $this->blade(<<<'BLADE'
+        <fieldset>
+            <legend>Tell me about</legend>
+            <div class="grid gap-4 expanded:grid-cols-2">
+                <x-checkbox label="Downloads" name="notify[]" value="downloads" />
+                <x-checkbox label="Comments" name="notify[]" value="comments" />
+            </div>
+        </fieldset>
+        BLADE);
+
+    expect($html)
+        ->toContain('class="grid gap-4 expanded:grid-cols-2"')
+        ->toContain('Downloads')
+        ->toContain('Comments')
+        ->and(substr_count($html, 'data-checkbox'))->toBe(2);
+
+    // The rule is guidance, not markup, so the component's header has to carry it.
+    expect(file_get_contents(__DIR__.'/../../../resources/views/components/checkbox.blade.php'))
+        ->toContain('expanded')
+        ->toContain('contained region');
+});
+
 it('puts a checkbox at the end of its row on request', function () {
     expect((string) $this->blade('<x-checkbox label="Show" right />'))->toContain('flex-row-reverse justify-between');
 });