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/AddGamePanel.jsx

@@ -10,6 +10,7 @@ import {Input} from '@/components/ui/input';
 import {Label} from '@/components/ui/label';
 import {Select, SelectContent, SelectItem, SelectTrigger, SelectValue} from '@/components/ui/select';
 import GameCover from './GameCover.jsx';
+import FitText from './FitText.jsx';
 import GameSearch from './GameSearch.jsx';
 import useStartImport from '../hooks/useStartImport.js';
 import {GAME_STATUSES, MAX_PLATFORM_LENGTH} from '../utils/limits.js';
@@ -122,7 +123,9 @@ function AddForm({hit, favorite, onBack, navigate}) {
         <form onSubmit={submit} className="space-y-4">
             <div className="flex items-center gap-3">
                 <GameCover appid={hit.appid} imageUrl={hit.imageUrl} className="w-24 shrink-0"/>
-                <div className="min-w-0 font-medium">{hit.name}{hit.year ? ` (${hit.year})` : ''}</div>
+                <div className="@container min-w-0 flex-1 font-medium">
+                    <FitText text={`${hit.name}${hit.year ? ` (${hit.year})` : ''}`}/>
+                </div>
             </div>
             <div className="grid gap-4 sm:grid-cols-3">
                 <div className="space-y-2">