feat(voice): dynamic silence threshold + filled red mic halo

The web silence detector previously ran RMS over getByteFrequencyData
bytes (which are already dB-scaled) and re-log'd the result, producing
numbers that didn't line up with real dBFS. Combined with a static
-40 dB threshold that sat right on top of room ambient, silence
detection rarely fired and the user had to click stop manually.

- Rewrite useSilenceDetector to use getFloatTimeDomainData for honest
  linear RMS → dBFS.
- Silence threshold is now dynamic: track session peak dBFS and treat
  "silent" as 15 dB below peak. Auto-calibrates per mic/room.
- Grace period (1500 ms) at start so the user can begin speaking
  before checks arm; static -45 dB fallback until peak clears -25 dB
  so dead-silent sessions don't spin forever.
- Silence duration bumped 1500 → 2000 ms for breathing room.

Visual: detached red radial-gradient disc sits behind the mic in a
wrapper; the button no longer scales, so the white mic icon stays
legible on top while the halo grows from 1x to ~2.6x with live
amplitude. Much more obvious "you are live" signal than the prior
subtle box-shadow pulse.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

frontend/src/components/ChatInputBar.vue

@@ -114,15 +114,17 @@ const transcribingVoice = ref(false)
 const recorder = useVoiceRecorder()
 const silenceDetector = useSilenceDetector()
 
-// Live mic pulse. `silenceDetector.amplitude` is 0..1 RMS; we floor at 0.1
-// so the button still breathes on silence and cap the scale growth so loud
-// input doesn't punch through the input bar.
-const micStyle = computed(() => {
-  if (!recorder.recording.value) return {}
-  const pulse = 0.1 + Math.min(silenceDetector.amplitude.value, 1) * 0.9
+// Live mic halo. A solid red disc sits behind the mic button and scales
+// with `silenceDetector.amplitude` (0..1 RMS, already amplified for
+// visibility). The button itself stays put so the mic icon is always
+// legible on top. 0.2 baseline breathes on silence; loud speech drives
+// the disc out to ~2.6× the button size with a softer radial fade.
+const micGlowStyle = computed(() => {
+  if (!recorder.recording.value) return { display: 'none' }
+  const pulse = 0.2 + Math.min(silenceDetector.amplitude.value, 1) * 0.8
   return {
-    transform: `scale(${1 + pulse * 0.18})`,
-    boxShadow: `0 0 ${6 + pulse * 14}px ${2 + pulse * 4}px rgba(239, 68, 68, ${0.2 + pulse * 0.3})`,
+    transform: `translate(-50%, -50%) scale(${1 + pulse * 1.6})`,
+    opacity: String(0.45 + pulse * 0.4),
   }
 })
 
@@ -242,24 +244,25 @@ defineExpose({ focus, prefill })
         class="input-textarea"
       ></textarea>
 
-      <!-- PTT mic -->
-      <button
-        v-if="voiceEnabled"
-        class="btn-icon btn-mic"
-        :class="{ 'mic-recording': recorder.recording.value, 'mic-transcribing': transcribingVoice }"
-        :style="micStyle"
-        @click.prevent="toggleVoice"
-        :disabled="transcribingVoice || !store.chatReady"
-        :title="recorder.recording.value ? 'Click to stop (or wait for silence)' : 'Click to speak'"
-        :aria-label="recorder.recording.value ? 'Stop recording' : 'Start recording'"
-      >
+      <!-- PTT mic (with live amplitude halo behind) -->
+      <div v-if="voiceEnabled" class="mic-wrapper">
+        <div class="mic-glow" :style="micGlowStyle" aria-hidden="true"></div>
+        <button
+          class="btn-icon btn-mic"
+          :class="{ 'mic-recording': recorder.recording.value, 'mic-transcribing': transcribingVoice }"
+          @click.prevent="toggleVoice"
+          :disabled="transcribingVoice || !store.chatReady"
+          :title="recorder.recording.value ? 'Click to stop (or wait for silence)' : 'Click to speak'"
+          :aria-label="recorder.recording.value ? 'Stop recording' : 'Start recording'"
+        >
         <svg v-if="!transcribingVoice" width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
           <path d="M12 14c1.66 0 3-1.34 3-3V5c0-1.66-1.34-3-3-3S9 3.34 9 5v6c0 1.66 1.34 3 3 3zm-1-9c0-.55.45-1 1-1s1 .45 1 1v6c0 .55-.45 1-1 1s-1-.45-1-1V5zm6 6c0 2.76-2.24 5-5 5s-5-2.24-5-5H5c0 3.53 2.61 6.43 6 6.92V21h2v-3.08c3.39-.49 6-3.39 6-6.92h-2z"/>
         </svg>
         <svg v-else width="17" height="17" viewBox="0 0 24 24" fill="currentColor">
           <circle cx="12" cy="12" r="8" opacity="0.35"/><circle cx="12" cy="12" r="4"/>
         </svg>
-      </button>
+        </button>
+      </div>
 
       <!-- Abort (streaming) or Send -->
       <button
@@ -358,14 +361,48 @@ defineExpose({ focus, prefill })
 
 .btn-mic.mic-recording {
   opacity: 1;
-  color: #ef4444;
-  border-radius: 50%;
-  /* Smooth between amplitude samples (~100ms) so the pulse feels continuous
-     rather than stepping. */
-  transition: transform 0.12s ease-out, box-shadow 0.12s ease-out;
+  /* White icon sits on top of the red halo so it stays legible at any
+     pulse size. */
+  color: #fff;
+  position: relative;
+  z-index: 1;
 }
 .btn-mic.mic-transcribing { opacity: 0.5; }
 
+/* Mic wrapper + live amplitude halo. The glow is a filled red disc
+   absolutely positioned behind the button, scaled/faded by the
+   computed `micGlowStyle` so the user gets unmistakable feedback
+   that their voice is being picked up while the mic icon itself
+   stays put and readable on top. */
+.mic-wrapper {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+}
+.mic-glow {
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 28px;
+  height: 28px;
+  border-radius: 50%;
+  background: radial-gradient(
+    circle,
+    rgba(239, 68, 68, 0.9) 0%,
+    rgba(239, 68, 68, 0.6) 55%,
+    rgba(239, 68, 68, 0) 100%
+  );
+  transform: translate(-50%, -50%) scale(1);
+  transform-origin: center;
+  pointer-events: none;
+  /* Smooth between amplitude samples (~100ms) so the pulse feels continuous
+     rather than stepping. */
+  transition: transform 0.12s ease-out, opacity 0.12s ease-out;
+  z-index: 0;
+}
+
 .note-picker-wrapper { position: relative; }
 .note-picker-dropdown {
   position: absolute;