refactor(ui): add shared character avatar

src/app/tip/tip-screen.tsx

@@ -1,9 +1,9 @@
 "use client";
 
 import { useEffect, useMemo, useRef } from "react";
-import Image from "next/image";
 import { ArrowLeft, Heart, Sparkles } from "lucide-react";
 
+import { CharacterAvatar } from "@/app/_components";
 import { MobileShell } from "@/app/_components/core";
 import { usePaymentOrderLifecycle } from "@/app/_hooks/use-payment-order-lifecycle";
 import type { PayChannel } from "@/data/dto/payment";
@@ -165,11 +165,10 @@ export function TipScreen({
 
         <section className={styles.hero} aria-labelledby="tip-title">
           <div className={styles.avatarRing}>
-            <Image
-              src="/images/chat/pic-chat-elio.png"
+            <CharacterAvatar
               alt="Elio Silvestri"
-              width={88}
-              height={88}
+              size="100%"
+              imageSize={88}
               priority
             />
           </div>