refactor(chat): reuse fullscreen back button

src/app/_components/__tests__/tailwind-components.test.tsx

@@ -21,6 +21,13 @@ describe("shared Tailwind components", () => {
         analyticsKey="chat.back_to_home"
       />,
     );
+    const unstyledHtml = renderToStaticMarkup(
+      <BackButton
+        onClick={() => undefined}
+        variant="unstyled"
+        className="custom-back"
+      />,
+    );
 
     expect(linkHtml).toContain('href="/chat"');
     expect(linkHtml).toContain('aria-label="Back to chat"');
@@ -35,6 +42,8 @@ describe("shared Tailwind components", () => {
     expect(darkHtml).toContain('data-analytics-key="chat.back_to_home"');
     expect(darkHtml).toContain("bg-[rgba(13,11,20,0.7)]");
     expect(darkHtml).toContain("text-white");
+    expect(unstyledHtml).toContain("custom-back");
+    expect(unstyledHtml).not.toContain("size-8");
   });
 
   it("renders CharacterAvatar with dynamic sizing and image utilities", () => {

src/app/_components/back-button.tsx

@@ -8,7 +8,7 @@ interface BackButtonBaseProps {
   ariaLabel?: string;
   analyticsKey?: string;
   iconSize?: number;
-  variant?: "floating" | "soft" | "ghost" | "dark";
+  variant?: "floating" | "soft" | "ghost" | "dark" | "unstyled";
 }
 
 type BackButtonLinkProps = BackButtonBaseProps & {
@@ -35,6 +35,7 @@ const VARIANT_CLASS_NAMES = {
     "size-8 bg-transparent text-black hover:opacity-70 active:scale-96",
   dark:
     "size-(--responsive-icon-button-size,42px) border border-[rgba(255,255,255,0.12)] bg-[rgba(13,11,20,0.7)] text-white shadow-[0_10px_24px_rgba(0,0,0,0.2)] backdrop-blur-md hover:bg-[rgba(28,24,39,0.82)] active:scale-96",
+  unstyled: "",
 } satisfies Record<NonNullable<BackButtonBaseProps["variant"]>, string>;
 
 export function BackButton({