feat: multilingual glossary UI, translate selector, context fusion

- TermEditor: rewritten with expandable multilingual translation grid
  (13 languages), editorial styling, source/target + translations JSON
- GlossarySelector: new component in translate page config panel,
  fetches user glossaries, shows flag + term count, Pro+LLM only
- useTranslationConfig: added glossaryId state
- useTranslationSubmit: sends glossary_id to backend
- Context page: removed textarea glossary, presets now create API
  glossaries via template import, added link to Glossaries page
- i18n: added 12 keys × 13 locales for glossary/translate/context

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>

frontend/src/app/dashboard/translate/GlossarySelector.tsx

@@ -0,0 +1,125 @@
+'use client';
+
+import { useState, useEffect } from 'react';
+import { BookText, ChevronDown } from 'lucide-react';
+import { API_BASE } from '@/lib/config';
+import { useI18n } from '@/lib/i18n';
+import { cn } from '@/lib/utils';
+import { SUPPORTED_LANGUAGES } from '../glossaries/types';
+
+interface GlossaryOption {
+  id: string;
+  name: string;
+  source_language: string;
+  terms_count: number;
+}
+
+interface GlossarySelectorProps {
+  glossaryId: string | null;
+  onChange: (id: string | null) => void;
+  disabled?: boolean;
+}
+
+export function GlossarySelector({ glossaryId, onChange, disabled }: GlossarySelectorProps) {
+  const { t } = useI18n();
+  const [glossaries, setGlossaries] = useState<GlossaryOption[]>([]);
+  const [isOpen, setIsOpen] = useState(false);
+  const [isLoading, setIsLoading] = useState(true);
+
+  useEffect(() => {
+    const fetchGlossaries = async () => {
+      try {
+        const token = localStorage.getItem('token');
+        const headers: Record<string, string> = {};
+        if (token) headers['Authorization'] = `Bearer ${token}`;
+
+        const res = await fetch(`${API_BASE}/api/v1/glossaries?per_page=100`, { headers });
+        if (res.ok) {
+          const data = await res.json();
+          setGlossaries(data.data || []);
+        }
+      } catch {
+        // ignore
+      } finally {
+        setIsLoading(false);
+      }
+    };
+    fetchGlossaries();
+  }, []);
+
+  const selected = glossaries.find(g => g.id === glossaryId);
+  const sourceFlag = SUPPORTED_LANGUAGES.find(l => l.code === selected?.source_language)?.flag ?? '';
+
+  if (isLoading || glossaries.length === 0) return null;
+
+  return (
+    <div className="space-y-3">
+      <label className="text-[9px] font-black text-brand-dark/40 dark:text-white/40 uppercase tracking-[0.2em] block">
+        <BookText size={10} className="inline mr-1.5 text-brand-accent" />
+        {t('translate.glossary.title')}
+      </label>
+
+      <div className="relative">
+        <button
+          onClick={() => !disabled && setIsOpen(!isOpen)}
+          disabled={disabled}
+          className={cn(
+            "w-full px-5 py-4 bg-brand-muted dark:bg-white/10 rounded-2xl text-[10px] font-black uppercase tracking-widest border border-black/5 dark:border-white/10 flex items-center justify-between gap-3 transition-all",
+            isOpen && "ring-2 ring-brand-accent/20 border-brand-accent/30",
+            disabled && "opacity-50 cursor-not-allowed"
+          )}
+        >
+          <span className={cn(
+            "truncate",
+            selected ? "text-brand-dark dark:text-white" : "text-brand-dark/30 dark:text-white/30"
+          )}>
+            {selected ? (
+              <>{sourceFlag} {selected.name} <span className="text-brand-dark/30 dark:text-white/30 font-normal normal-case">({selected.terms_count} {t('translate.glossary.terms')})</span></>
+            ) : (
+              t('translate.glossary.select')
+            )}
+          </span>
+          <ChevronDown size={14} className={cn(
+            "text-brand-accent shrink-0 transition-transform",
+            isOpen && "rotate-180"
+          )} />
+        </button>
+
+        {isOpen && (
+          <div className="absolute z-50 top-full left-0 right-0 mt-2 bg-white dark:bg-[#1a1a1a] rounded-2xl border border-black/10 dark:border-white/10 shadow-xl max-h-64 overflow-y-auto">
+            {/* None option */}
+            <button
+              onClick={() => { onChange(null); setIsOpen(false); }}
+              className={cn(
+                "w-full px-5 py-3 text-left text-[10px] font-black uppercase tracking-widest hover:bg-brand-muted dark:hover:bg-white/5 transition-colors",
+                !glossaryId ? "text-brand-accent" : "text-brand-dark/30 dark:text-white/30"
+              )}
+            >
+              {t('translate.glossary.none')}
+            </button>
+
+            {glossaries.map((g) => {
+              const flag = SUPPORTED_LANGUAGES.find(l => l.code === g.source_language)?.flag ?? '';
+              return (
+                <button
+                  key={g.id}
+                  onClick={() => { onChange(g.id); setIsOpen(false); }}
+                  className={cn(
+                    "w-full px-5 py-3 text-left text-[10px] font-black uppercase tracking-widest hover:bg-brand-muted dark:hover:bg-white/5 transition-colors border-t border-black/5 dark:border-white/5",
+                    glossaryId === g.id ? "text-brand-accent" : "text-brand-dark dark:text-white"
+                  )}
+                >
+                  <span className="mr-2">{flag}</span>
+                  {g.name}
+                  <span className="ml-2 text-brand-dark/30 dark:text-white/30 font-normal normal-case">
+                    ({g.terms_count} {t('translate.glossary.terms')})
+                  </span>
+                </button>
+              );
+            })}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}