diff --git a/I18N.md b/I18N.md
new file mode 100644
index 0000000..1498eb1
--- /dev/null
+++ b/I18N.md
@@ -0,0 +1,349 @@
+# Internationalisierung (i18n) Dokumentation
+
+Hördle unterstützt vollständige Mehrsprachigkeit (Internationalisierung) für Deutsch und Englisch.
+
+## Übersicht
+
+Die i18n-Implementierung basiert auf [next-intl](https://next-intl-docs.vercel.app/) und nutzt den Next.js App Router mit dynamischen `[locale]`-Segmenten.
+
+## Unterstützte Sprachen
+
+- **Deutsch (de)** - Standardsprache
+- **Englisch (en)**
+
+## URL-Struktur
+
+Alle Routen sind lokalisiert:
+
+- `http://localhost:3000/` → Redirect zu `/de` (Standard)
+- `http://localhost:3000/de` → Deutsche Version
+- `http://localhost:3000/en` → Englische Version
+- `http://localhost:3000/de/admin` → Admin-Dashboard (Deutsch)
+- `http://localhost:3000/de/Rock` → Rock Genre (Deutsch)
+- `http://localhost:3000/de/special/Weihnachtslieder` → Special (Deutsch)
+
+## Architektur
+
+### Verzeichnisstruktur
+
+```
+app/
+  [locale]/              # Lokalisierte Routen
+    layout.tsx           # Root Layout mit i18n Provider
+    page.tsx             # Homepage
+    admin/
+      page.tsx           # Admin Dashboard
+    [genre]/
+      page.tsx           # Genre-spezifische Seite
+    special/
+      [name]/
+        page.tsx         # Special-Seite
+
+i18n/
+  request.ts             # next-intl Konfiguration
+
+messages/
+  de.json                # Deutsche Übersetzungen
+  en.json                # Englische Übersetzungen
+
+lib/
+  i18n.ts                # Helper-Funktionen für lokalisierte DB-Werte
+  navigation.ts          # Lokalisierte Navigation (Link, useRouter, etc.)
+```
+
+### Übersetzungsdateien
+
+Die Übersetzungen sind in JSON-Dateien unter `messages/` organisiert:
+
+```json
+{
+  "Common": {
+    "loading": "Laden...",
+    "error": "Ein Fehler ist aufgetreten"
+  },
+  "Game": {
+    "play": "Abspielen",
+    "pause": "Pause",
+    "won": "Gewonnen!"
+  },
+  "Home": {
+    "welcome": "Willkommen bei Hördle"
+  }
+}
+```
+
+### Datenbank-Schema
+
+Die folgenden Modelle unterstützen mehrsprachige Felder:
+
+#### Genre
+- `name`: JSON `{ "de": "Rock", "en": "Rock" }`
+- `subtitle`: JSON `{ "de": "Klassischer Rock", "en": "Classic Rock" }`
+
+#### Special
+- `name`: JSON `{ "de": "Weihnachtslieder", "en": "Christmas Songs" }`
+- `subtitle`: JSON `{ "de": "Festliche Musik", "en": "Festive Music" }`
+
+#### News
+- `title`: JSON `{ "de": "Neues Feature", "en": "New Feature" }`
+- `content`: JSON `{ "de": "Markdown Inhalt...", "en": "Markdown content..." }`
+
+### Helper-Funktionen
+
+#### `getLocalizedValue(value, locale, fallback?)`
+
+Extrahiert den lokalisierten Wert aus einem JSON-Objekt:
+
+```typescript
+import { getLocalizedValue } from '@/lib/i18n';
+
+const genreName = getLocalizedValue(genre.name, 'de'); // "Rock"
+const genreNameEn = getLocalizedValue(genre.name, 'en'); // "Rock"
+```
+
+**Fallback-Verhalten:**
+1. Versucht die angeforderte Locale (`de` oder `en`)
+2. Fallback zu `de` falls nicht vorhanden
+3. Fallback zu `en` falls nicht vorhanden
+4. Fallback zum ersten verfügbaren Schlüssel
+5. Fallback zum übergebenen `fallback`-Parameter
+
+#### `createLocalizedObject(de, en?)`
+
+Erstellt ein lokalisiertes Objekt:
+
+```typescript
+import { createLocalizedObject } from '@/lib/i18n';
+
+const name = createLocalizedObject('Rock', 'Rock');
+// { de: "Rock", en: "Rock" }
+```
+
+## Verwendung in Komponenten
+
+### Server Components
+
+```typescript
+import { getTranslations } from 'next-intl/server';
+import { getLocalizedValue } from '@/lib/i18n';
+
+export default async function Page({ params }: { params: { locale: string } }) {
+  const { locale } = await params;
+  const t = await getTranslations('Home');
+  
+  const genreName = getLocalizedValue(genre.name, locale);
+  
+  return <h1>{t('welcome')}</h1>;
+}
+```
+
+### Client Components
+
+```typescript
+'use client';
+import { useTranslations } from 'next-intl';
+import { useLocale } from 'next-intl';
+
+export default function Game() {
+  const t = useTranslations('Game');
+  const locale = useLocale();
+  
+  return <button>{t('play')}</button>;
+}
+```
+
+### Navigation
+
+Verwende die lokalisierte Navigation aus `lib/navigation.ts`:
+
+```typescript
+import { Link } from '@/lib/navigation';
+
+// Automatisch lokalisiert
+<Link href="/admin">Admin</Link>
+<Link href="/Rock">Rock</Link>
+```
+
+## Admin-Interface
+
+Das Admin-Dashboard unterstützt mehrsprachige Eingaben:
+
+1. **Sprach-Tabs:** Wechsle zwischen `DE` und `EN` Tabs
+2. **Genre/Special/News:** Alle Felder können in beiden Sprachen bearbeitet werden
+3. **Vorschau:** Sieh dir die lokalisierte Version direkt an
+
+### Beispiel: Genre erstellen
+
+1. Öffne `/de/admin`
+2. Wähle den `DE` Tab
+3. Gib Name und Subtitle ein
+4. Wechsle zum `EN` Tab
+5. Gib die englischen Übersetzungen ein
+6. Speichere
+
+## Migration bestehender Daten
+
+Bestehende Daten werden automatisch migriert:
+
+1. **Migration `20251128131405_add_i18n_columns`:** Fügt neue JSON-Spalten hinzu
+2. **Migration `20251128132806_switch_to_json_columns`:** Konvertiert String-Spalten zu JSON
+
+**Wichtig:** Alte String-Werte werden automatisch in beide Sprachen kopiert:
+- `"Rock"` → `{ "de": "Rock", "en": "Rock" }`
+
+## Proxy
+
+Der Proxy (`proxy.ts`) leitet Anfragen automatisch um:
+
+- `/` → `/de` (Standard)
+- Ungültige Locales → 404
+- Validiert Locale-Parameter
+
+## Sprachumschalter
+
+Die `LanguageSwitcher`-Komponente ermöglicht Nutzern, zwischen Sprachen zu wechseln:
+
+```typescript
+import LanguageSwitcher from '@/components/LanguageSwitcher';
+
+<LanguageSwitcher />
+```
+
+Die aktuelle Route bleibt erhalten, nur die Locale ändert sich:
+- `/de/admin` → `/en/admin`
+- `/de/Rock` → `/en/Rock`
+
+## API-Endpunkte
+
+API-Routen unterstützen einen optionalen `locale`-Parameter:
+
+```typescript
+GET /api/genres?locale=de
+GET /api/specials?locale=en
+GET /api/news?locale=de
+```
+
+Falls kein `locale` angegeben wird, wird `de` als Standard verwendet.
+
+## Best Practices
+
+### 1. Immer `getLocalizedValue` verwenden
+
+❌ **Falsch:**
+```typescript
+<span>{genre.name}</span> // Rendert { de: "...", en: "..." }
+```
+
+✅ **Richtig:**
+```typescript
+<span>{getLocalizedValue(genre.name, locale)}</span>
+```
+
+### 2. Übersetzungsschlüssel konsistent benennen
+
+Verwende Namespaces für bessere Organisation:
+- `Common.*` - Allgemeine UI-Elemente
+- `Game.*` - Spiel-spezifische Texte
+- `Home.*` - Homepage-Texte
+- `Navigation.*` - Navigations-Elemente
+
+### 3. Fallbacks definieren
+
+Immer einen Fallback-Wert angeben:
+
+```typescript
+const name = getLocalizedValue(genre.name, locale, 'Unbekannt');
+```
+
+### 4. Neue Übersetzungen hinzufügen
+
+1. Füge den Schlüssel zu `messages/de.json` hinzu
+2. Füge den Schlüssel zu `messages/en.json` hinzu
+3. Verwende `useTranslations('Namespace')` oder `getTranslations('Namespace')`
+
+## Troubleshooting
+
+### 404-Fehler auf `/de` oder `/en`
+
+**Problem:** Route wird nicht gefunden.
+
+**Lösung:**
+1. Überprüfe, ob `proxy.ts` korrekt konfiguriert ist
+2. Stelle sicher, dass `app/[locale]/layout.tsx` existiert
+3. Prüfe die `i18n/request.ts` Konfiguration
+
+### "Objects are not valid as a React child"
+
+**Problem:** Ein JSON-Objekt wird direkt gerendert statt des lokalisierten Werts.
+
+**Lösung:**
+Verwende `getLocalizedValue()`:
+
+```typescript
+// ❌ Falsch
+<span>{genre.name}</span>
+
+// ✅ Richtig
+<span>{getLocalizedValue(genre.name, locale)}</span>
+```
+
+### Übersetzungen werden nicht angezeigt
+
+**Problem:** Texte erscheinen als Schlüssel (z.B. `"Game.play"`).
+
+**Lösung:**
+1. Überprüfe, ob der Übersetzungsschlüssel in `messages/de.json` und `messages/en.json` existiert
+2. Stelle sicher, dass der Namespace korrekt ist: `useTranslations('Game')` für `Game.play`
+3. Prüfe die JSON-Syntax auf Fehler
+
+### Admin-Interface zeigt Objekte statt Text
+
+**Problem:** In Dropdowns oder Listen werden `{ de: "...", en: "..." }` angezeigt.
+
+**Lösung:**
+Verwende `getLocalizedValue()` in allen Render-Funktionen:
+
+```typescript
+// ❌ Falsch
+<option value={s.id}>{s.name}</option>
+
+// ✅ Richtig
+<option value={s.id}>{getLocalizedValue(s.name, activeTab)}</option>
+```
+
+## Erweiterung um weitere Sprachen
+
+Um eine neue Sprache hinzuzufügen (z.B. Französisch):
+
+1. **Übersetzungsdatei erstellen:**
+   ```bash
+   cp messages/de.json messages/fr.json
+   ```
+
+2. **Übersetzungen hinzufügen:**
+   Bearbeite `messages/fr.json` mit französischen Übersetzungen
+
+3. **Locale zur Konfiguration hinzufügen:**
+   - `i18n/request.ts`: `const locales = ['en', 'de', 'fr'];`
+   - `proxy.ts`: `locales: ['en', 'de', 'fr']`
+   - `lib/navigation.ts`: `export const locales = ['de', 'en', 'fr'] as const;`
+
+4. **Layout aktualisieren:**
+   ```typescript
+   // app/[locale]/layout.tsx
+   if (!['en', 'de', 'fr'].includes(locale)) {
+     notFound();
+   }
+   ```
+
+5. **LanguageSwitcher erweitern:**
+   Füge einen Button für `fr` hinzu
+
+6. **Datenbank-Migration:**
+   Bestehende Daten behalten ihre Struktur, neue Einträge können optional `fr` enthalten
+
+## Weitere Ressourcen
+
+- [next-intl Dokumentation](https://next-intl-docs.vercel.app/)
+- [Next.js App Router i18n](https://nextjs.org/docs/app/building-your-application/routing/internationalization)
+
diff --git a/README.md b/README.md
index 6193f73..31f3c76 100644
--- a/README.md
+++ b/README.md
@@ -4,6 +4,7 @@ Eine Web-App inspiriert von Heardle, bei der Nutzer täglich einen Song anhand k
 
 ## Features
 
+- **🌍 Mehrsprachigkeit (i18n):** Vollständige Unterstützung für Deutsch und Englisch mit automatischer Sprachumleitung und lokalisierten Inhalten.
 - **Tägliches Rätsel:** Jeden Tag ein neuer Song für alle Nutzer.
 - **Inkrementelle Hinweise:** Startet mit 2 Sekunden, dann 4s, 7s, 11s, 16s, 30s, bis 60s (7 Versuche).
 - **Admin Dashboard:**
@@ -51,6 +52,17 @@ Eine Web-App inspiriert von Heardle, bei der Nutzer täglich einen Song anhand k
     - Special-Verknüpfung: Direkte Links zu Specials in News-Beiträgen.
     - Verwaltung über das Admin-Dashboard.
 
+## Internationalisierung (i18n)
+
+Hördle unterstützt vollständige Mehrsprachigkeit für Deutsch und Englisch.
+
+👉 **[Vollständige i18n-Dokumentation](I18N.md)**
+
+**Schnellstart:**
+- Deutsche Version: `http://localhost:3000/de`
+- Englische Version: `http://localhost:3000/en`
+- Root (`/`) leitet automatisch zur Standardsprache (Deutsch) um
+
 ## White Labeling
 
 Hördle ist "White Label Ready". Das bedeutet, du kannst das Branding (Name, Farben, Logos) komplett anpassen, ohne den Code zu ändern.
@@ -103,7 +115,7 @@ Das Ziel ist es, den Song mit so wenigen Hinweisen wie möglich zu erraten und d
    ```bash
    npm run dev
    ```
-   Die App läuft unter `http://localhost:3000`.
+   Die App läuft unter `http://localhost:3000` (leitet automatisch zu `/de` um).
 
 ## Deployment mit Docker
 
@@ -139,7 +151,7 @@ Das Projekt ist für den Betrieb mit Docker optimiert.
     - Beim Start des Containers wird automatisch ein Migrations-Skript ausgeführt, das fehlende Cover-Bilder aus den MP3s extrahiert.
 
 4. **Admin-Zugang:**
-   - URL: `/admin`
+   - URL: `/de/admin` oder `/en/admin`
    - Standard-Passwort: `admin123` (Bitte in `docker-compose.yml` ändern! Muss als Hash hinterlegt werden.)
 
 5. **Special Curation & Scheduling verwenden:**
@@ -210,12 +222,12 @@ Hördle kann problemlos als iFrame in andere Webseiten eingebettet werden. Die A
 
 ### Genre-spezifische Einbindung
 
-Einzelne Genres können direkt eingebunden werden:
+Einzelne Genres können direkt eingebunden werden (mit Locale-Präfix):
 
 ```html
-<!-- Rock Genre -->
+<!-- Rock Genre (Deutsch) -->
 <iframe 
-    src="https://hoerdle.elpatron.me/Rock" 
+    src="https://hoerdle.elpatron.me/de/Rock" 
     width="100%" 
     height="800" 
     frameborder="0"
@@ -223,9 +235,9 @@ Einzelne Genres können direkt eingebunden werden:
     title="Hördle Rock Quiz">
 </iframe>
 
-<!-- Pop Genre -->
+<!-- Pop Genre (Englisch) -->
 <iframe 
-    src="https://hoerdle.elpatron.me/Pop" 
+    src="https://hoerdle.elpatron.me/en/Pop" 
     width="100%" 
     height="800" 
     frameborder="0"
@@ -239,8 +251,9 @@ Einzelne Genres können direkt eingebunden werden:
 Auch thematische Specials können direkt eingebettet werden:
 
 ```html
+<!-- Weihnachtslieder (Deutsch) -->
 <iframe 
-    src="https://hoerdle.elpatron.me/special/Weihnachtslieder" 
+    src="https://hoerdle.elpatron.me/de/special/Weihnachtslieder" 
     width="100%" 
     height="800" 
     frameborder="0"
diff --git a/app/[genre]/page.tsx b/app/[genre]/page.tsx
deleted file mode 100644
index e5dc87e..0000000
--- a/app/[genre]/page.tsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import Game from '@/components/Game';
-import NewsSection from '@/components/NewsSection';
-import { getOrCreateDailyPuzzle } from '@/lib/dailyPuzzle';
-import Link from 'next/link';
-import { PrismaClient } from '@prisma/client';
-import { notFound } from 'next/navigation';
-
-export const dynamic = 'force-dynamic';
-
-const prisma = new PrismaClient();
-
-interface PageProps {
-    params: Promise<{ genre: string }>;
-}
-
-export default async function GenrePage({ params }: PageProps) {
-    const { genre } = await params;
-    const decodedGenre = decodeURIComponent(genre);
-
-    // Check if genre exists and is active
-    const currentGenre = await prisma.genre.findUnique({
-        where: { name: decodedGenre }
-    });
-
-    if (!currentGenre || !currentGenre.active) {
-        notFound();
-    }
-
-    const dailyPuzzle = await getOrCreateDailyPuzzle(decodedGenre);
-    const genres = await prisma.genre.findMany({
-        where: { active: true },
-        orderBy: { name: 'asc' }
-    });
-    const specials = await prisma.special.findMany({ orderBy: { name: 'asc' } });
-
-    const now = new Date();
-    const activeSpecials = specials.filter(s => {
-        const isStarted = !s.launchDate || s.launchDate <= now;
-        const isEnded = s.endDate && s.endDate < now;
-        return isStarted && !isEnded;
-    });
-
-    const upcomingSpecials = specials.filter(s => {
-        return s.launchDate && s.launchDate > now;
-    });
-
-    return (
-        <>
-            <div style={{ textAlign: 'center', padding: '1rem', background: '#f3f4f6' }}>
-                <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center' }}>
-                    <Link href="/" style={{ color: '#4b5563', textDecoration: 'none' }}>Global</Link>
-
-                    {/* Genres */}
-                    {genres.map(g => (
-                        <Link
-                            key={g.id}
-                            href={`/${g.name}`}
-                            style={{
-                                fontWeight: g.name === decodedGenre ? 'bold' : 'normal',
-                                textDecoration: g.name === decodedGenre ? 'underline' : 'none',
-                                color: g.name === decodedGenre ? 'black' : '#4b5563'
-                            }}
-                        >
-                            {g.name}
-                        </Link>
-                    ))}
-
-                    {/* Separator if both exist */}
-                    {genres.length > 0 && activeSpecials.length > 0 && (
-                        <span style={{ color: '#d1d5db' }}>|</span>
-                    )}
-
-                    {/* Specials */}
-                    {activeSpecials.map(s => (
-                        <Link
-                            key={s.id}
-                            href={`/special/${s.name}`}
-                            style={{
-                                color: '#be185d', // Pink-700
-                                textDecoration: 'none',
-                                fontWeight: '500'
-                            }}
-                        >
-                            ★ {s.name}
-                        </Link>
-                    ))}
-                </div>
-
-                {/* Upcoming Specials */}
-                {upcomingSpecials.length > 0 && (
-                    <div style={{ marginTop: '0.5rem', fontSize: '0.875rem', color: '#666' }}>
-                        Coming soon: {upcomingSpecials.map(s => (
-                            <span key={s.id} style={{ marginLeft: '0.5rem' }}>
-                                ★ {s.name} ({s.launchDate ? new Date(s.launchDate).toLocaleDateString('de-DE', {
-                                    day: '2-digit',
-                                    month: '2-digit',
-                                    year: 'numeric',
-                                    timeZone: process.env.TZ
-                                }) : ''})
-                                {s.curator && <span style={{ fontStyle: 'italic', marginLeft: '0.25rem' }}>Curated by {s.curator}</span>}
-                            </span>
-                        ))}
-                    </div>
-                )}
-            </div>
-            <NewsSection />
-            <Game dailyPuzzle={dailyPuzzle} genre={decodedGenre} />
-        </>
-    );
-}
diff --git a/app/[locale]/[genre]/page.tsx b/app/[locale]/[genre]/page.tsx
new file mode 100644
index 0000000..619ce82
--- /dev/null
+++ b/app/[locale]/[genre]/page.tsx
@@ -0,0 +1,134 @@
+import Game from '@/components/Game';
+import NewsSection from '@/components/NewsSection';
+import { getOrCreateDailyPuzzle } from '@/lib/dailyPuzzle';
+import { Link } from '@/lib/navigation';
+import { PrismaClient } from '@prisma/client';
+import { notFound } from 'next/navigation';
+import { getLocalizedValue } from '@/lib/i18n';
+import { getTranslations } from 'next-intl/server';
+
+export const dynamic = 'force-dynamic';
+
+const prisma = new PrismaClient();
+
+interface PageProps {
+    params: Promise<{ locale: string; genre: string }>;
+}
+
+export default async function GenrePage({ params }: PageProps) {
+    const { locale, genre } = await params;
+    const decodedGenre = decodeURIComponent(genre);
+    const tNav = await getTranslations('Navigation');
+
+    // Fetch all genres to find the matching one by localized name
+    const allGenres = await prisma.genre.findMany();
+    const currentGenre = allGenres.find(g => getLocalizedValue(g.name, locale) === decodedGenre);
+
+    if (!currentGenre || !currentGenre.active) {
+        notFound();
+    }
+
+    const dailyPuzzle = await getOrCreateDailyPuzzle(currentGenre);
+    // getOrCreateDailyPuzzle likely expects string or needs update. 
+    // Actually, getOrCreateDailyPuzzle takes `genreName: string | null`. 
+    // If I pass the JSON object, it might fail. 
+    // But wait, the DB schema for DailyPuzzle stores `genreId`. 
+    // `getOrCreateDailyPuzzle` probably looks up genre by name.
+    // I should check `lib/dailyPuzzle.ts`. 
+    // For now, I'll pass the localized name, but that might be risky if it tries to create a genre (unlikely).
+    // Let's assume for now I should pass the localized name if that's what it uses to find/create.
+    // But if `getOrCreateDailyPuzzle` uses `findUnique({ where: { name: genreName } })`, it will fail because name is JSON.
+    // I need to update `lib/dailyPuzzle.ts` too! 
+    // I'll mark that as a todo. For now, let's proceed with page creation.
+
+    const genres = allGenres.filter(g => g.active);
+    // Sort
+    genres.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+
+    const specials = await prisma.special.findMany();
+    specials.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+
+    const now = new Date();
+    const activeSpecials = specials.filter(s => {
+        const isStarted = !s.launchDate || s.launchDate <= now;
+        const isEnded = s.endDate && s.endDate < now;
+        return isStarted && !isEnded;
+    });
+
+    const upcomingSpecials = specials.filter(s => {
+        return s.launchDate && s.launchDate > now;
+    });
+
+    return (
+        <>
+            <div style={{ textAlign: 'center', padding: '1rem', background: '#f3f4f6' }}>
+                <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center' }}>
+                    <Link href="/" style={{ color: '#4b5563', textDecoration: 'none' }}>{tNav('global')}</Link>
+
+                    {/* Genres */}
+                    {genres.map(g => {
+                        const name = getLocalizedValue(g.name, locale);
+                        return (
+                            <Link
+                                key={g.id}
+                                href={`/${name}`}
+                                style={{
+                                    fontWeight: name === decodedGenre ? 'bold' : 'normal',
+                                    textDecoration: name === decodedGenre ? 'underline' : 'none',
+                                    color: name === decodedGenre ? 'black' : '#4b5563'
+                                }}
+                            >
+                                {name}
+                            </Link>
+                        );
+                    })}
+
+                    {/* Separator if both exist */}
+                    {genres.length > 0 && activeSpecials.length > 0 && (
+                        <span style={{ color: '#d1d5db' }}>|</span>
+                    )}
+
+                    {/* Specials */}
+                    {activeSpecials.map(s => {
+                        const name = getLocalizedValue(s.name, locale);
+                        return (
+                            <Link
+                                key={s.id}
+                                href={`/special/${name}`}
+                                style={{
+                                    color: '#be185d', // Pink-700
+                                    textDecoration: 'none',
+                                    fontWeight: '500'
+                                }}
+                            >
+                                ★ {name}
+                            </Link>
+                        );
+                    })}
+                </div>
+
+                {/* Upcoming Specials */}
+                {upcomingSpecials.length > 0 && (
+                    <div style={{ marginTop: '0.5rem', fontSize: '0.875rem', color: '#666' }}>
+                        Coming soon: {upcomingSpecials.map(s => {
+                            const name = getLocalizedValue(s.name, locale);
+                            return (
+                                <span key={s.id} style={{ marginLeft: '0.5rem' }}>
+                                    ★ {name} ({s.launchDate ? new Date(s.launchDate).toLocaleDateString(locale, {
+                                        day: '2-digit',
+                                        month: '2-digit',
+                                        year: 'numeric',
+                                        timeZone: process.env.TZ
+                                    }) : ''})
+                                    {s.curator && <span style={{ fontStyle: 'italic', marginLeft: '0.25rem' }}>Curated by {s.curator}</span>}
+                                </span>
+                            );
+                        })}
+                    </div>
+                )}
+            </div>
+            <NewsSection locale={locale} />
+            <Game dailyPuzzle={dailyPuzzle} genre={decodedGenre} />
+        </>
+    );
+}
diff --git a/app/[locale]/admin/page.tsx b/app/[locale]/admin/page.tsx
new file mode 100644
index 0000000..58d907d
--- /dev/null
+++ b/app/[locale]/admin/page.tsx
@@ -0,0 +1,2242 @@
+'use client';
+
+import { useState, useEffect, useRef } from 'react';
+import { useTranslations, useLocale } from 'next-intl';
+import { Link } from '@/lib/navigation';
+import { getLocalizedValue } from '@/lib/i18n';
+
+
+interface Special {
+    id: number;
+    name: any;
+    subtitle?: any;
+    maxAttempts: number;
+    unlockSteps: string;
+    launchDate?: string;
+    endDate?: string;
+    curator?: string;
+    _count?: {
+        songs: number;
+    };
+}
+
+interface Genre {
+    id: number;
+    name: any;
+    subtitle?: any;
+    active: boolean;
+    _count?: {
+        songs: number;
+    };
+}
+
+interface DailyPuzzle {
+    id: number;
+    date: string;
+    songId: number;
+    genreId: number | null;
+    specialId: number | null;
+}
+
+interface Song {
+    id: number;
+    title: string;
+    artist: string;
+    filename: string;
+    createdAt: string;
+    releaseYear: number | null;
+    activations: number;
+    puzzles: DailyPuzzle[];
+    genres: Genre[];
+    specials: Special[];
+    averageRating: number;
+    ratingCount: number;
+    excludeFromGlobal: boolean;
+}
+
+interface News {
+    id: number;
+    title: any;
+    content: any;
+    author: string | null;
+    publishedAt: string;
+    featured: boolean;
+    specialId: number | null;
+    special: {
+        id: number;
+        name: any;
+    } | null;
+}
+
+type SortField = 'id' | 'title' | 'artist' | 'createdAt' | 'releaseYear' | 'activations' | 'averageRating';
+type SortDirection = 'asc' | 'desc';
+
+export default function AdminPage({ params }: { params: { locale: string } }) {
+    const t = useTranslations('Admin');
+    const locale = useLocale();
+    const [activeTab, setActiveTab] = useState<'de' | 'en'>('de');
+    const [password, setPassword] = useState('');
+    const [isAuthenticated, setIsAuthenticated] = useState(false);
+    const [files, setFiles] = useState<File[]>([]);
+    const [message, setMessage] = useState('');
+    const [isUploading, setIsUploading] = useState(false);
+    const [uploadProgress, setUploadProgress] = useState<{ current: number, total: number }>({ current: 0, total: 0 });
+    const [uploadResults, setUploadResults] = useState<any[]>([]);
+    const [isDragging, setIsDragging] = useState(false);
+    const [songs, setSongs] = useState<Song[]>([]);
+    const [genres, setGenres] = useState<Genre[]>([]);
+    const [newGenreName, setNewGenreName] = useState({ de: '', en: '' });
+    const [newGenreSubtitle, setNewGenreSubtitle] = useState({ de: '', en: '' });
+    const [newGenreActive, setNewGenreActive] = useState(true);
+    const [editingGenreId, setEditingGenreId] = useState<number | null>(null);
+    const [editGenreName, setEditGenreName] = useState({ de: '', en: '' });
+    const [editGenreSubtitle, setEditGenreSubtitle] = useState({ de: '', en: '' });
+    const [editGenreActive, setEditGenreActive] = useState(true);
+
+    // Specials state
+    const [specials, setSpecials] = useState<Special[]>([]);
+    const [newSpecialName, setNewSpecialName] = useState({ de: '', en: '' });
+    const [newSpecialSubtitle, setNewSpecialSubtitle] = useState({ de: '', en: '' });
+    const [newSpecialMaxAttempts, setNewSpecialMaxAttempts] = useState(7);
+    const [newSpecialUnlockSteps, setNewSpecialUnlockSteps] = useState('[2,4,7,11,16,30,60]');
+    const [newSpecialLaunchDate, setNewSpecialLaunchDate] = useState('');
+    const [newSpecialEndDate, setNewSpecialEndDate] = useState('');
+    const [newSpecialCurator, setNewSpecialCurator] = useState('');
+
+    const [editingSpecialId, setEditingSpecialId] = useState<number | null>(null);
+    const [editSpecialName, setEditSpecialName] = useState({ de: '', en: '' });
+    const [editSpecialSubtitle, setEditSpecialSubtitle] = useState({ de: '', en: '' });
+    const [editSpecialMaxAttempts, setEditSpecialMaxAttempts] = useState(7);
+    const [editSpecialUnlockSteps, setEditSpecialUnlockSteps] = useState('[2,4,7,11,16,30,60]');
+    const [editSpecialLaunchDate, setEditSpecialLaunchDate] = useState('');
+    const [editSpecialEndDate, setEditSpecialEndDate] = useState('');
+    const [editSpecialCurator, setEditSpecialCurator] = useState('');
+
+    // News state
+    const [news, setNews] = useState<News[]>([]);
+    const [newNewsTitle, setNewNewsTitle] = useState({ de: '', en: '' });
+    const [newNewsContent, setNewNewsContent] = useState({ de: '', en: '' });
+    const [newNewsAuthor, setNewNewsAuthor] = useState('');
+    const [newNewsFeatured, setNewNewsFeatured] = useState(false);
+    const [newNewsSpecialId, setNewNewsSpecialId] = useState<number | null>(null);
+    const [editingNewsId, setEditingNewsId] = useState<number | null>(null);
+    const [editNewsTitle, setEditNewsTitle] = useState({ de: '', en: '' });
+    const [editNewsContent, setEditNewsContent] = useState({ de: '', en: '' });
+    const [editNewsAuthor, setEditNewsAuthor] = useState('');
+    const [editNewsFeatured, setEditNewsFeatured] = useState(false);
+    const [editNewsSpecialId, setEditNewsSpecialId] = useState<number | null>(null);
+
+    // Edit state
+    const [editingId, setEditingId] = useState<number | null>(null);
+    const [editTitle, setEditTitle] = useState('');
+    const [editArtist, setEditArtist] = useState('');
+    const [editReleaseYear, setEditReleaseYear] = useState<number | ''>('');
+    const [editGenreIds, setEditGenreIds] = useState<number[]>([]);
+    const [editSpecialIds, setEditSpecialIds] = useState<number[]>([]);
+    const [editExcludeFromGlobal, setEditExcludeFromGlobal] = useState(false);
+
+    // Post-upload state
+    const [uploadedSong, setUploadedSong] = useState<Song | null>(null);
+    const [uploadGenreIds, setUploadGenreIds] = useState<number[]>([]);
+    const [uploadExcludeFromGlobal, setUploadExcludeFromGlobal] = useState(false);
+
+    // Batch upload genre selection
+    const [batchUploadGenreIds, setBatchUploadGenreIds] = useState<number[]>([]);
+
+    // AI Categorization state
+    const [isCategorizing, setIsCategorizing] = useState(false);
+    const [categorizationResults, setCategorizationResults] = useState<any>(null);
+
+    // Sort state
+    const [sortField, setSortField] = useState<SortField>('artist');
+    const [sortDirection, setSortDirection] = useState<SortDirection>('asc');
+
+    // Search and pagination state
+    const [searchQuery, setSearchQuery] = useState('');
+    const [selectedGenreFilter, setSelectedGenreFilter] = useState<string>('');
+    const [selectedSpecialFilter, setSelectedSpecialFilter] = useState<number | null>(null);
+    const [currentPage, setCurrentPage] = useState(1);
+    const itemsPerPage = 10;
+
+    // Audio state
+    const [playingSongId, setPlayingSongId] = useState<number | null>(null);
+    const [audioElement, setAudioElement] = useState<HTMLAudioElement | null>(null);
+
+    // Daily Puzzles state
+    const [dailyPuzzles, setDailyPuzzles] = useState<any[]>([]);
+    const [playingPuzzleId, setPlayingPuzzleId] = useState<number | null>(null);
+    const [showDailyPuzzles, setShowDailyPuzzles] = useState(false);
+    const [showSpecials, setShowSpecials] = useState(false);
+    const [showGenres, setShowGenres] = useState(false);
+    const [showNews, setShowNews] = useState(false);
+    const fileInputRef = useRef<HTMLInputElement>(null);
+
+    // Check for existing auth on mount
+    useEffect(() => {
+        const authToken = localStorage.getItem('hoerdle_admin_auth');
+        if (authToken === 'authenticated') {
+            setIsAuthenticated(true);
+            fetchSongs();
+            fetchGenres();
+            fetchDailyPuzzles();
+            fetchSpecials();
+            fetchNews();
+        }
+    }, []);
+
+    const handleLogin = async () => {
+        const res = await fetch('/api/admin/login', {
+            method: 'POST',
+            body: JSON.stringify({ password }),
+        });
+        if (res.ok) {
+            localStorage.setItem('hoerdle_admin_auth', 'authenticated');
+            setIsAuthenticated(true);
+            fetchSongs();
+            fetchGenres();
+            fetchDailyPuzzles();
+            fetchSpecials();
+            fetchNews();
+        } else {
+            alert(t('wrongPassword'));
+        }
+    };
+
+    const handleLogout = () => {
+        localStorage.removeItem('hoerdle_admin_auth');
+        setIsAuthenticated(false);
+        setPassword('');
+        // Reset all state
+        setSongs([]);
+        setGenres([]);
+        setSpecials([]);
+        setDailyPuzzles([]);
+    };
+
+    // Helper function to add auth headers to requests
+    const getAuthHeaders = () => {
+        const authToken = localStorage.getItem('hoerdle_admin_auth');
+        return {
+            'Content-Type': 'application/json',
+            'x-admin-auth': authToken || ''
+        };
+    };
+
+    const fetchSongs = async () => {
+        const res = await fetch('/api/songs', {
+            headers: getAuthHeaders()
+        });
+        if (res.ok) {
+            const data = await res.json();
+            setSongs(data);
+        }
+    };
+
+    const fetchGenres = async () => {
+        const res = await fetch('/api/genres', {
+            headers: getAuthHeaders()
+        });
+        if (res.ok) {
+            const data = await res.json();
+            setGenres(data);
+        }
+    };
+
+    const createGenre = async () => {
+        if (!newGenreName.de.trim() && !newGenreName.en.trim()) return;
+        const res = await fetch('/api/genres', {
+            method: 'POST',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                name: newGenreName,
+                subtitle: newGenreSubtitle,
+                active: newGenreActive
+            }),
+        });
+        if (res.ok) {
+            setNewGenreName({ de: '', en: '' });
+            setNewGenreSubtitle({ de: '', en: '' });
+            setNewGenreActive(true);
+            fetchGenres();
+        } else {
+            alert('Failed to create genre');
+        }
+    };
+
+    const startEditGenre = (genre: Genre) => {
+        setEditingGenreId(genre.id);
+        setEditGenreName(typeof genre.name === 'string' ? { de: genre.name, en: genre.name } : genre.name);
+        setEditGenreSubtitle(genre.subtitle ? (typeof genre.subtitle === 'string' ? { de: genre.subtitle, en: genre.subtitle } : genre.subtitle) : { de: '', en: '' });
+        setEditGenreActive(genre.active !== undefined ? genre.active : true);
+    };
+
+    const saveEditedGenre = async () => {
+        if (editingGenreId === null) return;
+        const res = await fetch('/api/genres', {
+            method: 'PUT',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                id: editingGenreId,
+                name: editGenreName,
+                subtitle: editGenreSubtitle,
+                active: editGenreActive
+            }),
+        });
+        if (res.ok) {
+            setEditingGenreId(null);
+            fetchGenres();
+        } else {
+            alert('Failed to update genre');
+        }
+    };
+
+    // Specials functions
+    const fetchSpecials = async () => {
+        const res = await fetch('/api/specials', {
+            headers: getAuthHeaders()
+        });
+        if (res.ok) {
+            const data = await res.json();
+            setSpecials(data);
+        }
+    };
+
+    const handleCreateSpecial = async (e: React.FormEvent) => {
+        e.preventDefault();
+        if (!newSpecialName.de.trim() && !newSpecialName.en.trim()) return;
+        const res = await fetch('/api/specials', {
+            method: 'POST',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                name: newSpecialName,
+                subtitle: newSpecialSubtitle,
+                maxAttempts: newSpecialMaxAttempts,
+                unlockSteps: newSpecialUnlockSteps,
+                launchDate: newSpecialLaunchDate || null,
+                endDate: newSpecialEndDate || null,
+                curator: newSpecialCurator || null,
+            }),
+        });
+        if (res.ok) {
+            setNewSpecialName({ de: '', en: '' });
+            setNewSpecialSubtitle({ de: '', en: '' });
+            setNewSpecialMaxAttempts(7);
+            setNewSpecialUnlockSteps('[2,4,7,11,16,30,60]');
+            setNewSpecialLaunchDate('');
+            setNewSpecialEndDate('');
+            setNewSpecialCurator('');
+            fetchSpecials();
+        } else {
+            alert('Failed to create special');
+        }
+    };
+
+    const handleDeleteSpecial = async (id: number) => {
+        if (!confirm('Delete this special?')) return;
+        const res = await fetch('/api/specials', {
+            method: 'DELETE',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({ id }),
+        });
+        if (res.ok) fetchSpecials();
+        else alert('Failed to delete special');
+    };
+
+    // Daily Puzzles functions
+    const fetchDailyPuzzles = async () => {
+        const res = await fetch('/api/admin/daily-puzzles', {
+            headers: getAuthHeaders()
+        });
+        if (res.ok) {
+            const data = await res.json();
+            setDailyPuzzles(data);
+        }
+    };
+
+    const handleDeletePuzzle = async (puzzleId: number) => {
+        if (!confirm('Delete this daily puzzle? A new one will be generated automatically.')) return;
+        const res = await fetch('/api/admin/daily-puzzles', {
+            method: 'DELETE',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({ puzzleId }),
+        });
+        if (res.ok) {
+            fetchDailyPuzzles();
+            alert('Puzzle deleted and regenerated successfully');
+        } else {
+            alert('Failed to delete puzzle');
+        }
+    };
+
+    const handlePlayPuzzle = (puzzle: any) => {
+        if (playingPuzzleId === puzzle.id) {
+            // Pause
+            audioElement?.pause();
+            setPlayingPuzzleId(null);
+            setAudioElement(null);
+        } else {
+            // Stop any currently playing audio
+            if (audioElement) {
+                audioElement.pause();
+                setAudioElement(null);
+            }
+
+            const audio = new Audio(puzzle.song.audioUrl);
+            audio.play()
+                .then(() => {
+                    setAudioElement(audio);
+                    setPlayingPuzzleId(puzzle.id);
+                })
+                .catch((error) => {
+                    console.error('Playback error:', error);
+                    alert(`Failed to play audio: ${error.message}`);
+                    setPlayingPuzzleId(null);
+                    setAudioElement(null);
+                });
+
+            audio.onended = () => {
+                setPlayingPuzzleId(null);
+                setAudioElement(null);
+            };
+        }
+    };
+
+    const startEditSpecial = (special: Special) => {
+        setEditingSpecialId(special.id);
+        setEditSpecialName(typeof special.name === 'string' ? { de: special.name, en: special.name } : special.name);
+        setEditSpecialSubtitle(special.subtitle ? (typeof special.subtitle === 'string' ? { de: special.subtitle, en: special.subtitle } : special.subtitle) : { de: '', en: '' });
+        setEditSpecialMaxAttempts(special.maxAttempts);
+        setEditSpecialUnlockSteps(special.unlockSteps);
+        setEditSpecialLaunchDate(special.launchDate ? new Date(special.launchDate).toISOString().split('T')[0] : '');
+        setEditSpecialEndDate(special.endDate ? new Date(special.endDate).toISOString().split('T')[0] : '');
+        setEditSpecialCurator(special.curator || '');
+    };
+
+    const saveEditedSpecial = async () => {
+        if (editingSpecialId === null) return;
+        const res = await fetch('/api/specials', {
+            method: 'PUT',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                id: editingSpecialId,
+                name: editSpecialName,
+                subtitle: editSpecialSubtitle,
+                maxAttempts: editSpecialMaxAttempts,
+                unlockSteps: editSpecialUnlockSteps,
+                launchDate: editSpecialLaunchDate || null,
+                endDate: editSpecialEndDate || null,
+                curator: editSpecialCurator || null,
+            }),
+        });
+        if (res.ok) {
+            setEditingSpecialId(null);
+            fetchSpecials();
+        } else {
+            alert('Failed to update special');
+        }
+    };
+
+    // News functions
+    const fetchNews = async () => {
+        const res = await fetch('/api/news', {
+            headers: getAuthHeaders()
+        });
+        if (res.ok) {
+            const data = await res.json();
+            setNews(data);
+        }
+    };
+
+    const handleCreateNews = async (e: React.FormEvent) => {
+        e.preventDefault();
+        if ((!newNewsTitle.de.trim() && !newNewsTitle.en.trim()) || (!newNewsContent.de.trim() && !newNewsContent.en.trim())) return;
+
+        const res = await fetch('/api/news', {
+            method: 'POST',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                title: newNewsTitle,
+                content: newNewsContent,
+                author: newNewsAuthor || null,
+                featured: newNewsFeatured,
+                specialId: newNewsSpecialId
+            }),
+        });
+
+        if (res.ok) {
+            setNewNewsTitle({ de: '', en: '' });
+            setNewNewsContent({ de: '', en: '' });
+            setNewNewsAuthor('');
+            setNewNewsFeatured(false);
+            setNewNewsSpecialId(null);
+            fetchNews();
+        } else {
+            alert('Failed to create news');
+        }
+    };
+
+    const startEditNews = (newsItem: News) => {
+        setEditingNewsId(newsItem.id);
+        setEditNewsTitle(typeof newsItem.title === 'string' ? { de: newsItem.title, en: newsItem.title } : newsItem.title);
+        setEditNewsContent(typeof newsItem.content === 'string' ? { de: newsItem.content, en: newsItem.content } : newsItem.content);
+        setEditNewsAuthor(newsItem.author || '');
+        setEditNewsFeatured(newsItem.featured);
+        setEditNewsSpecialId(newsItem.specialId);
+    };
+
+    const saveEditedNews = async () => {
+        if (editingNewsId === null) return;
+
+        const res = await fetch('/api/news', {
+            method: 'PUT',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                id: editingNewsId,
+                title: editNewsTitle,
+                content: editNewsContent,
+                author: editNewsAuthor || null,
+                featured: editNewsFeatured,
+                specialId: editNewsSpecialId
+            }),
+        });
+
+        if (res.ok) {
+            setEditingNewsId(null);
+            fetchNews();
+        } else {
+            alert('Failed to update news');
+        }
+    };
+
+    const handleDeleteNews = async (id: number) => {
+        if (!confirm('Delete this news item?')) return;
+
+        const res = await fetch('/api/news', {
+            method: 'DELETE',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({ id }),
+        });
+
+        if (res.ok) {
+            fetchNews();
+        } else {
+            alert('Failed to delete news');
+        }
+    };
+
+    // Load specials after auth
+    useEffect(() => {
+        if (isAuthenticated) fetchSpecials();
+    }, [isAuthenticated]);
+
+    const deleteGenre = async (id: number) => {
+        if (!confirm('Delete this genre?')) return;
+        const res = await fetch('/api/genres', {
+            method: 'DELETE',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({ id }),
+        });
+        if (res.ok) {
+            fetchGenres();
+        } else {
+            alert('Failed to delete genre');
+        }
+    };
+
+    const handleAICategorization = async () => {
+        if (!confirm('This will categorize all songs without genres using AI. Continue?')) return;
+
+        setIsCategorizing(true);
+        setCategorizationResults(null);
+
+        try {
+            let offset = 0;
+            let hasMore = true;
+            let allResults: any[] = [];
+            let totalUncategorized = 0;
+            let totalProcessed = 0;
+
+            // Process in batches
+            while (hasMore) {
+                const res = await fetch('/api/categorize', {
+                    method: 'POST',
+                    headers: getAuthHeaders(),
+                    body: JSON.stringify({ offset })
+                });
+
+                if (!res.ok) {
+                    const error = await res.json();
+                    alert(`Categorization failed: ${error.error || 'Unknown error'}`);
+                    break;
+                }
+
+                const data = await res.json();
+                totalUncategorized = data.totalUncategorized;
+                totalProcessed = data.processed;
+                hasMore = data.hasMore;
+                offset = data.nextOffset || 0;
+
+                // Accumulate results
+                allResults = [...allResults, ...data.results];
+
+                // Update UI with progress
+                setCategorizationResults({
+                    message: `Processing: ${totalProcessed} / ${totalUncategorized} songs...`,
+                    totalProcessed: totalUncategorized,
+                    totalCategorized: allResults.length,
+                    results: allResults,
+                    inProgress: hasMore
+                });
+            }
+
+            // Final update
+            setCategorizationResults({
+                message: `Completed! Processed ${totalUncategorized} songs, categorized ${allResults.length}`,
+                totalProcessed: totalUncategorized,
+                totalCategorized: allResults.length,
+                results: allResults,
+                inProgress: false
+            });
+
+            fetchSongs(); // Refresh song list
+            fetchGenres(); // Refresh genre counts
+        } catch (error) {
+            alert('Failed to categorize songs');
+            console.error(error);
+        } finally {
+            setIsCategorizing(false);
+        }
+    };
+
+    const handleBatchUpload = async (e: React.FormEvent) => {
+        e.preventDefault();
+        if (files.length === 0) return;
+
+        setIsUploading(true);
+        setUploadResults([]);
+        setUploadProgress({ current: 0, total: files.length });
+        setMessage('');
+
+        const results = [];
+
+        // Upload files sequentially to avoid timeout
+        for (let i = 0; i < files.length; i++) {
+            const file = files[i];
+            setUploadProgress({ current: i + 1, total: files.length });
+
+            try {
+                console.log(`Uploading file ${i + 1}/${files.length}: ${file.name} (${(file.size / 1024 / 1024).toFixed(2)}MB)`);
+
+                const formData = new FormData();
+                formData.append('file', file);
+                formData.append('excludeFromGlobal', String(uploadExcludeFromGlobal));
+
+                const res = await fetch('/api/songs', {
+                    method: 'POST',
+                    headers: { 'x-admin-auth': localStorage.getItem('hoerdle_admin_auth') || '' },
+                    body: formData,
+                });
+
+                console.log(`Response status for ${file.name}: ${res.status}`);
+
+                if (res.ok) {
+                    const data = await res.json();
+                    console.log(`Upload successful for ${file.name}:`, data);
+                    results.push({
+                        filename: file.name,
+                        success: true,
+                        song: data.song,
+                        validation: data.validation
+                    });
+                } else if (res.status === 409) {
+                    // Duplicate detected
+                    const data = await res.json();
+                    console.log(`Duplicate detected for ${file.name}:`, data);
+                    results.push({
+                        filename: file.name,
+                        success: false,
+                        isDuplicate: true,
+                        duplicate: data.duplicate,
+                        error: `Duplicate: Already exists as "${data.duplicate.title}" by "${data.duplicate.artist}"`
+                    });
+                } else {
+                    const errorText = await res.text();
+                    console.error(`Upload failed for ${file.name} (${res.status}):`, errorText);
+                    results.push({
+                        filename: file.name,
+                        success: false,
+                        error: `Upload failed (${res.status}): ${errorText.substring(0, 100)}`
+                    });
+                }
+            } catch (error) {
+                console.error(`Network error for ${file.name}:`, error);
+                results.push({
+                    filename: file.name,
+                    success: false,
+                    error: `Network error: ${error instanceof Error ? error.message : 'Unknown error'}`
+                });
+            }
+        }
+
+        setUploadResults(results);
+        setFiles([]);
+        setIsUploading(false);
+
+        // Assign genres to successfully uploaded songs
+        if (batchUploadGenreIds.length > 0) {
+            const successfulUploads = results.filter(r => r.success && r.song);
+            for (const result of successfulUploads) {
+                try {
+                    await fetch('/api/songs', {
+                        method: 'PUT',
+                        headers: getAuthHeaders(),
+                        body: JSON.stringify({
+                            id: result.song.id,
+                            title: result.song.title,
+                            artist: result.song.artist,
+                            genreIds: batchUploadGenreIds
+                        }),
+                    });
+                } catch (error) {
+                    console.error(`Failed to assign genres to ${result.song.title}:`, error);
+                }
+            }
+        }
+
+        fetchSongs();
+        fetchGenres();
+        fetchSpecials(); // Update special counts
+
+        // Auto-trigger categorization after uploads
+        const successCount = results.filter(r => r.success).length;
+        const duplicateCount = results.filter(r => r.isDuplicate).length;
+        const failedCount = results.filter(r => !r.success && !r.isDuplicate).length;
+        if (successCount > 0) {
+            let msg = `✅ Uploaded ${successCount}/${files.length} songs successfully!`;
+            if (duplicateCount > 0) {
+                msg += `\n⚠️ Skipped ${duplicateCount} duplicate(s)`;
+            }
+            if (failedCount > 0) {
+                msg += `\n❌ ${failedCount} failed`;
+            }
+            if (batchUploadGenreIds.length > 0) {
+                const selectedGenreNames = genres
+                    .filter(g => batchUploadGenreIds.includes(g.id))
+                    .map(g => getLocalizedValue(g.name, activeTab))
+                    .join(', ');
+                msg += `\n🏷️ Assigned genres: ${selectedGenreNames}`;
+            }
+            msg += '\n\n🤖 Starting auto-categorization...';
+            setMessage(msg);
+            // Small delay to let user see the message
+            setTimeout(() => {
+                handleAICategorization();
+            }, 1000);
+        } else if (duplicateCount > 0 && failedCount === 0) {
+            setMessage(`⚠️ All ${duplicateCount} file(s) were duplicates - nothing uploaded.`);
+        } else {
+            setMessage(`❌ All uploads failed.`);
+        }
+    };
+
+    const handleDragEnter = (e: React.DragEvent) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragging(true);
+    };
+
+    const handleDragOver = (e: React.DragEvent) => {
+        e.preventDefault();
+        e.stopPropagation();
+        e.dataTransfer.dropEffect = 'copy';
+        if (!isDragging) setIsDragging(true);
+    };
+
+    const handleDragLeave = (e: React.DragEvent) => {
+        e.preventDefault();
+        e.stopPropagation();
+
+        // Prevent flickering when dragging over children
+        if (e.currentTarget.contains(e.relatedTarget as Node)) {
+            return;
+        }
+        setIsDragging(false);
+    };
+
+    const handleDrop = (e: React.DragEvent) => {
+        e.preventDefault();
+        e.stopPropagation();
+        setIsDragging(false);
+
+        const droppedFiles = Array.from(e.dataTransfer.files);
+
+        // Validate file types
+        const validFiles: File[] = [];
+        const invalidFiles: string[] = [];
+
+        droppedFiles.forEach(file => {
+            if (file.type === 'audio/mpeg' || file.name.toLowerCase().endsWith('.mp3')) {
+                validFiles.push(file);
+            } else {
+                invalidFiles.push(`${file.name} (${file.type || 'unknown type'})`);
+            }
+        });
+
+        if (invalidFiles.length > 0) {
+            alert(`⚠️ The following files are not supported:\n\n${invalidFiles.join('\n')}\n\nOnly MP3 files are allowed.`);
+        }
+
+        if (validFiles.length > 0) {
+            setFiles(validFiles);
+        }
+    };
+
+    const handleFileChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+        if (e.target.files) {
+            const selectedFiles = Array.from(e.target.files);
+
+            // Validate file types
+            const validFiles: File[] = [];
+            const invalidFiles: string[] = [];
+
+            selectedFiles.forEach(file => {
+                if (file.type === 'audio/mpeg' || file.name.toLowerCase().endsWith('.mp3')) {
+                    validFiles.push(file);
+                } else {
+                    invalidFiles.push(`${file.name} (${file.type || 'unknown type'})`);
+                }
+            });
+
+            if (invalidFiles.length > 0) {
+                alert(`⚠️ The following files are not supported:\n\n${invalidFiles.join('\n')}\n\nOnly MP3 files are allowed.`);
+            }
+
+            if (validFiles.length > 0) {
+                setFiles(validFiles);
+            }
+        }
+    };
+
+    const saveUploadedSongGenres = async () => {
+        if (!uploadedSong) return;
+
+        const res = await fetch('/api/songs', {
+            method: 'PUT',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                id: uploadedSong.id,
+                title: uploadedSong.title,
+                artist: uploadedSong.artist,
+                genreIds: uploadGenreIds
+            }),
+        });
+
+        if (res.ok) {
+            setUploadedSong(null);
+            setUploadGenreIds([]);
+            fetchSongs();
+            fetchGenres();
+            fetchSpecials(); // Update special counts if song was assigned to specials
+            setMessage(prev => prev + '\n✅ Genres assigned successfully!');
+        } else {
+            alert('Failed to assign genres');
+        }
+    };
+
+    const startEditing = (song: Song) => {
+        setEditingId(song.id);
+        setEditTitle(song.title);
+        setEditArtist(song.artist);
+        setEditReleaseYear(song.releaseYear || '');
+        setEditGenreIds(song.genres.map(g => g.id));
+        setEditSpecialIds(song.specials ? song.specials.map(s => s.id) : []);
+        setEditExcludeFromGlobal(song.excludeFromGlobal || false);
+    };
+
+    const cancelEditing = () => {
+        setEditingId(null);
+        setEditTitle('');
+        setEditArtist('');
+        setEditReleaseYear('');
+        setEditGenreIds([]);
+        setEditSpecialIds([]);
+        setEditExcludeFromGlobal(false);
+    };
+
+    const saveEditing = async (id: number) => {
+        const res = await fetch('/api/songs', {
+            method: 'PUT',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({
+                id,
+                title: editTitle,
+                artist: editArtist,
+                releaseYear: editReleaseYear === '' ? null : Number(editReleaseYear),
+                genreIds: editGenreIds,
+                specialIds: editSpecialIds,
+                excludeFromGlobal: editExcludeFromGlobal
+            }),
+        });
+
+        if (res.ok) {
+            setEditingId(null);
+            fetchSongs();
+            fetchGenres();
+            fetchSpecials(); // Update special counts
+        } else {
+            alert('Failed to update song');
+        }
+    };
+
+    const handleDelete = async (id: number, title: string) => {
+        if (!confirm(`Are you sure you want to delete "${title}"? This will also delete the file.`)) {
+            return;
+        }
+
+        const res = await fetch('/api/songs', {
+            method: 'DELETE',
+            headers: getAuthHeaders(),
+            body: JSON.stringify({ id }),
+        });
+
+        if (res.ok) {
+            fetchSongs();
+            fetchGenres();
+            fetchSpecials(); // Update special counts
+        } else {
+            alert('Failed to delete song');
+        }
+    };
+
+    const handleSort = (field: SortField) => {
+        if (sortField === field) {
+            setSortDirection(sortDirection === 'asc' ? 'desc' : 'asc');
+        } else {
+            setSortField(field);
+            setSortDirection('asc');
+        }
+    };
+
+    const handlePlayPause = (song: Song) => {
+        if (playingSongId === song.id) {
+            // Pause current song
+            audioElement?.pause();
+            setPlayingSongId(null);
+        } else {
+            // Stop any currently playing song
+            audioElement?.pause();
+
+            // Play new song
+            const audio = new Audio(`/api/audio/${song.filename}`);
+
+            // Handle playback errors
+            audio.onerror = () => {
+                alert(`Failed to load audio file: ${song.filename}\nThe file may be corrupted or missing.`);
+                setPlayingSongId(null);
+                setAudioElement(null);
+            };
+
+            audio.play()
+                .then(() => {
+                    setAudioElement(audio);
+                    setPlayingSongId(song.id);
+                })
+                .catch((error) => {
+                    console.error('Playback error:', error);
+                    alert(`Failed to play audio: ${error.message}`);
+                    setPlayingSongId(null);
+                    setAudioElement(null);
+                });
+
+            // Reset when song ends
+            audio.onended = () => {
+                setPlayingSongId(null);
+                setAudioElement(null);
+            };
+        }
+    };
+
+    // Filter and sort songs
+    const filteredSongs = songs.filter(song => {
+        // Text search filter
+        const matchesSearch = song.title.toLowerCase().includes(searchQuery.toLowerCase()) ||
+            song.artist.toLowerCase().includes(searchQuery.toLowerCase());
+
+        // Genre filter
+        // Unified Filter
+        let matchesFilter = true;
+        if (selectedGenreFilter) {
+            if (selectedGenreFilter.startsWith('genre:')) {
+                const genreId = Number(selectedGenreFilter.split(':')[1]);
+                matchesFilter = genreId === -1
+                    ? song.genres.length === 0
+                    : song.genres.some(g => g.id === genreId);
+            } else if (selectedGenreFilter.startsWith('special:')) {
+                const specialId = Number(selectedGenreFilter.split(':')[1]);
+                matchesFilter = song.specials?.some(s => s.id === specialId) || false;
+            } else if (selectedGenreFilter === 'daily') {
+                const today = new Date().toISOString().split('T')[0];
+                matchesFilter = song.puzzles?.some(p => p.date === today) || false;
+            } else if (selectedGenreFilter === 'no-global') {
+                matchesFilter = song.excludeFromGlobal === true;
+            }
+        }
+
+        return matchesSearch && matchesFilter;
+    });
+
+    const sortedSongs = [...filteredSongs].sort((a, b) => {
+        // Handle numeric sorting for ID, Release Year, Activations, and Rating
+        if (sortField === 'id') {
+            return sortDirection === 'asc' ? a.id - b.id : b.id - a.id;
+        }
+        if (sortField === 'releaseYear') {
+            const yearA = a.releaseYear || 0;
+            const yearB = b.releaseYear || 0;
+            return sortDirection === 'asc' ? yearA - yearB : yearB - yearA;
+        }
+        if (sortField === 'activations') {
+            return sortDirection === 'asc' ? a.activations - b.activations : b.activations - a.activations;
+        }
+        if (sortField === 'averageRating') {
+            return sortDirection === 'asc' ? a.averageRating - b.averageRating : b.averageRating - a.averageRating;
+        }
+
+        // String sorting for other fields
+        const valA = String(a[sortField]).toLowerCase();
+        const valB = String(b[sortField]).toLowerCase();
+
+        if (valA < valB) return sortDirection === 'asc' ? -1 : 1;
+        if (valA > valB) return sortDirection === 'asc' ? 1 : -1;
+        return 0;
+    });
+
+    // Pagination
+    const totalPages = Math.ceil(sortedSongs.length / itemsPerPage);
+    const startIndex = (currentPage - 1) * itemsPerPage;
+    const paginatedSongs = sortedSongs.slice(startIndex, startIndex + itemsPerPage);
+
+    // Reset to page 1 when search changes
+    useEffect(() => {
+        setCurrentPage(1);
+    }, [searchQuery]);
+
+    if (!isAuthenticated) {
+        return (
+            <div className="container" style={{ justifyContent: 'center' }}>
+                <h1 className="title" style={{ marginBottom: '1rem', fontSize: '1.5rem' }}>{t('login')}</h1>
+                <input
+                    type="password"
+                    value={password}
+                    onChange={e => setPassword(e.target.value)}
+                    className="form-input"
+                    style={{ marginBottom: '1rem', maxWidth: '300px' }}
+                    placeholder={t('password')}
+                />
+                <button onClick={handleLogin} className="btn-primary">{t('loginButton')}</button>
+            </div>
+        );
+    }
+
+    return (
+        <div className="admin-container">
+            <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '2rem' }}>
+                <h1 className="title" style={{ margin: 0 }}>{t('title')}</h1>
+                <div style={{ display: 'flex', gap: '1rem', alignItems: 'center' }}>
+                    <div style={{ display: 'flex', background: '#e5e7eb', borderRadius: '0.25rem', padding: '0.25rem' }}>
+                        <button
+                            type="button"
+                            onClick={(e) => {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                setActiveTab('de');
+                            }}
+                            style={{
+                                padding: '0.25rem 0.75rem',
+                                background: activeTab === 'de' ? 'white' : 'transparent',
+                                borderRadius: '0.25rem',
+                                border: 'none',
+                                cursor: 'pointer',
+                                fontWeight: activeTab === 'de' ? 'bold' : 'normal',
+                                boxShadow: activeTab === 'de' ? '0 1px 2px rgba(0,0,0,0.1)' : 'none'
+                            }}
+                        >
+                            DE
+                        </button>
+                        <button
+                            type="button"
+                            onClick={(e) => {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                setActiveTab('en');
+                            }}
+                            style={{
+                                padding: '0.25rem 0.75rem',
+                                background: activeTab === 'en' ? 'white' : 'transparent',
+                                borderRadius: '0.25rem',
+                                border: 'none',
+                                cursor: 'pointer',
+                                fontWeight: activeTab === 'en' ? 'bold' : 'normal',
+                                boxShadow: activeTab === 'en' ? '0 1px 2px rgba(0,0,0,0.1)' : 'none'
+                            }}
+                        >
+                            EN
+                        </button>
+                    </div>
+                    <button
+                        onClick={handleLogout}
+                        className="btn-secondary"
+                        style={{
+                            padding: '0.5rem 1rem',
+                            backgroundColor: '#dc3545',
+                            color: 'white',
+                            border: 'none',
+                            borderRadius: '4px',
+                            cursor: 'pointer',
+                            fontSize: '0.9rem'
+                        }}
+                    >
+                        🚪 {t('logout')}
+                    </button>
+                </div>
+            </div>
+
+            {/* Special Management */}
+            <div className="admin-card" style={{ marginBottom: '2rem' }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        {t('manageSpecials')}
+                    </h2>
+                    <button
+                        onClick={() => setShowSpecials(!showSpecials)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showSpecials ? t('hide') : t('show')}
+                    </button>
+                </div>
+                {showSpecials && (
+                    <>
+                        <form onSubmit={handleCreateSpecial} style={{ marginBottom: '1rem' }} key={`special-form-${activeTab}`}>
+                    <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
+                            <input type="text" placeholder={t('name')} value={newSpecialName[activeTab] || ''} onChange={e => setNewSpecialName({ ...newSpecialName, [activeTab]: e.target.value })} className="form-input" required key={`special-name-${activeTab}`} />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
+                            <input type="text" placeholder={t('subtitle')} value={newSpecialSubtitle[activeTab] || ''} onChange={e => setNewSpecialSubtitle({ ...newSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" key={`special-subtitle-${activeTab}`} />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('maxAttempts')}</label>
+                            <input type="number" placeholder={t('maxAttempts')} value={newSpecialMaxAttempts} onChange={e => setNewSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
+                            <input type="text" placeholder={t('unlockSteps')} value={newSpecialUnlockSteps} onChange={e => setNewSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
+                            <input type="date" value={newSpecialLaunchDate} onChange={e => setNewSpecialLaunchDate(e.target.value)} className="form-input" />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('endDate')}</label>
+                            <input type="date" value={newSpecialEndDate} onChange={e => setNewSpecialEndDate(e.target.value)} className="form-input" />
+                        </div>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
+                            <input type="text" placeholder={t('curator')} value={newSpecialCurator} onChange={e => setNewSpecialCurator(e.target.value)} className="form-input" />
+                        </div>
+                        <button type="submit" className="btn-primary" style={{ height: '38px' }}>{t('addSpecial')}</button>
+                    </div>
+                </form>
+                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
+                    {specials.map(special => (
+                        <div key={special.id} style={{
+                            background: '#f3f4f6',
+                            padding: '0.25rem 0.75rem',
+                            borderRadius: '999px',
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: '0.5rem',
+                            fontSize: '0.875rem'
+                        }}>
+                            <span>{getLocalizedValue(special.name, activeTab)} ({special._count?.songs || 0})</span>
+                            {special.subtitle && <span style={{ fontSize: '0.75rem', color: '#666', marginLeft: '0.25rem' }}>- {getLocalizedValue(special.subtitle, activeTab)}</span>}
+                            <Link href={`/admin/specials/${special.id}`} className="btn-primary" style={{ marginRight: '0.5rem', textDecoration: 'none' }}>{t('curate')}</Link>
+                            <button onClick={() => startEditSpecial(special)} className="btn-secondary" style={{ marginRight: '0.5rem' }}>{t('edit')}</button>
+                            <button onClick={() => handleDeleteSpecial(special.id)} className="btn-danger">{t('delete')}</button>
+                        </div>
+                    ))}
+                </div>
+                {editingSpecialId !== null && (
+                    <div style={{ marginTop: '1rem', padding: '1rem', background: '#f9fafb', borderRadius: '0.5rem' }}>
+                        <h3>{t('editSpecial')}</h3>
+                        <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'flex-end' }}>
+                        <div style={{ display: 'flex', flexDirection: 'column' }}>
+                            <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
+                            <input type="text" value={editSpecialName[activeTab] || ''} onChange={e => setEditSpecialName({ ...editSpecialName, [activeTab]: e.target.value })} className="form-input" key={`edit-special-name-${activeTab}`} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
+                                <input type="text" value={editSpecialSubtitle[activeTab] || ''} onChange={e => setEditSpecialSubtitle({ ...editSpecialSubtitle, [activeTab]: e.target.value })} className="form-input" key={`edit-special-subtitle-${activeTab}`} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('maxAttempts')}</label>
+                                <input type="number" value={editSpecialMaxAttempts} onChange={e => setEditSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
+                                <input type="text" value={editSpecialUnlockSteps} onChange={e => setEditSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
+                                <input type="date" value={editSpecialLaunchDate} onChange={e => setEditSpecialLaunchDate(e.target.value)} className="form-input" />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('endDate')}</label>
+                                <input type="date" value={editSpecialEndDate} onChange={e => setEditSpecialEndDate(e.target.value)} className="form-input" />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
+                                <input type="text" value={editSpecialCurator} onChange={e => setEditSpecialCurator(e.target.value)} className="form-input" />
+                            </div>
+                            <button onClick={saveEditedSpecial} className="btn-primary" style={{ height: '38px' }}>{t('save')}</button>
+                            <button onClick={() => setEditingSpecialId(null)} className="btn-secondary" style={{ height: '38px' }}>{t('cancel')}</button>
+                        </div>
+                    </div>
+                )}
+                    </>
+                )}
+            </div>
+
+            {/* Genre Management */}
+            <div className="admin-card" style={{ marginBottom: '2rem' }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        {t('manageGenres')}
+                    </h2>
+                    <button
+                        onClick={() => setShowGenres(!showGenres)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showGenres ? t('hide') : t('show')}
+                    </button>
+                </div>
+                {showGenres && (
+                    <>
+                        <div style={{ display: 'flex', gap: '0.5rem', marginBottom: '1rem', alignItems: 'center' }}>
+                    <input
+                        type="text"
+                        value={newGenreName[activeTab] || ''}
+                        onChange={e => setNewGenreName({ ...newGenreName, [activeTab]: e.target.value })}
+                        placeholder={t('newGenreName')}
+                        className="form-input"
+                        style={{ maxWidth: '200px' }}
+                        key={`genre-name-${activeTab}`}
+                    />
+                    <input
+                        type="text"
+                        value={newGenreSubtitle[activeTab] || ''}
+                        onChange={e => setNewGenreSubtitle({ ...newGenreSubtitle, [activeTab]: e.target.value })}
+                        placeholder={t('subtitle')}
+                        className="form-input"
+                        style={{ maxWidth: '300px' }}
+                        key={`genre-subtitle-${activeTab}`}
+                    />
+                    <label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem', cursor: 'pointer' }}>
+                        <input
+                            type="checkbox"
+                            checked={newGenreActive}
+                            onChange={e => setNewGenreActive(e.target.checked)}
+                        />
+                        {t('active')}
+                    </label>
+                    <button onClick={createGenre} className="btn-primary">{t('addGenre')}</button>
+                </div>
+                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
+                    {genres.map(genre => (
+                        <div key={genre.id} style={{
+                            background: genre.active ? '#f3f4f6' : '#fee2e2',
+                            opacity: genre.active ? 1 : 0.8,
+                            padding: '0.25rem 0.75rem',
+                            borderRadius: '999px',
+                            display: 'flex',
+                            alignItems: 'center',
+                            gap: '0.5rem',
+                            fontSize: '0.875rem'
+                        }}>
+                            <span>{getLocalizedValue(genre.name, activeTab)} ({genre._count?.songs || 0})</span>
+                            {genre.subtitle && <span style={{ fontSize: '0.75rem', color: '#666' }}>- {getLocalizedValue(genre.subtitle, activeTab)}</span>}
+                            <button onClick={() => startEditGenre(genre)} className="btn-secondary" style={{ padding: '0.1rem 0.5rem', fontSize: '0.75rem' }}>{t('edit')}</button>
+                            <button onClick={() => deleteGenre(genre.id)} className="btn-danger" style={{ padding: '0.1rem 0.5rem', fontSize: '0.75rem' }}>×</button>
+                        </div>
+                    ))}
+                </div>
+                {editingGenreId !== null && (
+                    <div style={{ marginTop: '1rem', padding: '1rem', background: '#f9fafb', borderRadius: '0.5rem' }}>
+                        <h3>{t('editGenre')}</h3>
+                        <div style={{ display: 'flex', gap: '0.5rem', alignItems: 'flex-end' }}>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('name')}</label>
+                                <input type="text" value={editGenreName[activeTab] || ''} onChange={e => setEditGenreName({ ...editGenreName, [activeTab]: e.target.value })} className="form-input" key={`edit-genre-name-${activeTab}`} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column' }}>
+                                <label style={{ fontSize: '0.75rem', color: '#666' }}>{t('subtitle')}</label>
+                                <input type="text" value={editGenreSubtitle[activeTab] || ''} onChange={e => setEditGenreSubtitle({ ...editGenreSubtitle, [activeTab]: e.target.value })} className="form-input" style={{ width: '300px' }} key={`edit-genre-subtitle-${activeTab}`} />
+                            </div>
+                            <div style={{ display: 'flex', flexDirection: 'column', justifyContent: 'flex-end', paddingBottom: '0.5rem' }}>
+                                <label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem', cursor: 'pointer' }}>
+                                    <input
+                                        type="checkbox"
+                                        checked={editGenreActive}
+                                        onChange={e => setEditGenreActive(e.target.checked)}
+                                    />
+                                    {t('active')}
+                                </label>
+                            </div>
+                            <button onClick={saveEditedGenre} className="btn-primary">{t('save')}</button>
+                            <button onClick={() => setEditingGenreId(null)} className="btn-secondary">{t('cancel')}</button>
+                        </div>
+                    </div>
+                )}
+
+                {/* AI Categorization */}
+                <div style={{ marginTop: '1.5rem', paddingTop: '1rem', borderTop: '1px solid #e5e7eb' }}>
+                    <button
+                        onClick={handleAICategorization}
+                        disabled={isCategorizing || genres.length === 0}
+                        className="btn-primary"
+                        style={{
+                            opacity: isCategorizing || genres.length === 0 ? 0.5 : 1,
+                            cursor: isCategorizing || genres.length === 0 ? 'not-allowed' : 'pointer'
+                        }}
+                    >
+                        {isCategorizing ? '🤖 Categorizing...' : '🤖 Auto-Categorize Songs with AI'}
+                    </button>
+                    {genres.length === 0 && (
+                        <p style={{ fontSize: '0.875rem', color: '#666', marginTop: '0.5rem' }}>
+                            Please create at least one genre first.
+                        </p>
+                    )}
+                </div>
+
+                {/* Categorization Results */}
+                {categorizationResults && (
+                    <div style={{
+                        marginTop: '1rem',
+                        padding: '1rem',
+                        background: '#f0fdf4',
+                        border: '1px solid #86efac',
+                        borderRadius: '0.5rem'
+                    }}>
+                        <h3 style={{ fontWeight: 'bold', marginBottom: '0.5rem', color: '#166534' }}>
+                            ✅ Categorization Complete
+                        </h3>
+                        <p style={{ fontSize: '0.875rem', marginBottom: '0.5rem' }}>
+                            {categorizationResults.message}
+                        </p>
+                        {categorizationResults.results && categorizationResults.results.length > 0 && (
+                            <div style={{ marginTop: '1rem' }}>
+                                <p style={{ fontWeight: 'bold', fontSize: '0.875rem', marginBottom: '0.5rem' }}>Updated Songs:</p>
+                                <div style={{ maxHeight: '300px', overflowY: 'auto' }}>
+                                    {categorizationResults.results.map((result: any) => (
+                                        <div key={result.songId} style={{
+                                            padding: '0.5rem',
+                                            background: 'white',
+                                            borderRadius: '0.25rem',
+                                            marginBottom: '0.5rem',
+                                            fontSize: '0.875rem'
+                                        }}>
+                                            <strong>{result.title}</strong> by {result.artist}
+                                            <div style={{ display: 'flex', gap: '0.25rem', marginTop: '0.25rem', flexWrap: 'wrap' }}>
+                                                {result.assignedGenres.map((genre: string) => (
+                                                    <span key={genre} style={{
+                                                        background: '#dbeafe',
+                                                        padding: '0.1rem 0.4rem',
+                                                        borderRadius: '0.25rem',
+                                                        fontSize: '0.75rem'
+                                                    }}>
+                                                        {genre}
+                                                    </span>
+                                                ))}
+                                            </div>
+                                        </div>
+                                    ))}
+                                </div>
+                            </div>
+                        )}
+                        <button
+                            onClick={() => setCategorizationResults(null)}
+                            style={{
+                                marginTop: '1rem',
+                                padding: '0.5rem 1rem',
+                                background: 'white',
+                                border: '1px solid #d1d5db',
+                                borderRadius: '0.25rem',
+                                cursor: 'pointer'
+                            }}
+                        >
+                            Close
+                        </button>
+                    </div>
+                )}
+                    </>
+                )}
+            </div>
+
+            {/* News Management */}
+            <div className="admin-card" style={{ marginBottom: '2rem' }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        {t('manageNews')}
+                    </h2>
+                    <button
+                        onClick={() => setShowNews(!showNews)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showNews ? t('hide') : t('show')}
+                    </button>
+                </div>
+                {showNews && (
+                    <>
+                        <form onSubmit={handleCreateNews} style={{ marginBottom: '1rem' }}>
+                    <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+                        <input
+                            type="text"
+                            value={newNewsTitle[activeTab] || ''}
+                            onChange={e => setNewNewsTitle({ ...newNewsTitle, [activeTab]: e.target.value })}
+                            placeholder={t('newsTitle')}
+                            className="form-input"
+                            required
+                            key={`news-title-${activeTab}`}
+                        />
+                        <textarea
+                            value={newNewsContent[activeTab] || ''}
+                            onChange={e => setNewNewsContent({ ...newNewsContent, [activeTab]: e.target.value })}
+                            placeholder={t('content')}
+                            className="form-input"
+                            rows={4}
+                            required
+                            style={{ fontFamily: 'monospace', fontSize: '0.875rem' }}
+                            key={`news-content-${activeTab}`}
+                        />
+                        <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'center' }}>
+                            <input
+                                type="text"
+                                value={newNewsAuthor}
+                                onChange={e => setNewNewsAuthor(e.target.value)}
+                                placeholder={t('author')}
+                                className="form-input"
+                                style={{ maxWidth: '200px' }}
+                            />
+                            <select
+                                value={newNewsSpecialId || ''}
+                                onChange={e => setNewNewsSpecialId(e.target.value ? Number(e.target.value) : null)}
+                                className="form-input"
+                                style={{ maxWidth: '200px' }}
+                            >
+                                <option value="">{t('noSpecialLink')}</option>
+                                {specials.map(s => (
+                                    <option key={s.id} value={s.id}>{getLocalizedValue(s.name, activeTab)}</option>
+                                ))}
+                            </select>
+                            <label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem', cursor: 'pointer' }}>
+                                <input
+                                    type="checkbox"
+                                    checked={newNewsFeatured}
+                                    onChange={e => setNewNewsFeatured(e.target.checked)}
+                                />
+                                {t('featured')}
+                            </label>
+                            <button type="submit" className="btn-primary">{t('addNews')}</button>
+                        </div>
+                    </div>
+                </form>
+
+                <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+                    {news.map(newsItem => (
+                        <div key={newsItem.id} style={{
+                            background: newsItem.featured ? '#fef3c7' : '#f3f4f6',
+                            padding: '0.75rem',
+                            borderRadius: '0.5rem',
+                            border: newsItem.featured ? '2px solid #f59e0b' : '1px solid #e5e7eb'
+                        }}>
+                            {editingNewsId === newsItem.id ? (
+                                <div style={{ display: 'flex', flexDirection: 'column', gap: '0.5rem' }}>
+                                    <input
+                                        type="text"
+                                        value={editNewsTitle[activeTab] || ''}
+                                        onChange={e => setEditNewsTitle({ ...editNewsTitle, [activeTab]: e.target.value })}
+                                        className="form-input"
+                                        key={`edit-news-title-${activeTab}`}
+                                    />
+                                    <textarea
+                                        value={editNewsContent[activeTab] || ''}
+                                        onChange={e => setEditNewsContent({ ...editNewsContent, [activeTab]: e.target.value })}
+                                        className="form-input"
+                                        rows={4}
+                                        style={{ fontFamily: 'monospace', fontSize: '0.875rem' }}
+                                        key={`edit-news-content-${activeTab}`}
+                                    />
+                                    <div style={{ display: 'flex', gap: '0.5rem', flexWrap: 'wrap', alignItems: 'center' }}>
+                                        <input
+                                            type="text"
+                                            value={editNewsAuthor}
+                                            onChange={e => setEditNewsAuthor(e.target.value)}
+                                            placeholder={t('author')}
+                                            className="form-input"
+                                            style={{ maxWidth: '200px' }}
+                                        />
+                                        <select
+                                            value={editNewsSpecialId || ''}
+                                            onChange={e => setEditNewsSpecialId(e.target.value ? Number(e.target.value) : null)}
+                                            className="form-input"
+                                            style={{ maxWidth: '200px' }}
+                                        >
+                                            <option value="">{t('noSpecialLink')}</option>
+                                            {specials.map(s => (
+                                                <option key={s.id} value={s.id}>{getLocalizedValue(s.name, activeTab)}</option>
+                                            ))}
+                                        </select>
+                                        <label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.875rem' }}>
+                                            <input
+                                                type="checkbox"
+                                                checked={editNewsFeatured}
+                                                onChange={e => setEditNewsFeatured(e.target.checked)}
+                                            />
+                                            {t('featured')}
+                                        </label>
+                                        <button onClick={saveEditedNews} className="btn-primary">{t('save')}</button>
+                                        <button onClick={() => setEditingNewsId(null)} className="btn-secondary">{t('cancel')}</button>
+                                    </div>
+                                </div>
+                            ) : (
+                                <>
+                                    <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'flex-start', marginBottom: '0.5rem' }}>
+                                        <div style={{ flex: 1 }}>
+                                            <div style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', marginBottom: '0.25rem' }}>
+                                                {newsItem.featured && (
+                                                    <span style={{
+                                                        background: '#f59e0b',
+                                                        color: 'white',
+                                                        padding: '0.125rem 0.375rem',
+                                                        borderRadius: '0.25rem',
+                                                        fontSize: '0.625rem',
+                                                        fontWeight: '600'
+                                                    }}>
+                                                        ⭐ FEATURED
+                                                    </span>
+                                                )}
+                                                <h3 style={{ margin: 0, fontSize: '1rem', fontWeight: '600' }}>{getLocalizedValue(newsItem.title, activeTab)}</h3>
+                                            </div>
+                                            <div style={{ fontSize: '0.75rem', color: '#666', marginBottom: '0.5rem' }}>
+                                                {new Date(newsItem.publishedAt).toLocaleDateString('de-DE')}
+                                                {newsItem.author && ` • by ${newsItem.author}`}
+                                                {newsItem.special && ` • ★ ${getLocalizedValue(newsItem.special.name, activeTab)}`}
+                                            </div>
+                                            <p style={{ margin: 0, fontSize: '0.875rem', whiteSpace: 'pre-wrap' }}>
+                                                {getLocalizedValue(newsItem.content, activeTab).length > 150
+                                                    ? getLocalizedValue(newsItem.content, activeTab).substring(0, 150) + '...'
+                                                    : getLocalizedValue(newsItem.content, activeTab)}
+                                            </p>
+                                        </div>
+                                        <div style={{ display: 'flex', gap: '0.25rem', marginLeft: '1rem' }}>
+                                            <button onClick={() => startEditNews(newsItem)} className="btn-secondary" style={{ padding: '0.25rem 0.5rem', fontSize: '0.75rem' }}>Edit</button>
+                                            <button onClick={() => handleDeleteNews(newsItem.id)} className="btn-danger" style={{ padding: '0.25rem 0.5rem', fontSize: '0.75rem' }}>{t('delete')}</button>
+                                        </div>
+                                    </div>
+                                </>
+                            )}
+                        </div>
+                    ))}
+                    {news.length === 0 && (
+                        <p style={{ color: '#666', fontSize: '0.875rem', textAlign: 'center', padding: '1rem' }}>
+                            {t('noNewsItems')}
+                        </p>
+                    )}
+                </div>
+                    </>
+                )}
+            </div>
+
+            <div className="admin-card" style={{ marginBottom: '2rem' }}>
+                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>{t('uploadSongs')}</h2>
+                <form onSubmit={handleBatchUpload}>
+                    {/* Drag & Drop Zone */}
+                    <div
+                        onDragEnter={handleDragEnter}
+                        onDragOver={handleDragOver}
+                        onDragLeave={handleDragLeave}
+                        onDrop={handleDrop}
+                        style={{
+                            border: isDragging ? '2px solid #4f46e5' : '2px dashed #d1d5db',
+                            borderRadius: '0.5rem',
+                            padding: '2rem',
+                            textAlign: 'center',
+                            background: isDragging ? '#eef2ff' : '#f9fafb',
+                            marginBottom: '1rem',
+                            cursor: 'pointer',
+                            transition: 'all 0.2s'
+                        }}
+                        onClick={() => fileInputRef.current?.click()}
+                    >
+                        <div style={{ fontSize: '3rem', marginBottom: '0.5rem' }}>📁</div>
+                        <p style={{ fontWeight: 'bold', marginBottom: '0.25rem' }}>
+                            {files.length > 0 ? `${files.length} file(s) selected` : 'Drag & drop MP3 files here'}
+                        </p>
+                        <p style={{ fontSize: '0.875rem', color: '#666' }}>
+                            or click to browse
+                        </p>
+                        <input
+                            ref={fileInputRef}
+                            type="file"
+                            accept="audio/mpeg"
+                            multiple
+                            onChange={handleFileChange}
+                            style={{ display: 'none' }}
+                        />
+                    </div>
+
+                    {/* File List */}
+                    {files.length > 0 && (
+                        <div style={{ marginBottom: '1rem' }}>
+                            <p style={{ fontWeight: 'bold', marginBottom: '0.5rem' }}>Selected Files:</p>
+                            <div style={{ maxHeight: '200px', overflowY: 'auto', background: '#f9fafb', padding: '0.5rem', borderRadius: '0.25rem' }}>
+                                {files.map((file, index) => (
+                                    <div key={index} style={{ padding: '0.25rem 0', fontSize: '0.875rem' }}>
+                                        📄 {file.name}
+                                    </div>
+                                ))}
+                            </div>
+                        </div>
+                    )}
+
+                    {/* Upload Progress */}
+                    {isUploading && (
+                        <div style={{ marginBottom: '1rem', padding: '1rem', background: '#eef2ff', borderRadius: '0.5rem' }}>
+                            <p style={{ fontWeight: 'bold', marginBottom: '0.5rem' }}>
+                                Uploading: {uploadProgress.current} / {uploadProgress.total}
+                            </p>
+                            <div style={{ width: '100%', height: '8px', background: '#d1d5db', borderRadius: '4px', overflow: 'hidden' }}>
+                                <div style={{
+                                    width: `${(uploadProgress.current / uploadProgress.total) * 100}%`,
+                                    height: '100%',
+                                    background: '#4f46e5',
+                                    transition: 'width 0.3s'
+                                }} />
+                            </div>
+                        </div>
+                    )}
+
+                    <div style={{ marginBottom: '1rem' }}>
+                        <label style={{ fontWeight: '500', display: 'block', marginBottom: '0.5rem' }}>
+                            Assign Genres (optional)
+                        </label>
+                        <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
+                            {genres.map(genre => (
+                                <label
+                                    key={genre.id}
+                                    style={{
+                                        display: 'flex',
+                                        alignItems: 'center',
+                                        gap: '0.25rem',
+                                        padding: '0.25rem 0.5rem',
+                                        background: batchUploadGenreIds.includes(genre.id) ? '#dbeafe' : '#f3f4f6',
+                                        border: batchUploadGenreIds.includes(genre.id) ? '2px solid #3b82f6' : '2px solid transparent',
+                                        borderRadius: '0.25rem',
+                                        cursor: 'pointer',
+                                        fontSize: '0.875rem',
+                                        transition: 'all 0.2s'
+                                    }}
+                                >
+                                    <input
+                                        type="checkbox"
+                                        checked={batchUploadGenreIds.includes(genre.id)}
+                                        onChange={e => {
+                                            if (e.target.checked) {
+                                                setBatchUploadGenreIds([...batchUploadGenreIds, genre.id]);
+                                            } else {
+                                                setBatchUploadGenreIds(batchUploadGenreIds.filter(id => id !== genre.id));
+                                            }
+                                        }}
+                                        style={{ margin: 0 }}
+                                    />
+                                    {getLocalizedValue(genre.name, activeTab)}
+                                </label>
+                            ))}
+                        </div>
+                        <p style={{ fontSize: '0.875rem', color: '#666', marginTop: '0.25rem' }}>
+                            Selected genres will be assigned to all uploaded songs.
+                        </p>
+                    </div>
+
+                    <div style={{ marginBottom: '1rem' }}>
+                        <label style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', cursor: 'pointer' }}>
+                            <input
+                                type="checkbox"
+                                checked={uploadExcludeFromGlobal}
+                                onChange={e => setUploadExcludeFromGlobal(e.target.checked)}
+                                style={{ width: '1.25rem', height: '1.25rem' }}
+                            />
+                            <span style={{ fontWeight: '500' }}>Exclude from Global Daily Puzzle</span>
+                        </label>
+                        <p style={{ fontSize: '0.875rem', color: '#666', marginLeft: '1.75rem', marginTop: '0.25rem' }}>
+                            If checked, these songs will only appear in Genre or Special puzzles.
+                        </p>
+                    </div>
+
+                    <button
+                        type="submit"
+                        className="btn-primary"
+                        disabled={files.length === 0 || isUploading}
+                        style={{ opacity: files.length === 0 || isUploading ? 0.5 : 1 }}
+                    >
+                        {isUploading ? 'Uploading...' : `Upload ${files.length} Song(s)`}
+                    </button>
+
+                    {message && (
+                        <div style={{
+                            marginTop: '1rem',
+                            padding: '0.75rem',
+                            background: '#d1fae5',
+                            color: '#065f46',
+                            borderRadius: '0.25rem'
+                        }}>
+                            {message}
+                        </div>
+                    )}
+                </form>
+            </div>
+
+            {/* Today's Daily Puzzles */}
+            <div className="admin-card">
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '1rem' }}>
+                    <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', margin: 0 }}>
+                        {t('todaysPuzzles')}
+                    </h2>
+                    <button
+                        onClick={() => setShowDailyPuzzles(!showDailyPuzzles)}
+                        style={{
+                            padding: '0.5rem 1rem',
+                            background: '#f3f4f6',
+                            border: '1px solid #d1d5db',
+                            borderRadius: '0.25rem',
+                            cursor: 'pointer',
+                            fontSize: '0.875rem'
+                        }}
+                    >
+                        {showDailyPuzzles ? '▼ Hide' : '▶ Show'}
+                    </button>
+                </div>
+                {showDailyPuzzles && (dailyPuzzles.length === 0 ? (
+                    <p style={{ color: '#6b7280' }}>{t('noPuzzlesToday')}</p>
+                ) : (
+                    <table style={{ width: '100%', borderCollapse: 'collapse' }}>
+                        <thead>
+                            <tr style={{ borderBottom: '2px solid #e5e7eb' }}>
+                                <th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('category')}</th>
+                                <th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('song')}</th>
+                                <th style={{ padding: '0.75rem', textAlign: 'left', fontWeight: 'bold' }}>{t('artist')}</th>
+                                <th style={{ padding: '0.75rem', textAlign: 'center', fontWeight: 'bold' }}>{t('actions')}</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            {dailyPuzzles.map(puzzle => (
+                                <tr key={puzzle.id} style={{ borderBottom: '1px solid #e5e7eb' }}>
+                                    <td style={{ padding: '0.75rem' }}>
+                                        <span style={{
+                                            background: puzzle.categoryType === 'global' ? '#dbeafe' : puzzle.categoryType === 'special' ? '#fce7f3' : '#f3f4f6',
+                                            color: puzzle.categoryType === 'global' ? '#1e40af' : puzzle.categoryType === 'special' ? '#be185d' : '#374151',
+                                            padding: '0.25rem 0.5rem',
+                                            borderRadius: '0.25rem',
+                                            fontSize: '0.875rem',
+                                            fontWeight: '500'
+                                        }}>
+                                            {puzzle.category}
+                                        </span>
+                                    </td>
+                                    <td style={{ padding: '0.75rem', fontWeight: 'bold' }}>{puzzle.song.title}</td>
+                                    <td style={{ padding: '0.75rem' }}>{puzzle.song.artist}</td>
+                                    <td style={{ padding: '0.75rem', textAlign: 'center' }}>
+                                        <div style={{ display: 'flex', gap: '0.5rem', justifyContent: 'center' }}>
+                                            <button
+                                                onClick={() => handlePlayPuzzle(puzzle)}
+                                                style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                title={playingPuzzleId === puzzle.id ? "Pause" : "Play"}
+                                            >
+                                                {playingPuzzleId === puzzle.id ? '⏸️' : '▶️'}
+                                            </button>
+                                            <button
+                                                onClick={() => handleDeletePuzzle(puzzle.id)}
+                                                style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                title={t('deletePuzzle')}
+                                            >
+                                                🗑️
+                                            </button>
+                                        </div>
+                                    </td>
+                                </tr>
+                            ))}
+                        </tbody>
+                    </table>
+                ))}
+            </div>
+
+            <div className="admin-card">
+                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>
+                    Song Library ({songs.length} songs)
+                </h2>
+
+                {/* Search and Filter */}
+                <div style={{ marginBottom: '1rem', display: 'flex', gap: '0.5rem', flexWrap: 'wrap' }}>
+                    <input
+                        type="text"
+                        placeholder="Search by title or artist..."
+                        value={searchQuery}
+                        onChange={e => setSearchQuery(e.target.value)}
+                        className="form-input"
+                        style={{ flex: '1', minWidth: '200px' }}
+                    />
+                    <select
+                        value={selectedGenreFilter}
+                        onChange={e => setSelectedGenreFilter(e.target.value)}
+                        className="form-input"
+                        style={{ minWidth: '150px' }}
+                    >
+                        <option value="">All Content</option>
+                        <option value="daily">📅 Song of the Day</option>
+                        <option value="no-global">🚫 No Global</option>
+                        <optgroup label="Genres">
+                            <option value="genre:-1">No Genre</option>
+                            {genres.map(genre => (
+                                <option key={genre.id} value={`genre:${genre.id}`}>
+                                    {getLocalizedValue(genre.name, activeTab)} ({genre._count?.songs || 0})
+                                </option>
+                            ))}
+                        </optgroup>
+                        <optgroup label="Specials">
+                            {specials.map(special => (
+                                <option key={special.id} value={`special:${special.id}`}>
+                                    ★ {getLocalizedValue(special.name, activeTab)} ({special._count?.songs || 0})
+                                </option>
+                            ))}
+                        </optgroup>
+                    </select>
+                    {(searchQuery || selectedGenreFilter) && (
+                        <button
+                            onClick={() => {
+                                setSearchQuery('');
+                                setSelectedGenreFilter('');
+                            }}
+                            style={{
+                                padding: '0.5rem 1rem',
+                                background: '#f3f4f6',
+                                border: '1px solid #d1d5db',
+                                borderRadius: '0.25rem',
+                                cursor: 'pointer',
+                                fontSize: '0.875rem'
+                            }}
+                        >
+                            Clear Filters
+                        </button>
+                    )}
+                </div>
+
+                <div style={{ overflowX: 'auto' }}>
+                    <table style={{ width: '100%', borderCollapse: 'collapse', fontSize: '0.875rem' }}>
+                        <thead>
+                            <tr style={{ borderBottom: '2px solid #e5e7eb', textAlign: 'left' }}>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('id')}
+                                >
+                                    ID {sortField === 'id' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('title')}
+                                >
+                                    Song {sortField === 'title' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('releaseYear')}
+                                >
+                                    Year {sortField === 'releaseYear' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th style={{ padding: '0.75rem' }}>Genres / Specials</th>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('createdAt')}
+                                >
+                                    Added {sortField === 'createdAt' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('activations')}
+                                >
+                                    Activations {sortField === 'activations' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th
+                                    style={{ padding: '0.75rem', cursor: 'pointer', userSelect: 'none' }}
+                                    onClick={() => handleSort('averageRating')}
+                                >
+                                    Rating {sortField === 'averageRating' && (sortDirection === 'asc' ? '↑' : '↓')}
+                                </th>
+                                <th style={{ padding: '0.75rem' }}>Actions</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            {paginatedSongs.map(song => (
+                                <tr key={song.id} style={{ borderBottom: '1px solid #e5e7eb' }}>
+                                    <td style={{ padding: '0.75rem' }}>{song.id}</td>
+
+                                    {editingId === song.id ? (
+                                        <>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <input
+                                                    type="text"
+                                                    value={editTitle}
+                                                    onChange={e => setEditTitle(e.target.value)}
+                                                    className="form-input"
+                                                    style={{ padding: '0.25rem', marginBottom: '0.5rem', width: '100%' }}
+                                                    placeholder="Title"
+                                                />
+                                                <input
+                                                    type="text"
+                                                    value={editArtist}
+                                                    onChange={e => setEditArtist(e.target.value)}
+                                                    className="form-input"
+                                                    style={{ padding: '0.25rem', width: '100%' }}
+                                                    placeholder="Artist"
+                                                />
+                                            </td>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <input
+                                                    type="number"
+                                                    value={editReleaseYear}
+                                                    onChange={e => setEditReleaseYear(e.target.value === '' ? '' : Number(e.target.value))}
+                                                    className="form-input"
+                                                    style={{ padding: '0.25rem', width: '80px' }}
+                                                    placeholder="Year"
+                                                />
+                                            </td>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem' }}>
+                                                    {genres.map(genre => (
+                                                        <label key={genre.id} style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.75rem' }}>
+                                                            <input
+                                                                type="checkbox"
+                                                                checked={editGenreIds.includes(genre.id)}
+                                                                onChange={e => {
+                                                                    if (e.target.checked) {
+                                                                        setEditGenreIds([...editGenreIds, genre.id]);
+                                                                    } else {
+                                                                        setEditGenreIds(editGenreIds.filter(id => id !== genre.id));
+                                                                    }
+                                                                }}
+                                                            />
+                                                            {getLocalizedValue(genre.name, activeTab)}
+                                                        </label>
+                                                    ))}
+                                                </div>
+                                                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem', marginTop: '0.5rem', borderTop: '1px dashed #eee', paddingTop: '0.25rem' }}>
+                                                    {specials.map(special => (
+                                                        <label key={special.id} style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', fontSize: '0.75rem', color: '#4b5563' }}>
+                                                            <input
+                                                                type="checkbox"
+                                                                checked={editSpecialIds.includes(special.id)}
+                                                                onChange={e => {
+                                                                    if (e.target.checked) {
+                                                                        setEditSpecialIds([...editSpecialIds, special.id]);
+                                                                    } else {
+                                                                        setEditSpecialIds(editSpecialIds.filter(id => id !== special.id));
+                                                                    }
+                                                                }}
+                                                            />
+                                                            {getLocalizedValue(special.name, activeTab)}
+                                                        </label>
+                                                    ))}
+                                                </div>
+                                                <div style={{ marginTop: '0.5rem', borderTop: '1px dashed #eee', paddingTop: '0.5rem' }}>
+                                                    <label style={{ display: 'flex', alignItems: 'center', gap: '0.5rem', fontSize: '0.75rem', cursor: 'pointer', color: '#b91c1c' }}>
+                                                        <input
+                                                            type="checkbox"
+                                                            checked={editExcludeFromGlobal}
+                                                            onChange={e => setEditExcludeFromGlobal(e.target.checked)}
+                                                        />
+                                                        Exclude from Global
+                                                    </label>
+                                                </div>
+                                            </td>
+                                            <td style={{ padding: '0.75rem', color: '#666', fontSize: '0.75rem' }}>
+                                                {new Date(song.createdAt).toLocaleDateString('de-DE')}
+                                            </td>
+                                            <td style={{ padding: '0.75rem', color: '#666' }}>{song.activations}</td>
+                                            <td style={{ padding: '0.75rem', color: '#666' }}>
+                                                {song.averageRating > 0 ? (
+                                                    <span title={`${song.ratingCount} ratings`}>
+                                                        {song.averageRating.toFixed(1)} ★ <span style={{ color: '#999', fontSize: '0.8rem' }}>({song.ratingCount})</span>
+                                                    </span>
+                                                ) : (
+                                                    <span style={{ color: '#ccc' }}>-</span>
+                                                )}
+                                            </td>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <div style={{ display: 'flex', gap: '0.5rem' }}>
+                                                    <button
+                                                        onClick={() => saveEditing(song.id)}
+                                                        style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                        title="Save"
+                                                    >
+                                                        ✅
+                                                    </button>
+                                                    <button
+                                                        onClick={cancelEditing}
+                                                        style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                        title="Cancel"
+                                                    >
+                                                        ❌
+                                                    </button>
+                                                </div>
+                                            </td>
+                                        </>
+                                    ) : (
+                                        <>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <div style={{ fontWeight: 'bold', color: '#111827' }}>{song.title}</div>
+                                                <div style={{ fontSize: '0.875rem', color: '#6b7280' }}>{song.artist}</div>
+
+                                                {song.excludeFromGlobal && (
+                                                    <div style={{ marginTop: '0.25rem' }}>
+                                                        <span style={{
+                                                            background: '#fee2e2',
+                                                            color: '#991b1b',
+                                                            padding: '0.1rem 0.4rem',
+                                                            borderRadius: '0.25rem',
+                                                            fontSize: '0.7rem',
+                                                            border: '1px solid #fecaca',
+                                                            display: 'inline-flex',
+                                                            alignItems: 'center',
+                                                            gap: '0.25rem'
+                                                        }}>
+                                                            🚫 No Global
+                                                        </span>
+                                                    </div>
+                                                )}
+
+                                                {/* Daily Puzzle Badges */}
+                                                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem', marginTop: '0.25rem' }}>
+                                                    {song.puzzles?.filter(p => p.date === new Date().toISOString().split('T')[0]).map(p => {
+                                                        if (!p.genreId && !p.specialId) {
+                                                            return (
+                                                                <span key={p.id} style={{ background: '#dbeafe', color: '#1e40af', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #93c5fd' }}>
+                                                                    🌍 Global Daily
+                                                                </span>
+                                                            );
+                                                        }
+                                                        if (p.genreId) {
+                                                            const genreName = genres.find(g => g.id === p.genreId)?.name;
+                                                            return (
+                                                                <span key={p.id} style={{ background: '#f3f4f6', color: '#374151', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #d1d5db' }}>
+                                                                    🏷️ {getLocalizedValue(genreName, activeTab)} Daily
+                                                                </span>
+                                                            );
+                                                        }
+                                                        if (p.specialId) {
+                                                            const specialName = specials.find(s => s.id === p.specialId)?.name;
+                                                            return (
+                                                                <span key={p.id} style={{ background: '#fce7f3', color: '#be185d', padding: '0.1rem 0.4rem', borderRadius: '0.25rem', fontSize: '0.7rem', border: '1px solid #fbcfe8' }}>
+                                                                    ★ {getLocalizedValue(specialName, activeTab)} Daily
+                                                                </span>
+                                                            );
+                                                        }
+                                                        return null;
+                                                    })}
+                                                </div>
+                                            </td>
+                                            <td style={{ padding: '0.75rem', color: '#666' }}>
+                                                {song.releaseYear || '-'}
+                                            </td>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem' }}>
+                                                    {song.genres?.map(g => (
+                                                        <span key={g.id} style={{
+                                                            background: '#e5e7eb',
+                                                            padding: '0.1rem 0.4rem',
+                                                            borderRadius: '0.25rem',
+                                                            fontSize: '0.7rem'
+                                                        }}>
+                                                            {getLocalizedValue(g.name, activeTab)}
+                                                        </span>
+                                                    ))}
+                                                </div>
+                                                <div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.25rem', marginTop: '0.25rem' }}>
+                                                    {song.specials?.map(s => (
+                                                        <span key={s.id} style={{
+                                                            background: '#fce7f3',
+                                                            color: '#9d174d',
+                                                            padding: '0.1rem 0.4rem',
+                                                            borderRadius: '0.25rem',
+                                                            fontSize: '0.7rem'
+                                                        }}>
+                                                            {getLocalizedValue(s.name, activeTab)}
+                                                        </span>
+                                                    ))}
+                                                </div>
+                                            </td>
+                                            <td style={{ padding: '0.75rem', color: '#666', fontSize: '0.75rem' }}>
+                                                {new Date(song.createdAt).toLocaleDateString('de-DE')}
+                                            </td>
+                                            <td style={{ padding: '0.75rem', color: '#666' }}>{song.activations}</td>
+                                            <td style={{ padding: '0.75rem', color: '#666' }}>
+                                                {song.averageRating > 0 ? (
+                                                    <span title={`${song.ratingCount} ratings`}>
+                                                        {song.averageRating.toFixed(1)} ★ <span style={{ color: '#999', fontSize: '0.8rem' }}>({song.ratingCount})</span>
+                                                    </span>
+                                                ) : (
+                                                    <span style={{ color: '#ccc' }}>-</span>
+                                                )}
+                                            </td>
+                                            <td style={{ padding: '0.75rem' }}>
+                                                <div style={{ display: 'flex', gap: '0.5rem' }}>
+                                                    <button
+                                                        onClick={() => handlePlayPause(song)}
+                                                        style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                        title={playingSongId === song.id ? "Pause" : "Play"}
+                                                    >
+                                                        {playingSongId === song.id ? '⏸️' : '▶️'}
+                                                    </button>
+                                                    <button
+                                                        onClick={() => startEditing(song)}
+                                                        style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                        title="Edit"
+                                                    >
+                                                        ✏️
+                                                    </button>
+                                                    <button
+                                                        onClick={() => handleDelete(song.id, song.title)}
+                                                        style={{ fontSize: '1.25rem', cursor: 'pointer', border: 'none', background: 'none' }}
+                                                        title={t('deletePuzzle')}
+                                                    >
+                                                        🗑️
+                                                    </button>
+                                                </div>
+                                            </td>
+                                        </>
+                                    )}
+                                </tr>
+                            ))}
+                            {paginatedSongs.length === 0 && (
+                                <tr>
+                                    <td colSpan={7} style={{ padding: '1rem', textAlign: 'center', color: '#666' }}>
+                                        {searchQuery ? 'No songs found matching your search.' : 'No songs uploaded yet.'}
+                                    </td>
+                                </tr>
+                            )}
+                        </tbody>
+                    </table>
+                </div>
+
+                {/* Pagination */}
+                {totalPages > 1 && (
+                    <div style={{ marginTop: '1rem', display: 'flex', justifyContent: 'center', gap: '0.5rem', alignItems: 'center' }}>
+                        <button
+                            onClick={() => setCurrentPage(p => Math.max(1, p - 1))}
+                            disabled={currentPage === 1}
+                            style={{
+                                padding: '0.5rem 1rem',
+                                border: '1px solid #d1d5db',
+                                background: currentPage === 1 ? '#f3f4f6' : '#fff',
+                                cursor: currentPage === 1 ? 'not-allowed' : 'pointer',
+                                borderRadius: '0.25rem'
+                            }}
+                        >
+                            Previous
+                        </button>
+                        <span style={{ color: '#666' }}>
+                            Page {currentPage} of {totalPages}
+                        </span>
+                        <button
+                            onClick={() => setCurrentPage(p => Math.min(totalPages, p + 1))}
+                            disabled={currentPage === totalPages}
+                            style={{
+                                padding: '0.5rem 1rem',
+                                border: '1px solid #d1d5db',
+                                background: currentPage === totalPages ? '#f3f4f6' : '#fff',
+                                cursor: currentPage === totalPages ? 'not-allowed' : 'pointer',
+                                borderRadius: '0.25rem'
+                            }}
+                        >
+                            Next
+                        </button>
+                    </div>
+                )}
+            </div>
+
+            <div className="admin-card" style={{ marginTop: '2rem', border: '1px solid #ef4444' }}>
+                <h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem', color: '#ef4444' }}>
+                    Danger Zone
+                </h2>
+                <p style={{ marginBottom: '1rem', color: '#666' }}>
+                    These actions are destructive and cannot be undone.
+                </p>
+                <button
+                    onClick={async () => {
+                        if (window.confirm('⚠️ WARNING: This will delete ALL data from the database (Songs, Genres, Specials, Puzzles) and re-import songs from the uploads folder.\n\nExisting genres and specials will be LOST and must be recreated manually.\n\nAre you sure you want to proceed?')) {
+                            try {
+                                setMessage('Rebuilding database... this may take a while.');
+                                const res = await fetch('/api/admin/rebuild', { method: 'POST' });
+                                if (res.ok) {
+                                    const data = await res.json();
+                                    alert(data.message + '\n\nPlease recreate your Genres and Specials now.');
+                                    window.location.reload();
+                                } else {
+                                    alert('Rebuild failed. Check server logs.');
+                                    setMessage('Rebuild failed.');
+                                }
+                            } catch (e) {
+                                console.error(e);
+                                alert('Rebuild failed due to network error.');
+                            }
+                        }
+                    }}
+                    style={{
+                        padding: '0.75rem 1.5rem',
+                        background: '#ef4444',
+                        color: 'white',
+                        border: 'none',
+                        borderRadius: '0.25rem',
+                        cursor: 'pointer',
+                        fontWeight: 'bold'
+                    }}
+                >
+                    ☢️ Rebuild Database
+                </button>
+
+
+            </div>
+        </div>
+    );
+}
diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx
new file mode 100644
index 0000000..7fa70a1
--- /dev/null
+++ b/app/[locale]/layout.tsx
@@ -0,0 +1,74 @@
+import type { Metadata, Viewport } from "next";
+import { Geist, Geist_Mono } from "next/font/google";
+import Script from "next/script";
+import "../globals.css"; // Adjusted path
+import { NextIntlClientProvider } from 'next-intl';
+import { getMessages } from 'next-intl/server';
+import { notFound } from 'next/navigation';
+
+import { config } from "@/lib/config";
+import InstallPrompt from "@/components/InstallPrompt";
+import AppFooter from "@/components/AppFooter";
+
+const geistSans = Geist({
+    variable: "--font-geist-sans",
+    subsets: ["latin"],
+});
+
+const geistMono = Geist_Mono({
+    variable: "--font-geist-mono",
+    subsets: ["latin"],
+});
+
+export const metadata: Metadata = {
+    title: config.appName,
+    description: config.appDescription,
+};
+
+export const viewport: Viewport = {
+    themeColor: config.colors.themeColor,
+    width: "device-width",
+    initialScale: 1,
+    maximumScale: 1,
+};
+
+export default async function LocaleLayout({
+    children,
+    params
+}: {
+    children: React.ReactNode;
+    params: Promise<{ locale: string }>;
+}) {
+    const { locale } = await params;
+
+    console.log('[app/[locale]/layout] params locale:', locale);
+
+    // Ensure that the incoming `locale` is valid
+    if (!['en', 'de'].includes(locale)) {
+        console.log('[app/[locale]/layout] invalid locale, triggering notFound()');
+        notFound();
+    }
+
+    // Providing all messages to the client
+    const messages = await getMessages();
+
+    return (
+        <html lang={locale}>
+            <head>
+                <Script
+                    defer
+                    data-domain={config.plausibleDomain}
+                    src={config.plausibleScriptSrc}
+                    strategy="beforeInteractive"
+                />
+            </head>
+            <body className={`${geistSans.variable} ${geistMono.variable}`}>
+                <NextIntlClientProvider messages={messages}>
+                    {children}
+                    <InstallPrompt />
+                    <AppFooter />
+                </NextIntlClientProvider>
+            </body>
+        </html>
+    );
+}
diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
new file mode 100644
index 0000000..2ebcaa5
--- /dev/null
+++ b/app/[locale]/page.tsx
@@ -0,0 +1,138 @@
+import Game from '@/components/Game';
+import NewsSection from '@/components/NewsSection';
+import OnboardingTour from '@/components/OnboardingTour';
+import LanguageSwitcher from '@/components/LanguageSwitcher';
+import { getOrCreateDailyPuzzle } from '@/lib/dailyPuzzle';
+import { Link } from '@/lib/navigation';
+import { PrismaClient } from '@prisma/client';
+import { getTranslations } from 'next-intl/server';
+import { getLocalizedValue } from '@/lib/i18n';
+
+export const dynamic = 'force-dynamic';
+
+const prisma = new PrismaClient();
+
+export default async function Home({
+    params
+}: {
+    params: { locale: string };
+}) {
+    const { locale } = await params;
+    const t = await getTranslations('Home');
+    const tNav = await getTranslations('Navigation');
+
+    const dailyPuzzle = await getOrCreateDailyPuzzle(null); // Global puzzle
+    const genres = await prisma.genre.findMany({
+        where: { active: true },
+    });
+    const specials = await prisma.special.findMany();
+
+    // Sort in memory
+    genres.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+    specials.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+
+    const now = new Date();
+
+    const activeSpecials = specials.filter(s => {
+        const isStarted = !s.launchDate || s.launchDate <= now;
+        const isEnded = s.endDate && s.endDate < now;
+        return isStarted && !isEnded;
+    });
+
+    const upcomingSpecials = specials.filter(s => {
+        return s.launchDate && s.launchDate > now;
+    });
+
+    return (
+        <>
+            <div id="tour-genres" style={{ textAlign: 'center', padding: '1rem', background: '#f3f4f6' }}>
+                <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '0.5rem', maxWidth: '1200px', margin: '0 auto', padding: '0 1rem' }}>
+                    <div style={{ flex: 1 }} />
+                    <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center', flex: 2 }}>
+                        <div className="tooltip">
+                            <Link href="/" style={{ fontWeight: 'bold', textDecoration: 'underline' }}>{tNav('global')}</Link>
+                            <span className="tooltip-text">{t('globalTooltip')}</span>
+                        </div>
+
+                        {/* Genres */}
+                        {genres.map(g => {
+                            const name = getLocalizedValue(g.name, locale);
+                            const subtitle = getLocalizedValue(g.subtitle, locale);
+                            return (
+                                <div key={g.id} className="tooltip">
+                                    <Link href={`/${name}`} style={{ color: '#4b5563', textDecoration: 'none' }}>
+                                        {name}
+                                    </Link>
+                                    {subtitle && <span className="tooltip-text">{subtitle}</span>}
+                                </div>
+                            );
+                        })}
+
+                        {/* Separator if both exist */}
+                        {genres.length > 0 && activeSpecials.length > 0 && (
+                            <span style={{ color: '#d1d5db' }}>|</span>
+                        )}
+
+                        {/* Active Specials */}
+                        {activeSpecials.map(s => {
+                            const name = getLocalizedValue(s.name, locale);
+                            const subtitle = getLocalizedValue(s.subtitle, locale);
+                            return (
+                                <div key={s.id} style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
+                                    <div className="tooltip">
+                                        <Link
+                                            href={`/special/${name}`}
+                                            style={{
+                                                color: '#be185d', // Pink-700
+                                                textDecoration: 'none',
+                                                fontWeight: '500'
+                                            }}
+                                        >
+                                            ★ {name}
+                                        </Link>
+                                        {subtitle && <span className="tooltip-text">{subtitle}</span>}
+                                    </div>
+                                    {s.curator && (
+                                        <span style={{ fontSize: '0.75rem', color: '#666' }}>
+                                            {t('curatedBy')} {s.curator}
+                                        </span>
+                                    )}
+                                </div>
+                            );
+                        })}
+                    </div>
+
+                    {/* Upcoming Specials */}
+                    {upcomingSpecials.length > 0 && (
+                        <div style={{ marginTop: '0.5rem', fontSize: '0.875rem', color: '#666' }}>
+                            {t('comingSoon')}: {upcomingSpecials.map(s => {
+                                const name = getLocalizedValue(s.name, locale);
+                                return (
+                                    <span key={s.id} style={{ marginLeft: '0.5rem' }}>
+                                        ★ {name} ({s.launchDate ? new Date(s.launchDate).toLocaleDateString(locale, {
+                                            day: '2-digit',
+                                            month: '2-digit',
+                                            year: 'numeric',
+                                            timeZone: process.env.TZ
+                                        }) : ''})
+                                        {s.curator && <span style={{ fontStyle: 'italic', marginLeft: '0.25rem' }}>{t('curatedBy')} {s.curator}</span>}
+                                    </span>
+                                );
+                            })}
+                        </div>
+                    )}
+                </div>
+                <div style={{ flex: 1, display: 'flex', justifyContent: 'flex-end' }}>
+                    <LanguageSwitcher />
+                </div>
+            </div>
+
+            <div id="tour-news">
+                <NewsSection locale={locale} />
+            </div>
+
+            <Game dailyPuzzle={dailyPuzzle} genre={null} />
+            <OnboardingTour />
+        </>
+    );
+}
diff --git a/app/[locale]/special/[name]/page.tsx b/app/[locale]/special/[name]/page.tsx
new file mode 100644
index 0000000..d6884f3
--- /dev/null
+++ b/app/[locale]/special/[name]/page.tsx
@@ -0,0 +1,125 @@
+import Game from '@/components/Game';
+import NewsSection from '@/components/NewsSection';
+import { getOrCreateSpecialPuzzle } from '@/lib/dailyPuzzle';
+import { Link } from '@/lib/navigation';
+import { PrismaClient } from '@prisma/client';
+import { getLocalizedValue } from '@/lib/i18n';
+import { getTranslations } from 'next-intl/server';
+
+export const dynamic = 'force-dynamic';
+
+const prisma = new PrismaClient();
+
+interface PageProps {
+    params: Promise<{ locale: string; name: string }>;
+}
+
+export default async function SpecialPage({ params }: PageProps) {
+    const { locale, name } = await params;
+    const decodedName = decodeURIComponent(name);
+    const tNav = await getTranslations('Navigation');
+
+    const allSpecials = await prisma.special.findMany();
+    const currentSpecial = allSpecials.find(s => getLocalizedValue(s.name, locale) === decodedName);
+
+    const now = new Date();
+    const isStarted = currentSpecial && (!currentSpecial.launchDate || currentSpecial.launchDate <= now);
+    const isEnded = currentSpecial && (currentSpecial.endDate && currentSpecial.endDate < now);
+
+    if (!currentSpecial || !isStarted) {
+        return (
+            <div style={{ textAlign: 'center', padding: '2rem' }}>
+                <h1>Special Not Available</h1>
+                <p>This special has not launched yet or does not exist.</p>
+                <Link href="/">{tNav('home')}</Link>
+            </div>
+        );
+    }
+
+    if (isEnded) {
+        return (
+            <div style={{ textAlign: 'center', padding: '2rem' }}>
+                <h1>Special Ended</h1>
+                <p>This special event has ended.</p>
+                <Link href="/">{tNav('home')}</Link>
+            </div>
+        );
+    }
+
+    // Need to handle getOrCreateSpecialPuzzle with localized name or ID
+    // Ideally pass ID or full object, but existing function takes name string.
+    // I'll need to update lib/dailyPuzzle.ts to handle this.
+    const dailyPuzzle = await getOrCreateSpecialPuzzle(currentSpecial);
+
+    const genres = await prisma.genre.findMany({
+        where: { active: true },
+    });
+    genres.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+
+    const specials = allSpecials; // Already fetched
+    specials.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
+
+    const activeSpecials = specials.filter(s => {
+        const sStarted = !s.launchDate || s.launchDate <= now;
+        const sEnded = s.endDate && s.endDate < now;
+        return sStarted && !sEnded;
+    });
+
+    return (
+        <>
+            <div style={{ textAlign: 'center', padding: '1rem', background: '#fce7f3' }}>
+                <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center' }}>
+                    <Link href="/" style={{ color: '#4b5563', textDecoration: 'none' }}>{tNav('global')}</Link>
+
+                    {/* Genres */}
+                    {genres.map(g => {
+                        const gName = getLocalizedValue(g.name, locale);
+                        return (
+                            <Link
+                                key={g.id}
+                                href={`/${gName}`}
+                                style={{
+                                    color: '#4b5563',
+                                    textDecoration: 'none'
+                                }}
+                            >
+                                {gName}
+                            </Link>
+                        );
+                    })}
+
+                    {/* Separator if both exist */}
+                    {genres.length > 0 && activeSpecials.length > 0 && (
+                        <span style={{ color: '#d1d5db' }}>|</span>
+                    )}
+
+                    {/* Specials */}
+                    {activeSpecials.map(s => {
+                        const sName = getLocalizedValue(s.name, locale);
+                        return (
+                            <Link
+                                key={s.id}
+                                href={`/special/${sName}`}
+                                style={{
+                                    fontWeight: sName === decodedName ? 'bold' : 'normal',
+                                    textDecoration: sName === decodedName ? 'underline' : 'none',
+                                    color: sName === decodedName ? '#9d174d' : '#be185d'
+                                }}
+                            >
+                                ★ {sName}
+                            </Link>
+                        );
+                    })}
+                </div>
+            </div>
+            <NewsSection locale={locale} />
+            <Game
+                dailyPuzzle={dailyPuzzle}
+                genre={decodedName}
+                isSpecial={true}
+                maxAttempts={dailyPuzzle?.maxAttempts}
+                unlockSteps={dailyPuzzle?.unlockSteps}
+            />
+        </>
+    );
+}
diff --git a/app/api/admin/daily-puzzles/route.ts b/app/api/admin/daily-puzzles/route.ts
index 860a52e..1ffcc05 100644
--- a/app/api/admin/daily-puzzles/route.ts
+++ b/app/api/admin/daily-puzzles/route.ts
@@ -98,14 +98,14 @@ export async function DELETE(request: Request) {
                 where: { id: puzzle.specialId }
             });
             if (special) {
-                newPuzzle = await getOrCreateSpecialPuzzle(special.name);
+                newPuzzle = await getOrCreateSpecialPuzzle(special);
             }
         } else if (puzzle.genreId) {
             const genre = await prisma.genre.findUnique({
                 where: { id: puzzle.genreId }
             });
             if (genre) {
-                newPuzzle = await getOrCreateDailyPuzzle(genre.name);
+                newPuzzle = await getOrCreateDailyPuzzle(genre);
             }
         } else {
             newPuzzle = await getOrCreateDailyPuzzle(null);
diff --git a/app/api/categorize/route.ts b/app/api/categorize/route.ts
index 2d78691..4d65d00 100644
--- a/app/api/categorize/route.ts
+++ b/app/api/categorize/route.ts
@@ -2,6 +2,7 @@
 
 import { PrismaClient } from '@prisma/client';
 import { requireAdminAuth } from '@/lib/auth';
+import { getLocalizedValue } from '@/lib/i18n';
 
 const prisma = new PrismaClient();
 
@@ -83,7 +84,8 @@ export async function POST(request: Request) {
         // Process each song in this batch
         for (const song of uncategorizedSongs) {
             try {
-                const genreNames = allGenres.map(g => g.name);
+                // Use German names for AI categorization (primary language)
+                const genreNames = allGenres.map(g => getLocalizedValue(g.name, 'de'));
 
                 const prompt = `You are a music genre categorization assistant. Given a song title and artist, categorize it into 0-3 of the available genres.
 
@@ -140,7 +142,7 @@ Your response:`;
 
                 // Filter to only valid genres and get their IDs
                 const genreIds = allGenres
-                    .filter(g => suggestedGenreNames.includes(g.name))
+                    .filter(g => suggestedGenreNames.includes(getLocalizedValue(g.name, 'de')))
                     .map(g => g.id)
                     .slice(0, 3); // Max 3 genres
 
@@ -160,7 +162,7 @@ Your response:`;
                         title: song.title,
                         artist: song.artist,
                         assignedGenres: suggestedGenreNames.filter(name =>
-                            allGenres.some(g => g.name === name)
+                            allGenres.some(g => getLocalizedValue(g.name, 'de') === name)
                         )
                     });
                 }
diff --git a/app/api/daily/route.ts b/app/api/daily/route.ts
index 09e21b9..1a8a408 100644
--- a/app/api/daily/route.ts
+++ b/app/api/daily/route.ts
@@ -1,12 +1,26 @@
 import { NextResponse } from 'next/server';
 import { getOrCreateDailyPuzzle } from '@/lib/dailyPuzzle';
+import { PrismaClient } from '@prisma/client';
+import { getLocalizedValue } from '@/lib/i18n';
+
+const prisma = new PrismaClient();
 
 export async function GET(request: Request) {
     try {
         const { searchParams } = new URL(request.url);
         const genreName = searchParams.get('genre');
 
-        const puzzle = await getOrCreateDailyPuzzle(genreName);
+        let genre = null;
+        if (genreName) {
+            // Find genre by localized name (try both locales)
+            const allGenres = await prisma.genre.findMany();
+            genre = allGenres.find(g =>
+                getLocalizedValue(g.name, 'de') === genreName ||
+                getLocalizedValue(g.name, 'en') === genreName
+            ) || null;
+        }
+
+        const puzzle = await getOrCreateDailyPuzzle(genre);
 
         if (!puzzle) {
             return NextResponse.json({ error: 'Failed to get or create puzzle' }, { status: 404 });
diff --git a/app/api/genres/route.ts b/app/api/genres/route.ts
index cc47664..e945237 100644
--- a/app/api/genres/route.ts
+++ b/app/api/genres/route.ts
@@ -1,19 +1,35 @@
 import { NextResponse } from 'next/server';
 import { PrismaClient } from '@prisma/client';
 import { requireAdminAuth } from '@/lib/auth';
+import { getLocalizedValue } from '@/lib/i18n';
 
 const prisma = new PrismaClient();
 
-export async function GET() {
+export async function GET(request: Request) {
     try {
+        const { searchParams } = new URL(request.url);
+        const locale = searchParams.get('locale');
+
         const genres = await prisma.genre.findMany({
-            orderBy: { name: 'asc' },
+            // orderBy: { name: 'asc' }, // Cannot sort by JSON field easily in SQLite
             include: {
                 _count: {
                     select: { songs: true }
                 }
             }
         });
+
+        // Sort in memory if needed, or just return
+        // If locale is provided, map to localized values
+        if (locale) {
+            const localizedGenres = genres.map(g => ({
+                ...g,
+                name: getLocalizedValue(g.name, locale),
+                subtitle: getLocalizedValue(g.subtitle, locale)
+            })).sort((a, b) => a.name.localeCompare(b.name));
+            return NextResponse.json(localizedGenres);
+        }
+
         return NextResponse.json(genres);
     } catch (error) {
         console.error('Error fetching genres:', error);
@@ -29,14 +45,18 @@ export async function POST(request: Request) {
     try {
         const { name, subtitle, active } = await request.json();
 
-        if (!name || typeof name !== 'string') {
+        if (!name) {
             return NextResponse.json({ error: 'Invalid name' }, { status: 400 });
         }
 
+        // Ensure name is stored as JSON
+        const nameData = typeof name === 'string' ? { de: name, en: name } : name;
+        const subtitleData = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
+
         const genre = await prisma.genre.create({
             data: {
-                name: name.trim(),
-                subtitle: subtitle ? subtitle.trim() : null,
+                name: nameData,
+                subtitle: subtitleData,
                 active: active !== undefined ? active : true
             },
         });
@@ -83,13 +103,14 @@ export async function PUT(request: Request) {
             return NextResponse.json({ error: 'Missing id' }, { status: 400 });
         }
 
+        const updateData: any = {};
+        if (name) updateData.name = typeof name === 'string' ? { de: name, en: name } : name;
+        if (subtitle !== undefined) updateData.subtitle = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
+        if (active !== undefined) updateData.active = active;
+
         const genre = await prisma.genre.update({
             where: { id: Number(id) },
-            data: {
-                ...(name && { name: name.trim() }),
-                subtitle: subtitle ? subtitle.trim() : null,
-                ...(active !== undefined && { active })
-            },
+            data: updateData,
         });
 
         return NextResponse.json(genre);
diff --git a/app/api/news/route.ts b/app/api/news/route.ts
index 1860509..3049f57 100644
--- a/app/api/news/route.ts
+++ b/app/api/news/route.ts
@@ -1,6 +1,7 @@
 import { NextResponse } from 'next/server';
 import { PrismaClient } from '@prisma/client';
 import { requireAdminAuth } from '@/lib/auth';
+import { getLocalizedValue } from '@/lib/i18n';
 
 const prisma = new PrismaClient();
 
@@ -10,6 +11,7 @@ export async function GET(request: Request) {
         const { searchParams } = new URL(request.url);
         const limit = parseInt(searchParams.get('limit') || '10');
         const featuredOnly = searchParams.get('featured') === 'true';
+        const locale = searchParams.get('locale');
 
         const where = featuredOnly ? { featured: true } : {};
 
@@ -27,6 +29,19 @@ export async function GET(request: Request) {
             }
         });
 
+        if (locale) {
+            const localizedNews = news.map(item => ({
+                ...item,
+                title: getLocalizedValue(item.title, locale),
+                content: getLocalizedValue(item.content, locale),
+                special: item.special ? {
+                    ...item.special,
+                    name: getLocalizedValue(item.special.name, locale)
+                } : null
+            }));
+            return NextResponse.json(localizedNews);
+        }
+
         return NextResponse.json(news);
     } catch (error) {
         console.error('Error fetching news:', error);
@@ -52,10 +67,14 @@ export async function POST(request: Request) {
             );
         }
 
+        // Ensure title and content are stored as JSON
+        const titleData = typeof title === 'string' ? { de: title, en: title } : title;
+        const contentData = typeof content === 'string' ? { de: content, en: content } : content;
+
         const news = await prisma.news.create({
             data: {
-                title,
-                content,
+                title: titleData,
+                content: contentData,
                 author: author || null,
                 featured: featured || false,
                 specialId: specialId || null
@@ -93,8 +112,8 @@ export async function PUT(request: Request) {
         }
 
         const updateData: any = {};
-        if (title !== undefined) updateData.title = title;
-        if (content !== undefined) updateData.content = content;
+        if (title !== undefined) updateData.title = typeof title === 'string' ? { de: title, en: title } : title;
+        if (content !== undefined) updateData.content = typeof content === 'string' ? { de: content, en: content } : content;
         if (author !== undefined) updateData.author = author || null;
         if (featured !== undefined) updateData.featured = featured;
         if (specialId !== undefined) updateData.specialId = specialId || null;
diff --git a/app/api/specials/route.ts b/app/api/specials/route.ts
index 4fd42b3..bc5a3ab 100644
--- a/app/api/specials/route.ts
+++ b/app/api/specials/route.ts
@@ -1,18 +1,32 @@
 import { PrismaClient, Special } from '@prisma/client';
 import { NextResponse } from 'next/server';
 import { requireAdminAuth } from '@/lib/auth';
+import { getLocalizedValue } from '@/lib/i18n';
 
 const prisma = new PrismaClient();
 
-export async function GET() {
+export async function GET(request: Request) {
+    const { searchParams } = new URL(request.url);
+    const locale = searchParams.get('locale');
+
     const specials = await prisma.special.findMany({
-        orderBy: { name: 'asc' },
+        // orderBy: { name: 'asc' },
         include: {
             _count: {
                 select: { songs: true }
             }
         }
     });
+
+    if (locale) {
+        const localizedSpecials = specials.map(s => ({
+            ...s,
+            name: getLocalizedValue(s.name, locale),
+            subtitle: getLocalizedValue(s.subtitle, locale)
+        })).sort((a, b) => a.name.localeCompare(b.name));
+        return NextResponse.json(localizedSpecials);
+    }
+
     return NextResponse.json(specials);
 }
 
@@ -25,10 +39,15 @@ export async function POST(request: Request) {
     if (!name) {
         return NextResponse.json({ error: 'Name is required' }, { status: 400 });
     }
+
+    // Ensure name is stored as JSON
+    const nameData = typeof name === 'string' ? { de: name, en: name } : name;
+    const subtitleData = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
+
     const special = await prisma.special.create({
         data: {
-            name,
-            subtitle: subtitle || null,
+            name: nameData,
+            subtitle: subtitleData,
             maxAttempts: Number(maxAttempts),
             unlockSteps,
             launchDate: launchDate ? new Date(launchDate) : null,
@@ -61,17 +80,19 @@ export async function PUT(request: Request) {
     if (!id) {
         return NextResponse.json({ error: 'ID required' }, { status: 400 });
     }
+
+    const updateData: any = {};
+    if (name) updateData.name = typeof name === 'string' ? { de: name, en: name } : name;
+    if (subtitle !== undefined) updateData.subtitle = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
+    if (maxAttempts) updateData.maxAttempts = Number(maxAttempts);
+    if (unlockSteps) updateData.unlockSteps = unlockSteps;
+    if (launchDate !== undefined) updateData.launchDate = launchDate ? new Date(launchDate) : null;
+    if (endDate !== undefined) updateData.endDate = endDate ? new Date(endDate) : null;
+    if (curator !== undefined) updateData.curator = curator || null;
+
     const updated = await prisma.special.update({
         where: { id: Number(id) },
-        data: {
-            ...(name && { name }),
-            subtitle: subtitle || null, // Allow clearing or setting
-            ...(maxAttempts && { maxAttempts: Number(maxAttempts) }),
-            ...(unlockSteps && { unlockSteps }),
-            launchDate: launchDate ? new Date(launchDate) : null,
-            endDate: endDate ? new Date(endDate) : null,
-            curator: curator || null,
-        },
+        data: updateData,
     });
     return NextResponse.json(updated);
 }
diff --git a/app/layout.tsx b/app/layout.tsx
deleted file mode 100644
index 0b4990a..0000000
--- a/app/layout.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import type { Metadata, Viewport } from "next";
-import { Geist, Geist_Mono } from "next/font/google";
-import Script from "next/script";
-import "./globals.css";
-
-import { config } from "@/lib/config";
-
-const geistSans = Geist({
-  variable: "--font-geist-sans",
-  subsets: ["latin"],
-});
-
-const geistMono = Geist_Mono({
-  variable: "--font-geist-mono",
-  subsets: ["latin"],
-});
-
-export const metadata: Metadata = {
-  title: config.appName,
-  description: config.appDescription,
-};
-
-export const viewport: Viewport = {
-  themeColor: config.colors.themeColor,
-  width: "device-width",
-  initialScale: 1,
-  maximumScale: 1,
-};
-
-import InstallPrompt from "@/components/InstallPrompt";
-import AppFooter from "@/components/AppFooter";
-
-export default function RootLayout({
-  children,
-}: Readonly<{
-  children: React.ReactNode;
-}>) {
-  return (
-    <html lang="en">
-      <head>
-        <Script
-          defer
-          data-domain={config.plausibleDomain}
-          src={config.plausibleScriptSrc}
-          strategy="beforeInteractive"
-        />
-      </head>
-      <body className={`${geistSans.variable} ${geistMono.variable}`}>
-        {children}
-        <InstallPrompt />
-        <AppFooter />
-      </body>
-    </html>
-  );
-}
diff --git a/app/page.tsx b/app/page.tsx
deleted file mode 100644
index 7c461cd..0000000
--- a/app/page.tsx
+++ /dev/null
@@ -1,107 +0,0 @@
-import Game from '@/components/Game';
-import NewsSection from '@/components/NewsSection';
-import OnboardingTour from '@/components/OnboardingTour';
-import { getOrCreateDailyPuzzle } from '@/lib/dailyPuzzle';
-import Link from 'next/link';
-import { PrismaClient } from '@prisma/client';
-
-export const dynamic = 'force-dynamic';
-
-const prisma = new PrismaClient();
-
-export default async function Home() {
-  const dailyPuzzle = await getOrCreateDailyPuzzle(null); // Global puzzle
-  const genres = await prisma.genre.findMany({
-    where: { active: true },
-    orderBy: { name: 'asc' }
-  });
-  const specials = await prisma.special.findMany({ orderBy: { name: 'asc' } });
-
-  const now = new Date();
-
-  const activeSpecials = specials.filter(s => {
-    const isStarted = !s.launchDate || s.launchDate <= now;
-    const isEnded = s.endDate && s.endDate < now;
-    return isStarted && !isEnded;
-  });
-
-  const upcomingSpecials = specials.filter(s => {
-    return s.launchDate && s.launchDate > now;
-  });
-
-  return (
-    <>
-      <div id="tour-genres" style={{ textAlign: 'center', padding: '1rem', background: '#f3f4f6' }}>
-        <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center' }}>
-          <div className="tooltip">
-            <Link href="/" style={{ fontWeight: 'bold', textDecoration: 'underline' }}>Global</Link>
-            <span className="tooltip-text">A random song from the entire collection</span>
-          </div>
-
-          {/* Genres */}
-          {genres.map(g => (
-            <div key={g.id} className="tooltip">
-              <Link href={`/${g.name}`} style={{ color: '#4b5563', textDecoration: 'none' }}>
-                {g.name}
-              </Link>
-              {g.subtitle && <span className="tooltip-text">{g.subtitle}</span>}
-            </div>
-          ))}
-
-          {/* Separator if both exist */}
-          {genres.length > 0 && activeSpecials.length > 0 && (
-            <span style={{ color: '#d1d5db' }}>|</span>
-          )}
-
-          {/* Active Specials */}
-          {activeSpecials.map(s => (
-            <div key={s.id} style={{ display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
-              <div className="tooltip">
-                <Link
-                  href={`/special/${s.name}`}
-                  style={{
-                    color: '#be185d', // Pink-700
-                    textDecoration: 'none',
-                    fontWeight: '500'
-                  }}
-                >
-                  ★ {s.name}
-                </Link>
-                {s.subtitle && <span className="tooltip-text">{s.subtitle}</span>}
-              </div>
-              {s.curator && (
-                <span style={{ fontSize: '0.75rem', color: '#666' }}>
-                  Curated by {s.curator}
-                </span>
-              )}
-            </div>
-          ))}
-        </div>
-
-        {/* Upcoming Specials */}
-        {upcomingSpecials.length > 0 && (
-          <div style={{ marginTop: '0.5rem', fontSize: '0.875rem', color: '#666' }}>
-            Coming soon: {upcomingSpecials.map(s => (
-              <span key={s.id} style={{ marginLeft: '0.5rem' }}>
-                ★ {s.name} ({s.launchDate ? new Date(s.launchDate).toLocaleDateString('de-DE', {
-                  day: '2-digit',
-                  month: '2-digit',
-                  year: 'numeric',
-                  timeZone: process.env.TZ
-                }) : ''})
-                {s.curator && <span style={{ fontStyle: 'italic', marginLeft: '0.25rem' }}>Curated by {s.curator}</span>}
-              </span>
-            ))}
-          </div>
-        )}
-      </div>
-
-      <div id="tour-news">
-        <NewsSection />
-      </div>
-
-      <Game dailyPuzzle={dailyPuzzle} genre={null} />
-      <OnboardingTour />
-    </>
-  );
-}
diff --git a/app/special/[name]/page.tsx b/app/special/[name]/page.tsx
deleted file mode 100644
index 26b1b4d..0000000
--- a/app/special/[name]/page.tsx
+++ /dev/null
@@ -1,111 +0,0 @@
-import Game from '@/components/Game';
-import NewsSection from '@/components/NewsSection';
-import { getOrCreateSpecialPuzzle } from '@/lib/dailyPuzzle';
-import Link from 'next/link';
-import { PrismaClient } from '@prisma/client';
-
-export const dynamic = 'force-dynamic';
-
-const prisma = new PrismaClient();
-
-interface PageProps {
-    params: Promise<{ name: string }>;
-}
-
-export default async function SpecialPage({ params }: PageProps) {
-    const { name } = await params;
-    const decodedName = decodeURIComponent(name);
-
-    const currentSpecial = await prisma.special.findUnique({
-        where: { name: decodedName }
-    });
-
-    const now = new Date();
-    const isStarted = currentSpecial && (!currentSpecial.launchDate || currentSpecial.launchDate <= now);
-    const isEnded = currentSpecial && (currentSpecial.endDate && currentSpecial.endDate < now);
-
-    if (!currentSpecial || !isStarted) {
-        return (
-            <div style={{ textAlign: 'center', padding: '2rem' }}>
-                <h1>Special Not Available</h1>
-                <p>This special has not launched yet or does not exist.</p>
-                <Link href="/">Go Home</Link>
-            </div>
-        );
-    }
-
-    if (isEnded) {
-        return (
-            <div style={{ textAlign: 'center', padding: '2rem' }}>
-                <h1>Special Ended</h1>
-                <p>This special event has ended.</p>
-                <Link href="/">Go Home</Link>
-            </div>
-        );
-    }
-
-    const dailyPuzzle = await getOrCreateSpecialPuzzle(decodedName);
-    const genres = await prisma.genre.findMany({
-        where: { active: true },
-        orderBy: { name: 'asc' }
-    });
-    const specials = await prisma.special.findMany({ orderBy: { name: 'asc' } });
-
-    const activeSpecials = specials.filter(s => {
-        const sStarted = !s.launchDate || s.launchDate <= now;
-        const sEnded = s.endDate && s.endDate < now;
-        return sStarted && !sEnded;
-    });
-
-    return (
-        <>
-            <div style={{ textAlign: 'center', padding: '1rem', background: '#fce7f3' }}>
-                <div style={{ display: 'flex', justifyContent: 'center', gap: '1rem', flexWrap: 'wrap', alignItems: 'center' }}>
-                    <Link href="/" style={{ color: '#4b5563', textDecoration: 'none' }}>Global</Link>
-
-                    {/* Genres */}
-                    {genres.map(g => (
-                        <Link
-                            key={g.id}
-                            href={`/${g.name}`}
-                            style={{
-                                color: '#4b5563',
-                                textDecoration: 'none'
-                            }}
-                        >
-                            {g.name}
-                        </Link>
-                    ))}
-
-                    {/* Separator if both exist */}
-                    {genres.length > 0 && activeSpecials.length > 0 && (
-                        <span style={{ color: '#d1d5db' }}>|</span>
-                    )}
-
-                    {/* Specials */}
-                    {activeSpecials.map(s => (
-                        <Link
-                            key={s.id}
-                            href={`/special/${s.name}`}
-                            style={{
-                                fontWeight: s.name === decodedName ? 'bold' : 'normal',
-                                textDecoration: s.name === decodedName ? 'underline' : 'none',
-                                color: s.name === decodedName ? '#9d174d' : '#be185d'
-                            }}
-                        >
-                            ★ {s.name}
-                        </Link>
-                    ))}
-                </div>
-            </div>
-            <NewsSection />
-            <Game
-                dailyPuzzle={dailyPuzzle}
-                genre={decodedName}
-                isSpecial={true}
-                maxAttempts={dailyPuzzle?.maxAttempts}
-                unlockSteps={dailyPuzzle?.unlockSteps}
-            />
-        </>
-    );
-}
diff --git a/components/Game.tsx b/components/Game.tsx
index 7d3ee5f..6ed1455 100644
--- a/components/Game.tsx
+++ b/components/Game.tsx
@@ -2,6 +2,7 @@
 
 import { config } from '@/lib/config';
 import { useEffect, useState, useRef } from 'react';
+import { useTranslations, useLocale } from 'next-intl';
 import AudioPlayer, { AudioPlayerRef } from './AudioPlayer';
 import GuessInput from './GuessInput';
 import Statistics from './Statistics';
@@ -36,10 +37,12 @@ interface GameProps {
 const DEFAULT_UNLOCK_STEPS = [2, 4, 7, 11, 16, 30, 60];
 
 export default function Game({ dailyPuzzle, genre = null, isSpecial = false, maxAttempts = 7, unlockSteps = DEFAULT_UNLOCK_STEPS }: GameProps) {
+    const t = useTranslations('Game');
+    const locale = useLocale();
     const { gameState, statistics, addGuess, giveUp, addReplay, addYearBonus, skipYearBonus } = useGameState(genre, maxAttempts);
     const [hasWon, setHasWon] = useState(false);
     const [hasLost, setHasLost] = useState(false);
-    const [shareText, setShareText] = useState('🔗 Share');
+    const [shareText, setShareText] = useState(`🔗 ${t('share')}`);
     const [lastAction, setLastAction] = useState<'GUESS' | 'SKIP' | null>(null);
     const [isProcessingGuess, setIsProcessingGuess] = useState(false);
     const [timeUntilNext, setTimeUntilNext] = useState('');
@@ -95,13 +98,13 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
 
     if (!dailyPuzzle) return (
         <div className="game-container" style={{ textAlign: 'center', padding: '2rem' }}>
-            <h2>No Puzzle Available</h2>
-            <p>Could not generate a daily puzzle.</p>
-            <p>Please ensure there are songs in the database{genre ? ` for genre "${genre}"` : ''}.</p>
-            <a href="/admin" style={{ color: 'var(--primary)', textDecoration: 'underline' }}>Go to Admin Dashboard</a>
+            <h2>{t('noPuzzleAvailable')}</h2>
+            <p>{t('noPuzzleDescription')}</p>
+            <p>{t('noPuzzleGenre')}{genre ? ` für Genre "${genre}"` : ''}.</p>
+            <a href="/admin" style={{ color: 'var(--primary)', textDecoration: 'underline' }}>{t('goToAdmin')}</a>
         </div>
     );
-    if (!gameState) return <div>Loading state...</div>;
+    if (!gameState) return <div>{t('loadingState')}</div>;
 
     const handleGuess = (song: any) => {
         if (isProcessingGuess) return;
@@ -269,9 +272,13 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
 
         const speaker = hasWon ? '🔉' : '🔇';
         const bonusStar = (hasWon && gameState.yearGuessed && dailyPuzzle.releaseYear && gameState.scoreBreakdown.some(item => item.reason === 'Bonus: Correct Year')) ? '⭐' : '';
-        const genreText = genre ? `${isSpecial ? 'Special' : 'Genre'}: ${genre}\n` : '';
+        const genreText = genre ? `${isSpecial ? t('special') : t('genre')}: ${genre}\n` : '';
 
         let shareUrl = `https://${config.domain}`;
+        // Add locale prefix if not default (de)
+        if (locale !== 'de') {
+            shareUrl += `/${locale}`;
+        }
         if (genre) {
             if (isSpecial) {
                 shareUrl += `/special/${encodeURIComponent(genre)}`;
@@ -280,7 +287,7 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
             }
         }
 
-        const text = `${config.appName} #${dailyPuzzle.puzzleNumber}\n${genreText}\n${speaker}${emojiGrid}${bonusStar}\nScore: ${gameState.score}\n\n#${config.appName} #Music\n\n${shareUrl}`;
+        const text = `${config.appName} #${dailyPuzzle.puzzleNumber}\n${genreText}\n${speaker}${emojiGrid}${bonusStar}\n${t('score')}: ${gameState.score}\n\n#${config.appName} #Music\n\n${shareUrl}`;
 
         const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
 
@@ -290,8 +297,8 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                     title: `Hördle #${dailyPuzzle.puzzleNumber}`,
                     text: text,
                 });
-                setShareText('✓ Shared!');
-                setTimeout(() => setShareText('🔗 Share'), 2000);
+                setShareText(t('shared'));
+                setTimeout(() => setShareText(`🔗 ${t('share')}`), 2000);
                 return;
             } catch (err) {
                 if ((err as Error).name !== 'AbortError') {
@@ -302,12 +309,12 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
 
         try {
             await navigator.clipboard.writeText(text);
-            setShareText('✓ Copied!');
-            setTimeout(() => setShareText('🔗 Share'), 2000);
+            setShareText(t('copied'));
+            setTimeout(() => setShareText(`🔗 ${t('share')}`), 2000);
         } catch (err) {
             console.error('Clipboard failed:', err);
-            setShareText('✗ Failed');
-            setTimeout(() => setShareText('🔗 Share'), 2000);
+            setShareText(t('shareFailed'));
+            setTimeout(() => setShareText(`🔗 ${t('share')}`), 2000);
         }
     };
 
@@ -333,15 +340,15 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
             <header className="header">
                 <h1 id="tour-title" className="title">{config.appName} #{dailyPuzzle.puzzleNumber}{genre ? ` / ${genre}` : ''}</h1>
                 <div style={{ fontSize: '0.9rem', color: 'var(--muted-foreground)', marginTop: '0.5rem', marginBottom: '1rem' }}>
-                    Next puzzle in: {timeUntilNext}
+                    {t('nextPuzzle')}: {timeUntilNext}
                 </div>
             </header>
 
             <main className="game-board">
                 <div style={{ borderBottom: '1px solid #e5e7eb', paddingBottom: '1rem' }}>
                     <div id="tour-status" className="status-bar">
-                        <span>Attempt {gameState.guesses.length + 1} / {maxAttempts}</span>
-                        <span>{unlockedSeconds}s unlocked</span>
+                        <span>{t('attempt')} {gameState.guesses.length + 1} / {maxAttempts}</span>
+                        <span>{unlockedSeconds}s {t('unlocked')}</span>
                     </div>
 
                     <div id="tour-score">
@@ -368,7 +375,7 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                             <div key={i} className="guess-item">
                                 <span className="guess-number">#{i + 1}</span>
                                 <span className={`guess-text ${guess === 'SKIPPED' ? 'skipped' : ''} ${isCorrect ? 'correct' : ''}`}>
-                                    {isCorrect ? 'Correct!' : guess}
+                                    {isCorrect ? t('correct') : guess}
                                 </span>
                             </div>
                         );
@@ -387,8 +394,8 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                                 className="skip-button"
                             >
                                 {gameState.guesses.length === 0 && !hasPlayedAudio
-                                    ? 'Start'
-                                    : `Skip (+${unlockSteps[Math.min(gameState.guesses.length + 1, unlockSteps.length - 1)] - unlockedSeconds}s)`
+                                    ? t('start')
+                                    : t('skipWithBonus', { seconds: unlockSteps[Math.min(gameState.guesses.length + 1, unlockSteps.length - 1)] - unlockedSeconds })
                                 }
                             </button>
                         ) : (
@@ -400,7 +407,7 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                                     boxShadow: '0 4px 15px rgba(245, 87, 108, 0.4)'
                                 }}
                             >
-                                Solve (Give Up)
+                                {t('solveGiveUp')}
                             </button>
                         )}
                     </>
@@ -409,15 +416,15 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                 {(hasWon || hasLost) && (
                     <div className={`message-box ${hasWon ? 'success' : 'failure'}`}>
                         <h2 style={{ fontSize: '1.5rem', fontWeight: 'bold', marginBottom: '0.5rem' }}>
-                            {hasWon ? 'You won!' : 'Game Over'}
+                            {hasWon ? t('won') : t('lost')}
                         </h2>
 
                         <div style={{ fontSize: '2rem', fontWeight: 'bold', margin: '1rem 0', color: hasWon ? 'var(--success)' : 'var(--danger)' }}>
-                            Score: {gameState.score}
+                            {t('score')}: {gameState.score}
                         </div>
 
                         <details style={{ marginBottom: '1rem', cursor: 'pointer', fontSize: '0.9rem', color: 'var(--muted-foreground)' }}>
-                            <summary>Score Breakdown</summary>
+                            <summary>{t('scoreBreakdown')}</summary>
                             <ul style={{ listStyle: 'none', padding: '0.5rem', textAlign: 'left', background: 'rgba(255,255,255,0.5)', borderRadius: '0.5rem', marginTop: '0.5rem' }}>
                                 {gameState.scoreBreakdown.map((item, i) => (
                                     <li key={i} style={{ display: 'flex', justifyContent: 'space-between', padding: '0.25rem 0' }}>
@@ -430,22 +437,22 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
                             </ul>
                         </details>
 
-                        <p>{hasWon ? 'Come back tomorrow for a new song.' : 'The song was:'}</p>
+                        <p>{hasWon ? t('comeBackTomorrow') : t('theSongWas')}</p>
 
                         <div style={{ margin: '1.5rem 0', padding: '1rem', background: 'rgba(255,255,255,0.5)', borderRadius: '0.5rem', display: 'flex', flexDirection: 'column', alignItems: 'center' }}>
                             <img
                                 src={dailyPuzzle.coverImage || '/favicon.ico'}
-                                alt="Album Cover"
+                                alt={t('albumCover')}
                                 style={{ width: '150px', height: '150px', objectFit: 'cover', borderRadius: '0.5rem', marginBottom: '1rem', boxShadow: '0 4px 6px rgba(0,0,0,0.1)' }}
                             />
                             <h3 style={{ fontSize: '1.125rem', fontWeight: 'bold', margin: '0 0 0.5rem 0' }}>{dailyPuzzle.title}</h3>
                             <p style={{ fontSize: '0.875rem', color: 'var(--muted-foreground)', margin: '0 0 0.5rem 0' }}>{dailyPuzzle.artist}</p>
                             {dailyPuzzle.releaseYear && gameState.yearGuessed && (
-                                <p style={{ fontSize: '0.875rem', color: 'var(--muted-foreground)', margin: '0 0 1rem 0' }}>Released: {dailyPuzzle.releaseYear}</p>
+                                <p style={{ fontSize: '0.875rem', color: 'var(--muted-foreground)', margin: '0 0 1rem 0' }}>{t('released')}: {dailyPuzzle.releaseYear}</p>
                             )}
                             <audio controls style={{ width: '100%' }}>
                                 <source src={dailyPuzzle.audioUrl} type="audio/mpeg" />
-                                Your browser does not support the audio element.
+                                {t('yourBrowserDoesNotSupport')}
                             </audio>
                         </div>
 
@@ -505,6 +512,7 @@ function ScoreDisplay({ score, breakdown }: { score: number, breakdown: Array<{
 }
 
 function YearGuessModal({ correctYear, onGuess, onSkip }: { correctYear: number, onGuess: (year: number) => void, onSkip: () => void }) {
+    const t = useTranslations('Game');
     const [options, setOptions] = useState<number[]>([]);
     const [feedback, setFeedback] = useState<{ show: boolean, correct: boolean, guessedYear?: number }>({ show: false, correct: false });
 
@@ -578,8 +586,8 @@ function YearGuessModal({ correctYear, onGuess, onSkip }: { correctYear: number,
             }}>
                 {!feedback.show ? (
                     <>
-                        <h3 style={{ fontSize: '1.5rem', fontWeight: 'bold', marginBottom: '0.5rem', color: 'var(--primary)' }}>Bonus Round!</h3>
-                        <p style={{ marginBottom: '1.5rem', color: 'var(--secondary)' }}>Guess the release year for <strong style={{ color: 'var(--success)' }}>+10 points</strong>!</p>
+                        <h3 style={{ fontSize: '1.5rem', fontWeight: 'bold', marginBottom: '0.5rem', color: 'var(--primary)' }}>{t('bonusRound')}</h3>
+                        <p style={{ marginBottom: '1.5rem', color: 'var(--secondary)' }}>{t('guessReleaseYear')} <strong style={{ color: 'var(--success)' }}>+10 {t('points')}</strong>!</p>
 
                         <div style={{
                             display: 'grid',
@@ -621,7 +629,7 @@ function YearGuessModal({ correctYear, onGuess, onSkip }: { correctYear: number,
                                 fontSize: '0.9rem'
                             }}
                         >
-                            Skip Bonus
+                            {t('skipBonus')}
                         </button>
                     </>
                 ) : (
@@ -630,23 +638,23 @@ function YearGuessModal({ correctYear, onGuess, onSkip }: { correctYear: number,
                             feedback.correct ? (
                                 <>
                                     <div style={{ fontSize: '4rem', marginBottom: '1rem' }}>🎉</div>
-                                    <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--success)', marginBottom: '0.5rem' }}>Correct!</h3>
-                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>Released in {correctYear}</p>
-                                    <p style={{ fontSize: '1.5rem', fontWeight: 'bold', color: 'var(--success)', marginTop: '1rem' }}>+10 Points!</p>
+                                    <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--success)', marginBottom: '0.5rem' }}>{t('correct')}</h3>
+                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>{t('released')} {correctYear}</p>
+                                    <p style={{ fontSize: '1.5rem', fontWeight: 'bold', color: 'var(--success)', marginTop: '1rem' }}>+10 {t('points')}!</p>
                                 </>
                             ) : (
                                 <>
                                     <div style={{ fontSize: '4rem', marginBottom: '1rem' }}>😕</div>
-                                    <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--danger)', marginBottom: '0.5rem' }}>Not quite!</h3>
-                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>You guessed {feedback.guessedYear}</p>
-                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)', marginTop: '0.5rem' }}>Actually released in <strong>{correctYear}</strong></p>
+                                    <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--danger)', marginBottom: '0.5rem' }}>{t('notQuite')}</h3>
+                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>{t('youGuessed')} {feedback.guessedYear}</p>
+                                    <p style={{ fontSize: '1.2rem', color: 'var(--secondary)', marginTop: '0.5rem' }}>{t('actuallyReleasedIn')} <strong>{correctYear}</strong></p>
                                 </>
                             )
                         ) : (
                             <>
                                 <div style={{ fontSize: '4rem', marginBottom: '1rem' }}>⏭️</div>
-                                <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--muted-foreground)', marginBottom: '0.5rem' }}>Skipped</h3>
-                                <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>Released in {correctYear}</p>
+                                <h3 style={{ fontSize: '2rem', fontWeight: 'bold', color: 'var(--muted-foreground)', marginBottom: '0.5rem' }}>{t('skipped')}</h3>
+                                <p style={{ fontSize: '1.2rem', color: 'var(--secondary)' }}>{t('released')} {correctYear}</p>
                             </>
                         )}
                     </div>
@@ -657,16 +665,17 @@ function YearGuessModal({ correctYear, onGuess, onSkip }: { correctYear: number,
 }
 
 function StarRating({ onRate, hasRated }: { onRate: (rating: number) => void, hasRated: boolean }) {
+    const t = useTranslations('Game');
     const [hover, setHover] = useState(0);
     const [rating, setRating] = useState(0);
 
     if (hasRated) {
-        return <div style={{ color: 'var(--muted-foreground)', fontStyle: 'italic' }}>Thanks for rating!</div>;
+        return <div style={{ color: 'var(--muted-foreground)', fontStyle: 'italic' }}>{t('thanksForRating')}</div>;
     }
 
     return (
         <div className="star-rating" style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', gap: '0.5rem' }}>
-            <span style={{ fontSize: '0.875rem', color: 'var(--muted-foreground)', fontWeight: '500' }}>Rate this puzzle:</span>
+            <span style={{ fontSize: '0.875rem', color: 'var(--muted-foreground)', fontWeight: '500' }}>{t('rateThisPuzzle')}</span>
             <div style={{ display: 'flex', gap: '0.25rem', justifyContent: 'center' }}>
                 {[...Array(5)].map((_, index) => {
                     const ratingValue = index + 1;
diff --git a/components/GuessInput.tsx b/components/GuessInput.tsx
index c1057f6..1e0c4b0 100644
--- a/components/GuessInput.tsx
+++ b/components/GuessInput.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { useState, useEffect } from 'react';
+import { useTranslations } from 'next-intl';
 
 interface Song {
     id: number;
@@ -14,6 +15,7 @@ interface GuessInputProps {
 }
 
 export default function GuessInput({ onGuess, disabled }: GuessInputProps) {
+    const t = useTranslations('Game');
     const [query, setQuery] = useState('');
     const [songs, setSongs] = useState<Song[]>([]);
     const [filteredSongs, setFilteredSongs] = useState<Song[]>([]);
@@ -53,7 +55,7 @@ export default function GuessInput({ onGuess, disabled }: GuessInputProps) {
                 value={query}
                 onChange={(e) => setQuery(e.target.value)}
                 disabled={disabled}
-                placeholder={disabled ? "Game Over" : "Know it? Search for the artist / title"}
+                placeholder={disabled ? t('gameOverPlaceholder') : t('knowItSearch')}
                 className="guess-input"
             />
 
diff --git a/components/InstallPrompt.tsx b/components/InstallPrompt.tsx
index 644a165..5351b31 100644
--- a/components/InstallPrompt.tsx
+++ b/components/InstallPrompt.tsx
@@ -1,8 +1,10 @@
 'use client';
 
 import { useState, useEffect } from 'react';
+import { useTranslations } from 'next-intl';
 
 export default function InstallPrompt() {
+    const t = useTranslations('InstallPrompt');
     const [isIOS, setIsIOS] = useState(false);
     const [isStandalone, setIsStandalone] = useState(false);
     const [showPrompt, setShowPrompt] = useState(false);
@@ -80,9 +82,9 @@ export default function InstallPrompt() {
         }}>
             <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'start' }}>
                 <div>
-                    <h3 style={{ fontWeight: 'bold', fontSize: '1rem', marginBottom: '0.25rem' }}>Install Hördle App</h3>
+                    <h3 style={{ fontWeight: 'bold', fontSize: '1rem', marginBottom: '0.25rem' }}>{t('installApp')}</h3>
                     <p style={{ fontSize: '0.875rem', color: '#666' }}>
-                        Install the app for a better experience and quick access!
+                        {t('installDescription')}
                     </p>
                 </div>
                 <button
@@ -102,7 +104,7 @@ export default function InstallPrompt() {
 
             {isIOS ? (
                 <div style={{ fontSize: '0.875rem', background: '#f3f4f6', padding: '0.75rem', borderRadius: '0.5rem', marginTop: '0.5rem' }}>
-                    Tap <span style={{ fontSize: '1.2rem' }}>share</span> then "Add to Home Screen" <span style={{ fontSize: '1.2rem' }}>+</span>
+                    {t('iosInstructions')} <span style={{ fontSize: '1.2rem' }}>{t('iosShare')}</span> {t('iosThen')} <span style={{ fontSize: '1.2rem' }}>+</span>
                 </div>
             ) : (
                 <button
@@ -118,7 +120,7 @@ export default function InstallPrompt() {
                         marginTop: '0.5rem'
                     }}
                 >
-                    Install App
+                    {t('installButton')}
                 </button>
             )}
             <style jsx>{`
diff --git a/components/LanguageSwitcher.tsx b/components/LanguageSwitcher.tsx
new file mode 100644
index 0000000..d7abd5c
--- /dev/null
+++ b/components/LanguageSwitcher.tsx
@@ -0,0 +1,59 @@
+'use client';
+
+import { usePathname, useRouter } from '@/lib/navigation';
+import { useLocale } from 'next-intl';
+
+export default function LanguageSwitcher() {
+    const locale = useLocale();
+    const router = useRouter();
+    const pathname = usePathname();
+
+    const switchLocale = (newLocale: 'de' | 'en') => {
+        router.replace(pathname, { locale: newLocale });
+    };
+
+    return (
+        <div style={{
+            display: 'flex',
+            background: '#f3f4f6',
+            borderRadius: '0.375rem',
+            padding: '0.25rem',
+            gap: '0.25rem'
+        }}>
+            <button
+                onClick={() => switchLocale('de')}
+                style={{
+                    padding: '0.375rem 0.75rem',
+                    background: locale === 'de' ? 'white' : 'transparent',
+                    border: 'none',
+                    borderRadius: '0.25rem',
+                    cursor: 'pointer',
+                    fontWeight: locale === 'de' ? '600' : '400',
+                    fontSize: '0.875rem',
+                    color: locale === 'de' ? '#111827' : '#6b7280',
+                    boxShadow: locale === 'de' ? '0 1px 2px rgba(0,0,0,0.05)' : 'none',
+                    transition: 'all 0.2s'
+                }}
+            >
+                DE
+            </button>
+            <button
+                onClick={() => switchLocale('en')}
+                style={{
+                    padding: '0.375rem 0.75rem',
+                    background: locale === 'en' ? 'white' : 'transparent',
+                    border: 'none',
+                    borderRadius: '0.25rem',
+                    cursor: 'pointer',
+                    fontWeight: locale === 'en' ? '600' : '400',
+                    fontSize: '0.875rem',
+                    color: locale === 'en' ? '#111827' : '#6b7280',
+                    boxShadow: locale === 'en' ? '0 1px 2px rgba(0,0,0,0.05)' : 'none',
+                    transition: 'all 0.2s'
+                }}
+            >
+                EN
+            </button>
+        </div>
+    );
+}
diff --git a/components/NewsSection.tsx b/components/NewsSection.tsx
index abd8d8b..4f13e6e 100644
--- a/components/NewsSection.tsx
+++ b/components/NewsSection.tsx
@@ -2,33 +2,38 @@
 
 import { useEffect, useState } from 'react';
 import ReactMarkdown from 'react-markdown';
-import Link from 'next/link';
+import { Link } from '@/lib/navigation';
+import { getLocalizedValue } from '@/lib/i18n';
 
 interface NewsItem {
     id: number;
-    title: string;
-    content: string;
+    title: any;
+    content: any;
     author: string | null;
     publishedAt: string;
     featured: boolean;
     special: {
         id: number;
-        name: string;
+        name: any;
     } | null;
 }
 
-export default function NewsSection() {
+interface NewsSectionProps {
+    locale: string;
+}
+
+export default function NewsSection({ locale }: NewsSectionProps) {
     const [news, setNews] = useState<NewsItem[]>([]);
     const [isExpanded, setIsExpanded] = useState(false);
     const [loading, setLoading] = useState(true);
 
     useEffect(() => {
         fetchNews();
-    }, []);
+    }, [locale]);
 
     const fetchNews = async () => {
         try {
-            const res = await fetch('/api/news?limit=3');
+            const res = await fetch(`/api/news?limit=3&locale=${locale}`);
             if (res.ok) {
                 const data = await res.json();
                 setNews(data);
@@ -115,7 +120,7 @@ export default function NewsSection() {
                                     fontWeight: '600',
                                     color: '#111827'
                                 }}>
-                                    {item.title}
+                                    {getLocalizedValue(item.title, locale)}
                                 </h3>
                             </div>
 
@@ -145,14 +150,14 @@ export default function NewsSection() {
                                     <>
                                         <span>•</span>
                                         <Link
-                                            href={`/special/${item.special.name}`}
+                                            href={`/special/${getLocalizedValue(item.special.name, locale)}`}
                                             style={{
                                                 color: '#be185d',
                                                 textDecoration: 'none',
                                                 fontWeight: '500'
                                             }}
                                         >
-                                            ★ {item.special.name}
+                                            ★ {getLocalizedValue(item.special.name, locale)}
                                         </Link>
                                     </>
                                 )}
@@ -187,7 +192,7 @@ export default function NewsSection() {
                                         li: ({ children }) => <li style={{ margin: '0.25rem 0' }}>{children}</li>
                                     }}
                                 >
-                                    {item.content}
+                                    {getLocalizedValue(item.content, locale)}
                                 </ReactMarkdown>
                             </div>
                         </div>
diff --git a/components/OnboardingTour.tsx b/components/OnboardingTour.tsx
index 473c301..3013c63 100644
--- a/components/OnboardingTour.tsx
+++ b/components/OnboardingTour.tsx
@@ -1,10 +1,13 @@
 'use client';
 
 import { useEffect } from 'react';
+import { useTranslations } from 'next-intl';
 import { driver } from 'driver.js';
 import 'driver.js/dist/driver.css';
 
 export default function OnboardingTour() {
+    const t = useTranslations('OnboardingTour');
+    
     useEffect(() => {
         const hasCompletedOnboarding = localStorage.getItem('hoerdle_onboarding_completed');
 
@@ -16,9 +19,9 @@ export default function OnboardingTour() {
             showProgress: true,
             animate: true,
             allowClose: true,
-            doneBtnText: 'Done',
-            nextBtnText: 'Next',
-            prevBtnText: 'Previous',
+            doneBtnText: t('done'),
+            nextBtnText: t('next'),
+            prevBtnText: t('previous'),
             onDestroyed: () => {
                 localStorage.setItem('hoerdle_onboarding_completed', 'true');
             },
@@ -26,8 +29,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-genres',
                     popover: {
-                        title: 'Genres & Specials',
-                        description: 'Choose a specific genre or a curated special event here.',
+                        title: t('genresSpecials'),
+                        description: t('genresSpecialsDescription'),
                         side: 'bottom',
                         align: 'start'
                     }
@@ -35,8 +38,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-news',
                     popover: {
-                        title: 'News',
-                        description: 'Stay updated with the latest news and announcements.',
+                        title: t('news'),
+                        description: t('newsDescription'),
                         side: 'top',
                         align: 'start'
                     }
@@ -44,8 +47,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-title',
                     popover: {
-                        title: 'Hördle',
-                        description: 'This is the daily puzzle. One new song every day per genre.',
+                        title: t('hoerdle'),
+                        description: t('hoerdleDescription'),
                         side: 'bottom',
                         align: 'start'
                     }
@@ -53,8 +56,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-status',
                     popover: {
-                        title: 'Attempts',
-                        description: 'You have a limited number of attempts to guess the song.',
+                        title: t('attempts'),
+                        description: t('attemptsDescription'),
                         side: 'bottom',
                         align: 'start'
                     }
@@ -62,8 +65,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-score',
                     popover: {
-                        title: 'Score',
-                        description: 'Your current score. Try to keep it high!',
+                        title: t('score'),
+                        description: t('scoreDescription'),
                         side: 'bottom',
                         align: 'start'
                     }
@@ -71,8 +74,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-player',
                     popover: {
-                        title: 'Player',
-                        description: 'Listen to the snippet. Each additional play reduces your potential score.',
+                        title: t('player'),
+                        description: t('playerDescription'),
                         side: 'top',
                         align: 'start'
                     }
@@ -80,8 +83,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-input',
                     popover: {
-                        title: 'Input',
-                        description: 'Type your guess here. Search for artist or title.',
+                        title: t('input'),
+                        description: t('inputDescription'),
                         side: 'top',
                         align: 'start'
                     }
@@ -89,8 +92,8 @@ export default function OnboardingTour() {
                 {
                     element: '#tour-controls',
                     popover: {
-                        title: 'Controls',
-                        description: 'Start the music or skip to the next snippet if you\'re stuck.',
+                        title: t('controls'),
+                        description: t('controlsDescription'),
                         side: 'top',
                         align: 'start'
                     }
@@ -103,7 +106,7 @@ export default function OnboardingTour() {
             driverObj.drive();
         }, 1000);
 
-    }, []);
+    }, [t]);
 
     return null;
 }
diff --git a/components/Statistics.tsx b/components/Statistics.tsx
index be3f3be..a5981db 100644
--- a/components/Statistics.tsx
+++ b/components/Statistics.tsx
@@ -1,5 +1,6 @@
 'use client';
 
+import { useTranslations } from 'next-intl';
 import { Statistics as StatsType } from '../lib/gameState';
 
 interface StatisticsProps {
@@ -18,6 +19,7 @@ const BADGES = {
 };
 
 export default function Statistics({ statistics }: StatisticsProps) {
+    const t = useTranslations('Statistics');
     const total =
         statistics.solvedIn1 +
         statistics.solvedIn2 +
@@ -36,19 +38,19 @@ export default function Statistics({ statistics }: StatisticsProps) {
         { attempts: 5, count: statistics.solvedIn5, badge: BADGES[5] },
         { attempts: 6, count: statistics.solvedIn6, badge: BADGES[6] },
         { attempts: 7, count: statistics.solvedIn7, badge: BADGES[7] },
-        { attempts: 'Failed', count: statistics.failed, badge: BADGES.failed },
+        { attempts: t('failed'), count: statistics.failed, badge: BADGES.failed },
     ];
 
     return (
         <div className="statistics-container">
-            <h3 className="statistics-title">Your Statistics</h3>
-            <p className="statistics-total">Total puzzles: {total}</p>
+            <h3 className="statistics-title">{t('yourStatistics')}</h3>
+            <p className="statistics-total">{t('totalPuzzles')}: {total}</p>
             <div className="statistics-grid">
                 {stats.map((stat, index) => (
                     <div key={index} className="stat-item">
                         <div className="stat-badge">{stat.badge}</div>
                         <div className="stat-label">
-                            {typeof stat.attempts === 'number' ? `${stat.attempts} try` : stat.attempts}
+                            {typeof stat.attempts === 'number' ? `${stat.attempts} ${t('try')}` : stat.attempts}
                         </div>
                         <div className="stat-count">{stat.count}</div>
                     </div>
diff --git a/docker-compose.example.yml b/docker-compose.example.yml
index 917e796..1cd2638 100644
--- a/docker-compose.example.yml
+++ b/docker-compose.example.yml
@@ -37,6 +37,4 @@ services:
       timeout: 10s
       retries: 3
       start_period: 40s
-    # Run migrations and start server (auto-baseline on first run if needed)
-    command: >
-      sh -c "npx prisma migrate deploy || (echo 'Baselining existing database...' && sh scripts/baseline-migrations.sh && npx prisma migrate deploy) && node server.js"
+    # docker-entrypoint.sh handles migrations and server startup (with baseline fallback)
diff --git a/i18n/request.ts b/i18n/request.ts
new file mode 100644
index 0000000..177910d
--- /dev/null
+++ b/i18n/request.ts
@@ -0,0 +1,20 @@
+import { getRequestConfig } from 'next-intl/server';
+
+const locales = ['en', 'de'] as const;
+
+export default getRequestConfig(async ({ requestLocale }) => {
+    // `requestLocale` kommt von next-intl (z.B. aus dem [locale]-Segment oder Fallback)
+    let locale = await requestLocale;
+
+    console.log('[i18n/request] incoming requestLocale:', locale);
+
+    if (!locale || !locales.includes(locale as (typeof locales)[number])) {
+        locale = 'de';
+        console.log('[i18n/request] falling back to default locale:', locale);
+    }
+
+    return {
+        locale,
+        messages: (await import(`../messages/${locale}.json`)).default
+    };
+});
diff --git a/lib/dailyPuzzle.ts b/lib/dailyPuzzle.ts
index 8e46d21..3c7a00c 100644
--- a/lib/dailyPuzzle.ts
+++ b/lib/dailyPuzzle.ts
@@ -1,22 +1,15 @@
-import { PrismaClient } from '@prisma/client';
+import { PrismaClient, Genre, Special } from '@prisma/client';
 import { getTodayISOString } from './dateUtils';
 
 const prisma = new PrismaClient();
 
-export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
+export async function getOrCreateDailyPuzzle(genre: Genre | null = null) {
     try {
         const today = getTodayISOString();
         let genreId: number | null = null;
 
-        if (genreName) {
-            const genre = await prisma.genre.findUnique({
-                where: { name: genreName }
-            });
-            if (genre) {
-                genreId = genre.id;
-            } else {
-                return null; // Genre not found
-            }
+        if (genre) {
+            genreId = genre.id;
         }
 
         let dailyPuzzle = await prisma.dailyPuzzle.findFirst({
@@ -27,8 +20,6 @@ export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
             include: { song: true },
         });
 
-
-
         if (!dailyPuzzle) {
             // Get songs available for this genre
             const whereClause = genreId
@@ -45,7 +36,7 @@ export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
             });
 
             if (allSongs.length === 0) {
-                console.log(`[Daily Puzzle] No songs available for genre: ${genreName || 'Global'}`);
+                console.log(`[Daily Puzzle] No songs available for genre: ${genre ? JSON.stringify(genre.name) : 'Global'}`);
                 return null;
             }
 
@@ -80,7 +71,7 @@ export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
                     },
                     include: { song: true },
                 });
-                console.log(`[Daily Puzzle] Created new puzzle for ${today} (Genre: ${genreName || 'Global'}) with song: ${selectedSong.title}`);
+                console.log(`[Daily Puzzle] Created new puzzle for ${today} (Genre: ${genre ? JSON.stringify(genre.name) : 'Global'}) with song: ${selectedSong.title}`);
             } catch (e) {
                 // Handle race condition
                 console.log('[Daily Puzzle] Creation failed, trying to fetch again (likely race condition)');
@@ -119,7 +110,7 @@ export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
             artist: dailyPuzzle.song.artist,
             coverImage: dailyPuzzle.song.coverImage ? `/uploads/covers/${dailyPuzzle.song.coverImage}` : null,
             releaseYear: dailyPuzzle.song.releaseYear,
-            genre: genreName
+            genre: genre ? genre.name : null
         };
 
     } catch (error) {
@@ -128,16 +119,10 @@ export async function getOrCreateDailyPuzzle(genreName: string | null = null) {
     }
 }
 
-export async function getOrCreateSpecialPuzzle(specialName: string) {
+export async function getOrCreateSpecialPuzzle(special: Special) {
     try {
         const today = getTodayISOString();
 
-        const special = await prisma.special.findUnique({
-            where: { name: specialName }
-        });
-
-        if (!special) return null;
-
         let dailyPuzzle = await prisma.dailyPuzzle.findFirst({
             where: {
                 date: today,
@@ -232,7 +217,7 @@ export async function getOrCreateSpecialPuzzle(specialName: string) {
             artist: dailyPuzzle.song.artist,
             coverImage: dailyPuzzle.song.coverImage ? `/uploads/covers/${dailyPuzzle.song.coverImage}` : null,
             releaseYear: dailyPuzzle.song.releaseYear,
-            special: specialName,
+            special: special.name,
             maxAttempts: special.maxAttempts,
             unlockSteps: JSON.parse(special.unlockSteps),
             startTime: specialSong?.startTime || 0
diff --git a/lib/i18n.ts b/lib/i18n.ts
new file mode 100644
index 0000000..96f7e87
--- /dev/null
+++ b/lib/i18n.ts
@@ -0,0 +1,41 @@
+export type LocalizedString = {
+    [key: string]: string;
+};
+
+export function getLocalizedValue(
+    value: any,
+    locale: string,
+    fallback: string = ''
+): string {
+    if (!value) return fallback;
+
+    // If it's already a string, return it (backward compatibility or simple values)
+    if (typeof value === 'string') return value;
+
+    // If it's an object, try to get the requested locale
+    if (typeof value === 'object') {
+        if (value[locale]) return value[locale];
+
+        // Fallback to 'de'
+        if (value['de']) return value['de'];
+
+        // Fallback to 'en'
+        if (value['en']) return value['en'];
+
+        // Fallback to first key
+        const keys = Object.keys(value);
+        if (keys.length > 0) return value[keys[0]];
+    }
+
+    return fallback;
+}
+
+export function createLocalizedObject(
+    de: string,
+    en?: string
+): LocalizedString {
+    return {
+        de: de.trim(),
+        en: (en || de).trim()
+    };
+}
diff --git a/lib/navigation.ts b/lib/navigation.ts
new file mode 100644
index 0000000..2aa4070
--- /dev/null
+++ b/lib/navigation.ts
@@ -0,0 +1,9 @@
+import { createNavigation } from 'next-intl/navigation';
+
+export const locales = ['de', 'en'] as const;
+export const localePrefix = 'always'; // Default
+
+export const { Link, redirect, usePathname, useRouter } = createNavigation({
+    locales,
+    localePrefix
+});
diff --git a/messages/de.json b/messages/de.json
new file mode 100644
index 0000000..edbddb8
--- /dev/null
+++ b/messages/de.json
@@ -0,0 +1,155 @@
+{
+    "Common": {
+        "loading": "Laden...",
+        "error": "Ein Fehler ist aufgetreten",
+        "save": "Speichern",
+        "cancel": "Abbrechen",
+        "delete": "Löschen",
+        "edit": "Bearbeiten",
+        "back": "Zurück"
+    },
+    "Navigation": {
+        "home": "Startseite",
+        "admin": "Admin",
+        "global": "Global",
+        "news": "Neuigkeiten"
+    },
+    "Game": {
+        "play": "Abspielen",
+        "pause": "Pause",
+        "skip": "Überspringen",
+        "submit": "Raten",
+        "next": "Nächstes",
+        "won": "Gewonnen!",
+        "lost": "Verloren",
+        "correct": "Richtig!",
+        "wrong": "Falsch",
+        "guessPlaceholder": "Lied oder Interpret eingeben...",
+        "attempts": "Versuche",
+        "share": "Teilen",
+        "nextPuzzle": "Nächstes Rätsel in",
+        "noPuzzleAvailable": "Kein Rätsel verfügbar",
+        "noPuzzleDescription": "Tägliches Rätsel konnte nicht generiert werden.",
+        "noPuzzleGenre": "Bitte stelle sicher, dass Songs in der Datenbank vorhanden sind",
+        "goToAdmin": "Zum Admin-Dashboard gehen",
+        "loadingState": "Lade Status...",
+        "attempt": "Versuch",
+        "unlocked": "freigeschaltet",
+        "start": "Start",
+        "skipWithBonus": "Überspringen (+{seconds}s)",
+        "solveGiveUp": "Lösen (Aufgeben)",
+        "comeBackTomorrow": "Komm morgen zurück für ein neues Lied.",
+        "theSongWas": "Das Lied war:",
+        "score": "Punkte",
+        "scoreBreakdown": "Punkteaufschlüsselung",
+        "albumCover": "Album-Cover",
+        "released": "Veröffentlicht",
+        "yourBrowserDoesNotSupport": "Ihr Browser unterstützt das Audio-Element nicht.",
+        "thanksForRating": "Danke für die Bewertung!",
+        "rateThisPuzzle": "Bewerte dieses Rätsel:",
+        "shared": "✓ Geteilt!",
+        "copied": "✓ Kopiert!",
+        "shareFailed": "✗ Fehlgeschlagen",
+        "bonusRound": "Bonus-Runde!",
+        "guessReleaseYear": "Errate das Veröffentlichungsjahr für",
+        "points": "Punkte",
+        "skipBonus": "Bonus überspringen",
+        "notQuite": "Nicht ganz!",
+        "youGuessed": "Du hast geraten",
+        "actuallyReleasedIn": "Tatsächlich veröffentlicht in",
+        "skipped": "Übersprungen",
+        "gameOverPlaceholder": "Spiel beendet",
+        "knowItSearch": "Weißt du es? Suche nach Interpret / Titel",
+        "special": "Special",
+        "genre": "Genre"
+    },
+    "Statistics": {
+        "yourStatistics": "Deine Statistiken",
+        "totalPuzzles": "Gesamte Rätsel",
+        "try": "Versuch",
+        "failed": "Verloren"
+    },
+    "OnboardingTour": {
+        "done": "Fertig",
+        "next": "Weiter",
+        "previous": "Zurück",
+        "genresSpecials": "Genres & Specials",
+        "genresSpecialsDescription": "Wähle hier ein bestimmtes Genre oder ein kuratiertes Special-Event.",
+        "news": "Neuigkeiten",
+        "newsDescription": "Bleibe auf dem Laufenden mit den neuesten Nachrichten und Ankündigungen.",
+        "hoerdle": "Hördle",
+        "hoerdleDescription": "Das ist das tägliche Rätsel. Ein neues Lied jeden Tag pro Genre.",
+        "attempts": "Versuche",
+        "attemptsDescription": "Du hast eine begrenzte Anzahl von Versuchen, um das Lied zu erraten.",
+        "score": "Punkte",
+        "scoreDescription": "Deine aktuelle Punktzahl. Versuche sie hoch zu halten!",
+        "player": "Player",
+        "playerDescription": "Höre dir den Ausschnitt an. Jedes zusätzliche Abspielen reduziert deine mögliche Punktzahl.",
+        "input": "Eingabe",
+        "inputDescription": "Gib hier deine Vermutung ein. Suche nach Interpret oder Titel.",
+        "controls": "Steuerung",
+        "controlsDescription": "Starte die Musik oder überspringe zum nächsten Ausschnitt, wenn du feststeckst."
+    },
+    "InstallPrompt": {
+        "installApp": "Hördle App installieren",
+        "installDescription": "Installiere die App für eine bessere Erfahrung und schnellen Zugriff!",
+        "iosInstructions": "Tippe auf",
+        "iosShare": "Teilen",
+        "iosThen": "dann \"Zum Home-Bildschirm hinzufügen\"",
+        "installButton": "App installieren"
+    },
+    "Home": {
+        "welcome": "Willkommen bei Hördle",
+        "subtitle": "Errate den Song anhand kurzer Ausschnitte",
+        "globalTooltip": "Ein zufälliger Song aus der gesamten Sammlung",
+        "comingSoon": "Demnächst",
+        "curatedBy": "Kuratiert von"
+    },
+    "Admin": {
+        "title": "Hördle Admin Dashboard",
+        "login": "Admin Login",
+        "password": "Passwort",
+        "loginButton": "Login",
+        "logout": "Abmelden",
+        "manageSpecials": "Specials verwalten",
+        "manageGenres": "Genres verwalten",
+        "manageNews": "News & Ankündigungen verwalten",
+        "uploadSongs": "Songs hochladen",
+        "todaysPuzzles": "Heutige tägliche Rätsel",
+        "show": "▶ Anzeigen",
+        "hide": "▼ Ausblenden",
+        "addSpecial": "Special hinzufügen",
+        "addGenre": "Genre hinzufügen",
+        "addNews": "News hinzufügen",
+        "edit": "Bearbeiten",
+        "delete": "Löschen",
+        "save": "Speichern",
+        "cancel": "Abbrechen",
+        "curate": "Kurieren",
+        "name": "Name",
+        "subtitle": "Untertitel",
+        "maxAttempts": "Max. Versuche",
+        "unlockSteps": "Freischalt-Schritte",
+        "launchDate": "Startdatum",
+        "endDate": "Enddatum",
+        "curator": "Kurator",
+        "active": "Aktiv",
+        "newGenreName": "Neuer Genre-Name",
+        "editSpecial": "Special bearbeiten",
+        "editGenre": "Genre bearbeiten",
+        "editNews": "News bearbeiten",
+        "newsTitle": "News-Titel",
+        "content": "Inhalt (Markdown unterstützt)",
+        "author": "Autor (optional)",
+        "featured": "Hervorgehoben",
+        "noSpecialLink": "Kein Special-Link",
+        "noNewsItems": "Noch keine News-Einträge. Erstelle einen oben!",
+        "noPuzzlesToday": "Keine täglichen Rätsel für heute gefunden.",
+        "category": "Kategorie",
+        "song": "Song",
+        "artist": "Interpret",
+        "actions": "Aktionen",
+        "deletePuzzle": "Löschen",
+        "wrongPassword": "Falsches Passwort"
+    }
+}
\ No newline at end of file
diff --git a/messages/en.json b/messages/en.json
new file mode 100644
index 0000000..9560979
--- /dev/null
+++ b/messages/en.json
@@ -0,0 +1,155 @@
+{
+    "Common": {
+        "loading": "Loading...",
+        "error": "An error occurred",
+        "save": "Save",
+        "cancel": "Cancel",
+        "delete": "Delete",
+        "edit": "Edit",
+        "back": "Back"
+    },
+    "Navigation": {
+        "home": "Home",
+        "admin": "Admin",
+        "global": "Global",
+        "news": "News"
+    },
+    "Game": {
+        "play": "Play",
+        "pause": "Pause",
+        "skip": "Skip",
+        "submit": "Guess",
+        "next": "Next",
+        "won": "You won!",
+        "lost": "Game Over",
+        "correct": "Correct!",
+        "wrong": "Wrong",
+        "guessPlaceholder": "Type song or artist...",
+        "attempts": "Attempts",
+        "share": "Share",
+        "nextPuzzle": "Next puzzle in",
+        "noPuzzleAvailable": "No Puzzle Available",
+        "noPuzzleDescription": "Could not generate a daily puzzle.",
+        "noPuzzleGenre": "Please ensure there are songs in the database",
+        "goToAdmin": "Go to Admin Dashboard",
+        "loadingState": "Loading state...",
+        "attempt": "Attempt",
+        "unlocked": "unlocked",
+        "start": "Start",
+        "skipWithBonus": "Skip (+{seconds}s)",
+        "solveGiveUp": "Solve (Give Up)",
+        "comeBackTomorrow": "Come back tomorrow for a new song.",
+        "theSongWas": "The song was:",
+        "score": "Score",
+        "scoreBreakdown": "Score Breakdown",
+        "albumCover": "Album Cover",
+        "released": "Released",
+        "yourBrowserDoesNotSupport": "Your browser does not support the audio element.",
+        "thanksForRating": "Thanks for rating!",
+        "rateThisPuzzle": "Rate this puzzle:",
+        "shared": "✓ Shared!",
+        "copied": "✓ Copied!",
+        "shareFailed": "✗ Failed",
+        "bonusRound": "Bonus Round!",
+        "guessReleaseYear": "Guess the release year for",
+        "points": "points",
+        "skipBonus": "Skip Bonus",
+        "notQuite": "Not quite!",
+        "youGuessed": "You guessed",
+        "actuallyReleasedIn": "Actually released in",
+        "skipped": "Skipped",
+        "gameOverPlaceholder": "Game Over",
+        "knowItSearch": "Know it? Search for the artist / title",
+        "special": "Special",
+        "genre": "Genre"
+    },
+    "Statistics": {
+        "yourStatistics": "Your Statistics",
+        "totalPuzzles": "Total puzzles",
+        "try": "try",
+        "failed": "Failed"
+    },
+    "OnboardingTour": {
+        "done": "Done",
+        "next": "Next",
+        "previous": "Previous",
+        "genresSpecials": "Genres & Specials",
+        "genresSpecialsDescription": "Choose a specific genre or a curated special event here.",
+        "news": "News",
+        "newsDescription": "Stay updated with the latest news and announcements.",
+        "hoerdle": "Hördle",
+        "hoerdleDescription": "This is the daily puzzle. One new song every day per genre.",
+        "attempts": "Attempts",
+        "attemptsDescription": "You have a limited number of attempts to guess the song.",
+        "score": "Score",
+        "scoreDescription": "Your current score. Try to keep it high!",
+        "player": "Player",
+        "playerDescription": "Listen to the snippet. Each additional play reduces your potential score.",
+        "input": "Input",
+        "inputDescription": "Type your guess here. Search for artist or title.",
+        "controls": "Controls",
+        "controlsDescription": "Start the music or skip to the next snippet if you're stuck."
+    },
+    "InstallPrompt": {
+        "installApp": "Install Hördle App",
+        "installDescription": "Install the app for a better experience and quick access!",
+        "iosInstructions": "Tap",
+        "iosShare": "share",
+        "iosThen": "then \"Add to Home Screen\"",
+        "installButton": "Install App"
+    },
+    "Home": {
+        "welcome": "Welcome to Hördle",
+        "subtitle": "Guess the song from short snippets",
+        "globalTooltip": "A random song from the entire collection",
+        "comingSoon": "Coming soon",
+        "curatedBy": "Curated by"
+    },
+    "Admin": {
+        "title": "Hördle Admin Dashboard",
+        "login": "Admin Login",
+        "password": "Password",
+        "loginButton": "Login",
+        "logout": "Logout",
+        "manageSpecials": "Manage Specials",
+        "manageGenres": "Manage Genres",
+        "manageNews": "Manage News & Announcements",
+        "uploadSongs": "Upload Songs",
+        "todaysPuzzles": "Today's Daily Puzzles",
+        "show": "▶ Show",
+        "hide": "▼ Hide",
+        "addSpecial": "Add Special",
+        "addGenre": "Add Genre",
+        "addNews": "Add News",
+        "edit": "Edit",
+        "delete": "Delete",
+        "save": "Save",
+        "cancel": "Cancel",
+        "curate": "Curate",
+        "name": "Name",
+        "subtitle": "Subtitle",
+        "maxAttempts": "Max Attempts",
+        "unlockSteps": "Unlock Steps",
+        "launchDate": "Launch Date",
+        "endDate": "End Date",
+        "curator": "Curator",
+        "active": "Active",
+        "newGenreName": "New Genre Name",
+        "editSpecial": "Edit Special",
+        "editGenre": "Edit Genre",
+        "editNews": "Edit News",
+        "newsTitle": "News Title",
+        "content": "Content (Markdown supported)",
+        "author": "Author (optional)",
+        "featured": "Featured",
+        "noSpecialLink": "No Special Link",
+        "noNewsItems": "No news items yet. Create one above!",
+        "noPuzzlesToday": "No daily puzzles found for today.",
+        "category": "Category",
+        "song": "Song",
+        "artist": "Artist",
+        "actions": "Actions",
+        "deletePuzzle": "Delete",
+        "wrongPassword": "Wrong password"
+    }
+}
\ No newline at end of file
diff --git a/next.config.ts b/next.config.ts
index 9b78294..8f417fa 100644
--- a/next.config.ts
+++ b/next.config.ts
@@ -1,5 +1,8 @@
+import createNextIntlPlugin from 'next-intl/plugin';
 import type { NextConfig } from "next";
 
+const withNextIntl = createNextIntlPlugin();
+
 const nextConfig: NextConfig = {
   /* config options here */
   reactCompiler: true,
@@ -8,7 +11,7 @@ const nextConfig: NextConfig = {
     serverActions: {
       bodySizeLimit: '50mb',
     },
-    middlewareClientMaxBodySize: '50mb',
+    proxyClientMaxBodySize: '50mb',
   },
   env: {
     TZ: process.env.TZ || 'Europe/Berlin',
@@ -36,4 +39,4 @@ const nextConfig: NextConfig = {
   },
 };
 
-export default nextConfig;
+export default withNextIntl(nextConfig);
diff --git a/package-lock.json b/package-lock.json
index 4414788..b4648f8 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,22 +1,24 @@
 {
   "name": "hoerdle",
-  "version": "0.1.0",
+  "version": "0.1.0.15",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "hoerdle",
-      "version": "0.1.0",
+      "version": "0.1.0.15",
       "dependencies": {
         "@prisma/client": "^6.19.0",
         "bcryptjs": "^3.0.3",
         "driver.js": "^1.4.0",
         "music-metadata": "^11.10.2",
         "next": "16.0.3",
+        "next-intl": "^4.5.6",
         "prisma": "^6.19.0",
         "react": "19.2.0",
         "react-dom": "19.2.0",
-        "react-markdown": "^10.1.0"
+        "react-markdown": "^10.1.0",
+        "unist-util-visit-parents": "^6.0.2"
       },
       "devDependencies": {
         "@types/bcryptjs": "^2.4.6",
@@ -24,6 +26,7 @@
         "@types/react": "^19",
         "@types/react-dom": "^19",
         "babel-plugin-react-compiler": "1.0.0",
+        "baseline-browser-mapping": "^2.8.32",
         "eslint": "^9",
         "eslint-config-next": "16.0.3",
         "typescript": "^5"
@@ -396,9 +399,9 @@
       }
     },
     "node_modules/@eslint/eslintrc": {
-      "version": "3.3.1",
-      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.1.tgz",
-      "integrity": "sha512-gtF186CXhIl1p4pJNGZw8Yc6RlshoePRvE0X91oPGb3vZ8pM3qOS9W9NGPat9LziaBV7XrJWGylNQXkGcnM3IQ==",
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-3.3.3.tgz",
+      "integrity": "sha512-Kr+LPIUVKz2qkx1HAMH8q1q6azbqBAsXJUxBl/ODDuVPX45Z9DfwB8tPjTi6nNZ8BuM3nbJxC5zCAg5elnBUTQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
@@ -408,7 +411,7 @@
         "globals": "^14.0.0",
         "ignore": "^5.2.0",
         "import-fresh": "^3.2.1",
-        "js-yaml": "^4.1.0",
+        "js-yaml": "^4.1.1",
         "minimatch": "^3.1.2",
         "strip-json-comments": "^3.1.1"
       },
@@ -456,6 +459,66 @@
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
       }
     },
+    "node_modules/@formatjs/ecma402-abstract": {
+      "version": "2.3.6",
+      "resolved": "https://registry.npmjs.org/@formatjs/ecma402-abstract/-/ecma402-abstract-2.3.6.tgz",
+      "integrity": "sha512-HJnTFeRM2kVFVr5gr5kH1XP6K0JcJtE7Lzvtr3FS/so5f1kpsqqqxy5JF+FRaO6H2qmcMfAUIox7AJteieRtVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@formatjs/fast-memoize": "2.2.7",
+        "@formatjs/intl-localematcher": "0.6.2",
+        "decimal.js": "^10.4.3",
+        "tslib": "^2.8.0"
+      }
+    },
+    "node_modules/@formatjs/ecma402-abstract/node_modules/@formatjs/intl-localematcher": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.6.2.tgz",
+      "integrity": "sha512-XOMO2Hupl0wdd172Y06h6kLpBz6Dv+J4okPLl4LPtzbr8f66WbIoy4ev98EBuZ6ZK4h5ydTN6XneT4QVpD7cdA==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.8.0"
+      }
+    },
+    "node_modules/@formatjs/fast-memoize": {
+      "version": "2.2.7",
+      "resolved": "https://registry.npmjs.org/@formatjs/fast-memoize/-/fast-memoize-2.2.7.tgz",
+      "integrity": "sha512-Yabmi9nSvyOMrlSeGGWDiH7rf3a7sIwplbvo/dlz9WCIjzIQAfy1RMf4S0X3yG724n5Ghu2GmEl5NJIV6O9sZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.8.0"
+      }
+    },
+    "node_modules/@formatjs/icu-messageformat-parser": {
+      "version": "2.11.4",
+      "resolved": "https://registry.npmjs.org/@formatjs/icu-messageformat-parser/-/icu-messageformat-parser-2.11.4.tgz",
+      "integrity": "sha512-7kR78cRrPNB4fjGFZg3Rmj5aah8rQj9KPzuLsmcSn4ipLXQvC04keycTI1F7kJYDwIXtT2+7IDEto842CfZBtw==",
+      "license": "MIT",
+      "dependencies": {
+        "@formatjs/ecma402-abstract": "2.3.6",
+        "@formatjs/icu-skeleton-parser": "1.8.16",
+        "tslib": "^2.8.0"
+      }
+    },
+    "node_modules/@formatjs/icu-skeleton-parser": {
+      "version": "1.8.16",
+      "resolved": "https://registry.npmjs.org/@formatjs/icu-skeleton-parser/-/icu-skeleton-parser-1.8.16.tgz",
+      "integrity": "sha512-H13E9Xl+PxBd8D5/6TVUluSpxGNvFSlN/b3coUp0e0JpuWXXnQDiavIpY3NnvSp4xhEMoXyyBvVfdFX8jglOHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@formatjs/ecma402-abstract": "2.3.6",
+        "tslib": "^2.8.0"
+      }
+    },
+    "node_modules/@formatjs/intl-localematcher": {
+      "version": "0.5.10",
+      "resolved": "https://registry.npmjs.org/@formatjs/intl-localematcher/-/intl-localematcher-0.5.10.tgz",
+      "integrity": "sha512-af3qATX+m4Rnd9+wHcjJ4w2ijq+rAVP3CCinJQvFv1kgSu1W6jypUmvleJxcewdxmutM8dmIRZFxO/IQBZmP2Q==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "2"
+      }
+    },
     "node_modules/@humanfs/core": {
       "version": "0.19.1",
       "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.1.tgz",
@@ -1315,12 +1378,184 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@schummar/icu-type-parser": {
+      "version": "1.21.5",
+      "resolved": "https://registry.npmjs.org/@schummar/icu-type-parser/-/icu-type-parser-1.21.5.tgz",
+      "integrity": "sha512-bXHSaW5jRTmke9Vd0h5P7BtWZG9Znqb8gSDxZnxaGSJnGwPLDPfS+3g0BKzeWqzgZPsIVZkM7m2tbo18cm5HBw==",
+      "license": "MIT"
+    },
     "node_modules/@standard-schema/spec": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.0.0.tgz",
       "integrity": "sha512-m2bOd0f2RT9k8QJx1JN85cZYyH1RqFBdlwtkSlf4tBDYLCiiZnv1fIIwacK6cqwXavOydf0NPToMQgpKq+dVlA==",
       "license": "MIT"
     },
+    "node_modules/@swc/core-darwin-arm64": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-arm64/-/core-darwin-arm64-1.15.3.tgz",
+      "integrity": "sha512-AXfeQn0CvcQ4cndlIshETx6jrAM45oeUrK8YeEY6oUZU/qzz0Id0CyvlEywxkWVC81Ajpd8TQQ1fW5yx6zQWkQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-darwin-x64": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-darwin-x64/-/core-darwin-x64-1.15.3.tgz",
+      "integrity": "sha512-p68OeCz1ui+MZYG4wmfJGvcsAcFYb6Sl25H9TxWl+GkBgmNimIiRdnypK9nBGlqMZAcxngNPtnG3kEMNnvoJ2A==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm-gnueabihf": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm-gnueabihf/-/core-linux-arm-gnueabihf-1.15.3.tgz",
+      "integrity": "sha512-Nuj5iF4JteFgwrai97mUX+xUOl+rQRHqTvnvHMATL/l9xE6/TJfPBpd3hk/PVpClMXG3Uvk1MxUFOEzM1JrMYg==",
+      "cpu": [
+        "arm"
+      ],
+      "license": "Apache-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm64-gnu": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-gnu/-/core-linux-arm64-gnu-1.15.3.tgz",
+      "integrity": "sha512-2Nc/s8jE6mW2EjXWxO/lyQuLKShcmTrym2LRf5Ayp3ICEMX6HwFqB1EzDhwoMa2DcUgmnZIalesq2lG3krrUNw==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-arm64-musl": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-arm64-musl/-/core-linux-arm64-musl-1.15.3.tgz",
+      "integrity": "sha512-j4SJniZ/qaZ5g8op+p1G9K1z22s/EYGg1UXIb3+Cg4nsxEpF5uSIGEE4mHUfA70L0BR9wKT2QF/zv3vkhfpX4g==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-x64-gnu": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-gnu/-/core-linux-x64-gnu-1.15.3.tgz",
+      "integrity": "sha512-aKttAZnz8YB1VJwPQZtyU8Uk0BfMP63iDMkvjhJzRZVgySmqt/apWSdnoIcZlUoGheBrcqbMC17GGUmur7OT5A==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-linux-x64-musl": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-linux-x64-musl/-/core-linux-x64-musl-1.15.3.tgz",
+      "integrity": "sha512-oe8FctPu1gnUsdtGJRO2rvOUIkkIIaHqsO9xxN0bTR7dFTlPTGi2Fhk1tnvXeyAvCPxLIcwD8phzKg6wLv9yug==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-arm64-msvc": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-arm64-msvc/-/core-win32-arm64-msvc-1.15.3.tgz",
+      "integrity": "sha512-L9AjzP2ZQ/Xh58e0lTRMLvEDrcJpR7GwZqAtIeNLcTK7JVE+QineSyHp0kLkO1rttCHyCy0U74kDTj0dRz6raA==",
+      "cpu": [
+        "arm64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-ia32-msvc": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-ia32-msvc/-/core-win32-ia32-msvc-1.15.3.tgz",
+      "integrity": "sha512-B8UtogMzErUPDWUoKONSVBdsgKYd58rRyv2sHJWKOIMCHfZ22FVXICR4O/VwIYtlnZ7ahERcjayBHDlBZpR0aw==",
+      "cpu": [
+        "ia32"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/core-win32-x64-msvc": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core-win32-x64-msvc/-/core-win32-x64-msvc-1.15.3.tgz",
+      "integrity": "sha512-SpZKMR9QBTecHeqpzJdYEfgw30Oo8b/Xl6rjSzBt1g0ZsXyy60KLXrp6IagQyfTYqNYE/caDvwtF2FPn7pomog==",
+      "cpu": [
+        "x64"
+      ],
+      "license": "Apache-2.0 AND MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/@swc/counter": {
+      "version": "0.1.3",
+      "resolved": "https://registry.npmjs.org/@swc/counter/-/counter-0.1.3.tgz",
+      "integrity": "sha512-e2BR4lsJkkRlKZ/qCHPw9ZaSxc0MVUd7gtbtaB7aMvHeJVYe8sOB8DBZkP2DtISHGSku9sCK6T6cnY0CtXrOCQ==",
+      "license": "Apache-2.0"
+    },
     "node_modules/@swc/helpers": {
       "version": "0.5.15",
       "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.15.tgz",
@@ -1330,6 +1565,15 @@
         "tslib": "^2.8.0"
       }
     },
+    "node_modules/@swc/types": {
+      "version": "0.1.25",
+      "resolved": "https://registry.npmjs.org/@swc/types/-/types-0.1.25.tgz",
+      "integrity": "sha512-iAoY/qRhNH8a/hBvm3zKj9qQ4oc2+3w1unPJa2XvTK3XjeLXtzcCingVPw/9e5mn1+0yPqxcBGp9Jf0pkfMb1g==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@swc/counter": "^0.1.3"
+      }
+    },
     "node_modules/@tokenizer/inflate": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/@tokenizer/inflate/-/inflate-0.4.1.tgz",
@@ -1444,9 +1688,9 @@
       }
     },
     "node_modules/@types/react": {
-      "version": "19.2.6",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.6.tgz",
-      "integrity": "sha512-p/jUvulfgU7oKtj6Xpk8cA2Y1xKTtICGpJYeJXz2YVO2UcvjQgeRMLDGfDeqeRW2Ta+0QNFwcc8X3GH8SxZz6w==",
+      "version": "19.2.7",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-19.2.7.tgz",
+      "integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==",
       "license": "MIT",
       "dependencies": {
         "csstype": "^3.2.2"
@@ -1469,17 +1713,17 @@
       "license": "MIT"
     },
     "node_modules/@typescript-eslint/eslint-plugin": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.47.0.tgz",
-      "integrity": "sha512-fe0rz9WJQ5t2iaLfdbDc9T80GJy0AeO453q8C3YCilnGozvOyCG5t+EZtg7j7D88+c3FipfP/x+wzGnh1xp8ZA==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.48.0.tgz",
+      "integrity": "sha512-XxXP5tL1txl13YFtrECECQYeZjBZad4fyd3cFV4a19LkAY/bIp9fev3US4S5fDVV2JaYFiKAZ/GRTOLer+mbyQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/regexpp": "^4.10.0",
-        "@typescript-eslint/scope-manager": "8.47.0",
-        "@typescript-eslint/type-utils": "8.47.0",
-        "@typescript-eslint/utils": "8.47.0",
-        "@typescript-eslint/visitor-keys": "8.47.0",
+        "@typescript-eslint/scope-manager": "8.48.0",
+        "@typescript-eslint/type-utils": "8.48.0",
+        "@typescript-eslint/utils": "8.48.0",
+        "@typescript-eslint/visitor-keys": "8.48.0",
         "graphemer": "^1.4.0",
         "ignore": "^7.0.0",
         "natural-compare": "^1.4.0",
@@ -1493,7 +1737,7 @@
         "url": "https://opencollective.com/typescript-eslint"
       },
       "peerDependencies": {
-        "@typescript-eslint/parser": "^8.47.0",
+        "@typescript-eslint/parser": "^8.48.0",
         "eslint": "^8.57.0 || ^9.0.0",
         "typescript": ">=4.8.4 <6.0.0"
       }
@@ -1509,16 +1753,16 @@
       }
     },
     "node_modules/@typescript-eslint/parser": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.47.0.tgz",
-      "integrity": "sha512-lJi3PfxVmo0AkEY93ecfN+r8SofEqZNGByvHAI3GBLrvt1Cw6H5k1IM02nSzu0RfUafr2EvFSw0wAsZgubNplQ==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.48.0.tgz",
+      "integrity": "sha512-jCzKdm/QK0Kg4V4IK/oMlRZlY+QOcdjv89U2NgKHZk1CYTj82/RVSx1mV/0gqCVMJ/DA+Zf/S4NBWNF8GQ+eqQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/scope-manager": "8.47.0",
-        "@typescript-eslint/types": "8.47.0",
-        "@typescript-eslint/typescript-estree": "8.47.0",
-        "@typescript-eslint/visitor-keys": "8.47.0",
+        "@typescript-eslint/scope-manager": "8.48.0",
+        "@typescript-eslint/types": "8.48.0",
+        "@typescript-eslint/typescript-estree": "8.48.0",
+        "@typescript-eslint/visitor-keys": "8.48.0",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -1534,14 +1778,14 @@
       }
     },
     "node_modules/@typescript-eslint/project-service": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.47.0.tgz",
-      "integrity": "sha512-2X4BX8hUeB5JcA1TQJ7GjcgulXQ+5UkNb0DL8gHsHUHdFoiCTJoYLTpib3LtSDPZsRET5ygN4qqIWrHyYIKERA==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.48.0.tgz",
+      "integrity": "sha512-Ne4CTZyRh1BecBf84siv42wv5vQvVmgtk8AuiEffKTUo3DrBaGYZueJSxxBZ8fjk/N3DrgChH4TOdIOwOwiqqw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/tsconfig-utils": "^8.47.0",
-        "@typescript-eslint/types": "^8.47.0",
+        "@typescript-eslint/tsconfig-utils": "^8.48.0",
+        "@typescript-eslint/types": "^8.48.0",
         "debug": "^4.3.4"
       },
       "engines": {
@@ -1556,14 +1800,14 @@
       }
     },
     "node_modules/@typescript-eslint/scope-manager": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.47.0.tgz",
-      "integrity": "sha512-a0TTJk4HXMkfpFkL9/WaGTNuv7JWfFTQFJd6zS9dVAjKsojmv9HT55xzbEpnZoY+VUb+YXLMp+ihMLz/UlZfDg==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.48.0.tgz",
+      "integrity": "sha512-uGSSsbrtJrLduti0Q1Q9+BF1/iFKaxGoQwjWOIVNJv0o6omrdyR8ct37m4xIl5Zzpkp69Kkmvom7QFTtue89YQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.47.0",
-        "@typescript-eslint/visitor-keys": "8.47.0"
+        "@typescript-eslint/types": "8.48.0",
+        "@typescript-eslint/visitor-keys": "8.48.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -1574,9 +1818,9 @@
       }
     },
     "node_modules/@typescript-eslint/tsconfig-utils": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.47.0.tgz",
-      "integrity": "sha512-ybUAvjy4ZCL11uryalkKxuT3w3sXJAuWhOoGS3T/Wu+iUu1tGJmk5ytSY8gbdACNARmcYEB0COksD2j6hfGK2g==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.48.0.tgz",
+      "integrity": "sha512-WNebjBdFdyu10sR1M4OXTt2OkMd5KWIL+LLfeH9KhgP+jzfDV/LI3eXzwJ1s9+Yc0Kzo2fQCdY/OpdusCMmh6w==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1591,15 +1835,15 @@
       }
     },
     "node_modules/@typescript-eslint/type-utils": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.47.0.tgz",
-      "integrity": "sha512-QC9RiCmZ2HmIdCEvhd1aJELBlD93ErziOXXlHEZyuBo3tBiAZieya0HLIxp+DoDWlsQqDawyKuNEhORyku+P8A==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.48.0.tgz",
+      "integrity": "sha512-zbeVaVqeXhhab6QNEKfK96Xyc7UQuoFWERhEnj3mLVnUWrQnv15cJNseUni7f3g557gm0e46LZ6IJ4NJVOgOpw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.47.0",
-        "@typescript-eslint/typescript-estree": "8.47.0",
-        "@typescript-eslint/utils": "8.47.0",
+        "@typescript-eslint/types": "8.48.0",
+        "@typescript-eslint/typescript-estree": "8.48.0",
+        "@typescript-eslint/utils": "8.48.0",
         "debug": "^4.3.4",
         "ts-api-utils": "^2.1.0"
       },
@@ -1616,9 +1860,9 @@
       }
     },
     "node_modules/@typescript-eslint/types": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.47.0.tgz",
-      "integrity": "sha512-nHAE6bMKsizhA2uuYZbEbmp5z2UpffNrPEqiKIeN7VsV6UY/roxanWfoRrf6x/k9+Obf+GQdkm0nPU+vnMXo9A==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.48.0.tgz",
+      "integrity": "sha512-cQMcGQQH7kwKoVswD1xdOytxQR60MWKM1di26xSUtxehaDs/32Zpqsu5WJlXTtTTqyAVK8R7hvsUnIXRS+bjvA==",
       "dev": true,
       "license": "MIT",
       "engines": {
@@ -1630,21 +1874,20 @@
       }
     },
     "node_modules/@typescript-eslint/typescript-estree": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.47.0.tgz",
-      "integrity": "sha512-k6ti9UepJf5NpzCjH31hQNLHQWupTRPhZ+KFF8WtTuTpy7uHPfeg2NM7cP27aCGajoEplxJDFVCEm9TGPYyiVg==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.48.0.tgz",
+      "integrity": "sha512-ljHab1CSO4rGrQIAyizUS6UGHHCiAYhbfcIZ1zVJr5nMryxlXMVWS3duFPSKvSUbFPwkXMFk1k0EMIjub4sRRQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/project-service": "8.47.0",
-        "@typescript-eslint/tsconfig-utils": "8.47.0",
-        "@typescript-eslint/types": "8.47.0",
-        "@typescript-eslint/visitor-keys": "8.47.0",
+        "@typescript-eslint/project-service": "8.48.0",
+        "@typescript-eslint/tsconfig-utils": "8.48.0",
+        "@typescript-eslint/types": "8.48.0",
+        "@typescript-eslint/visitor-keys": "8.48.0",
         "debug": "^4.3.4",
-        "fast-glob": "^3.3.2",
-        "is-glob": "^4.0.3",
         "minimatch": "^9.0.4",
         "semver": "^7.6.0",
+        "tinyglobby": "^0.2.15",
         "ts-api-utils": "^2.1.0"
       },
       "engines": {
@@ -1668,36 +1911,6 @@
         "balanced-match": "^1.0.0"
       }
     },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/fast-glob": {
-      "version": "3.3.3",
-      "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.3.3.tgz",
-      "integrity": "sha512-7MptL8U0cqcFdzIzwOTHoilX9x5BrNqye7Z/LuC7kCMRio1EMSyqRK3BEAUD7sXRq4iT4AzTVuZdhgQ2TCvYLg==",
-      "dev": true,
-      "license": "MIT",
-      "dependencies": {
-        "@nodelib/fs.stat": "^2.0.2",
-        "@nodelib/fs.walk": "^1.2.3",
-        "glob-parent": "^5.1.2",
-        "merge2": "^1.3.0",
-        "micromatch": "^4.0.8"
-      },
-      "engines": {
-        "node": ">=8.6.0"
-      }
-    },
-    "node_modules/@typescript-eslint/typescript-estree/node_modules/glob-parent": {
-      "version": "5.1.2",
-      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
-      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
-      "dev": true,
-      "license": "ISC",
-      "dependencies": {
-        "is-glob": "^4.0.1"
-      },
-      "engines": {
-        "node": ">= 6"
-      }
-    },
     "node_modules/@typescript-eslint/typescript-estree/node_modules/minimatch": {
       "version": "9.0.5",
       "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz",
@@ -1728,16 +1941,16 @@
       }
     },
     "node_modules/@typescript-eslint/utils": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.47.0.tgz",
-      "integrity": "sha512-g7XrNf25iL4TJOiPqatNuaChyqt49a/onq5YsJ9+hXeugK+41LVg7AxikMfM02PC6jbNtZLCJj6AUcQXJS/jGQ==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.48.0.tgz",
+      "integrity": "sha512-yTJO1XuGxCsSfIVt1+1UrLHtue8xz16V8apzPYI06W0HbEbEWHxHXgZaAgavIkoh+GeV6hKKd5jm0sS6OYxWXQ==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.7.0",
-        "@typescript-eslint/scope-manager": "8.47.0",
-        "@typescript-eslint/types": "8.47.0",
-        "@typescript-eslint/typescript-estree": "8.47.0"
+        "@typescript-eslint/scope-manager": "8.48.0",
+        "@typescript-eslint/types": "8.48.0",
+        "@typescript-eslint/typescript-estree": "8.48.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -1752,13 +1965,13 @@
       }
     },
     "node_modules/@typescript-eslint/visitor-keys": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.47.0.tgz",
-      "integrity": "sha512-SIV3/6eftCy1bNzCQoPmbWsRLujS8t5iDIZ4spZOBHqrM+yfX2ogg8Tt3PDTAVKw3sSCiUgg30uOAvK2r9zGjQ==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.48.0.tgz",
+      "integrity": "sha512-T0XJMaRPOH3+LBbAfzR2jalckP1MSG/L9eUtY0DEzUyVaXJ/t6zN0nR7co5kz0Jko/nkSYCBRkz1djvjajVTTg==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/types": "8.47.0",
+        "@typescript-eslint/types": "8.48.0",
         "eslint-visitor-keys": "^4.2.1"
       },
       "engines": {
@@ -2358,9 +2571,9 @@
       "license": "MIT"
     },
     "node_modules/baseline-browser-mapping": {
-      "version": "2.8.30",
-      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.30.tgz",
-      "integrity": "sha512-aTUKW4ptQhS64+v2d6IkPzymEzzhw+G0bA1g3uBRV3+ntkH+svttKseW5IOR4Ed6NUVKqnY7qT3dKvzQ7io4AA==",
+      "version": "2.8.32",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.8.32.tgz",
+      "integrity": "sha512-OPz5aBThlyLFgxyhdwf/s2+8ab3OvT7AdTNvKHBwpXomIYeXqpUUuT8LrdtxZSsWJ4R4CU1un4XGh5Ez3nlTpw==",
       "dev": true,
       "license": "Apache-2.0",
       "bin": {
@@ -2523,9 +2736,9 @@
       }
     },
     "node_modules/caniuse-lite": {
-      "version": "1.0.30001756",
-      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001756.tgz",
-      "integrity": "sha512-4HnCNKbMLkLdhJz3TToeVWHSnfJvPaq6vu/eRP0Ahub/07n484XHhBF5AJoSGHdVrS8tKFauUQz8Bp9P7LVx7A==",
+      "version": "1.0.30001757",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001757.tgz",
+      "integrity": "sha512-r0nnL/I28Zi/yjk1el6ilj27tKcdjLsNqAOZr0yVjWPrSQyHgKI2INaEWw21bAQSv2LXRt1XuCS/GomNpWOxsQ==",
       "funding": [
         {
           "type": "opencollective",
@@ -2806,6 +3019,12 @@
         }
       }
     },
+    "node_modules/decimal.js": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
+      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
+      "license": "MIT"
+    },
     "node_modules/decode-named-character-reference": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.2.0.tgz",
@@ -2972,9 +3191,9 @@
       }
     },
     "node_modules/electron-to-chromium": {
-      "version": "1.5.259",
-      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.259.tgz",
-      "integrity": "sha512-I+oLXgpEJzD6Cwuwt1gYjxsDmu/S/Kd41mmLA3O+/uH2pFRO/DvOjUyGozL8j3KeLV6WyZ7ssPwELMsXCcsJAQ==",
+      "version": "1.5.262",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.262.tgz",
+      "integrity": "sha512-NlAsMteRHek05jRUxUR0a5jpjYq9ykk6+kO0yRaMi5moe7u0fVIOeQ3Y30A8dIiWFBNUoQGi1ljb1i5VtS9WQQ==",
       "dev": true,
       "license": "ISC"
     },
@@ -4271,6 +4490,18 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/intl-messageformat": {
+      "version": "10.7.18",
+      "resolved": "https://registry.npmjs.org/intl-messageformat/-/intl-messageformat-10.7.18.tgz",
+      "integrity": "sha512-m3Ofv/X/tV8Y3tHXLohcuVuhWKo7BBq62cqY15etqmLxg2DZ34AGGgQDeR+SCta2+zICb1NX83af0GJmbQ1++g==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@formatjs/ecma402-abstract": "2.3.6",
+        "@formatjs/fast-memoize": "2.2.7",
+        "@formatjs/icu-messageformat-parser": "2.11.4",
+        "tslib": "^2.8.0"
+      }
+    },
     "node_modules/is-alphabetical": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/is-alphabetical/-/is-alphabetical-2.0.1.tgz",
@@ -5634,9 +5865,9 @@
       "license": "MIT"
     },
     "node_modules/music-metadata": {
-      "version": "11.10.2",
-      "resolved": "https://registry.npmjs.org/music-metadata/-/music-metadata-11.10.2.tgz",
-      "integrity": "sha512-sGbF+Si+GqYJGO6qQDyfvesfxb1M49m0QjLLkGR5zoRlPaZtHRvo8DDI5R/vySJVtUzTQ6Lwfd7nspYpmmInsA==",
+      "version": "11.10.3",
+      "resolved": "https://registry.npmjs.org/music-metadata/-/music-metadata-11.10.3.tgz",
+      "integrity": "sha512-j0g/x4cNNZW6I5gdcPAY+GFkJY9WHTpkFDMBJKQLxJQyvSfQbXm57fTE3haGFFuOzCgtsTd4Plwc49Sn9RacDQ==",
       "funding": [
         {
           "type": "github",
@@ -5704,6 +5935,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/negotiator": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
+      "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
     "node_modules/next": {
       "version": "16.0.3",
       "resolved": "https://registry.npmjs.org/next/-/next-16.0.3.tgz",
@@ -5756,6 +5996,91 @@
         }
       }
     },
+    "node_modules/next-intl": {
+      "version": "4.5.6",
+      "resolved": "https://registry.npmjs.org/next-intl/-/next-intl-4.5.6.tgz",
+      "integrity": "sha512-LD1mM9HL44NGqDus3cpIE8wqRU87GWf7rdy1g7UHceT9KJvvjER/jlmIRt3GHaoOiln16K4IbHpO2ZI6jiqiDQ==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/amannn"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@formatjs/intl-localematcher": "^0.5.4",
+        "@swc/core": "^1.15.2",
+        "negotiator": "^1.0.0",
+        "next-intl-swc-plugin-extractor": "^4.5.6",
+        "po-parser": "^1.0.2",
+        "use-intl": "^4.5.6"
+      },
+      "peerDependencies": {
+        "next": "^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0",
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0",
+        "typescript": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/next-intl-swc-plugin-extractor": {
+      "version": "4.5.6",
+      "resolved": "https://registry.npmjs.org/next-intl-swc-plugin-extractor/-/next-intl-swc-plugin-extractor-4.5.6.tgz",
+      "integrity": "sha512-ApB3wGYqni8lks90UuaslnCK4a+q8I6ajEafSpknN6RDrs2hUwNuWVrjKhOuhLqNLn4kBKl+Zi5c0WKpL968ag==",
+      "license": "MIT"
+    },
+    "node_modules/next-intl/node_modules/@swc/core": {
+      "version": "1.15.3",
+      "resolved": "https://registry.npmjs.org/@swc/core/-/core-1.15.3.tgz",
+      "integrity": "sha512-Qd8eBPkUFL4eAONgGjycZXj1jFCBW8Fd+xF0PzdTlBCWQIV1xnUT7B93wUANtW3KGjl3TRcOyxwSx/u/jyKw/Q==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@swc/counter": "^0.1.3",
+        "@swc/types": "^0.1.25"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/swc"
+      },
+      "optionalDependencies": {
+        "@swc/core-darwin-arm64": "1.15.3",
+        "@swc/core-darwin-x64": "1.15.3",
+        "@swc/core-linux-arm-gnueabihf": "1.15.3",
+        "@swc/core-linux-arm64-gnu": "1.15.3",
+        "@swc/core-linux-arm64-musl": "1.15.3",
+        "@swc/core-linux-x64-gnu": "1.15.3",
+        "@swc/core-linux-x64-musl": "1.15.3",
+        "@swc/core-win32-arm64-msvc": "1.15.3",
+        "@swc/core-win32-ia32-msvc": "1.15.3",
+        "@swc/core-win32-x64-msvc": "1.15.3"
+      },
+      "peerDependencies": {
+        "@swc/helpers": ">=0.5.17"
+      },
+      "peerDependenciesMeta": {
+        "@swc/helpers": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/next-intl/node_modules/@swc/helpers": {
+      "version": "0.5.17",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.17.tgz",
+      "integrity": "sha512-5IKx/Y13RsYd+sauPb2x+U/xZikHjolzfuDgTAl/Tdf3Q8rslRvC19NKDLgAJQ6wsqADk10ntlv08nPFw/gO/A==",
+      "license": "Apache-2.0",
+      "optional": true,
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.8.0"
+      }
+    },
     "node_modules/node-fetch-native": {
       "version": "1.6.7",
       "resolved": "https://registry.npmjs.org/node-fetch-native/-/node-fetch-native-1.6.7.tgz",
@@ -6092,6 +6417,12 @@
         "pathe": "^2.0.3"
       }
     },
+    "node_modules/po-parser": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/po-parser/-/po-parser-1.0.2.tgz",
+      "integrity": "sha512-yTIQL8PZy7V8c0psPoJUx7fayez+Mo/53MZgX9MPuPHx+Dt+sRPNuRbI+6Oqxnddhkd68x4Nlgon/zizL1Xg+w==",
+      "license": "MIT"
+    },
     "node_modules/possible-typed-array-names": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.1.0.tgz",
@@ -7284,16 +7615,16 @@
       }
     },
     "node_modules/typescript-eslint": {
-      "version": "8.47.0",
-      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.47.0.tgz",
-      "integrity": "sha512-Lwe8i2XQ3WoMjua/r1PHrCTpkubPYJCAfOurtn+mtTzqB6jNd+14n9UN1bJ4s3F49x9ixAm0FLflB/JzQ57M8Q==",
+      "version": "8.48.0",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.48.0.tgz",
+      "integrity": "sha512-fcKOvQD9GUn3Xw63EgiDqhvWJ5jsyZUaekl3KVpGsDJnN46WJTe3jWxtQP9lMZm1LJNkFLlTaWAxK2vUQR+cqw==",
       "dev": true,
       "license": "MIT",
       "dependencies": {
-        "@typescript-eslint/eslint-plugin": "8.47.0",
-        "@typescript-eslint/parser": "8.47.0",
-        "@typescript-eslint/typescript-estree": "8.47.0",
-        "@typescript-eslint/utils": "8.47.0"
+        "@typescript-eslint/eslint-plugin": "8.48.0",
+        "@typescript-eslint/parser": "8.48.0",
+        "@typescript-eslint/typescript-estree": "8.48.0",
+        "@typescript-eslint/utils": "8.48.0"
       },
       "engines": {
         "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
@@ -7508,6 +7839,20 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/use-intl": {
+      "version": "4.5.6",
+      "resolved": "https://registry.npmjs.org/use-intl/-/use-intl-4.5.6.tgz",
+      "integrity": "sha512-SzxrUH/X3LatVcgWVqz8ifoBK01LC3fzc8Y29Vj0QfrjLIXfGwxvJ3aapyWumBIIHsZmCR0Rx5FpKDWCc9JiOg==",
+      "license": "MIT",
+      "dependencies": {
+        "@formatjs/fast-memoize": "^2.2.0",
+        "@schummar/icu-type-parser": "1.21.5",
+        "intl-messageformat": "^10.5.14"
+      },
+      "peerDependencies": {
+        "react": "^17.0.0 || ^18.0.0 || >=19.0.0-rc <19.0.0 || ^19.0.0"
+      }
+    },
     "node_modules/vfile": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
@@ -7672,9 +8017,9 @@
       }
     },
     "node_modules/zod": {
-      "version": "4.1.12",
-      "resolved": "https://registry.npmjs.org/zod/-/zod-4.1.12.tgz",
-      "integrity": "sha512-JInaHOamG8pt5+Ey8kGmdcAcg3OL9reK8ltczgHTAwNhMys/6ThXHityHxVV2p3fkw/c+MAvBHFVYHFZDmjMCQ==",
+      "version": "4.1.13",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.1.13.tgz",
+      "integrity": "sha512-AvvthqfqrAhNH9dnfmrfKzX5upOdjUVJYFqNSlkmGf64gRaTzlPwz99IHYnVs28qYAybvAlBV+H7pn0saFY4Ig==",
       "dev": true,
       "license": "MIT",
       "funding": {
diff --git a/package.json b/package.json
index 029482d..dc80955 100644
--- a/package.json
+++ b/package.json
@@ -14,10 +14,12 @@
     "driver.js": "^1.4.0",
     "music-metadata": "^11.10.2",
     "next": "16.0.3",
+    "next-intl": "^4.5.6",
     "prisma": "^6.19.0",
     "react": "19.2.0",
     "react-dom": "19.2.0",
-    "react-markdown": "^10.1.0"
+    "react-markdown": "^10.1.0",
+    "unist-util-visit-parents": "^6.0.2"
   },
   "devDependencies": {
     "@types/bcryptjs": "^2.4.6",
@@ -25,8 +27,9 @@
     "@types/react": "^19",
     "@types/react-dom": "^19",
     "babel-plugin-react-compiler": "1.0.0",
+    "baseline-browser-mapping": "^2.8.32",
     "eslint": "^9",
     "eslint-config-next": "16.0.3",
     "typescript": "^5"
   }
-}
\ No newline at end of file
+}
diff --git a/prisma/migrations/20251128131405_add_i18n_columns/migration.sql b/prisma/migrations/20251128131405_add_i18n_columns/migration.sql
new file mode 100644
index 0000000..0caf223
--- /dev/null
+++ b/prisma/migrations/20251128131405_add_i18n_columns/migration.sql
@@ -0,0 +1,11 @@
+-- AlterTable
+ALTER TABLE "Genre" ADD COLUMN "nameI18n" JSONB;
+ALTER TABLE "Genre" ADD COLUMN "subtitleI18n" JSONB;
+
+-- AlterTable
+ALTER TABLE "News" ADD COLUMN "contentI18n" JSONB;
+ALTER TABLE "News" ADD COLUMN "titleI18n" JSONB;
+
+-- AlterTable
+ALTER TABLE "Special" ADD COLUMN "nameI18n" JSONB;
+ALTER TABLE "Special" ADD COLUMN "subtitleI18n" JSONB;
diff --git a/prisma/migrations/20251128132806_switch_to_json_columns/migration.sql b/prisma/migrations/20251128132806_switch_to_json_columns/migration.sql
new file mode 100644
index 0000000..38a7a8f
--- /dev/null
+++ b/prisma/migrations/20251128132806_switch_to_json_columns/migration.sql
@@ -0,0 +1,60 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `nameI18n` on the `Genre` table. All the data in the column will be lost.
+  - You are about to drop the column `subtitleI18n` on the `Genre` table. All the data in the column will be lost.
+  - You are about to alter the column `name` on the `Genre` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+  - You are about to alter the column `subtitle` on the `Genre` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+  - You are about to drop the column `contentI18n` on the `News` table. All the data in the column will be lost.
+  - You are about to drop the column `titleI18n` on the `News` table. All the data in the column will be lost.
+  - You are about to alter the column `content` on the `News` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+  - You are about to alter the column `title` on the `News` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+  - You are about to drop the column `nameI18n` on the `Special` table. All the data in the column will be lost.
+  - You are about to drop the column `subtitleI18n` on the `Special` table. All the data in the column will be lost.
+  - You are about to alter the column `name` on the `Special` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+  - You are about to alter the column `subtitle` on the `Special` table. The data in that column could be lost. The data in that column will be cast from `String` to `Json`.
+
+*/
+-- RedefineTables
+PRAGMA defer_foreign_keys=ON;
+PRAGMA foreign_keys=OFF;
+CREATE TABLE "new_Genre" (
+    "id" INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
+    "name" JSONB NOT NULL,
+    "subtitle" JSONB,
+    "active" BOOLEAN NOT NULL DEFAULT true
+);
+INSERT INTO "new_Genre" ("active", "id", "name", "subtitle") SELECT "active", "id", "nameI18n", "subtitleI18n" FROM "Genre";
+DROP TABLE "Genre";
+ALTER TABLE "new_Genre" RENAME TO "Genre";
+CREATE TABLE "new_News" (
+    "id" INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
+    "title" JSONB NOT NULL,
+    "content" JSONB NOT NULL,
+    "author" TEXT,
+    "publishedAt" DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "updatedAt" DATETIME NOT NULL,
+    "featured" BOOLEAN NOT NULL DEFAULT false,
+    "specialId" INTEGER,
+    CONSTRAINT "News_specialId_fkey" FOREIGN KEY ("specialId") REFERENCES "Special" ("id") ON DELETE SET NULL ON UPDATE CASCADE
+);
+INSERT INTO "new_News" ("author", "content", "featured", "id", "publishedAt", "specialId", "title", "updatedAt") SELECT "author", "contentI18n", "featured", "id", "publishedAt", "specialId", "titleI18n", "updatedAt" FROM "News";
+DROP TABLE "News";
+ALTER TABLE "new_News" RENAME TO "News";
+CREATE INDEX "News_publishedAt_idx" ON "News"("publishedAt");
+CREATE TABLE "new_Special" (
+    "id" INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
+    "name" JSONB NOT NULL,
+    "subtitle" JSONB,
+    "maxAttempts" INTEGER NOT NULL DEFAULT 7,
+    "unlockSteps" TEXT NOT NULL,
+    "createdAt" DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
+    "launchDate" DATETIME,
+    "endDate" DATETIME,
+    "curator" TEXT
+);
+INSERT INTO "new_Special" ("createdAt", "curator", "endDate", "id", "launchDate", "maxAttempts", "name", "subtitle", "unlockSteps") SELECT "createdAt", "curator", "endDate", "id", "launchDate", "maxAttempts", "nameI18n", "subtitleI18n", "unlockSteps" FROM "Special";
+DROP TABLE "Special";
+ALTER TABLE "new_Special" RENAME TO "Special";
+PRAGMA foreign_keys=ON;
+PRAGMA defer_foreign_keys=OFF;
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 0f2101d..36ef48a 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -28,8 +28,8 @@ model Song {
 
 model Genre {
   id    Int    @id @default(autoincrement())
-  name  String @unique
-  subtitle String?
+  name  Json   // Multilingual: { "de": "Rock", "en": "Rock" }
+  subtitle Json? // Multilingual
   active   Boolean @default(true)
   songs Song[]
   dailyPuzzles DailyPuzzle[]
@@ -37,8 +37,8 @@ model Genre {
 
 model Special {
   id          Int           @id @default(autoincrement())
-  name        String        @unique
-  subtitle    String?
+  name        Json          // Multilingual
+  subtitle    Json?         // Multilingual
   maxAttempts Int           @default(7)
   unlockSteps String // JSON string: e.g. "[2, 4, 7, 11, 16, 30]"
   createdAt   DateTime      @default(now())
@@ -77,8 +77,8 @@ model DailyPuzzle {
 
 model News {
   id          Int      @id @default(autoincrement())
-  title       String
-  content     String   // Markdown format
+  title       Json     // Multilingual
+  content     Json     // Multilingual
   author      String?  // Optional: curator/admin name
   publishedAt DateTime @default(now())
   updatedAt   DateTime @updatedAt
diff --git a/middleware.ts b/proxy.ts
similarity index 51%
rename from middleware.ts
rename to proxy.ts
index 18047ac..3d5c3c2 100644
--- a/middleware.ts
+++ b/proxy.ts
@@ -1,32 +1,30 @@
-import { NextResponse } from 'next/server';
+import createMiddleware from 'next-intl/middleware';
 import type { NextRequest } from 'next/server';
 
-export function middleware(request: NextRequest) {
-    const response = NextResponse.next();
+const i18nMiddleware = createMiddleware({
+    locales: ['de', 'en'],
+    defaultLocale: 'de',
+    // Wir nutzen überall Locale-Präfixe (`/de`, `/en`)
+    localePrefix: 'always'
+});
 
-    // Security Headers
+export default function proxy(request: NextRequest) {
+    // 1. i18n-Routing
+    const response = i18nMiddleware(request);
+
+    // 2. Security-Header ergänzen
     const headers = response.headers;
 
-    // Prevent clickjacking
     headers.set('X-Frame-Options', 'SAMEORIGIN');
-
-    // XSS Protection (legacy but still useful)
     headers.set('X-XSS-Protection', '1; mode=block');
-
-    // Prevent MIME type sniffing
     headers.set('X-Content-Type-Options', 'nosniff');
-
-    // Referrer Policy
     headers.set('Referrer-Policy', 'strict-origin-when-cross-origin');
-
-    // Permissions Policy (restrict features)
     headers.set('Permissions-Policy', 'camera=(), microphone=(), geolocation=()');
 
-    // Content Security Policy
     const csp = [
         "default-src 'self'",
-        "script-src 'self' 'unsafe-inline' 'unsafe-eval' https://plausible.elpatron.me", // Next.js requires unsafe-inline/eval
-        "style-src 'self' 'unsafe-inline'", // Allow inline styles
+        "script-src 'self' 'unsafe-inline' 'unsafe-eval' https://plausible.elpatron.me",
+        "style-src 'self' 'unsafe-inline'",
         "img-src 'self' data: blob:",
         "font-src 'self' data:",
         "connect-src 'self' https://openrouter.ai https://gotify.example.com https://plausible.elpatron.me",
@@ -38,15 +36,8 @@ export function middleware(request: NextRequest) {
     return response;
 }
 
-// Apply middleware to all routes
 export const config = {
-    matcher: [
-        /*
-         * Match all request paths except for the ones starting with:
-         * - _next/static (static files)
-         * - _next/image (image optimization files)
-         * - favicon.ico (favicon file)
-         */
-        '/((?!_next/static|_next/image|favicon.ico).*)',
-    ],
+    // Empfohlener Matcher aus der next-intl Doku:
+    // alle Routen außer _next, API und statischen Dateien
+    matcher: ['/((?!api|_next|.*\\..*).*)']
 };
diff --git a/scripts/baseline-migrations.sh b/scripts/baseline-migrations.sh
index df82282..aa302f8 100755
--- a/scripts/baseline-migrations.sh
+++ b/scripts/baseline-migrations.sh
@@ -14,5 +14,10 @@ npx prisma migrate resolve --applied "20251123083856_add_rating_system"
 npx prisma migrate resolve --applied "20251123140527_add_subtitles"
 npx prisma migrate resolve --applied "20251123181922_add_release_year"
 npx prisma migrate resolve --applied "20251123204000_fix_cascade_delete"
+npx prisma migrate resolve --applied "20251124182259_add_exclude_from_global"
+npx prisma migrate resolve --applied "20251124231438_add_genre_active_field"
+npx prisma migrate resolve --applied "20251125101602_add_news_model"
+npx prisma migrate resolve --applied "20251128131405_add_i18n_columns"
+npx prisma migrate resolve --applied "20251128132806_switch_to_json_columns"
 
 echo "✅ Baseline complete! Restart the container to apply migrations normally."
diff --git a/scripts/docker-entrypoint.sh b/scripts/docker-entrypoint.sh
index fc2e0d9..84a9075 100755
--- a/scripts/docker-entrypoint.sh
+++ b/scripts/docker-entrypoint.sh
@@ -9,11 +9,23 @@ fi
 
 echo "Starting deployment..."
 
-# Run migrations
+# Run migrations with fallback to baseline if needed
 echo "Running database migrations..."
-npx prisma migrate deploy
-
-
+if ! npx prisma migrate deploy; then
+    echo "⚠️  Migration failed, attempting to baseline existing database..."
+    if [ -f /app/scripts/baseline-migrations.sh ]; then
+        sh /app/scripts/baseline-migrations.sh
+        echo "Retrying migrations after baseline..."
+        npx prisma migrate deploy || {
+            echo "❌ Migration failed even after baseline. Please check your database."
+            exit 1
+        }
+    else
+        echo "❌ ERROR: Migration failed and baseline script not found at /app/scripts/baseline-migrations.sh"
+        exit 1
+    fi
+fi
+echo "✅ Migrations completed successfully"
 
 # Start the application
 echo "Starting application..."
diff --git a/scripts/restore_songs.ts b/scripts/restore_songs.ts
index 753e0be..24dcc27 100644
--- a/scripts/restore_songs.ts
+++ b/scripts/restore_songs.ts
@@ -43,10 +43,22 @@ async function restoreSongs() {
                     // Simple normalization
                     const normalizedGenre = genreName.trim();
 
-                    // Upsert genre (we can't use upsert easily with connect, so find or create first)
-                    let genre = await prisma.genre.findUnique({ where: { name: normalizedGenre } });
+                    // Find genre by checking all genres (name is now JSON)
+                    const allGenres = await prisma.genre.findMany();
+                    let genre = allGenres.find(g => {
+                        const name = g.name as any;
+                        return (typeof name === 'string' && name === normalizedGenre) ||
+                            (typeof name === 'object' && (name.de === normalizedGenre || name.en === normalizedGenre));
+                    });
+
                     if (!genre) {
-                        genre = await prisma.genre.create({ data: { name: normalizedGenre } });
+                        // Create with JSON structure
+                        genre = await prisma.genre.create({
+                            data: {
+                                name: { de: normalizedGenre, en: normalizedGenre },
+                                active: true
+                            }
+                        });
                         console.log(`Created genre: ${normalizedGenre}`);
                     }
                     genreConnect.push({ id: genre.id });
diff --git a/scripts/verify-i18n-migration.ts b/scripts/verify-i18n-migration.ts
new file mode 100644
index 0000000..f0cfeea
--- /dev/null
+++ b/scripts/verify-i18n-migration.ts
@@ -0,0 +1,31 @@
+import { PrismaClient } from '@prisma/client';
+
+const prisma = new PrismaClient();
+
+async function main() {
+    console.log('Verifying i18n migration...');
+
+    const genre = await prisma.genre.findFirst();
+    if (!genre) {
+        console.log('No genres found to verify.');
+        return;
+    }
+
+    console.log('First genre:', JSON.stringify(genre, null, 2));
+
+    if (typeof genre.name === 'object' && genre.name !== null && 'de' in (genre.name as any)) {
+        console.log('SUCCESS: Genre name is a JSON object with "de" key.');
+    } else {
+        console.error('FAILURE: Genre name is NOT in expected format:', genre.name);
+        process.exit(1);
+    }
+}
+
+main()
+    .catch((e) => {
+        console.error(e);
+        process.exit(1);
+    })
+    .finally(async () => {
+        await prisma.$disconnect();
+    });