feat(desktop): move dictionary entries in and out as files

Users could only rebuild their spoken-word dictionary entry by entry. Import
and export now round-trip the whole list, reporting duplicate and invalid
entries per row instead of failing the batch, so a dictionary survives a
reinstall or a move to another machine.

apps/desktop/src/renderer/pages/DictionaryPage.tsx

@@ -3,7 +3,7 @@
 
 import React, { useState, useEffect, useCallback, useRef } from 'react'
 import { Box, TextField, Dialog, DialogTitle, DialogContent, DialogActions, IconButton, Tooltip } from '@mui/material'
-import { Plus, Trash2, Pencil, BookA } from 'lucide-react'
+import { Plus, Trash2, Pencil, BookA, Download, Upload } from 'lucide-react'
 import { MetalCard, PhosphorText, PhysicalButton, TactileBadge } from '@d3ro/ui/components/ds'
 import { PageHeader, SearchInput, EmptyStateCard } from '../components/shared'
 import { d3roPalette, d3roFontSans, d3roTypo, d3roRadius, d3roShadow } from '@d3ro/ui/theme'
@@ -21,10 +21,15 @@ export function DictionaryPage(): React.ReactElement {
   const [formPronunciation, setFormPronunciation] = useState('')
   const [saving, setSaving] = useState(false)
   const isSavingRef = useRef(false)
+  const [ioBusy, setIoBusy] = useState(false)
+  const [ioMessage, setIoMessage] = useState<string | null>(null)
 
   const loadData = useCallback(async () => {
     setLoading(true)
-    const result = await window.electronAPI.dictionary.getAll({ search: search || undefined })
+    const trimmed = search.trim()
+    const result = trimmed
+      ? await window.electronAPI.dictionary.search({ query: trimmed, page: 0, pageSize: 50 })
+      : await window.electronAPI.dictionary.getAll({ page: 0, pageSize: 50 })
     if (result.success) setData(result.data)
     setLoading(false)
   }, [search])
@@ -74,18 +79,112 @@ export function DictionaryPage(): React.ReactElement {
     }
   }
 
+  const handleExport = async (format: 'json' | 'csv'): Promise<void> => {
+    if (ioBusy) return
+    setIoBusy(true)
+    setIoMessage(null)
+    try {
+      const result = await window.electronAPI.dictionary.export({ format })
+      setIoMessage(result.success ? t('dictionary.exported') : t('dictionary.exportFailed'))
+    } finally {
+      setIoBusy(false)
+    }
+  }
+
+  const handleImport = async (format: 'json' | 'csv'): Promise<void> => {
+    if (ioBusy) return
+    setIoBusy(true)
+    setIoMessage(null)
+    try {
+      const result = await window.electronAPI.dictionary.import({ filePath: '', format })
+      if (!result.success) {
+        setIoMessage(t('dictionary.importFailed'))
+        return
+      }
+      const { imported, skipped, errors } = result.data
+      setIoMessage(
+        t('dictionary.importedCount', {
+          imported: String(imported),
+          skipped: String(skipped),
+          errors: String(errors),
+        })
+      )
+      await loadData()
+    } finally {
+      setIoBusy(false)
+    }
+  }
+
+  const ioButtonSx = {
+    p: 0.7,
+    color: d3roPalette.text.inactive,
+    bgcolor: d3roPalette.glass.raised,
+    border: `1px solid ${d3roPalette.glass.hairline}`,
+    '&:hover': { color: d3roPalette.accent.light, bgcolor: d3roPalette.glass.hairlineStrong },
+  } as const
+
   return (
     <Box sx={{ maxWidth: 1060, mx: 'auto', p: { xs: 2.5, md: 4 }, pb: 10 }}>
       <PageHeader
         title={t('dictionary.title')}
         count={t('dictionary.words', { count: data?.total ?? 0 })}
         action={
-          <PhysicalButton tone="accent" onClick={openAdd} size="small" trailingIcon={<Plus size={14} />}>
-            {t('dictionary.add')}
-          </PhysicalButton>
+          <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.75 }}>
+            <Tooltip title={`${t('dictionary.export')} JSON`}>
+              <IconButton
+                size="small"
+                disabled={ioBusy}
+                onClick={() => void handleExport('json')}
+                sx={ioButtonSx}
+              >
+                <Download size={15} />
+              </IconButton>
+            </Tooltip>
+            <Tooltip title={`${t('dictionary.export')} CSV`}>
+              <IconButton
+                size="small"
+                disabled={ioBusy}
+                onClick={() => void handleExport('csv')}
+                sx={ioButtonSx}
+              >
+                <Download size={15} />
+              </IconButton>
+            </Tooltip>
+            <Tooltip title={`${t('dictionary.import')} JSON`}>
+              <IconButton
+                size="small"
+                disabled={ioBusy}
+                onClick={() => void handleImport('json')}
+                sx={ioButtonSx}
+              >
+                <Upload size={15} />
+              </IconButton>
+            </Tooltip>
+            <Tooltip title={`${t('dictionary.import')} CSV`}>
+              <IconButton
+                size="small"
+                disabled={ioBusy}
+                onClick={() => void handleImport('csv')}
+                sx={ioButtonSx}
+              >
+                <Upload size={15} />
+              </IconButton>
+            </Tooltip>
+            <PhysicalButton tone="accent" onClick={openAdd} size="small" trailingIcon={<Plus size={14} />}>
+              {t('dictionary.add')}
+            </PhysicalButton>
+          </Box>
         }
       />
 
+      {ioMessage && (
+        <Box sx={{ mb: 1.5 }}>
+          <PhosphorText variant="meta" sx={{ color: d3roPalette.text.dimLabel }}>
+            {ioMessage}
+          </PhosphorText>
+        </Box>
+      )}
+
       <SearchInput
         placeholder={t('dictionary.search')}
         value={search}
@@ -160,8 +259,8 @@ export function DictionaryPage(): React.ReactElement {
                   <Tooltip title={t('common.delete')}>
                     <IconButton
                       size="small"
-                      onClick={() => {
-                        window.electronAPI.dictionary.delete({ id: entry.id })
+                      onClick={async () => {
+                        await window.electronAPI.dictionary.delete({ id: entry.id })
                         loadData()
                       }}
                       sx={{