Englisch als zweite Sprache fuer die oeffentlichen Seiten

Hub und Bot-Produktseite lassen sich jetzt auf Englisch umstellen. Die Wahl
haengt am Browser (Deutsch nur, wenn der Browser es will) und bleibt im
localStorage stehen.

- src/i18n.jsx: Context mit t(), tOr(), Datums- und Zahlenformat der Sprache.
  Keine Bibliothek, die Woerterbuecher werden mitgebaut — kein Nachlade-Blitzer.
- Platzhalter im %s-Stil, dieselbe Schreibweise wie in den Bot-Texten.
- Umschalter in der Navigation, zusaetzlich im Schubladen-Menue: .auth ist auf
  schmalen Schirmen ausgeblendet, sonst waere der Wechsel dort unerreichbar.
- Datums- und Zahlenformat folgen mit (31.07.2026 / 31/07/2026, 45.231 / 45,231).
- Die Funktionsliste kommt weiter deutsch vom Server; englische Modulnamen
  liegen unter feat.<id> im Woerterbuch. Fehlt einer, bleibt der Servertext
  stehen — ein neues Modul verschwindet nie von der Seite.

Das Config-Panel und die Discord-Texte bleiben deutsch.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

frontend/src/pages/Home.jsx

@@ -4,18 +4,19 @@ import { useEffect, useState } from 'react';
 import { Link } from 'react-router-dom';
 import { apiGet } from '../api.js';
 import { Markdown } from '../markdown.jsx';
+import { useT, useFmt } from '../i18n.jsx';
 import {
     IconDevlog, IconRoadmap, IconServer, IconGallery, IconLevel, IconEvents,
     IconMessage, IconArrowRight, IconLink,
 } from '../icons.jsx';
 
 const TILES = [
-    ['/devlogs', IconDevlog, 'Devlog', 'Entwicklungs-Updates, frisch aus dem Editor'],
-    ['/roadmap', IconRoadmap, 'Roadmap', 'Meilensteine + Community-Wünsche zum Abstimmen'],
-    ['/server', IconServer, 'Server', 'Live-Status aller Game-Server mit Verlauf'],
-    ['/galerie', IconGallery, 'Galerie', 'Screenshots aus der Community'],
-    ['/level', IconLevel, 'Level', 'XP-Bestenliste — wer redet am meisten mit?'],
-    ['/events', IconEvents, 'Events', 'Playtests, Streams und was sonst ansteht'],
+    ['/devlogs', IconDevlog, 'nav.devlog', 'home.tile.devlog'],
+    ['/roadmap', IconRoadmap, 'nav.roadmap', 'home.tile.roadmap'],
+    ['/server', IconServer, 'nav.server', 'home.tile.server'],
+    ['/galerie', IconGallery, 'nav.gallery', 'home.tile.gallery'],
+    ['/level', IconLevel, 'nav.level', 'home.tile.level'],
+    ['/events', IconEvents, 'nav.events', 'home.tile.events'],
 ];
 
 /** Devlog-Text für den Teaser kürzen (erste Sätze, ohne Titel-Zeile) */
@@ -28,6 +29,8 @@ function teaser(content) {
 }
 
 export default function Home() {
+    const { t } = useT();
+    const { zahl } = useFmt();
     const [stats, setStats] = useState(null);
     const [servers, setServers] = useState(null);
     const [latest, setLatest] = useState(null);
@@ -52,22 +55,19 @@ export default function Home() {
                 <div className="page-bg-text">D4RKST3R</div>
                 <div className="page-header-grid" aria-hidden="true" />
                 <div className="page-header-content">
-                    <div className="page-tag">// Community-Hub</div>
+                    <div className="page-tag">{t('home.tag')}</div>
                     <h1 className="page-title">
-                        Willkommen<br />bei D4RKST<span className="home-accent">3</span>R
+                        {t('home.welcome')}<br />{t('home.at')} D4RKST<span className="home-accent">3</span>R
                     </h1>
-                    <p className="page-subtitle">
-                        Devlogs, Roadmap, Server-Status und alles aus der Community —
-                        an einem Ort, direkt aus dem Discord.
-                    </p>
+                    <p className="page-subtitle">{t('home.subtitle')}</p>
                     <div className="home-cta">
                         {invite && (
                             <a className="btn btn-save with-icon" href={invite} target="_blank" rel="noreferrer">
-                                <IconMessage /> Zum Discord
+                                <IconMessage /> {t('home.discord')}
                             </a>
                         )}
                         <Link className="btn btn-ghost home-cta-alt with-icon" to="/devlogs">
-                            <IconDevlog /> Devlogs lesen
+                            <IconDevlog /> {t('home.readDevlogs')}
                         </Link>
                     </div>
                 </div>
@@ -78,38 +78,38 @@ export default function Home() {
                     <div className="srv-summary home-stats">
                         {stats?.members > 0 && (
                             <div className="srv-sum-item">
-                                <span className="srv-sum-n">{stats.members.toLocaleString('de-DE')}</span>
-                                <span className="srv-sum-label">Member im Discord</span>
+                                <span className="srv-sum-n">{zahl(stats.members)}</span>
+                                <span className="srv-sum-label">{t('home.members')}</span>
                             </div>
                         )}
                         {servers?.length > 0 && (
                             <div className="srv-sum-item">
                                 <span className="srv-sum-n">{online.length}<span className="srv-sum-of"> / {servers.length}</span></span>
-                                <span className="srv-sum-label">Server online</span>
+                                <span className="srv-sum-label">{t('home.serversOnline')}</span>
                             </div>
                         )}
                         {online.length > 0 && (
                             <div className="srv-sum-item">
                                 <span className="srv-sum-n">{players}</span>
-                                <span className="srv-sum-label">Spieler gerade drauf</span>
+                                <span className="srv-sum-label">{t('home.playersNow')}</span>
                             </div>
                         )}
                     </div>
                 )}
 
                 <div className="home-tiles">
-                    {TILES.map(([to, Icon, title, desc]) => (
+                    {TILES.map(([to, Icon, titleKey, descKey]) => (
                         <Link className="card home-tile" to={to} key={to}>
                             <span className="home-tile-icon"><Icon size={26} /></span>
-                            <span className="home-tile-title">{title}</span>
-                            <span className="home-tile-desc">{desc}</span>
+                            <span className="home-tile-title">{t(titleKey)}</span>
+                            <span className="home-tile-desc">{t(descKey)}</span>
                         </Link>
                     ))}
                 </div>
 
                 {services.length > 0 && (
                     <div className="roadmap-group" style={{ marginTop: '2.5rem' }}>
-                        <h2 className="settings-title">// Dienste</h2>
+                        <h2 className="settings-title">{t('home.services')}</h2>
                         <div className="home-tiles">
                             {/* Dienst-Icons pflegt der Owner selbst — daher bleiben es Emojis */}
                             {services.map((s) => (
@@ -127,12 +127,12 @@ export default function Home() {
 
                 {latest && (
                     <div className="roadmap-group" style={{ marginTop: '2.5rem' }}>
-                        <h2 className="settings-title">// Neuestes Devlog</h2>
+                        <h2 className="settings-title">{t('home.latestDevlog')}</h2>
                         <Link to="/devlogs" className="card home-devlog">
                             <div className="card-body">
                                 <Markdown text={teaser(latest.content)} />
                             </div>
-                            <span className="home-devlog-more with-icon">Weiterlesen <IconArrowRight size={14} /></span>
+                            <span className="home-devlog-more with-icon">{t('home.more')} <IconArrowRight size={14} /></span>
                         </Link>
                     </div>
                 )}