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/pages/GameCatalogPage.jsx

@@ -9,6 +9,7 @@ import {Card, CardContent, CardHeader, CardTitle} from '@/components/ui/card';
 import {Input} from '@/components/ui/input';
 import GameCorrectionDialog from '../components/GameCorrectionDialog.jsx';
 import GameCover from '../components/GameCover.jsx';
+import FitText from '../components/FitText.jsx';
 import PageContainer from '../components/PageContainer.jsx';
 import {fetchCatalogGame, searchCatalog} from '../utils/corrections.js';
 import {MAX_LIBRARY_SEARCH_LENGTH} from '../utils/limits.js';
@@ -137,8 +138,8 @@ export default function GameCatalogPage() {
                             {result.content.map((game) => (
                                 <li key={game.appid} className="flex items-center gap-3 py-2">
                                     <GameCover appid={game.appid} imageUrl={game.imageUrl} className="w-20 shrink-0"/>
-                                    <div className="min-w-0 flex-1">
-                                        <p className="truncate text-sm font-medium">{game.name}</p>
+                                    <div className="@container min-w-0 flex-1">
+                                        <p className="text-sm font-medium"><FitText text={game.name}/></p>
                                         <p className="text-xs text-muted-foreground">
                                             {game.platforms.join(', ')} · {t('CATALOG.KEY', {appid: game.appid})}
                                         </p>