feat(tip): add character splash back button

src/app/tip/tip-screen.module.css

@@ -68,7 +68,8 @@
 .header {
   display: flex;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: space-between;
+  gap: 12px;
 }
 
 .headerPill {

src/app/tip/tip-screen.tsx

@@ -4,7 +4,7 @@ import { useEffect, useMemo, useState, type CSSProperties } from "react";
 import Image from "next/image";
 import { Heart, Sparkles } from "lucide-react";
 
-import { CharacterAvatar } from "@/app/_components";
+import { BackButton, CharacterAvatar } from "@/app/_components";
 import { MobileShell } from "@/app/_components/core";
 import { PaymentMethodSelector } from "@/app/_components/payment/payment-method-selector";
 import { usePaymentMethodSelection } from "@/app/_hooks/use-payment-method-selection";
@@ -225,6 +225,12 @@ export function TipScreen({
         <div className={styles.bgGlowTwo} aria-hidden="true" />
 
         <header className={styles.header}>
+          <BackButton
+            href={characterRoutes.splash}
+            variant="soft"
+            ariaLabel="Back to character home"
+            analyticsKey="tip.back_to_splash"
+          />
           <span className={styles.headerPill}>{character.copy.tipHeader}</span>
         </header>