From 07c6d13c990173b813680027edba04fd436b96c2 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EC=9C=A4=EC=B0=AC?= <yunchan@yunchan-ui-MacBookPro.local>
Date: Sat, 11 Apr 2026 08:57:27 +0900
Subject: [PATCH] =?UTF-8?q?feat(V2-6=EC=B0=A8):=20=ED=85=8C=EB=A7=88=20?=
 =?UTF-8?q?=ED=86=A0=EA=B8=80=20+=20Mermaid=20+=20=EC=98=A4=EB=94=94?=
 =?UTF-8?q?=EC=98=A4=20=EC=9E=AC=EC=83=9D=20+=20Dashboard=20=EC=B0=A8?=
 =?UTF-8?q?=ED=8A=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

[A] Dark/Light/6종 + Auto 테마 토글
- theme-mode-context.tsx: localStorage 영속 + prefers-color-scheme
- theme-provider.tsx: 컨텍스트 기반 동적 getTheme
- sidebar.tsx: MUI Select 토글 (PaletteIcon)
- 12개 locale theme.* 키 추가 (label/dark/light/auto/nord/solarized/catppuccin/dracula)

[B] DocumentEditor Mermaid + Markdown 렌더
- markdown-preview.tsx: react-markdown + remark-gfm + lazy mermaid
  - mermaid 코드 블록 자동 SVG 렌더
  - dark theme + d3ro 폰트
- document-editor.tsx: Edit/Preview Tabs

[C] 회의 오디오 재생
- meeting-audio-player.tsx: Supabase Storage signed URL (1h) → <audio controls>
- meetings/[id] AUDIO 카드 추가

[D] Dashboard 14일 추이 차트
- meetings-trend-chart.tsx: recharts LineChart (회의/문서)
- dashboard/page.tsx: 14일 데이터 집계 + 이번 주 stat 자동 계산

[W] fix: Emotion key 'd3ro-mui' → 'mui'
- 'd3ro-mui'에 숫자 3이 포함돼 Emotion 키 검증 실패
- dev SSR /login 500 에러 차단했음

deps:
- react-markdown@10, remark-gfm@4, mermaid@11, recharts@3
---
 apps/web/package.json                         |    6 +-
 apps/web/src/app/(app)/dashboard/page.tsx     |   78 +-
 apps/web/src/app/(app)/meetings/[id]/page.tsx |    9 +
 .../dashboard/meetings-trend-chart.tsx        |   83 +
 apps/web/src/components/layout/sidebar.tsx    |   47 +-
 .../components/meetings/document-editor.tsx   |   70 +-
 .../components/meetings/markdown-preview.tsx  |  171 ++
 .../meetings/meeting-audio-player.tsx         |  103 ++
 .../providers/theme-mode-context.tsx          |  101 ++
 .../components/providers/theme-provider.tsx   |   27 +-
 memory/project_status.md                      |   11 +-
 package-lock.json                             | 1433 ++++++++++++++++-
 packages/i18n/src/locales/de.json             |   12 +-
 packages/i18n/src/locales/en.json             |   12 +-
 packages/i18n/src/locales/es.json             |   12 +-
 packages/i18n/src/locales/fr.json             |   12 +-
 packages/i18n/src/locales/ja.json             |   12 +-
 packages/i18n/src/locales/ko.json             |   12 +-
 packages/i18n/src/locales/pt.json             |   12 +-
 packages/i18n/src/locales/ru.json             |   12 +-
 packages/i18n/src/locales/th.json             |   12 +-
 packages/i18n/src/locales/vi.json             |   12 +-
 packages/i18n/src/locales/zh-TW.json          |   12 +-
 packages/i18n/src/locales/zh.json             |   12 +-
 24 files changed, 2220 insertions(+), 63 deletions(-)
 create mode 100644 apps/web/src/components/dashboard/meetings-trend-chart.tsx
 create mode 100644 apps/web/src/components/meetings/markdown-preview.tsx
 create mode 100644 apps/web/src/components/meetings/meeting-audio-player.tsx
 create mode 100644 apps/web/src/components/providers/theme-mode-context.tsx

diff --git a/apps/web/package.json b/apps/web/package.json
index f06bfcc..09441d4 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -25,9 +25,13 @@
     "@mui/material-nextjs": "^7.0.0",
     "@supabase/ssr": "^0.10.0",
     "@supabase/supabase-js": "^2.103.0",
+    "mermaid": "^11.14.0",
     "next": "^15.0.0",
     "react": "^19.0.0",
-    "react-dom": "^19.0.0"
+    "react-dom": "^19.0.0",
+    "react-markdown": "^10.1.0",
+    "recharts": "^3.8.1",
+    "remark-gfm": "^4.0.1"
   },
   "devDependencies": {
     "@types/node": "^22.13.0",
diff --git a/apps/web/src/app/(app)/dashboard/page.tsx b/apps/web/src/app/(app)/dashboard/page.tsx
index 54510f3..318dacd 100644
--- a/apps/web/src/app/(app)/dashboard/page.tsx
+++ b/apps/web/src/app/(app)/dashboard/page.tsx
@@ -5,6 +5,10 @@ import { Box, Grid, Stack } from '@mui/material'
 import { MetalCard, PhosphorText } from '@d3ro/ui/components/ds'
 import { d3roPalette, typoSx } from "@d3ro/ui/theme"
 import { getSupabaseServerClient } from '@/lib/supabase-server'
+import {
+  MeetingsTrendChart,
+  type TrendPoint
+} from '@/components/dashboard/meetings-trend-chart'
 
 interface Stat {
   label: string
@@ -12,22 +16,73 @@ interface Stat {
   hint?: string
 }
 
-async function loadDashboardData(): Promise<{ stats: Stat[]; recentMeetings: Array<{ id: string; title: string; started_at: string }> }> {
+const TREND_DAYS = 14
+
+function buildEmptyTrend(days: number): TrendPoint[] {
+  const out: TrendPoint[] = []
+  const now = new Date()
+  for (let i = days - 1; i >= 0; i -= 1) {
+    const d = new Date(now)
+    d.setDate(now.getDate() - i)
+    const m = String(d.getMonth() + 1).padStart(2, '0')
+    const day = String(d.getDate()).padStart(2, '0')
+    out.push({ date: `${m}/${day}`, meetings: 0, documents: 0 })
+  }
+  return out
+}
+
+function bumpTrend(points: TrendPoint[], isoTimestamp: string, key: 'meetings' | 'documents'): void {
+  const created = new Date(isoTimestamp)
+  const m = String(created.getMonth() + 1).padStart(2, '0')
+  const d = String(created.getDate()).padStart(2, '0')
+  const label = `${m}/${d}`
+  const point = points.find((p) => p.date === label)
+  if (point) point[key] += 1
+}
+
+async function loadDashboardData(): Promise<{
+  stats: Stat[]
+  recentMeetings: Array<{ id: string; title: string; started_at: string }>
+  trend: TrendPoint[]
+}> {
+  const trend = buildEmptyTrend(TREND_DAYS)
+
   try {
     const supabase = await getSupabaseServerClient()
 
-    const [{ count: meetingCount }, { data: recent }] = await Promise.all([
+    const since = new Date()
+    since.setDate(since.getDate() - (TREND_DAYS - 1))
+    since.setHours(0, 0, 0, 0)
+    const sinceIso = since.toISOString()
+
+    const [
+      { count: meetingCount },
+      { data: recent },
+      { data: meetingsTrendRows },
+      { data: documentsTrendRows }
+    ] = await Promise.all([
       supabase.from('meetings').select('*', { count: 'exact', head: true }),
       supabase
         .from('meetings')
         .select('id, title, started_at')
         .order('started_at', { ascending: false })
-        .limit(5)
+        .limit(5),
+      supabase.from('meetings').select('started_at').gte('started_at', sinceIso),
+      supabase.from('meeting_documents').select('created_at').gte('created_at', sinceIso)
     ])
 
+    ;(meetingsTrendRows ?? []).forEach((row) => {
+      if (row.started_at) bumpTrend(trend, row.started_at, 'meetings')
+    })
+    ;(documentsTrendRows ?? []).forEach((row) => {
+      if (row.created_at) bumpTrend(trend, row.created_at, 'documents')
+    })
+
+    const thisWeek = trend.slice(-7).reduce((acc, p) => acc + p.meetings, 0)
+
     const stats: Stat[] = [
       { label: '총 회의', value: String(meetingCount ?? 0), hint: '전체 기간' },
-      { label: '이번 주', value: '—', hint: '7일간' },
+      { label: '이번 주', value: String(thisWeek), hint: '최근 7일' },
       { label: '구독 티어', value: 'Free', hint: '업그레이드 가능' },
       { label: '쿼터 사용', value: '0 / 50', hint: '오늘' }
     ]
@@ -38,7 +93,8 @@ async function loadDashboardData(): Promise<{ stats: Stat[]; recentMeetings: Arr
         id: m.id,
         title: m.title ?? '(제목 없음)',
         started_at: m.started_at
-      }))
+      })),
+      trend
     }
   } catch {
     return {
@@ -48,13 +104,14 @@ async function loadDashboardData(): Promise<{ stats: Stat[]; recentMeetings: Arr
         { label: '구독 티어', value: '—' },
         { label: '쿼터 사용', value: '—' }
       ],
-      recentMeetings: []
+      recentMeetings: [],
+      trend
     }
   }
 }
 
 export default async function DashboardPage(): Promise<React.ReactElement> {
-  const { stats, recentMeetings } = await loadDashboardData()
+  const { stats, recentMeetings, trend } = await loadDashboardData()
 
   return (
     <Box sx={{ p: 4 }}>
@@ -80,6 +137,13 @@ export default async function DashboardPage(): Promise<React.ReactElement> {
         ))}
       </Grid>
 
+      <MetalCard sx={{ p: 3, mb: 4 }}>
+        <PhosphorText variant="heading" sx={{ mb: 2 }}>
+          ACTIVITY TREND ({TREND_DAYS}D)
+        </PhosphorText>
+        <MeetingsTrendChart points={trend} />
+      </MetalCard>
+
       <PhosphorText variant="heading" sx={{ mb: 2 }}>
         RECENT MEETINGS
       </PhosphorText>
diff --git a/apps/web/src/app/(app)/meetings/[id]/page.tsx b/apps/web/src/app/(app)/meetings/[id]/page.tsx
index 7430ac3..639c7df 100644
--- a/apps/web/src/app/(app)/meetings/[id]/page.tsx
+++ b/apps/web/src/app/(app)/meetings/[id]/page.tsx
@@ -13,6 +13,7 @@ import {
 import { GenerateDocumentButton } from '@/components/meetings/generate-document-button'
 import { DocumentEditor } from '@/components/meetings/document-editor'
 import { MemoForm } from '@/components/meetings/memo-form'
+import { MeetingAudioPlayer } from '@/components/meetings/meeting-audio-player'
 
 interface PageProps {
   params: Promise<{ id: string }>
@@ -59,6 +60,14 @@ export default async function MeetingDetailPage({ params }: PageProps): Promise<
       </Box>
 
       <Stack spacing={3}>
+          {/* Audio — Supabase Storage signed URL */}
+          <MetalCard sx={{ p: 3 }}>
+            <PhosphorText variant="heading" sx={{ mb: 2 }}>
+              AUDIO
+            </PhosphorText>
+            <MeetingAudioPlayer storageKey={meeting.audio_storage_key ?? null} />
+          </MetalCard>
+
           {/* Transcript — Realtime 구독 */}
           <MetalCard sx={{ p: 3 }}>
             <PhosphorText variant="heading" sx={{ mb: 2 }}>
diff --git a/apps/web/src/components/dashboard/meetings-trend-chart.tsx b/apps/web/src/components/dashboard/meetings-trend-chart.tsx
new file mode 100644
index 0000000..e3bb255
--- /dev/null
+++ b/apps/web/src/components/dashboard/meetings-trend-chart.tsx
@@ -0,0 +1,83 @@
+'use client'
+
+// apps/web/src/components/dashboard/meetings-trend-chart.tsx
+// recharts 기반 회의/문서 추이 차트 (최근 14일).
+
+import {
+  ResponsiveContainer,
+  LineChart,
+  Line,
+  XAxis,
+  YAxis,
+  Tooltip,
+  CartesianGrid,
+  Legend
+} from 'recharts'
+import { Box } from '@mui/material'
+import { d3roPalette } from '@d3ro/ui/theme'
+
+export interface TrendPoint {
+  date: string
+  meetings: number
+  documents: number
+}
+
+interface MeetingsTrendChartProps {
+  points: TrendPoint[]
+}
+
+export function MeetingsTrendChart({ points }: MeetingsTrendChartProps): React.ReactElement {
+  return (
+    <Box sx={{ width: '100%', height: 260 }}>
+      <ResponsiveContainer width="100%" height="100%">
+        <LineChart data={points} margin={{ top: 5, right: 12, left: -12, bottom: 5 }}>
+          <CartesianGrid strokeDasharray="3 3" stroke={d3roPalette.border.subtle} />
+          <XAxis
+            dataKey="date"
+            stroke={d3roPalette.text.muted}
+            fontSize={11}
+            tickLine={false}
+          />
+          <YAxis
+            stroke={d3roPalette.text.muted}
+            fontSize={11}
+            tickLine={false}
+            allowDecimals={false}
+          />
+          <Tooltip
+            contentStyle={{
+              backgroundColor: d3roPalette.bg.elevated,
+              border: `1px solid ${d3roPalette.border.default}`,
+              borderRadius: 8,
+              color: d3roPalette.text.primary,
+              fontSize: 12
+            }}
+            labelStyle={{ color: d3roPalette.text.label }}
+          />
+          <Legend
+            wrapperStyle={{ fontSize: 11, color: d3roPalette.text.secondary }}
+            iconType="circle"
+          />
+          <Line
+            type="monotone"
+            dataKey="meetings"
+            name="Meetings"
+            stroke={d3roPalette.accent.amber}
+            strokeWidth={2}
+            dot={{ r: 3 }}
+            activeDot={{ r: 5 }}
+          />
+          <Line
+            type="monotone"
+            dataKey="documents"
+            name="Documents"
+            stroke={d3roPalette.tag.purple}
+            strokeWidth={2}
+            dot={{ r: 3 }}
+            activeDot={{ r: 5 }}
+          />
+        </LineChart>
+      </ResponsiveContainer>
+    </Box>
+  )
+}
diff --git a/apps/web/src/components/layout/sidebar.tsx b/apps/web/src/components/layout/sidebar.tsx
index 7a27590..dd67355 100644
--- a/apps/web/src/components/layout/sidebar.tsx
+++ b/apps/web/src/components/layout/sidebar.tsx
@@ -4,7 +4,19 @@
 // 대시보드 좌측 사이드바
 
 import { usePathname, useRouter } from 'next/navigation'
-import { Box, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from '@mui/material'
+import {
+  Box,
+  FormControl,
+  InputLabel,
+  List,
+  ListItem,
+  ListItemButton,
+  ListItemIcon,
+  ListItemText,
+  MenuItem,
+  Select,
+  type SelectChangeEvent
+} from '@mui/material'
 import DashboardIcon from '@mui/icons-material/Dashboard'
 import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'
 import MicIcon from '@mui/icons-material/Mic'
@@ -14,10 +26,13 @@ import AutoAwesomeIcon from '@mui/icons-material/AutoAwesome'
 import GroupsIcon from '@mui/icons-material/Groups'
 import PaymentIcon from '@mui/icons-material/Payment'
 import LogoutIcon from '@mui/icons-material/Logout'
+import PaletteIcon from '@mui/icons-material/Palette'
+import type { ThemeMode } from '@d3ro/core/types'
 import { PhosphorText } from '@d3ro/ui/components/ds'
 import { d3roPalette } from '@d3ro/ui/theme'
 import { useI18n } from '@d3ro/i18n'
 import { getSupabaseBrowserClient } from '@/lib/supabase-browser'
+import { AVAILABLE_MODES, useThemeMode } from '@/components/providers/theme-mode-context'
 
 interface NavItem {
   key: string
@@ -30,6 +45,11 @@ export function Sidebar(): React.ReactElement {
   const router = useRouter()
   const pathname = usePathname()
   const { t } = useI18n()
+  const { mode, setMode } = useThemeMode()
+
+  const handleThemeChange = (event: SelectChangeEvent<ThemeMode>): void => {
+    setMode(event.target.value as ThemeMode)
+  }
 
   const items: NavItem[] = [
     {
@@ -135,6 +155,31 @@ export function Sidebar(): React.ReactElement {
         })}
       </List>
 
+      <Box sx={{ px: 2, py: 1.5, borderTop: `1px solid ${d3roPalette.border.default}` }}>
+        <FormControl fullWidth size="small">
+          <InputLabel
+            id="theme-mode-label"
+            sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}
+          >
+            <PaletteIcon fontSize="inherit" />
+            {t('theme.label') ?? 'Theme'}
+          </InputLabel>
+          <Select<ThemeMode>
+            labelId="theme-mode-label"
+            id="theme-mode-select"
+            value={mode}
+            onChange={handleThemeChange}
+            label={t('theme.label') ?? 'Theme'}
+          >
+            {AVAILABLE_MODES.map((m) => (
+              <MenuItem key={m} value={m}>
+                {t(`theme.${m}`) ?? m}
+              </MenuItem>
+            ))}
+          </Select>
+        </FormControl>
+      </Box>
+
       <List sx={{ borderTop: `1px solid ${d3roPalette.border.default}` }}>
         <ListItem disablePadding>
           <ListItemButton onClick={() => void handleLogout()}>
diff --git a/apps/web/src/components/meetings/document-editor.tsx b/apps/web/src/components/meetings/document-editor.tsx
index 337a068..0c0fa18 100644
--- a/apps/web/src/components/meetings/document-editor.tsx
+++ b/apps/web/src/components/meetings/document-editor.tsx
@@ -16,13 +16,18 @@ import {
   Box,
   Alert,
   IconButton,
-  Stack
+  Stack,
+  Tab,
+  Tabs
 } from '@mui/material'
 import CloseIcon from '@mui/icons-material/Close'
 import SaveIcon from '@mui/icons-material/Save'
 import DeleteIcon from '@mui/icons-material/Delete'
+import EditIcon from '@mui/icons-material/Edit'
+import VisibilityIcon from '@mui/icons-material/Visibility'
 import { d3roPalette, typoSx } from '@d3ro/ui/theme'
 import { getSupabaseBrowserClient } from '@/lib/supabase-browser'
+import { MarkdownPreview } from './markdown-preview'
 
 interface DocumentEditorProps {
   doc: {
@@ -41,6 +46,7 @@ export function DocumentEditor({ doc }: DocumentEditorProps): React.ReactElement
   const [content, setContent] = useState(doc.content)
   const [busy, setBusy] = useState(false)
   const [error, setError] = useState<string | null>(null)
+  const [tab, setTab] = useState<'edit' | 'preview'>('edit')
 
   async function handleSave(): Promise<void> {
     setError(null)
@@ -121,22 +127,52 @@ export function DocumentEditor({ doc }: DocumentEditorProps): React.ReactElement
           </Stack>
         </DialogTitle>
         <DialogContent dividers>
-          <TextField
-            fullWidth
-            multiline
-            minRows={20}
-            maxRows={40}
-            value={content}
-            onChange={(e) => setContent(e.target.value)}
-            disabled={busy}
-            placeholder="마크다운으로 편집..."
-            variant="outlined"
-            slotProps={{
-              input: {
-                style: { fontFamily: 'monospace', fontSize: 13 }
-              }
-            }}
-          />
+          <Tabs
+            value={tab}
+            onChange={(_e, v: 'edit' | 'preview') => setTab(v)}
+            sx={{ mb: 2 }}
+          >
+            <Tab value="edit" icon={<EditIcon fontSize="small" />} iconPosition="start" label="Edit" />
+            <Tab
+              value="preview"
+              icon={<VisibilityIcon fontSize="small" />}
+              iconPosition="start"
+              label="Preview"
+            />
+          </Tabs>
+          {tab === 'edit' ? (
+            <TextField
+              fullWidth
+              multiline
+              minRows={20}
+              maxRows={40}
+              value={content}
+              onChange={(e) => setContent(e.target.value)}
+              disabled={busy}
+              placeholder="마크다운으로 편집..."
+              variant="outlined"
+              slotProps={{
+                input: {
+                  style: { fontFamily: 'monospace', fontSize: 13 }
+                }
+              }}
+            />
+          ) : (
+            <Box
+              sx={{
+                minHeight: 400,
+                maxHeight: '60vh',
+                overflowY: 'auto',
+                px: 2,
+                py: 1.5,
+                bgcolor: d3roPalette.bg.card,
+                border: `1px solid ${d3roPalette.border.default}`,
+                borderRadius: 1
+              }}
+            >
+              <MarkdownPreview content={content} />
+            </Box>
+          )}
           {error && (
             <Alert severity="error" variant="outlined" sx={{ mt: 2 }}>
               {error}
diff --git a/apps/web/src/components/meetings/markdown-preview.tsx b/apps/web/src/components/meetings/markdown-preview.tsx
new file mode 100644
index 0000000..82cbf97
--- /dev/null
+++ b/apps/web/src/components/meetings/markdown-preview.tsx
@@ -0,0 +1,171 @@
+'use client'
+
+// apps/web/src/components/meetings/markdown-preview.tsx
+// react-markdown + remark-gfm 렌더 + mermaid code block → 다이어그램 자동 변환.
+// DocumentEditor 미리보기 탭에서 사용.
+
+import { useEffect, useMemo, useRef } from 'react'
+import ReactMarkdown from 'react-markdown'
+import remarkGfm from 'remark-gfm'
+import { Box } from '@mui/material'
+import { d3roPalette } from '@d3ro/ui/theme'
+
+interface MarkdownPreviewProps {
+  content: string
+}
+
+// mermaid는 번들 크기가 크고 brower-only라서 lazy import.
+let mermaidReady: Promise<typeof import('mermaid').default> | null = null
+
+function loadMermaid(): Promise<typeof import('mermaid').default> {
+  if (!mermaidReady) {
+    mermaidReady = import('mermaid').then((mod) => {
+      const m = mod.default
+      m.initialize({
+        startOnLoad: false,
+        theme: 'dark',
+        securityLevel: 'strict',
+        fontFamily:
+          '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'
+      })
+      return m
+    })
+  }
+  return mermaidReady
+}
+
+export function MarkdownPreview({ content }: MarkdownPreviewProps): React.ReactElement {
+  const rootRef = useRef<HTMLDivElement | null>(null)
+  // Unique run id for this component instance to avoid id collisions.
+  const runId = useMemo(() => `mermaid-${Math.random().toString(36).slice(2, 9)}`, [])
+
+  // content 바뀔 때마다 mermaid 블록 재렌더.
+  useEffect(() => {
+    let cancelled = false
+    void loadMermaid().then((mermaid) => {
+      if (cancelled || !rootRef.current) return
+      const nodes = rootRef.current.querySelectorAll<HTMLElement>('.d3ro-mermaid-source')
+      nodes.forEach((node, idx) => {
+        const source = node.textContent ?? ''
+        const id = `${runId}-${idx}`
+        mermaid
+          .render(id, source)
+          .then(({ svg }) => {
+            if (cancelled) return
+            node.innerHTML = svg
+            node.classList.remove('d3ro-mermaid-source')
+            node.classList.add('d3ro-mermaid-rendered')
+          })
+          .catch((err: unknown) => {
+            const msg = err instanceof Error ? err.message : String(err)
+            node.innerHTML = `<pre style="color:${d3roPalette.tag.red};white-space:pre-wrap;">mermaid error: ${msg}</pre>`
+          })
+      })
+    })
+    return () => {
+      cancelled = true
+    }
+  }, [content, runId])
+
+  return (
+    <Box
+      ref={rootRef}
+      sx={{
+        color: d3roPalette.text.primary,
+        fontSize: 14,
+        lineHeight: 1.6,
+        '& h1, & h2, & h3, & h4': {
+          color: d3roPalette.text.primary,
+          fontWeight: 700,
+          marginTop: '1.2em',
+          marginBottom: '0.4em'
+        },
+        '& h1': { fontSize: '1.6em' },
+        '& h2': { fontSize: '1.35em' },
+        '& h3': { fontSize: '1.15em' },
+        '& p': { margin: '0.6em 0', color: d3roPalette.text.primary },
+        '& ul, & ol': { paddingLeft: '1.4em', margin: '0.6em 0' },
+        '& li': { margin: '0.25em 0' },
+        '& a': { color: d3roPalette.accent.amber, textDecoration: 'underline' },
+        '& code': {
+          bgcolor: d3roPalette.bg.inset,
+          px: 0.5,
+          py: 0.25,
+          borderRadius: 0.5,
+          fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace',
+          fontSize: '0.9em'
+        },
+        '& pre': {
+          bgcolor: d3roPalette.bg.inset,
+          border: `1px solid ${d3roPalette.border.subtle}`,
+          borderRadius: 1,
+          padding: 1.5,
+          overflowX: 'auto',
+          fontSize: '0.9em'
+        },
+        '& pre code': { bgcolor: 'transparent', padding: 0 },
+        '& blockquote': {
+          borderLeft: `3px solid ${d3roPalette.accent.amber}`,
+          margin: '0.8em 0',
+          paddingLeft: '1em',
+          color: d3roPalette.text.secondary
+        },
+        '& table': {
+          borderCollapse: 'collapse',
+          width: '100%',
+          margin: '0.8em 0'
+        },
+        '& th, & td': {
+          border: `1px solid ${d3roPalette.border.default}`,
+          padding: '6px 10px',
+          textAlign: 'left'
+        },
+        '& th': { bgcolor: d3roPalette.bg.inset, fontWeight: 700 },
+        '& hr': { border: 'none', borderTop: `1px solid ${d3roPalette.border.default}`, margin: '1.2em 0' },
+        '& .d3ro-mermaid-source': {
+          fontFamily: 'ui-monospace, Menlo, Consolas, monospace',
+          fontSize: '0.85em',
+          whiteSpace: 'pre',
+          color: d3roPalette.text.secondary,
+          bgcolor: d3roPalette.bg.inset,
+          border: `1px dashed ${d3roPalette.border.default}`,
+          borderRadius: 1,
+          padding: 1,
+          overflowX: 'auto'
+        },
+        '& .d3ro-mermaid-rendered': {
+          display: 'flex',
+          justifyContent: 'center',
+          padding: 1,
+          bgcolor: d3roPalette.bg.inset,
+          borderRadius: 1,
+          border: `1px solid ${d3roPalette.border.subtle}`,
+          '& svg': { maxWidth: '100%', height: 'auto' }
+        }
+      }}
+    >
+      <ReactMarkdown
+        remarkPlugins={[remarkGfm]}
+        components={{
+          code(props) {
+            const { className, children, ...rest } = props
+            const lang = /language-(\w+)/.exec(className ?? '')?.[1]
+            if (lang === 'mermaid') {
+              const source = String(children).replace(/\n$/, '')
+              // pre > div 대신 div 하나로 렌더하면 react-markdown이 span으로 감쌀 수 있음.
+              // 여기서는 div.d3ro-mermaid-source를 반환하고 useEffect에서 replace.
+              return <div className="d3ro-mermaid-source">{source}</div>
+            }
+            return (
+              <code className={className} {...rest}>
+                {children}
+              </code>
+            )
+          }
+        }}
+      >
+        {content}
+      </ReactMarkdown>
+    </Box>
+  )
+}
diff --git a/apps/web/src/components/meetings/meeting-audio-player.tsx b/apps/web/src/components/meetings/meeting-audio-player.tsx
new file mode 100644
index 0000000..edc8b76
--- /dev/null
+++ b/apps/web/src/components/meetings/meeting-audio-player.tsx
@@ -0,0 +1,103 @@
+'use client'
+
+// apps/web/src/components/meetings/meeting-audio-player.tsx
+// 회의 오디오 재생 — storage key → signed URL → <audio> 엘리먼트
+
+import { useEffect, useState } from 'react'
+import { Alert, Box, CircularProgress } from '@mui/material'
+import { d3roPalette, typoSx } from '@d3ro/ui/theme'
+import { getSupabaseBrowserClient } from '@/lib/supabase-browser'
+
+interface MeetingAudioPlayerProps {
+  storageKey: string | null
+}
+
+const SIGNED_URL_TTL_SECONDS = 3600
+
+export function MeetingAudioPlayer({ storageKey }: MeetingAudioPlayerProps): React.ReactElement {
+  const [signedUrl, setSignedUrl] = useState<string | null>(null)
+  const [error, setError] = useState<string | null>(null)
+  const [loading, setLoading] = useState<boolean>(false)
+
+  useEffect(() => {
+    if (!storageKey) {
+      setSignedUrl(null)
+      setError(null)
+      setLoading(false)
+      return
+    }
+
+    let cancelled = false
+    setLoading(true)
+    setError(null)
+
+    const supabase = getSupabaseBrowserClient()
+    supabase.storage
+      .from('audio')
+      .createSignedUrl(storageKey, SIGNED_URL_TTL_SECONDS)
+      .then(({ data, error: signErr }) => {
+        if (cancelled) return
+        if (signErr || !data?.signedUrl) {
+          setError(signErr?.message ?? 'Failed to create signed URL')
+          setSignedUrl(null)
+          return
+        }
+        setSignedUrl(data.signedUrl)
+      })
+      .catch((err: unknown) => {
+        if (cancelled) return
+        setError(err instanceof Error ? err.message : String(err))
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false)
+      })
+
+    return () => {
+      cancelled = true
+    }
+  }, [storageKey])
+
+  if (!storageKey) {
+    return (
+      <Box sx={{ ...typoSx('body'), color: d3roPalette.text.muted, fontSize: 13 }}>
+        오디오 파일이 저장되지 않았습니다.
+      </Box>
+    )
+  }
+
+  if (loading) {
+    return (
+      <Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
+        <CircularProgress size={16} />
+        <Box sx={{ color: d3roPalette.text.muted, fontSize: 13 }}>오디오 URL 준비 중...</Box>
+      </Box>
+    )
+  }
+
+  if (error) {
+    return (
+      <Alert severity="error" variant="outlined">
+        {error}
+      </Alert>
+    )
+  }
+
+  if (!signedUrl) return <></>
+
+  return (
+    <Box sx={{ width: '100%' }}>
+      <Box
+        component="audio"
+        controls
+        preload="metadata"
+        sx={{
+          width: '100%',
+          '&::-webkit-media-controls-panel': {
+            backgroundColor: d3roPalette.bg.inset
+          }
+        }}
+        src={signedUrl}
+      />
+    </Box>
+  )
+}
diff --git a/apps/web/src/components/providers/theme-mode-context.tsx b/apps/web/src/components/providers/theme-mode-context.tsx
new file mode 100644
index 0000000..9e2cd18
--- /dev/null
+++ b/apps/web/src/components/providers/theme-mode-context.tsx
@@ -0,0 +1,101 @@
+'use client'
+
+// apps/web/src/components/providers/theme-mode-context.tsx
+// 웹 테마 모드(dark/light/nord/...) 전역 상태.
+// localStorage 영속 + 시스템 prefers-color-scheme 기본값.
+
+import { createContext, useCallback, useContext, useEffect, useState } from 'react'
+import type { ThemeMode } from '@d3ro/core/types'
+
+const STORAGE_KEY = 'd3ro.voice.theme-mode'
+const DEFAULT_MODE: ThemeMode = 'dark'
+
+export const AVAILABLE_MODES: readonly ThemeMode[] = [
+  'dark',
+  'light',
+  'nord',
+  'solarized',
+  'catppuccin',
+  'dracula',
+  'auto'
+] as const
+
+interface ThemeModeContextValue {
+  mode: ThemeMode
+  effectiveMode: Exclude<ThemeMode, 'auto'>
+  setMode: (next: ThemeMode) => void
+  prefersDark: boolean
+}
+
+const ThemeModeContext = createContext<ThemeModeContextValue>({
+  mode: DEFAULT_MODE,
+  effectiveMode: 'dark',
+  setMode: () => undefined,
+  prefersDark: true
+})
+
+function loadStoredMode(): ThemeMode {
+  if (typeof window === 'undefined') return DEFAULT_MODE
+  try {
+    const raw = window.localStorage.getItem(STORAGE_KEY)
+    if (raw && (AVAILABLE_MODES as readonly string[]).includes(raw)) {
+      return raw as ThemeMode
+    }
+  } catch {
+    // storage blocked
+  }
+  return DEFAULT_MODE
+}
+
+export function ThemeModeProvider({ children }: { children: React.ReactNode }): React.ReactElement {
+  const [mode, setModeState] = useState<ThemeMode>(DEFAULT_MODE)
+  const [prefersDark, setPrefersDark] = useState<boolean>(true)
+  const [hydrated, setHydrated] = useState<boolean>(false)
+
+  // 초기 로드 (CSR only — SSR은 dark 기본)
+  useEffect(() => {
+    setModeState(loadStoredMode())
+    if (typeof window !== 'undefined' && 'matchMedia' in window) {
+      const mq = window.matchMedia('(prefers-color-scheme: dark)')
+      setPrefersDark(mq.matches)
+      const listener = (e: MediaQueryListEvent): void => {
+        setPrefersDark(e.matches)
+      }
+      mq.addEventListener('change', listener)
+      setHydrated(true)
+      return () => {
+        mq.removeEventListener('change', listener)
+      }
+    }
+    setHydrated(true)
+    return undefined
+  }, [])
+
+  const setMode = useCallback((next: ThemeMode): void => {
+    setModeState(next)
+    if (typeof window !== 'undefined') {
+      try {
+        window.localStorage.setItem(STORAGE_KEY, next)
+      } catch {
+        // storage blocked
+      }
+    }
+  }, [])
+
+  const effectiveMode: Exclude<ThemeMode, 'auto'> =
+    mode === 'auto' ? (prefersDark ? 'dark' : 'light') : mode
+
+  // hydration 전에는 SSR과 동일한 dark 기본값 유지 (mismatch 방지)
+  const value: ThemeModeContextValue = {
+    mode: hydrated ? mode : DEFAULT_MODE,
+    effectiveMode: hydrated ? effectiveMode : 'dark',
+    setMode,
+    prefersDark
+  }
+
+  return <ThemeModeContext.Provider value={value}>{children}</ThemeModeContext.Provider>
+}
+
+export function useThemeMode(): ThemeModeContextValue {
+  return useContext(ThemeModeContext)
+}
diff --git a/apps/web/src/components/providers/theme-provider.tsx b/apps/web/src/components/providers/theme-provider.tsx
index 9f859dc..bbdf92d 100644
--- a/apps/web/src/components/providers/theme-provider.tsx
+++ b/apps/web/src/components/providers/theme-provider.tsx
@@ -2,23 +2,32 @@
 
 // apps/web/src/components/providers/theme-provider.tsx
 // MUI ThemeProvider + Emotion cache (Next.js App Router용)
+// ThemeModeProvider로 감싸서 런타임 테마 모드 전환 지원.
 
 import { useMemo } from 'react'
 import { ThemeProvider as MuiThemeProvider, CssBaseline } from '@mui/material'
 import { AppRouterCacheProvider } from '@mui/material-nextjs/v15-appRouter'
 import { getTheme } from '@d3ro/ui/theme'
+import { ThemeModeProvider, useThemeMode } from './theme-mode-context'
 
-export function ThemeProvider({ children }: { children: React.ReactNode }): React.ReactElement {
-  // 웹은 시스템 prefers-color-scheme 대신 사용자 설정 저장소를 나중에 추가.
-  // V2-3 MVP에서는 dark 고정.
-  const theme = useMemo(() => getTheme('dark', true), [])
+function ThemeProviderInner({ children }: { children: React.ReactNode }): React.ReactElement {
+  const { effectiveMode } = useThemeMode()
+  const theme = useMemo(() => getTheme(effectiveMode, true), [effectiveMode])
 
   return (
-    <AppRouterCacheProvider options={{ key: 'd3ro-mui', enableCssLayer: true }}>
-      <MuiThemeProvider theme={theme}>
-        <CssBaseline />
-        {children}
-      </MuiThemeProvider>
+    <MuiThemeProvider theme={theme}>
+      <CssBaseline />
+      {children}
+    </MuiThemeProvider>
+  )
+}
+
+export function ThemeProvider({ children }: { children: React.ReactNode }): React.ReactElement {
+  return (
+    <AppRouterCacheProvider options={{ key: 'mui', enableCssLayer: true }}>
+      <ThemeModeProvider>
+        <ThemeProviderInner>{children}</ThemeProviderInner>
+      </ThemeModeProvider>
     </AppRouterCacheProvider>
   )
 }
diff --git a/memory/project_status.md b/memory/project_status.md
index d0f3871..c5935e2 100644
--- a/memory/project_status.md
+++ b/memory/project_status.md
@@ -120,7 +120,16 @@ V2 5차 고도화 (2026-04-10):
 - [U] ✅ Desktop CloudSyncService Realtime 구독 + web record 오디오 Storage 업로드 + 회의 메모 작성 UI (MemoForm)
 - [V] ✅ 11개 locale에 nav.chat/knowledge/actions 키 추가, ko.json 정리, Sidebar Actions 메뉴
 
-**다음 사이클**: 사용자 환경 실제 연결, 회의 상세 편집 고도화(Rich Markdown preview, mermaid 렌더), RAG에서 검색 결과 → /chat으로 연동, VoiceAction 카탈로그 확대, E2E 테스트 실제 실행 (Playwright install)
+V2 6차 고도화 (2026-04-11):
+- [W] 🐛 fix: AppRouterCacheProvider Emotion key `'d3ro-mui'` → `'mui'` (`d3ro` 안에 숫자 `3` → Emotion 검증 실패로 dev SSR 500)
+- [A] ✅ Dark/Light/Theme 토글 — `theme-mode-context.tsx` (localStorage + prefers-color-scheme), Sidebar에 6종 + auto MUI Select, 12개 locale `theme.*` 키 추가
+- [B] ✅ DocumentEditor Mermaid + Markdown 렌더 — `markdown-preview.tsx` (react-markdown + remark-gfm + lazy mermaid), Edit/Preview Tabs
+- [C] ✅ 회의 오디오 재생 — `meeting-audio-player.tsx` (Storage signed URL 1h TTL → `<audio controls>`), `/meetings/[id]` AUDIO 카드
+- [D] ✅ Dashboard 14일 추이 차트 — recharts LineChart (회의/문서 수 일별 집계), 이번 주 stat 자동 계산
+
+**6차 검증**: web typecheck/dev 200, production build 15 라우트 (`dashboard` 1.6kB→111kB, `meetings/[id]` 4.8kB→55kB by chart/mermaid)
+
+**다음 사이클 후보**: VoiceAction 카탈로그 확대, RAG → /chat 연동, Knowledge 파일 업로드(PDF/docx), Voice Input UI(/actions 마이크), 알림 센터, 팀 대시보드, recharts dynamic import로 dashboard split, Playwright browsers install + E2E 실 실행
 
 ## V1 완료 페이즈
 
diff --git a/package-lock.json b/package-lock.json
index 66fb172..aec576f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -88,9 +88,13 @@
         "@mui/material-nextjs": "^7.0.0",
         "@supabase/ssr": "^0.10.0",
         "@supabase/supabase-js": "^2.103.0",
+        "mermaid": "^11.14.0",
         "next": "^15.0.0",
         "react": "^19.0.0",
-        "react-dom": "^19.0.0"
+        "react-dom": "^19.0.0",
+        "react-markdown": "^10.1.0",
+        "recharts": "^3.8.1",
+        "remark-gfm": "^4.0.1"
       },
       "devDependencies": {
         "@types/node": "^22.13.0",
@@ -98,6 +102,28 @@
         "@types/react-dom": "^19.0.0"
       }
     },
+    "node_modules/@antfu/install-pkg": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-1.1.0.tgz",
+      "integrity": "sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==",
+      "license": "MIT",
+      "dependencies": {
+        "package-manager-detector": "^1.3.0",
+        "tinyexec": "^1.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@antfu/install-pkg/node_modules/tinyexec": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.1.1.tgz",
+      "integrity": "sha512-VKS/ZaQhhkKFMANmAOhhXVoIfBXblQxGX1myCQ2faQrfmobMftXeJPcZGp0gS07ocvGJWDLZGyOZDadDBqYIJg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.29.0",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
@@ -619,6 +645,49 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@braintree/sanitize-url": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/@braintree/sanitize-url/-/sanitize-url-7.1.2.tgz",
+      "integrity": "sha512-jigsZK+sMF/cuiB7sERuo9V7N9jx+dhmHHnQyDSVdpZwVutaBu7WvNYqMDLSgFgfB30n452TP3vjDAvFC973mA==",
+      "license": "MIT"
+    },
+    "node_modules/@chevrotain/cst-dts-gen": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@chevrotain/cst-dts-gen/-/cst-dts-gen-12.0.0.tgz",
+      "integrity": "sha512-fSL4KXjTl7cDgf0B5Rip9Q05BOrYvkJV/RrBTE/bKDN096E4hN/ySpcBK5B24T76dlQ2i32Zc3PAE27jFnFrKg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/gast": "12.0.0",
+        "@chevrotain/types": "12.0.0"
+      }
+    },
+    "node_modules/@chevrotain/gast": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@chevrotain/gast/-/gast-12.0.0.tgz",
+      "integrity": "sha512-1ne/m3XsIT8aEdrvT33so0GUC+wkctpUPK6zU9IlOyJLUbR0rg4G7ZiApiJbggpgPir9ERy3FRjT6T7lpgetnQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/types": "12.0.0"
+      }
+    },
+    "node_modules/@chevrotain/regexp-to-ast": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@chevrotain/regexp-to-ast/-/regexp-to-ast-12.0.0.tgz",
+      "integrity": "sha512-p+EW9MaJwgaHguhoqwOtx/FwuGr+DnNn857sXWOi/mClXIkPGl3rn7hGNWvo31HA3vyeQxjqe+H36yZJwYU8cA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/types": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@chevrotain/types/-/types-12.0.0.tgz",
+      "integrity": "sha512-S+04vjFQKeuYw0/eW3U52LkAHQsB1ASxsPGsLPUyQgrZ2iNNibQrsidruDzjEX2JYfespXMG0eZmXlhA6z7nWA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/utils": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/@chevrotain/utils/-/utils-12.0.0.tgz",
+      "integrity": "sha512-lB59uJoaGIfOOL9knQqQRfhl9g7x8/wqFkp13zTdkRu1huG9kg6IJs1O8hqj9rs6h7orGxHJUKb+mX3rPbWGhA==",
+      "license": "Apache-2.0"
+    },
     "node_modules/@d3ro/api-client": {
       "resolved": "packages/api-client",
       "link": true
@@ -1983,6 +2052,23 @@
       "dev": true,
       "license": "BSD-3-Clause"
     },
+    "node_modules/@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "license": "MIT"
+    },
+    "node_modules/@iconify/utils": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@iconify/utils/-/utils-3.1.0.tgz",
+      "integrity": "sha512-Zlzem1ZXhI1iHeeERabLNzBHdOa4VhQbqAcOQaMKuTuyZCpwKbC2R4Dd0Zo3g9EAc+Y4fiarO8HIHRAth7+skw==",
+      "license": "MIT",
+      "dependencies": {
+        "@antfu/install-pkg": "^1.1.0",
+        "@iconify/types": "^2.0.0",
+        "mlly": "^1.8.0"
+      }
+    },
     "node_modules/@img/colour": {
       "version": "1.1.0",
       "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.1.0.tgz",
@@ -3364,6 +3450,15 @@
         "node": ">= 10.0.0"
       }
     },
+    "node_modules/@mermaid-js/parser": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@mermaid-js/parser/-/parser-1.1.0.tgz",
+      "integrity": "sha512-gxK9ZX2+Fex5zu8LhRQoMeMPEHbc73UKZ0FQ54YrQtUxE1VVhMwzeNtKRPAu5aXks4FasbMe4xB4bWrmq6Jlxw==",
+      "license": "MIT",
+      "dependencies": {
+        "langium": "^4.0.0"
+      }
+    },
     "node_modules/@mui/core-downloads-tracker": {
       "version": "7.3.9",
       "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-7.3.9.tgz",
@@ -4385,6 +4480,42 @@
         }
       }
     },
+    "node_modules/@reduxjs/toolkit": {
+      "version": "2.11.2",
+      "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.11.2.tgz",
+      "integrity": "sha512-Kd6kAHTA6/nUpp8mySPqj3en3dm0tdMIgbttnQ1xFMVpufoj+ADi8pXLBsd4xzTRHQa7t/Jv8W5UnCuW4kuWMQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.0.0",
+        "@standard-schema/utils": "^0.3.0",
+        "immer": "^11.0.0",
+        "redux": "^5.0.1",
+        "redux-thunk": "^3.1.0",
+        "reselect": "^5.1.0"
+      },
+      "peerDependencies": {
+        "react": "^16.9.0 || ^17.0.0 || ^18 || ^19",
+        "react-redux": "^7.2.1 || ^8.1.3 || ^9.0.0"
+      },
+      "peerDependenciesMeta": {
+        "react": {
+          "optional": true
+        },
+        "react-redux": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@reduxjs/toolkit/node_modules/immer": {
+      "version": "11.1.4",
+      "resolved": "https://registry.npmjs.org/immer/-/immer-11.1.4.tgz",
+      "integrity": "sha512-XREFCPo6ksxVzP4E0ekD5aMdf8WMwmdNaz6vuvxgI40UaEiu6q3p8X52aU6GdyvLY3XXX/8R7JOTXStz/nBbRw==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/immer"
+      }
+    },
     "node_modules/@rolldown/pluginutils": {
       "version": "1.0.0-beta.27",
       "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-beta.27.tgz",
@@ -4779,6 +4910,18 @@
         "@sinonjs/commons": "^3.0.0"
       }
     },
+    "node_modules/@standard-schema/spec": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
+      "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
+      "license": "MIT"
+    },
+    "node_modules/@standard-schema/utils": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/utils/-/utils-0.3.0.tgz",
+      "integrity": "sha512-e7Mew686owMaPJVNNLs55PUvgz371nKgwsc4vxE49zsODpJEnxgxRo2y/OKrqueavXgZNMDVj3DdHFlaSAeU8g==",
+      "license": "MIT"
+    },
     "node_modules/@supabase/auth-js": {
       "version": "2.103.0",
       "resolved": "https://registry.npmjs.org/@supabase/auth-js/-/auth-js-2.103.0.tgz",
@@ -4967,6 +5110,259 @@
         "@types/responselike": "^1.0.0"
       }
     },
+    "node_modules/@types/d3": {
+      "version": "7.4.3",
+      "resolved": "https://registry.npmjs.org/@types/d3/-/d3-7.4.3.tgz",
+      "integrity": "sha512-lZXZ9ckh5R8uiFVt8ogUNf+pIrK4EsWrx2Np75WvF/eTpJ0FMHNhjXk8CKEx/+gpHbNQyJWehbFaTvqmHWB3ww==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-array": "*",
+        "@types/d3-axis": "*",
+        "@types/d3-brush": "*",
+        "@types/d3-chord": "*",
+        "@types/d3-color": "*",
+        "@types/d3-contour": "*",
+        "@types/d3-delaunay": "*",
+        "@types/d3-dispatch": "*",
+        "@types/d3-drag": "*",
+        "@types/d3-dsv": "*",
+        "@types/d3-ease": "*",
+        "@types/d3-fetch": "*",
+        "@types/d3-force": "*",
+        "@types/d3-format": "*",
+        "@types/d3-geo": "*",
+        "@types/d3-hierarchy": "*",
+        "@types/d3-interpolate": "*",
+        "@types/d3-path": "*",
+        "@types/d3-polygon": "*",
+        "@types/d3-quadtree": "*",
+        "@types/d3-random": "*",
+        "@types/d3-scale": "*",
+        "@types/d3-scale-chromatic": "*",
+        "@types/d3-selection": "*",
+        "@types/d3-shape": "*",
+        "@types/d3-time": "*",
+        "@types/d3-time-format": "*",
+        "@types/d3-timer": "*",
+        "@types/d3-transition": "*",
+        "@types/d3-zoom": "*"
+      }
+    },
+    "node_modules/@types/d3-array": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.2.tgz",
+      "integrity": "sha512-hOLWVbm7uRza0BYXpIIW5pxfrKe0W+D5lrFiAEYR+pb6w3N2SwSMaJbXdUfSEv+dT4MfHBLtn5js0LAWaO6otw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-axis": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-axis/-/d3-axis-3.0.6.tgz",
+      "integrity": "sha512-pYeijfZuBd87T0hGn0FO1vQ/cgLk6E1ALJjfkC0oJ8cbwkZl3TpgS8bVBLZN+2jjGgg38epgxb2zmoGtSfvgMw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-brush": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-brush/-/d3-brush-3.0.6.tgz",
+      "integrity": "sha512-nH60IZNNxEcrh6L1ZSMNA28rj27ut/2ZmI3r96Zd+1jrZD++zD3LsMIjWlvg4AYrHn/Pqz4CF3veCxGjtbqt7A==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-chord": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-chord/-/d3-chord-3.0.6.tgz",
+      "integrity": "sha512-LFYWWd8nwfwEmTZG9PfQxd17HbNPksHBiJHaKuY1XeqscXacsS2tyoo6OdRsjf+NQYeB6XrNL3a25E3gH69lcg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-color": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
+      "integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-contour": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-contour/-/d3-contour-3.0.6.tgz",
+      "integrity": "sha512-BjzLgXGnCWjUSYGfH1cpdo41/hgdWETu4YxpezoztawmqsvCeep+8QGfiY6YbDvfgHz/DkjeIkkZVJavB4a3rg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-array": "*",
+        "@types/geojson": "*"
+      }
+    },
+    "node_modules/@types/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-ZMaSKu4THYCU6sV64Lhg6qjf1orxBthaC161plr5KuPHo3CNm8DTHiLw/5Eq2b6TsNP0W0iJrUOFscY6Q450Hw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-dispatch": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-dispatch/-/d3-dispatch-3.0.7.tgz",
+      "integrity": "sha512-5o9OIAdKkhN1QItV2oqaE5KMIiXAvDWBDPrD85e58Qlz1c1kI/J0NcqbEG88CoTwJrYe7ntUCVfeUl2UJKbWgA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-drag": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-drag/-/d3-drag-3.0.7.tgz",
+      "integrity": "sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-dsv": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-dsv/-/d3-dsv-3.0.7.tgz",
+      "integrity": "sha512-n6QBF9/+XASqcKK6waudgL0pf/S5XHPPI8APyMLLUHd8NqouBGLsU8MgtO7NINGtPBtk9Kko/W4ea0oAspwh9g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-ease": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-ease/-/d3-ease-3.0.2.tgz",
+      "integrity": "sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-fetch": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-fetch/-/d3-fetch-3.0.7.tgz",
+      "integrity": "sha512-fTAfNmxSb9SOWNB9IoG5c8Hg6R+AzUHDRlsXsDZsNp6sxAEOP0tkP3gKkNSO/qmHPoBFTxNrjDprVHDQDvo5aA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-dsv": "*"
+      }
+    },
+    "node_modules/@types/d3-force": {
+      "version": "3.0.10",
+      "resolved": "https://registry.npmjs.org/@types/d3-force/-/d3-force-3.0.10.tgz",
+      "integrity": "sha512-ZYeSaCF3p73RdOKcjj+swRlZfnYpK1EbaDiYICEEp5Q6sUiqFaFQ9qgoshp5CzIyyb/yD09kD9o2zEltCexlgw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-format": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-format/-/d3-format-3.0.4.tgz",
+      "integrity": "sha512-fALi2aI6shfg7vM5KiR1wNJnZ7r6UuggVqtDA+xiEdPZQwy/trcQaHnwShLuLdta2rTymCNpxYTiMZX/e09F4g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-geo": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@types/d3-geo/-/d3-geo-3.1.0.tgz",
+      "integrity": "sha512-856sckF0oP/diXtS4jNsiQw/UuK5fQG8l/a9VVLeSouf1/PPbBE1i1W852zVwKwYCBkFJJB7nCFTbk6UMEXBOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/geojson": "*"
+      }
+    },
+    "node_modules/@types/d3-hierarchy": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-hierarchy/-/d3-hierarchy-3.1.7.tgz",
+      "integrity": "sha512-tJFtNoYBtRtkNysX1Xq4sxtjK8YgoWUNpIiUee0/jHGRwqvzYxkq0hGVbbOGSz+JgFxxRu4K8nb3YpG3CMARtg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-interpolate": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
+      "integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-color": "*"
+      }
+    },
+    "node_modules/@types/d3-path": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-3.1.1.tgz",
+      "integrity": "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-polygon": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-polygon/-/d3-polygon-3.0.2.tgz",
+      "integrity": "sha512-ZuWOtMaHCkN9xoeEMr1ubW2nGWsp4nIql+OPQRstu4ypeZ+zk3YKqQT0CXVe/PYqrKpZAi+J9mTs05TKwjXSRA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-quadtree": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-quadtree/-/d3-quadtree-3.0.6.tgz",
+      "integrity": "sha512-oUzyO1/Zm6rsxKRHA1vH0NEDG58HrT5icx/azi9MF1TWdtttWl0UIUsjEQBBh+SIkrpd21ZjEv7ptxWys1ncsg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-random": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-random/-/d3-random-3.0.3.tgz",
+      "integrity": "sha512-Imagg1vJ3y76Y2ea0871wpabqp613+8/r0mCLEBfdtqC7xMSfj9idOnmBYyMoULfHePJyxMAw3nWhJxzc+LFwQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-scale": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-4.0.9.tgz",
+      "integrity": "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-time": "*"
+      }
+    },
+    "node_modules/@types/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-selection": {
+      "version": "3.0.11",
+      "resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-3.0.11.tgz",
+      "integrity": "sha512-bhAXu23DJWsrI45xafYpkQ4NtcKMwWnAC/vKrd2l+nxMFuvOT3XMYTIj2opv8vq8AO5Yh7Qac/nSeP/3zjTK0w==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-shape": {
+      "version": "3.1.8",
+      "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-3.1.8.tgz",
+      "integrity": "sha512-lae0iWfcDeR7qt7rA88BNiqdvPS5pFVPpo5OfjElwNaT2yyekbM0C9vK+yqBqEmHr6lDkRnYNoTBYlAgJa7a4w==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-path": "*"
+      }
+    },
+    "node_modules/@types/d3-time": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-3.0.4.tgz",
+      "integrity": "sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-time-format": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-4.0.3.tgz",
+      "integrity": "sha512-5xg9rC+wWL8kdDj153qZcsJ0FWiFt0J5RB6LYUNZjwSnesfblqrI/bJ1wBdJ8OQfncgbJG5+2F+qfqnqyzYxyg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-timer": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-timer/-/d3-timer-3.0.2.tgz",
+      "integrity": "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-transition": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-transition/-/d3-transition-3.0.9.tgz",
+      "integrity": "sha512-uZS5shfxzO3rGlu0cC3bjmMFKsXv+SmZZcgp0KD22ts4uGXp5EVYGzu/0YdwZeKmddhcAccYtREJKkPfXkZuCg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-zoom": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@types/d3-zoom/-/d3-zoom-3.0.8.tgz",
+      "integrity": "sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-interpolate": "*",
+        "@types/d3-selection": "*"
+      }
+    },
     "node_modules/@types/debug": {
       "version": "4.1.13",
       "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.13.tgz",
@@ -5011,6 +5407,12 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@types/geojson": {
+      "version": "7946.0.16",
+      "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.16.tgz",
+      "integrity": "sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==",
+      "license": "MIT"
+    },
     "node_modules/@types/graceful-fs": {
       "version": "4.1.9",
       "resolved": "https://registry.npmjs.org/@types/graceful-fs/-/graceful-fs-4.1.9.tgz",
@@ -5164,12 +5566,25 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/@types/trusted-types": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/@types/trusted-types/-/trusted-types-2.0.7.tgz",
+      "integrity": "sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==",
+      "license": "MIT",
+      "optional": true
+    },
     "node_modules/@types/unist": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.3.tgz",
       "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==",
       "license": "MIT"
     },
+    "node_modules/@types/use-sync-external-store": {
+      "version": "0.0.6",
+      "resolved": "https://registry.npmjs.org/@types/use-sync-external-store/-/use-sync-external-store-0.0.6.tgz",
+      "integrity": "sha512-zFDAD+tlpf2r4asuHEj0XH6pY6i0g5NeAHPn+15wk3BV6JA69eERFXC1gyGThDkVa1zCyKr5jox1+2LbV/AMLg==",
+      "license": "MIT"
+    },
     "node_modules/@types/verror": {
       "version": "1.10.11",
       "resolved": "https://registry.npmjs.org/@types/verror/-/verror-1.10.11.tgz",
@@ -5453,6 +5868,16 @@
       "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
       "license": "ISC"
     },
+    "node_modules/@upsetjs/venn.js": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@upsetjs/venn.js/-/venn.js-2.0.0.tgz",
+      "integrity": "sha512-WbBhLrooyePuQ1VZxrJjtLvTc4NVfpOyKx0sKqioq9bX1C1m7Jgykkn8gLrtwumBioXIqam8DLxp88Adbue6Hw==",
+      "license": "MIT",
+      "optionalDependencies": {
+        "d3-selection": "^3.0.0",
+        "d3-transition": "^3.0.1"
+      }
+    },
     "node_modules/@vitejs/plugin-react": {
       "version": "4.7.0",
       "resolved": "https://registry.npmjs.org/@vitejs/plugin-react/-/plugin-react-4.7.0.tgz",
@@ -6847,6 +7272,34 @@
         "node": ">= 16"
       }
     },
+    "node_modules/chevrotain": {
+      "version": "12.0.0",
+      "resolved": "https://registry.npmjs.org/chevrotain/-/chevrotain-12.0.0.tgz",
+      "integrity": "sha512-csJvb+6kEiQaqo1woTdSAuOWdN0WTLIydkKrBnS+V5gZz0oqBrp4kQ35519QgK6TpBThiG3V1vNSHlIkv4AglQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/cst-dts-gen": "12.0.0",
+        "@chevrotain/gast": "12.0.0",
+        "@chevrotain/regexp-to-ast": "12.0.0",
+        "@chevrotain/types": "12.0.0",
+        "@chevrotain/utils": "12.0.0"
+      },
+      "engines": {
+        "node": ">=22.0.0"
+      }
+    },
+    "node_modules/chevrotain-allstar": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/chevrotain-allstar/-/chevrotain-allstar-0.4.1.tgz",
+      "integrity": "sha512-PvVJm3oGqrveUVW2Vt/eZGeiAIsJszYweUcYwcskg9e+IubNYKKD+rHHem7A6XVO22eDAL+inxNIGAzZ/VIWlA==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash-es": "^4.17.21"
+      },
+      "peerDependencies": {
+        "chevrotain": "^12.0.0"
+      }
+    },
     "node_modules/chownr": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/chownr/-/chownr-3.0.0.tgz",
@@ -7160,6 +7613,12 @@
       "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
       "license": "MIT"
     },
+    "node_modules/confbox": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz",
+      "integrity": "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==",
+      "license": "MIT"
+    },
     "node_modules/connect": {
       "version": "3.7.0",
       "resolved": "https://registry.npmjs.org/connect/-/connect-3.7.0.tgz",
@@ -7218,6 +7677,15 @@
       "integrity": "sha512-ZQBvi1DcpJ4GDqanjucZ2Hj3wEO5pZDS89BWbkcrvdxksJorwUDDZamX9ldFkp9aw2lmBDLgkObEA4DWNJ9FYQ==",
       "license": "MIT"
     },
+    "node_modules/cose-base": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/cose-base/-/cose-base-1.0.3.tgz",
+      "integrity": "sha512-s9whTXInMSgAp/NVXVNuVxVKzGH2qck3aQlVHxDCdAEPgtMKwc4Wq6/QKhgdEdgbLSi9rBTAcPoRa6JpiG4ksg==",
+      "license": "MIT",
+      "dependencies": {
+        "layout-base": "^1.0.0"
+      }
+    },
     "node_modules/cosmiconfig": {
       "version": "7.1.0",
       "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-7.1.0.tgz",
@@ -7274,6 +7742,520 @@
       "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==",
       "license": "MIT"
     },
+    "node_modules/cytoscape": {
+      "version": "3.33.2",
+      "resolved": "https://registry.npmjs.org/cytoscape/-/cytoscape-3.33.2.tgz",
+      "integrity": "sha512-sj4HXd3DokGhzZAdjDejGvTPLqlt84vNFN8m7bGsOzDY5DyVcxIb2ejIXat2Iy7HxWhdT/N1oKyheJ5YdpsGuw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/cytoscape-cose-bilkent": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cytoscape-cose-bilkent/-/cytoscape-cose-bilkent-4.1.0.tgz",
+      "integrity": "sha512-wgQlVIUJF13Quxiv5e1gstZ08rnZj2XaLHGoFMYXz7SkNfCDOOteKBE6SYRfA9WxxI/iBc3ajfDoc6hb/MRAHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "cose-base": "^1.0.0"
+      },
+      "peerDependencies": {
+        "cytoscape": "^3.2.0"
+      }
+    },
+    "node_modules/cytoscape-fcose": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cytoscape-fcose/-/cytoscape-fcose-2.2.0.tgz",
+      "integrity": "sha512-ki1/VuRIHFCzxWNrsshHYPs6L7TvLu3DL+TyIGEsRcvVERmxokbf5Gdk7mFxZnTdiGtnA4cfSmjZJMviqSuZrQ==",
+      "license": "MIT",
+      "dependencies": {
+        "cose-base": "^2.2.0"
+      },
+      "peerDependencies": {
+        "cytoscape": "^3.2.0"
+      }
+    },
+    "node_modules/cytoscape-fcose/node_modules/cose-base": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cose-base/-/cose-base-2.2.0.tgz",
+      "integrity": "sha512-AzlgcsCbUMymkADOJtQm3wO9S3ltPfYOFD5033keQn9NJzIbtnZj+UdBJe7DYml/8TdbtHJW3j58SOnKhWY/5g==",
+      "license": "MIT",
+      "dependencies": {
+        "layout-base": "^2.0.0"
+      }
+    },
+    "node_modules/cytoscape-fcose/node_modules/layout-base": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/layout-base/-/layout-base-2.0.1.tgz",
+      "integrity": "sha512-dp3s92+uNI1hWIpPGH3jK2kxE2lMjdXdr+DH8ynZHpd6PUlH6x6cbuXnoMmiNumznqaNO31xu9e79F0uuZ0JFg==",
+      "license": "MIT"
+    },
+    "node_modules/d3": {
+      "version": "7.9.0",
+      "resolved": "https://registry.npmjs.org/d3/-/d3-7.9.0.tgz",
+      "integrity": "sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "3",
+        "d3-axis": "3",
+        "d3-brush": "3",
+        "d3-chord": "3",
+        "d3-color": "3",
+        "d3-contour": "4",
+        "d3-delaunay": "6",
+        "d3-dispatch": "3",
+        "d3-drag": "3",
+        "d3-dsv": "3",
+        "d3-ease": "3",
+        "d3-fetch": "3",
+        "d3-force": "3",
+        "d3-format": "3",
+        "d3-geo": "3",
+        "d3-hierarchy": "3",
+        "d3-interpolate": "3",
+        "d3-path": "3",
+        "d3-polygon": "3",
+        "d3-quadtree": "3",
+        "d3-random": "3",
+        "d3-scale": "4",
+        "d3-scale-chromatic": "3",
+        "d3-selection": "3",
+        "d3-shape": "3",
+        "d3-time": "3",
+        "d3-time-format": "4",
+        "d3-timer": "3",
+        "d3-transition": "3",
+        "d3-zoom": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-array": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz",
+      "integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==",
+      "license": "ISC",
+      "dependencies": {
+        "internmap": "1 - 2"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-axis": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-3.0.0.tgz",
+      "integrity": "sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-brush": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-brush/-/d3-brush-3.0.0.tgz",
+      "integrity": "sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-drag": "2 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-selection": "3",
+        "d3-transition": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-chord": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-chord/-/d3-chord-3.0.1.tgz",
+      "integrity": "sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-color": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
+      "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-contour": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-contour/-/d3-contour-4.0.2.tgz",
+      "integrity": "sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "^3.2.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==",
+      "license": "ISC",
+      "dependencies": {
+        "delaunator": "5"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dispatch": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz",
+      "integrity": "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-drag": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz",
+      "integrity": "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-selection": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dsv": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-dsv/-/d3-dsv-3.0.1.tgz",
+      "integrity": "sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==",
+      "license": "ISC",
+      "dependencies": {
+        "commander": "7",
+        "iconv-lite": "0.6",
+        "rw": "1"
+      },
+      "bin": {
+        "csv2json": "bin/dsv2json.js",
+        "csv2tsv": "bin/dsv2dsv.js",
+        "dsv2dsv": "bin/dsv2dsv.js",
+        "dsv2json": "bin/dsv2json.js",
+        "json2csv": "bin/json2dsv.js",
+        "json2dsv": "bin/json2dsv.js",
+        "json2tsv": "bin/json2dsv.js",
+        "tsv2csv": "bin/dsv2dsv.js",
+        "tsv2json": "bin/dsv2json.js"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dsv/node_modules/commander": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
+      "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/d3-ease": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
+      "integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-fetch": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-fetch/-/d3-fetch-3.0.1.tgz",
+      "integrity": "sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dsv": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-force": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-3.0.0.tgz",
+      "integrity": "sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-quadtree": "1 - 3",
+        "d3-timer": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-format": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.2.tgz",
+      "integrity": "sha512-AJDdYOdnyRDV5b6ArilzCPPwc1ejkHcoyFarqlPqT7zRYjhavcT3uSrqcMvsgh2CgoPbK3RCwyHaVyxYcP2Arg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-geo": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-3.1.1.tgz",
+      "integrity": "sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.5.0 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-hierarchy": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-3.1.2.tgz",
+      "integrity": "sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-interpolate": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
+      "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-path": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz",
+      "integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-polygon": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-polygon/-/d3-polygon-3.0.1.tgz",
+      "integrity": "sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-quadtree": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-3.0.1.tgz",
+      "integrity": "sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-random": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-random/-/d3-random-3.0.1.tgz",
+      "integrity": "sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-sankey": {
+      "version": "0.12.3",
+      "resolved": "https://registry.npmjs.org/d3-sankey/-/d3-sankey-0.12.3.tgz",
+      "integrity": "sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-array": "1 - 2",
+        "d3-shape": "^1.2.0"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/d3-array": {
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.12.1.tgz",
+      "integrity": "sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "internmap": "^1.0.0"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/d3-path": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
+      "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-sankey/node_modules/d3-shape": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
+      "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-path": "1"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/internmap": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.1.tgz",
+      "integrity": "sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==",
+      "license": "ISC"
+    },
+    "node_modules/d3-scale": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz",
+      "integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.10.0 - 3",
+        "d3-format": "1 - 3",
+        "d3-interpolate": "1.2.0 - 3",
+        "d3-time": "2.1.1 - 3",
+        "d3-time-format": "2 - 4"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-interpolate": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-selection": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
+      "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-shape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz",
+      "integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz",
+      "integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time-format": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-4.1.0.tgz",
+      "integrity": "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-time": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-timer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
+      "integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-transition": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz",
+      "integrity": "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-dispatch": "1 - 3",
+        "d3-ease": "1 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-timer": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "peerDependencies": {
+        "d3-selection": "2 - 3"
+      }
+    },
+    "node_modules/d3-zoom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz",
+      "integrity": "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-drag": "2 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-selection": "2 - 3",
+        "d3-transition": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/dagre-d3-es": {
+      "version": "7.0.14",
+      "resolved": "https://registry.npmjs.org/dagre-d3-es/-/dagre-d3-es-7.0.14.tgz",
+      "integrity": "sha512-P4rFMVq9ESWqmOgK+dlXvOtLwYg0i7u0HBGJER0LZDJT2VHIPAMZ/riPxqJceWMStH5+E61QxFra9kIS3AqdMg==",
+      "license": "MIT",
+      "dependencies": {
+        "d3": "^7.9.0",
+        "lodash-es": "^4.17.21"
+      }
+    },
+    "node_modules/dayjs": {
+      "version": "1.11.20",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.20.tgz",
+      "integrity": "sha512-YbwwqR/uYpeoP4pu043q+LTDLFBLApUP6VxRihdfNTqu4ubqMlGDLd6ErXhEgsyvY0K6nCs7nggYumAN+9uEuQ==",
+      "license": "MIT"
+    },
     "node_modules/debounce-fn": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/debounce-fn/-/debounce-fn-6.0.0.tgz",
@@ -7306,6 +8288,12 @@
         }
       }
     },
+    "node_modules/decimal.js-light": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/decimal.js-light/-/decimal.js-light-2.5.1.tgz",
+      "integrity": "sha512-qIMFpTMZmny+MMIitAB6D7iVPEorVw6YQRWkvarTkT4tBeSLLiHzcwj6q0MmYSFCiVpiqPJTJEYIrpcPzVEIvg==",
+      "license": "MIT"
+    },
     "node_modules/decode-named-character-reference": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.3.0.tgz",
@@ -7430,6 +8418,15 @@
         "url": "https://github.com/sponsors/ljharb"
       }
     },
+    "node_modules/delaunator": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.1.0.tgz",
+      "integrity": "sha512-AGrQ4QSgssa1NGmWmLPqN5NY2KajF5MqxetNEO+o0n3ZwZZeTmt7bBnvzHWrmkZFxGgr4HdyFgelzgi06otLuQ==",
+      "license": "ISC",
+      "dependencies": {
+        "robust-predicates": "^3.0.2"
+      }
+    },
     "node_modules/delayed-stream": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -7683,6 +8680,15 @@
       "resolved": "https://registry.npmjs.org/dom-walk/-/dom-walk-0.1.2.tgz",
       "integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
     },
+    "node_modules/dompurify": {
+      "version": "3.3.3",
+      "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.3.3.tgz",
+      "integrity": "sha512-Oj6pzI2+RqBfFG+qOaOLbFXLQ90ARpcGG6UePL82bJLtdsa6CYJD7nmiU8MW9nQNOtCHV3lZ/Bzq1X0QYbBZCA==",
+      "license": "(MPL-2.0 OR Apache-2.0)",
+      "optionalDependencies": {
+        "@types/trusted-types": "^2.0.7"
+      }
+    },
     "node_modules/dot-prop": {
       "version": "9.0.0",
       "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-9.0.0.tgz",
@@ -8314,6 +9320,16 @@
         "node": ">= 0.4"
       }
     },
+    "node_modules/es-toolkit": {
+      "version": "1.45.1",
+      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.45.1.tgz",
+      "integrity": "sha512-/jhoOj/Fx+A+IIyDNOvO3TItGmlMKhtX8ISAHKE90c4b/k1tqaqEZ+uUqfpU8DMnW5cgNJv606zS55jGvza0Xw==",
+      "license": "MIT",
+      "workspaces": [
+        "docs",
+        "benchmarks"
+      ]
+    },
     "node_modules/es6-error": {
       "version": "4.1.1",
       "resolved": "https://registry.npmjs.org/es6-error/-/es6-error-4.1.1.tgz",
@@ -8646,6 +9662,12 @@
         "node": ">=6"
       }
     },
+    "node_modules/eventemitter3": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz",
+      "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==",
+      "license": "MIT"
+    },
     "node_modules/events": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/events/-/events-3.3.0.tgz",
@@ -9527,6 +10549,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/hachure-fill": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/hachure-fill/-/hachure-fill-0.5.2.tgz",
+      "integrity": "sha512-3GKBOn+m2LX9iq+JC1064cSFprJY4jL1jCXTcpnfER5HYE2l/4EfWSGzkPa/ZDBmYI0ZOEj5VHV/eKnPGkHuOg==",
+      "license": "MIT"
+    },
     "node_modules/has-flag": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -9838,7 +10866,6 @@
       "version": "0.6.3",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
       "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
-      "devOptional": true,
       "license": "MIT",
       "dependencies": {
         "safer-buffer": ">= 2.1.2 < 3.0.0"
@@ -9914,6 +10941,16 @@
       "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
       "license": "MIT"
     },
+    "node_modules/immer": {
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/immer/-/immer-10.2.0.tgz",
+      "integrity": "sha512-d/+XTN3zfODyjr89gM3mPq1WNX2B8pYsu7eORitdwyA2sBubnTl3laYlBk4sXY5FUa5qTZGBDPJICVbvqzjlbw==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/immer"
+      }
+    },
     "node_modules/import-fresh": {
       "version": "3.3.1",
       "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
@@ -9968,6 +11005,15 @@
       "integrity": "sha512-Nb2ctOyNR8DqQoR0OwRG95uNWIC0C1lCgf5Naz5H6Ji72KZ8OcFZLz2P5sNgwlyoJ8Yif11oMuYs5pBQa86csA==",
       "license": "MIT"
     },
+    "node_modules/internmap": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
+      "integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/invariant": {
       "version": "2.2.4",
       "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz",
@@ -10643,6 +11689,31 @@
         "setimmediate": "^1.0.5"
       }
     },
+    "node_modules/katex": {
+      "version": "0.16.45",
+      "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.45.tgz",
+      "integrity": "sha512-pQpZbdBu7wCTmQUh7ufPmLr0pFoObnGUoL/yhtwJDgmmQpbkg/0HSVti25Fu4rmd1oCR6NGWe9vqTWuWv3GcNA==",
+      "funding": [
+        "https://opencollective.com/katex",
+        "https://github.com/sponsors/katex"
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^8.3.0"
+      },
+      "bin": {
+        "katex": "cli.js"
+      }
+    },
+    "node_modules/katex/node_modules/commander": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
+      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/keyv": {
       "version": "4.5.4",
       "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
@@ -10652,6 +11723,35 @@
         "json-buffer": "3.0.1"
       }
     },
+    "node_modules/khroma": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/khroma/-/khroma-2.1.0.tgz",
+      "integrity": "sha512-Ls993zuzfayK269Svk9hzpeGUKob/sIgZzyHYdjQoAdQetRKpOLj+k/QQQ/6Qi0Yz65mlROrfd+Ev+1+7dz9Kw=="
+    },
+    "node_modules/langium": {
+      "version": "4.2.2",
+      "resolved": "https://registry.npmjs.org/langium/-/langium-4.2.2.tgz",
+      "integrity": "sha512-JUshTRAfHI4/MF9dH2WupvjSXyn8JBuUEWazB8ZVJUtXutT0doDlAv1XKbZ1Pb5sMexa8FF4CFBc0iiul7gbUQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@chevrotain/regexp-to-ast": "~12.0.0",
+        "chevrotain": "~12.0.0",
+        "chevrotain-allstar": "~0.4.1",
+        "vscode-languageserver": "~9.0.1",
+        "vscode-languageserver-textdocument": "~1.0.11",
+        "vscode-uri": "~3.1.0"
+      },
+      "engines": {
+        "node": ">=20.10.0",
+        "npm": ">=10.2.3"
+      }
+    },
+    "node_modules/layout-base": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/layout-base/-/layout-base-1.0.2.tgz",
+      "integrity": "sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg==",
+      "license": "MIT"
+    },
     "node_modules/lazy-val": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/lazy-val/-/lazy-val-1.0.5.tgz",
@@ -10777,6 +11877,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/lodash-es": {
+      "version": "4.18.1",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.18.1.tgz",
+      "integrity": "sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==",
+      "license": "MIT"
+    },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
       "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
@@ -10908,6 +12014,18 @@
         "url": "https://github.com/sponsors/wooorm"
       }
     },
+    "node_modules/marked": {
+      "version": "16.4.2",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-16.4.2.tgz",
+      "integrity": "sha512-TI3V8YYWvkVf3KJe1dRkpnjs68JUPyEa5vjKrp1XEEJUAOaQc+Qj+L1qWbPd0SJuAdQkFU0h73sXXqwDYxsiDA==",
+      "license": "MIT",
+      "bin": {
+        "marked": "bin/marked.js"
+      },
+      "engines": {
+        "node": ">= 20"
+      }
+    },
     "node_modules/marky": {
       "version": "1.3.0",
       "resolved": "https://registry.npmjs.org/marky/-/marky-1.3.0.tgz",
@@ -11234,6 +12352,41 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/mermaid": {
+      "version": "11.14.0",
+      "resolved": "https://registry.npmjs.org/mermaid/-/mermaid-11.14.0.tgz",
+      "integrity": "sha512-GSGloRsBs+JINmmhl0JDwjpuezCsHB4WGI4NASHxL3fHo3o/BRXTxhDLKnln8/Q0lRFRyDdEjmk1/d5Sn1Xz8g==",
+      "license": "MIT",
+      "dependencies": {
+        "@braintree/sanitize-url": "^7.1.1",
+        "@iconify/utils": "^3.0.2",
+        "@mermaid-js/parser": "^1.1.0",
+        "@types/d3": "^7.4.3",
+        "@upsetjs/venn.js": "^2.0.0",
+        "cytoscape": "^3.33.1",
+        "cytoscape-cose-bilkent": "^4.1.0",
+        "cytoscape-fcose": "^2.2.0",
+        "d3": "^7.9.0",
+        "d3-sankey": "^0.12.3",
+        "dagre-d3-es": "7.0.14",
+        "dayjs": "^1.11.19",
+        "dompurify": "^3.3.1",
+        "katex": "^0.16.25",
+        "khroma": "^2.1.0",
+        "lodash-es": "^4.17.23",
+        "marked": "^16.3.0",
+        "roughjs": "^4.6.6",
+        "stylis": "^4.3.6",
+        "ts-dedent": "^2.2.0",
+        "uuid": "^11.1.0"
+      }
+    },
+    "node_modules/mermaid/node_modules/stylis": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.6.tgz",
+      "integrity": "sha512-yQ3rwFWRfwNUY7H5vpU0wfdkNSnvnJinhF9830Swlaxl03zsOjCfmX0ugac+3LtK0lYSgwL/KXc8oYL3mG4YFQ==",
+      "license": "MIT"
+    },
     "node_modules/metro": {
       "version": "0.83.5",
       "resolved": "https://registry.npmjs.org/metro/-/metro-0.83.5.tgz",
@@ -12502,6 +13655,24 @@
       "integrity": "sha512-gKLcREMhtuZRwRAfqP3RFW+TK4JqApVBtOIftVgjuABpAtpxhPGaDcfvbhNvD0B8iD1oUr/txX35NjcaY6Ns/A==",
       "license": "MIT"
     },
+    "node_modules/mlly": {
+      "version": "1.8.2",
+      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.8.2.tgz",
+      "integrity": "sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==",
+      "license": "MIT",
+      "dependencies": {
+        "acorn": "^8.16.0",
+        "pathe": "^2.0.3",
+        "pkg-types": "^1.3.1",
+        "ufo": "^1.6.3"
+      }
+    },
+    "node_modules/mlly/node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "license": "MIT"
+    },
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
@@ -13088,6 +14259,12 @@
       "dev": true,
       "license": "BlueOak-1.0.0"
     },
+    "node_modules/package-manager-detector": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-1.6.0.tgz",
+      "integrity": "sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==",
+      "license": "MIT"
+    },
     "node_modules/pako": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/pako/-/pako-1.0.11.tgz",
@@ -13187,6 +14364,12 @@
         "node": ">= 0.8"
       }
     },
+    "node_modules/path-data-parser": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/path-data-parser/-/path-data-parser-0.1.0.tgz",
+      "integrity": "sha512-NOnmBpt5Y2RWbuv0LMzsayp3lVylAHLPUTut412ZA3l+C4uw4ZVkQbjShYCQ8TCpUMdPapr4YjUqLYD6v68j+w==",
+      "license": "MIT"
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -13398,6 +14581,23 @@
         "node": ">=4.0.0"
       }
     },
+    "node_modules/pkg-types": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.3.1.tgz",
+      "integrity": "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==",
+      "license": "MIT",
+      "dependencies": {
+        "confbox": "^0.1.8",
+        "mlly": "^1.7.4",
+        "pathe": "^2.0.1"
+      }
+    },
+    "node_modules/pkg-types/node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "license": "MIT"
+    },
     "node_modules/plist": {
       "version": "3.1.0",
       "resolved": "https://registry.npmjs.org/plist/-/plist-3.1.0.tgz",
@@ -13422,6 +14622,22 @@
         "node": ">=12.13.0"
       }
     },
+    "node_modules/points-on-curve": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/points-on-curve/-/points-on-curve-0.2.0.tgz",
+      "integrity": "sha512-0mYKnYYe9ZcqMCWhUjItv/oHjvgEsfKvnUTg8sAtnHr3GVy7rGkXCb6d5cSyqrWqL4k81b9CPg3urd+T7aop3A==",
+      "license": "MIT"
+    },
+    "node_modules/points-on-path": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/points-on-path/-/points-on-path-0.2.1.tgz",
+      "integrity": "sha512-25ClnWWuw7JbWZcgqY/gJ4FQWadKxGWk+3kR/7kD0tCaDtPPMj7oHu2ToLaVhfpnHrZzYby2w6tUA0eOIuUg8g==",
+      "license": "MIT",
+      "dependencies": {
+        "path-data-parser": "0.1.0",
+        "points-on-curve": "0.2.0"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.5.9",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.9.tgz",
@@ -13982,6 +15198,29 @@
         }
       }
     },
+    "node_modules/react-redux": {
+      "version": "9.2.0",
+      "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
+      "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/use-sync-external-store": "^0.0.6",
+        "use-sync-external-store": "^1.4.0"
+      },
+      "peerDependencies": {
+        "@types/react": "^18.2.25 || ^19",
+        "react": "^18.0 || ^19",
+        "redux": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "redux": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/react-refresh": {
       "version": "0.17.0",
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.17.0.tgz",
@@ -14121,6 +15360,51 @@
         "safe-buffer": "~5.2.0"
       }
     },
+    "node_modules/recharts": {
+      "version": "3.8.1",
+      "resolved": "https://registry.npmjs.org/recharts/-/recharts-3.8.1.tgz",
+      "integrity": "sha512-mwzmO1s9sFL0TduUpwndxCUNoXsBw3u3E/0+A+cLcrSfQitSG62L32N69GhqUrrT5qKcAE3pCGVINC6pqkBBQg==",
+      "license": "MIT",
+      "workspaces": [
+        "www"
+      ],
+      "dependencies": {
+        "@reduxjs/toolkit": "^1.9.0 || 2.x.x",
+        "clsx": "^2.1.1",
+        "decimal.js-light": "^2.5.1",
+        "es-toolkit": "^1.39.3",
+        "eventemitter3": "^5.0.1",
+        "immer": "^10.1.1",
+        "react-redux": "8.x.x || 9.x.x",
+        "reselect": "5.1.1",
+        "tiny-invariant": "^1.3.3",
+        "use-sync-external-store": "^1.2.2",
+        "victory-vendor": "^37.0.2"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-dom": "^16.0.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
+        "react-is": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
+    "node_modules/redux": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
+      "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
+      "license": "MIT"
+    },
+    "node_modules/redux-thunk": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-3.1.0.tgz",
+      "integrity": "sha512-NW2r5T6ksUKXCabzhL9z+h206HQw/NJkcLm1GPImRQ8IzfXwRGqjVhKJGauHirT0DAuyy6hjdnMZaRoAcy0Klw==",
+      "license": "MIT",
+      "peerDependencies": {
+        "redux": "^5.0.0"
+      }
+    },
     "node_modules/regenerator-runtime": {
       "version": "0.13.11",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
@@ -14229,6 +15513,12 @@
         "url": "https://github.com/sponsors/jet2jet"
       }
     },
+    "node_modules/reselect": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/reselect/-/reselect-5.1.1.tgz",
+      "integrity": "sha512-K/BG6eIky/SBpzfHZv/dd+9JBFiS4SWV7FIujVyJRux6e45+73RaUHXLmIR1f7WOMaQ0U1km6qwklRQxpJJY0w==",
+      "license": "MIT"
+    },
     "node_modules/resolve": {
       "version": "1.22.11",
       "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.11.tgz",
@@ -14345,6 +15635,12 @@
         "node": ">=8.0"
       }
     },
+    "node_modules/robust-predicates": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.3.tgz",
+      "integrity": "sha512-NS3levdsRIUOmiJ8FZWCP7LG3QpJyrs/TE0Zpf1yvZu8cAJJ6QMW92H1c7kWpdIHo8RvmLxN/o2JXTKHp74lUA==",
+      "license": "Unlicense"
+    },
     "node_modules/rollup": {
       "version": "4.60.1",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.1.tgz",
@@ -14390,6 +15686,18 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/roughjs": {
+      "version": "4.6.6",
+      "resolved": "https://registry.npmjs.org/roughjs/-/roughjs-4.6.6.tgz",
+      "integrity": "sha512-ZUz/69+SYpFN/g/lUlo2FXcIjRkSu3nDarreVdGGndHEBJ6cXPdKguS8JGxwj5HA5xIbVKSmLgr5b3AWxtRfvQ==",
+      "license": "MIT",
+      "dependencies": {
+        "hachure-fill": "^0.5.2",
+        "path-data-parser": "^0.1.0",
+        "points-on-curve": "^0.2.0",
+        "points-on-path": "^0.2.1"
+      }
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -14414,6 +15722,12 @@
         "queue-microtask": "^1.2.2"
       }
     },
+    "node_modules/rw": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
+      "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==",
+      "license": "BSD-3-Clause"
+    },
     "node_modules/safe-buffer": {
       "version": "5.1.2",
       "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
@@ -14424,7 +15738,6 @@
       "version": "2.1.2",
       "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
       "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
-      "devOptional": true,
       "license": "MIT"
     },
     "node_modules/sanitize-filename": {
@@ -15480,6 +16793,12 @@
         "semver": "bin/semver"
       }
     },
+    "node_modules/tiny-invariant": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/tiny-invariant/-/tiny-invariant-1.3.3.tgz",
+      "integrity": "sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==",
+      "license": "MIT"
+    },
     "node_modules/tinybench": {
       "version": "2.9.0",
       "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
@@ -15662,6 +16981,15 @@
         "typescript": ">=4.8.4"
       }
     },
+    "node_modules/ts-dedent": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/ts-dedent/-/ts-dedent-2.2.0.tgz",
+      "integrity": "sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.10"
+      }
+    },
     "node_modules/tslib": {
       "version": "2.8.1",
       "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
@@ -15730,6 +17058,12 @@
         "node": ">=14.17"
       }
     },
+    "node_modules/ufo": {
+      "version": "1.6.3",
+      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.6.3.tgz",
+      "integrity": "sha512-yDJTmhydvl5lJzBmy/hyOAA0d+aqCBuwl818haVdYCRrWV84o7YyeVm4QlVHStqNrrJSTb6jKuFAVqAFsr+K3Q==",
+      "license": "MIT"
+    },
     "node_modules/uint8array-extras": {
       "version": "1.5.0",
       "resolved": "https://registry.npmjs.org/uint8array-extras/-/uint8array-extras-1.5.0.tgz",
@@ -15933,6 +17267,15 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/use-sync-external-store": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/use-sync-external-store/-/use-sync-external-store-1.6.0.tgz",
+      "integrity": "sha512-Pp6GSwGP/NrPIrxVFAIkOQeyw8lFenOHijQWkUTrDvrF4ALqylP2C/KCkeS9dpUM3KvYRQhna5vt7IL95+ZQ9w==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
+      }
+    },
     "node_modules/utf8-byte-length": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/utf8-byte-length/-/utf8-byte-length-1.0.5.tgz",
@@ -15965,6 +17308,19 @@
         "node": ">= 0.4.0"
       }
     },
+    "node_modules/uuid": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.1.0.tgz",
+      "integrity": "sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/esm/bin/uuid"
+      }
+    },
     "node_modules/verror": {
       "version": "1.10.1",
       "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.1.tgz",
@@ -16017,6 +17373,28 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/victory-vendor": {
+      "version": "37.3.6",
+      "resolved": "https://registry.npmjs.org/victory-vendor/-/victory-vendor-37.3.6.tgz",
+      "integrity": "sha512-SbPDPdDBYp+5MJHhBCAyI7wKM3d5ivekigc2Dk2s7pgbZ9wIgIBYGVw4zGHBml/qTFbexrofXW6Gu4noGxrOwQ==",
+      "license": "MIT AND ISC",
+      "dependencies": {
+        "@types/d3-array": "^3.0.3",
+        "@types/d3-ease": "^3.0.0",
+        "@types/d3-interpolate": "^3.0.1",
+        "@types/d3-scale": "^4.0.2",
+        "@types/d3-shape": "^3.1.0",
+        "@types/d3-time": "^3.0.0",
+        "@types/d3-timer": "^3.0.0",
+        "d3-array": "^3.1.6",
+        "d3-ease": "^3.0.1",
+        "d3-interpolate": "^3.0.1",
+        "d3-scale": "^4.0.2",
+        "d3-shape": "^3.1.0",
+        "d3-time": "^3.0.0",
+        "d3-timer": "^3.0.1"
+      }
+    },
     "node_modules/vite": {
       "version": "5.4.21",
       "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.21.tgz",
@@ -16173,6 +17551,55 @@
       "license": "MIT",
       "peer": true
     },
+    "node_modules/vscode-jsonrpc": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-8.2.0.tgz",
+      "integrity": "sha512-C+r0eKJUIfiDIfwJhria30+TYWPtuHJXHtI7J0YlOmKAo7ogxP20T0zxB7HZQIFhIyvoBPwWskjxrvAtfjyZfA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/vscode-languageserver": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-9.0.1.tgz",
+      "integrity": "sha512-woByF3PDpkHFUreUa7Hos7+pUWdeWMXRd26+ZX2A8cFx6v/JPTtd4/uN0/jB6XQHYaOlHbio03NTHCqrgG5n7g==",
+      "license": "MIT",
+      "dependencies": {
+        "vscode-languageserver-protocol": "3.17.5"
+      },
+      "bin": {
+        "installServerIntoExtension": "bin/installServerIntoExtension"
+      }
+    },
+    "node_modules/vscode-languageserver-protocol": {
+      "version": "3.17.5",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.17.5.tgz",
+      "integrity": "sha512-mb1bvRJN8SVznADSGWM9u/b07H7Ecg0I3OgXDuLdn307rl/J3A9YD6/eYOssqhecL27hK1IPZAsaqh00i/Jljg==",
+      "license": "MIT",
+      "dependencies": {
+        "vscode-jsonrpc": "8.2.0",
+        "vscode-languageserver-types": "3.17.5"
+      }
+    },
+    "node_modules/vscode-languageserver-textdocument": {
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.12.tgz",
+      "integrity": "sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==",
+      "license": "MIT"
+    },
+    "node_modules/vscode-languageserver-types": {
+      "version": "3.17.5",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.17.5.tgz",
+      "integrity": "sha512-Ld1VelNuX9pdF39h2Hgaeb5hEZM2Z3jUrrMgWQAu82jMtZp7p3vJT3BzToKtZI7NgQssZje5o0zryOrhQvzQAg==",
+      "license": "MIT"
+    },
+    "node_modules/vscode-uri": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.1.0.tgz",
+      "integrity": "sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==",
+      "license": "MIT"
+    },
     "node_modules/walker": {
       "version": "1.0.8",
       "resolved": "https://registry.npmjs.org/walker/-/walker-1.0.8.tgz",
diff --git a/packages/i18n/src/locales/de.json b/packages/i18n/src/locales/de.json
index d11d998..aa5262a 100644
--- a/packages/i18n/src/locales/de.json
+++ b/packages/i18n/src/locales/de.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "HuggingFace Token",
   "settings.hfTokenHint": "Ein HuggingFace Token wird für die Sprechertrennung benötigt",
   "settings.diarization": "Sprechertrennung",
-  "settings.diarizationHint": "Sprecher werden nach der Aufnahme automatisch identifiziert"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Sprecher werden nach der Aufnahme automatisch identifiziert",
+  "theme.label": "Design",
+  "theme.dark": "Dunkel",
+  "theme.light": "Hell",
+  "theme.auto": "Auto (System)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/en.json b/packages/i18n/src/locales/en.json
index 48ac9c1..14a551d 100644
--- a/packages/i18n/src/locales/en.json
+++ b/packages/i18n/src/locales/en.json
@@ -491,5 +491,13 @@
   "settings.hfToken": "HuggingFace Token",
   "settings.hfTokenHint": "A HuggingFace token is required for speaker diarization",
   "settings.diarization": "Speaker Diarization",
-  "settings.diarizationHint": "Automatically identify speakers after recording ends"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Automatically identify speakers after recording ends",
+  "theme.label": "Theme",
+  "theme.dark": "Dark",
+  "theme.light": "Light",
+  "theme.auto": "Auto (system)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/es.json b/packages/i18n/src/locales/es.json
index ec53b5b..8eba8e8 100644
--- a/packages/i18n/src/locales/es.json
+++ b/packages/i18n/src/locales/es.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "Token de HuggingFace",
   "settings.hfTokenHint": "Se necesita un token de HuggingFace para identificar hablantes",
   "settings.diarization": "Identificación de hablantes",
-  "settings.diarizationHint": "Identifica automáticamente los hablantes al finalizar la grabación"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Identifica automáticamente los hablantes al finalizar la grabación",
+  "theme.label": "Tema",
+  "theme.dark": "Oscuro",
+  "theme.light": "Claro",
+  "theme.auto": "Auto (sistema)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/fr.json b/packages/i18n/src/locales/fr.json
index 1d3e4c1..da3ff1a 100644
--- a/packages/i18n/src/locales/fr.json
+++ b/packages/i18n/src/locales/fr.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "Token HuggingFace",
   "settings.hfTokenHint": "Un token HuggingFace est requis pour l'identification des locuteurs",
   "settings.diarization": "Identification des locuteurs",
-  "settings.diarizationHint": "Identifier automatiquement les locuteurs après l'enregistrement"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Identifier automatiquement les locuteurs après l'enregistrement",
+  "theme.label": "Thème",
+  "theme.dark": "Sombre",
+  "theme.light": "Clair",
+  "theme.auto": "Auto (système)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/ja.json b/packages/i18n/src/locales/ja.json
index 2f2c24b..e7cbd29 100644
--- a/packages/i18n/src/locales/ja.json
+++ b/packages/i18n/src/locales/ja.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "HuggingFaceトークン",
   "settings.hfTokenHint": "話者分離にはHuggingFaceトークンが必要です",
   "settings.diarization": "話者分離",
-  "settings.diarizationHint": "録音終了後に自動的に話者を識別します"
-}
\ No newline at end of file
+  "settings.diarizationHint": "録音終了後に自動的に話者を識別します",
+  "theme.label": "テーマ",
+  "theme.dark": "ダーク",
+  "theme.light": "ライト",
+  "theme.auto": "自動 (システム)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/ko.json b/packages/i18n/src/locales/ko.json
index 5e2ee88..016d029 100644
--- a/packages/i18n/src/locales/ko.json
+++ b/packages/i18n/src/locales/ko.json
@@ -491,5 +491,13 @@
   "settings.hfToken": "HuggingFace 토큰",
   "settings.hfTokenHint": "화자 구분을 위해 HuggingFace 토큰이 필요합니다",
   "settings.diarization": "화자 구분",
-  "settings.diarizationHint": "녹음 종료 후 화자를 자동으로 구분합니다"
-}
\ No newline at end of file
+  "settings.diarizationHint": "녹음 종료 후 화자를 자동으로 구분합니다",
+  "theme.label": "테마",
+  "theme.dark": "다크",
+  "theme.light": "라이트",
+  "theme.auto": "자동 (시스템)",
+  "theme.nord": "노드",
+  "theme.solarized": "솔라라이즈드",
+  "theme.catppuccin": "카푸치노",
+  "theme.dracula": "드라큘라"
+}
diff --git a/packages/i18n/src/locales/pt.json b/packages/i18n/src/locales/pt.json
index 305b70a..2f2ef6d 100644
--- a/packages/i18n/src/locales/pt.json
+++ b/packages/i18n/src/locales/pt.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "Token do HuggingFace",
   "settings.hfTokenHint": "Um token do HuggingFace é necessário para identificar oradores",
   "settings.diarization": "Identificação de oradores",
-  "settings.diarizationHint": "Identifica automaticamente os oradores após o término da gravação"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Identifica automaticamente os oradores após o término da gravação",
+  "theme.label": "Tema",
+  "theme.dark": "Escuro",
+  "theme.light": "Claro",
+  "theme.auto": "Auto (sistema)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/ru.json b/packages/i18n/src/locales/ru.json
index bdd7f4c..f3c8142 100644
--- a/packages/i18n/src/locales/ru.json
+++ b/packages/i18n/src/locales/ru.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "Токен HuggingFace",
   "settings.hfTokenHint": "Токен HuggingFace необходим для определения говорящих",
   "settings.diarization": "Диаризация",
-  "settings.diarizationHint": "Автоматически определять говорящих после завершения записи"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Автоматически определять говорящих после завершения записи",
+  "theme.label": "Тема",
+  "theme.dark": "Тёмная",
+  "theme.light": "Светлая",
+  "theme.auto": "Авто (система)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/th.json b/packages/i18n/src/locales/th.json
index 1a56566..298c0a5 100644
--- a/packages/i18n/src/locales/th.json
+++ b/packages/i18n/src/locales/th.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "โทเค็น HuggingFace",
   "settings.hfTokenHint": "ต้องใช้โทเค็น HuggingFace สำหรับการแยกผู้พูด",
   "settings.diarization": "การแยกผู้พูด",
-  "settings.diarizationHint": "ระบุผู้พูดโดยอัตโนมัติหลังจากการบันทึกสิ้นสุด"
-}
\ No newline at end of file
+  "settings.diarizationHint": "ระบุผู้พูดโดยอัตโนมัติหลังจากการบันทึกสิ้นสุด",
+  "theme.label": "ธีม",
+  "theme.dark": "มืด",
+  "theme.light": "สว่าง",
+  "theme.auto": "อัตโนมัติ (ระบบ)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/vi.json b/packages/i18n/src/locales/vi.json
index b345bd6..a9575f1 100644
--- a/packages/i18n/src/locales/vi.json
+++ b/packages/i18n/src/locales/vi.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "Token HuggingFace",
   "settings.hfTokenHint": "Cần token HuggingFace để phân tách người nói",
   "settings.diarization": "Phân tách người nói",
-  "settings.diarizationHint": "Tự động nhận dạng người nói sau khi ghi âm kết thúc"
-}
\ No newline at end of file
+  "settings.diarizationHint": "Tự động nhận dạng người nói sau khi ghi âm kết thúc",
+  "theme.label": "Chủ đề",
+  "theme.dark": "Tối",
+  "theme.light": "Sáng",
+  "theme.auto": "Tự động (hệ thống)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/zh-TW.json b/packages/i18n/src/locales/zh-TW.json
index 63ad8b1..5c8ec3f 100644
--- a/packages/i18n/src/locales/zh-TW.json
+++ b/packages/i18n/src/locales/zh-TW.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "HuggingFace 令牌",
   "settings.hfTokenHint": "說話人分離需要HuggingFace令牌",
   "settings.diarization": "說話人分離",
-  "settings.diarizationHint": "錄音結束後自動識別說話人"
-}
\ No newline at end of file
+  "settings.diarizationHint": "錄音結束後自動識別說話人",
+  "theme.label": "主題",
+  "theme.dark": "深色",
+  "theme.light": "淺色",
+  "theme.auto": "自動 (系統)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}
diff --git a/packages/i18n/src/locales/zh.json b/packages/i18n/src/locales/zh.json
index cf2d791..e20c441 100644
--- a/packages/i18n/src/locales/zh.json
+++ b/packages/i18n/src/locales/zh.json
@@ -291,5 +291,13 @@
   "settings.hfToken": "HuggingFace令牌",
   "settings.hfTokenHint": "说话人分离需要HuggingFace令牌",
   "settings.diarization": "说话人分离",
-  "settings.diarizationHint": "录音结束后自动识别说话人"
-}
\ No newline at end of file
+  "settings.diarizationHint": "录音结束后自动识别说话人",
+  "theme.label": "主题",
+  "theme.dark": "深色",
+  "theme.light": "浅色",
+  "theme.auto": "自动 (系统)",
+  "theme.nord": "Nord",
+  "theme.solarized": "Solarized",
+  "theme.catppuccin": "Catppuccin",
+  "theme.dracula": "Dracula"
+}