feat(ui): modern shadcn/ui theme with violet accent across all pages

Add shadcn/ui (Radix + Tailwind 4) components, zinc/violet theme tokens and self-hosted Inter. New header with user menu, Steam cover art, skeletons and toasts. Replace @mdi/font with lucide-react. Fix: top-owned list on the landing page only showed with top-played entries; numbers use the app language.

src/components/StatCard.jsx

@@ -1,4 +1,7 @@
 import {useEffect, useState} from 'react';
+import {useTranslation} from 'react-i18next';
+
+import {Card} from '@/components/ui/card';
 
 function useCountUp(target, durationMs = 1600) {
     const [value, setValue] = useState(0);
@@ -22,19 +25,20 @@ function useCountUp(target, durationMs = 1600) {
     return value;
 }
 
-export default function StatCard({label, value, icon, suffix}) {
+export default function StatCard({label, value, icon: Icon, suffix}) {
+    const {i18n} = useTranslation();
     const animated = useCountUp(value);
     return (
-        <div className="flex flex-col items-center justify-center p-6 bg-white dark:bg-slate-800 rounded-xl shadow-sm border border-slate-200 dark:border-slate-700">
-            {icon && (
-                <i className={`mdi ${icon} text-3xl text-blue-600 dark:text-blue-400 mb-2`}></i>
+        <Card className="gap-3 p-5">
+            {Icon && (
+                <span className="flex size-9 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                    <Icon className="size-4"/>
+                </span>
             )}
-            <div className="text-4xl font-black text-slate-900 dark:text-white tabular-nums">
-                {animated.toLocaleString()}{suffix ?? ''}
+            <div className="text-3xl font-bold tracking-tight tabular-nums">
+                {animated.toLocaleString(i18n.language)}{suffix ?? ''}
             </div>
-            <div className="text-xs uppercase tracking-wider text-slate-500 dark:text-slate-400 mt-2 text-center">
-                {label}
-            </div>
-        </div>
+            <div className="text-sm text-muted-foreground">{label}</div>
+        </Card>
     );
 }