fix(layout): fit names on phones without sideways scroll

Display and game names shrink to 0.875rem, then end with an ellipsis
(FitText + fit-text utility, CSS container units, full text in title).
Rows and buttons wrap at large fonts, header points chip can shrink.
Guard: scripts/check-overflow.js.

src/components/DashboardWelcomeCard.jsx

@@ -7,6 +7,7 @@ import {Button} from '@/components/ui/button';
 import {Card} from '@/components/ui/card';
 import {cn} from '@/lib/utils';
 import HeroBanner from './HeroBanner.jsx';
+import FitText from './FitText.jsx';
 import PointsBadge from './PointsBadge.jsx';
 import SteamAvatar from './SteamAvatar.jsx';
 import SyncStatusBadge from './SyncStatusBadge.jsx';
@@ -24,7 +25,7 @@ export default function DashboardWelcomeCard({bannerAppid, avatarUrl, sync, forc
             lookClass(equipped, 'BANNER_FRAME'))}>
             {/* A picked game, else the game played most in the last two weeks. */}
             <HeroBanner appid={bannerAppid} effect={bannerEffect(equipped)}/>
-            <div className="relative flex min-w-0 items-center gap-4">
+            <div className="relative flex min-w-0 items-center gap-4 md:flex-1">
                 {/* The slot is there before the avatar loads, so the title does not jump. */}
                 {hasSteamId && (
                     <span className={cn('flex size-16 shrink-0 items-center justify-center rounded-full bg-muted',
@@ -32,16 +33,16 @@ export default function DashboardWelcomeCard({bannerAppid, avatarUrl, sync, forc
                         <SteamAvatar url={avatarUrl} className="size-16" iconClassName="size-8 text-muted-foreground"/>
                     </span>
                 )}
-                <div className="min-w-0">
+                <div className="min-w-0 flex-1">
                     <p className="text-sm font-medium text-muted-foreground">{t('DASHBOARD.WELCOME_BACK')}</p>
-                    <h1 className="mt-1 text-3xl md:text-4xl font-bold tracking-tight truncate">
-                        {t('DASHBOARD.HELLO')} {userData?.displayName ?? userData?.email?.split('@')[0]} 👋
+                    <h1 className="@container mt-1 text-3xl md:text-4xl font-bold tracking-tight">
+                        <FitText text={[t('DASHBOARD.HELLO'), userData?.displayName ?? userData?.email?.split('@')[0], '👋'].filter(Boolean).join(' ')}/>
                     </h1>
                     <PointsBadge equipped={equipped} className="mt-2"/>
                     {hasSteamId ? (
-                        <Badge variant="outline" className="mt-3 gap-1.5 font-mono text-muted-foreground">
+                        <Badge variant="outline" className="mt-3 max-w-full gap-1.5 font-mono text-muted-foreground">
                             <Hash className="size-3"/>
-                            {userData.steamId}
+                            <span className="min-w-0 truncate">{userData.steamId}</span>
                         </Badge>
                     ) : (
                         <Button asChild variant="link" className="mt-2 h-auto p-0">