feat(characters): use local character catalog

src/app/chat/components/voice-bubble.tsx

@@ -4,6 +4,7 @@ import { LockKeyhole, Pause, Play } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 
 import { useCachedChatMediaUrl } from "@/lib/chat/use_cached_chat_media_url";
+import { useActiveCharacter } from "@/providers/character-provider";
 import styles from "./voice-bubble.module.css";
 
 export interface VoiceBubbleProps {
@@ -27,6 +28,7 @@ export function VoiceBubble({
   isUnlocking = false,
   onUnlock,
 }: VoiceBubbleProps) {
+  const character = useActiveCharacter();
   const audioRef = useRef<HTMLAudioElement>(null);
   const [isPlaying, setIsPlaying] = useState(false);
   const [errorMediaUrl, setErrorMediaUrl] = useState<string | null>(null);
@@ -123,7 +125,7 @@ export function VoiceBubble({
             <p className={styles.hint}>
               {hint && hint.length > 0
                 ? hint
-                : "Elio has a locked voice message for you."}
+                : `${character.shortName} has a locked voice message for you.`}
             </p>
             <button
               type="button"