Unify language system: one setting for all modules

- Merge two separate language systems (bp_language + bp_native_language) into one
- NativeLanguageContext now reads from LanguageContext (same localStorage key)
- Extend i18n.ts to 26 languages with flags (UI falls back to EN/DE)
- Replace LanguageSwitcher with LanguageDropdown (flags) in learn + parent layouts
- Migration: old bp_native_language value auto-migrates to bp_language
- Onboarding page writes to bp_language (unified key)

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

studio-v2/lib/NativeLanguageContext.tsx

@@ -1,9 +1,15 @@
 'use client'
 
-import React, { createContext, useContext, useState, useEffect, useCallback } from 'react'
+import React, { createContext, useContext, useCallback } from 'react'
 import { exerciseT, type ExerciseKey } from './exerciseTranslations'
+import { useLanguage } from './LanguageContext'
 
-const STORAGE_KEY = 'bp_native_language'
+/**
+ * NativeLanguageContext — unified with LanguageContext.
+ *
+ * Reads/writes the SAME language as the central LanguageContext (bp_language).
+ * No separate localStorage key — one language setting for the entire app.
+ */
 
 interface NativeLanguageState {
   nativeLang: string
@@ -22,17 +28,14 @@ const NativeLanguageContext = createContext<NativeLanguageState>({
 })
 
 export function NativeLanguageProvider({ children }: { children: React.ReactNode }) {
-  const [nativeLang, setNativeLangState] = useState('de')
+  const { language, setLanguage } = useLanguage()
 
-  useEffect(() => {
-    const stored = localStorage.getItem(STORAGE_KEY)
-    if (stored) setNativeLangState(stored)
-  }, [])
+  // Sync: nativeLang = the central language setting
+  const nativeLang = language
 
   const setNativeLang = useCallback((lang: string) => {
-    setNativeLangState(lang)
-    localStorage.setItem(STORAGE_KEY, lang)
-  }, [])
+    setLanguage(lang)
+  }, [setLanguage])
 
   const isThirdLanguage = nativeLang !== 'de' && nativeLang !== 'en'