refactor(app): migrate banner styles to tailwind

src/app/chat/components/chat-header.tsx

@@ -11,8 +11,6 @@ import { Lock, Menu } from "lucide-react";
 import { ROUTES } from "@/router/routes";
 import { useAppNavigator } from "@/router/use-app-navigator";
 
-import styles from "./chat-header.module.css";
-
 export interface ChatHeaderProps {
   isGuest: boolean;
   offerBanner?: ReactNode;
@@ -23,14 +21,18 @@ export function ChatHeader({ isGuest, offerBanner }: ChatHeaderProps) {
 
   if (isGuest) {
     return (
-      <header className={styles.header}>
+      <header className="flex shrink-0 flex-col items-stretch bg-transparent p-0">
         <button
           type="button"
-          className={styles.guestBanner}
+          className="flex w-full cursor-pointer items-center justify-center gap-[var(--spacing-sm,8px)] border-0 bg-[var(--color-accent,#f84d96)] px-[var(--spacing-md,12px)] py-[var(--spacing-sm,8px)] text-center text-[var(--responsive-caption,var(--font-size-sm,12px))] font-medium text-white"
           onClick={() => navigator.openAuth(ROUTES.chat)}
           aria-label="Sign up to unlock more features"
         >
-          <Lock className={styles.guestBannerIcon} size={16} aria-hidden="true" />
+          <Lock
+            className="size-[var(--icon-size-sm,16px)]"
+            size={16}
+            aria-hidden="true"
+          />
           <span>Sign up to unlock more features</span>
         </button>
       </header>
@@ -38,18 +40,22 @@ export function ChatHeader({ isGuest, offerBanner }: ChatHeaderProps) {
   }
 
   return (
-    <header className={styles.header}>
+    <header className="flex shrink-0 flex-col items-stretch bg-transparent p-0">
       {offerBanner}
 
-      <div className={styles.headerRow}>
+      <div className="ml-[var(--spacing-md,12px)] flex items-center justify-between px-[var(--spacing-md,12px)] py-[var(--spacing-sm,8px)]">
         {/* 菜单按钮（点击 → push 到 /sidebar，与 Dart MenuButton 一致） */}
         <button
           type="button"
-          className={styles.menuButton}
+          className="flex cursor-pointer items-center justify-center rounded-[var(--radius-full,999px)] border-0 bg-[rgba(13,11,20,0.7)] p-[var(--spacing-sm,8px)] text-[var(--color-text-primary,#fff)]"
           onClick={() => navigator.push(ROUTES.sidebar)}
           aria-label="Menu"
         >
-          <Menu className={styles.menuIcon} size={24} aria-hidden="true" />
+          <Menu
+            className="size-[var(--icon-size-xl,32px)]"
+            size={24}
+            aria-hidden="true"
+          />
         </button>
       </div>
     </header>