Render a tab panel's id and its hidden state on the server

Every panel was visible until Alpine booted — four role="tabpanel" regions at
once for a screen reader, and aria-controls pointing at ids that did not exist
yet. The panel now carries its id, its aria-labelledby and, unless it is the
chosen one, display:none from the server. A slot renders before the component
around it, so the panel reads <x-tabs>'s attributes off the component stack and
repeats its id and initial-tab lines; both files say so.
Plan: docs/plans/material-3-alignment.md, step 14 (navigation N-05).

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

resources/views/components/tabs.blade.php

@@ -3,7 +3,8 @@
      The bar is rendered on the server from `tabs`, a list of `['name' => …, 'label' => …]` with an
      optional `icon`, `badge` and `disabled` — so it arrives with the page, never a moment after it.
      The panels are `<x-tab name="…">` in the slot; every panel is rendered, so switching never waits
-     on the server.
+     on the server, and each arrives with its id and with every panel but the chosen one already
+     hidden, so nothing flashes and no screen reader meets four panels at once.
 
      The chosen tab is the Livewire property in `wire:model` (entangled; `wire:model.live` tells the
      server at once), or, without it, `selected` (the first tab by default) and `x-model`. The bar is
@@ -24,6 +25,8 @@
 @php
     $model = $attributes->wire('model')->value() ?: null;
     $variant = $variant === 'secondary' ? 'secondary' : 'primary';
+    // tab.blade.php repeats these two lines off the component stack, because a slot renders before
+    // the component around it: change them together, or a panel's id stops matching aria-controls.
     $id = $attributes->get('id') ?? 'tabs-'.substr(md5($model.'|'.implode('|', array_column($tabs, 'name'))), 0, 8);
 
     $initial = $selected ?? (collect($tabs)->first(fn (array $tab): bool => ! ($tab['disabled'] ?? false))['name'] ?? null);