feat(V2-3): Web App MVP — Next.js 15 + @d3ro/api-client

packages/api-client (@d3ro/api-client) 신규:
- types.ts: 12개 테이블 Row/Insert/Update 타입 + Database 형식
- client.ts: createD3roSupabaseClient 팩토리 (placeholder fallback)
- auth.ts: signInWithOAuth/signOut/getSession/onAuthStateChange
- meetings.ts: 회의 + 메모 + 문서 + 전사 CRUD
- history.ts: 음성 입력 이력 CRUD
- usage.ts: 일일 쿼터 + 구독 조회
- 루트 barrel은 types만 re-export, 함수는 subpath import 전용

apps/web (@d3ro/web) 신규 — Next.js 15 App Router:
- transpilePackages: @d3ro/core, ui, i18n, api-client
- ThemeProvider (MUI + AppRouterCacheProvider)
- I18nProvider (localStorage 어댑터)
- AuthProvider (Supabase session Context)
- 라우트 9개:
  - / (auth 상태 기반 리다이렉트)
  - /login (Google/GitHub OAuth, 미설정 경고)
  - /auth/callback (code -> session 교환)
  - /dashboard (요약 카드 + 최근 회의)
  - /meetings (카드 그리드 리스트)
  - /meetings/[id] (transcripts/memos/documents)
  - /record (getUserMedia + MediaRecorder + stt-proxy)
- Sidebar, 인증 가드, 9바 웨이브폼, 레벨 미터

packages/ui 확장:
- MetalCard가 BoxProps 상속 (sx/onClick 등 전달)
- theme.ts에 typoSx(key) 헬퍼 추가 (d3roTypo -> MUI sx 변환)
- d3roPalette.tag.blue 추가 (M5 정리 포함)
- DS 컴포넌트 9개에 'use client' directive
- MetalDial 미사용 import 제거

packages/i18n 확장:
- ko.json에 7개 새 키 (nav.meetings/record/logout, login.*)

설계 결정:
- Database 제네릭 현재는 기본 타입 (V2-4에서 supabase gen types로 자동화)
- api-client barrel은 타입만 노출해서 컴파일 전파 차단
- DS 컴포넌트 client 경계 명시
- env 없어도 Next.js 빌드 성공 (placeholder URL/key)

검증:
- web typecheck OK
- desktop typecheck OK (회귀 없음)
- web next build OK (9 라우트 정적/동적 생성)
- desktop build OK (회귀 없음)

apps/web/src/components/layout/sidebar.tsx

@@ -0,0 +1,118 @@
+'use client'
+
+// apps/web/src/components/layout/sidebar.tsx
+// 대시보드 좌측 사이드바
+
+import { usePathname, useRouter } from 'next/navigation'
+import { Box, List, ListItem, ListItemButton, ListItemIcon, ListItemText } from '@mui/material'
+import DashboardIcon from '@mui/icons-material/Dashboard'
+import MeetingRoomIcon from '@mui/icons-material/MeetingRoom'
+import MicIcon from '@mui/icons-material/Mic'
+import LogoutIcon from '@mui/icons-material/Logout'
+import { PhosphorText } from '@d3ro/ui/components/ds'
+import { d3roPalette } from '@d3ro/ui/theme'
+import { useI18n } from '@d3ro/i18n'
+import { getSupabaseBrowserClient } from '@/lib/supabase-browser'
+
+interface NavItem {
+  key: string
+  path: string
+  label: string
+  icon: React.ReactElement
+}
+
+export function Sidebar(): React.ReactElement {
+  const router = useRouter()
+  const pathname = usePathname()
+  const { t } = useI18n()
+
+  const items: NavItem[] = [
+    {
+      key: 'dashboard',
+      path: '/dashboard',
+      label: t('nav.dashboard') ?? 'Dashboard',
+      icon: <DashboardIcon />
+    },
+    {
+      key: 'meetings',
+      path: '/meetings',
+      label: t('nav.meetings') ?? 'Meetings',
+      icon: <MeetingRoomIcon />
+    },
+    {
+      key: 'record',
+      path: '/record',
+      label: t('nav.record') ?? 'Record',
+      icon: <MicIcon />
+    }
+  ]
+
+  async function handleLogout(): Promise<void> {
+    const supabase = getSupabaseBrowserClient()
+    await supabase.auth.signOut()
+    router.replace('/login')
+  }
+
+  return (
+    <Box
+      sx={{
+        width: 240,
+        minHeight: '100vh',
+        bgcolor: d3roPalette.bg.sidebar,
+        borderRight: `1px solid ${d3roPalette.border.default}`,
+        display: 'flex',
+        flexDirection: 'column'
+      }}
+    >
+      <Box sx={{ p: 3, borderBottom: `1px solid ${d3roPalette.border.default}` }}>
+        <PhosphorText variant="heading">
+          D3RO VOICE
+        </PhosphorText>
+      </Box>
+
+      <List sx={{ flex: 1, py: 2 }}>
+        {items.map((item) => {
+          const active = pathname === item.path || pathname.startsWith(`${item.path}/`)
+          return (
+            <ListItem key={item.key} disablePadding>
+              <ListItemButton
+                selected={active}
+                onClick={() => router.push(item.path)}
+                sx={{
+                  '&.Mui-selected': {
+                    bgcolor: d3roPalette.bg.inset,
+                    borderLeft: `3px solid ${d3roPalette.accent.amber}`
+                  }
+                }}
+              >
+                <ListItemIcon sx={{ color: active ? d3roPalette.accent.amber : d3roPalette.text.label }}>
+                  {item.icon}
+                </ListItemIcon>
+                <ListItemText
+                  primary={item.label}
+                  primaryTypographyProps={{
+                    color: active ? d3roPalette.text.primary : d3roPalette.text.secondary
+                  }}
+                />
+              </ListItemButton>
+            </ListItem>
+          )
+        })}
+      </List>
+
+      <List sx={{ borderTop: `1px solid ${d3roPalette.border.default}` }}>
+        <ListItem disablePadding>
+          <ListItemButton onClick={() => void handleLogout()}>
+            <ListItemIcon sx={{ color: d3roPalette.text.label }}>
+              <LogoutIcon />
+            </ListItemIcon>
+            <ListItemText
+              primary={t('nav.logout') ?? 'Logout'}
+              primaryTypographyProps={{ color: d3roPalette.text.secondary }}
+            />
+          </ListItemButton>
+        </ListItem>
+      </List>
+    </Box>
+  )
+}