Improve recordings list sorting and live show-page status updates.

Add sortable columns with a fixed status width, and keep the show page in sync via Echo, polling, and Alpine hydrate while transcription runs.

resources/views/livewire/recordings/show.blade.php

@@ -1,13 +1,19 @@
 <div
-    x-data="transcriptionMonitor(@js([
-        'statusUrl' => route('recordings.transcription-status', $recording),
-        'initial' => $recording->transcriptionStatusPayload(),
-    ]))"
-    x-init="
-        start();
-        return () => destroy();
-    "
+    @if ($recording->isTranscribing())
+        wire:poll.2s.visible
+    @endif
 >
+    <div
+        wire:key="transcription-ui-{{ $recording->id }}-{{ $recording->transcription_status }}-{{ $recording->transcription_percent }}-{{ md5((string) $recording->transcription_progress) }}-{{ $recording->transcribed_at?->timestamp }}"
+        x-data="transcriptionMonitor(@js([
+            'statusUrl' => route('recordings.transcription-status', $recording),
+            'initial' => $recording->transcriptionStatusPayload(),
+        ]))"
+        x-init="
+            start();
+            return () => destroy();
+        "
+    >
     <div class="mb-6 flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
         <div>
             <flux:link href="{{ route('recordings.index') }}" wire:navigate class="text-sm">← Recordings</flux:link>
@@ -222,4 +228,5 @@
             No transcript yet. Transcription starts automatically after upload, or use the button above.
         </flux:text>
     </flux:card>
+    </div>
 </div>