Render word confidence as colored text instead of chips.

Keep click-to-seek and hover percentages, but drop the boxed pill styling so the transcript reads as normal flowing text.

resources/js/transcription.js

@@ -125,18 +125,18 @@ export function formatClock(seconds) {
 
 export function wordConfidenceClass(probability) {
     if (probability == null) {
-        return 'bg-zinc-400/20 text-zinc-700 dark:text-zinc-200';
+        return 'text-zinc-700 dark:text-zinc-200';
     }
 
     if (probability >= 0.85) {
-        return 'bg-teal-400/25 text-teal-800 dark:text-teal-200';
+        return 'text-teal-700 dark:text-teal-300';
     }
 
     if (probability >= 0.6) {
-        return 'bg-amber-400/25 text-amber-800 dark:text-amber-200';
+        return 'text-amber-700 dark:text-amber-300';
     }
 
-    return 'bg-red-400/20 text-red-700 dark:text-red-300';
+    return 'text-red-700 dark:text-red-300';
 }
 
 /**

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

@@ -260,11 +260,14 @@
                 </span>
             </div>
 
-            <div class="flex flex-wrap gap-1" x-show="whisperWords.length">
+            <div
+                class="mt-4 text-sm leading-relaxed"
+                x-show="whisperWords.length"
+            >
                 <template x-for="word in whisperWords" :key="word.key">
                     <button
                         type="button"
-                        class="rounded px-1.5 py-0.5 text-xs tabular-nums"
+                        class="mr-1 inline cursor-pointer hover:underline"
                         :class="wordConfidenceClass(word.probability)"
                         :title="(word.start != null ? formatClock(word.start) : '') + (word.probability != null ? (' · ' + Math.round(word.probability * 100) + '%') : '')"
                         @click="seekTo(word.start)"