feat(stats): add platform statistics and landing blocks

Add PlatformStats component to stats page. Extract YearBars from
FinishedStats for reuse on landing. Add three blocks to landing: games
per platform, top genres, finished per year. Update translations.

src/pages/LandingPage.jsx

@@ -11,7 +11,10 @@ import {Skeleton} from '@/components/ui/skeleton';
 import GameCover from '../components/GameCover.jsx';
 import Logo from '../components/Logo.jsx';
 import StatCard from '../components/StatCard.jsx';
+import {YearBars} from '../components/stats/FinishedStats.jsx';
+import {TagBars} from '../components/stats/TasteStats.jsx';
 import useSession from '../hooks/useSession.js';
+import {genreKey} from '../utils/stats.js';
 
 import usePublicStats from '../hooks/usePublicStats.js';
 
@@ -36,6 +39,15 @@ function RankedGames({title, games, formatValue}) {
     );
 }
 
+function BarsCard({title, children}) {
+    return (
+        <Card className="gap-0 py-0">
+            <h3 className="flex items-center gap-2 border-b px-5 py-4 font-semibold">{title}</h3>
+            <div className="px-5 py-4">{children}</div>
+        </Card>
+    );
+}
+
 export default function LandingPage() {
     const {t, i18n} = useTranslation();
     const {data, isLoading} = usePublicStats();
@@ -102,6 +114,25 @@ export default function LandingPage() {
                         />
                     )}
                 </div>
+
+                <div className="grid grid-cols-1 gap-6 md:grid-cols-3">
+                    {core?.gamesPerPlatform?.length > 0 && (
+                        <BarsCard title={t('LANDING.PLATFORMS')}>
+                            <TagBars tags={core.gamesPerPlatform}/>
+                        </BarsCard>
+                    )}
+                    {core?.topGenres?.length > 0 && (
+                        <BarsCard title={t('LANDING.TOP_GENRES')}>
+                            <TagBars tags={core.topGenres}
+                                     label={(name) => t(`STATS.GENRE.${genreKey(name)}`, {defaultValue: name})}/>
+                        </BarsCard>
+                    )}
+                    {core?.finishedPerYear?.length > 0 && (
+                        <BarsCard title={t('LANDING.FINISHED_PER_YEAR')}>
+                            <YearBars perYear={core.finishedPerYear}/>
+                        </BarsCard>
+                    )}
+                </div>
             </section>
         </div>
     );