feat(ui): Midnight Glass v2 마감 — lucide 아이콘 통일 + 몰입 패널 웨이브 + 팝업 정합

- @mui/icons-material → lucide-react 전환 (23파일, 잔여 0)
- VoiceRecordingPanel: 9바 DOM 웨이브 → GradientWave (canvas)
- Vanilla 팝업 5종 style.css v2 정합 (글래스 네이비/헤어라인/블루,
  CSS 변수 주입 구조 유지 — 테마 반응형 보존)

apps/desktop/src/renderer/components/meeting/DocumentTab.tsx

@@ -3,7 +3,7 @@
 
 import { useCallback, useRef } from 'react'
 import { Box } from '@mui/material'
-import DeleteIcon from '@mui/icons-material/Delete'
+import { Trash2 } from 'lucide-react'
 import { MarkdownEditor } from './MarkdownEditor'
 import { ExportMenu } from './ExportMenu'
 import { PhysicalButton } from '@d3ro/ui/components/ds'
@@ -80,7 +80,7 @@ export function DocumentTab({
           onClick={onDelete}
           sx={{ height: 32, fontSize: d3roTypo.engrave.size }}
         >
-          <DeleteIcon sx={{ fontSize: 14, mr: 0.5 }} />
+          <Trash2 size={14} style={{ marginRight: 4 }} />
           {t('common.delete')}
         </PhysicalButton>
       </Box>

apps/desktop/src/renderer/components/meeting/ExportMenu.tsx

@@ -3,7 +3,7 @@
 
 import { useState, useCallback } from 'react'
 import { Menu, MenuItem } from '@mui/material'
-import FileDownloadIcon from '@mui/icons-material/FileDownload'
+import { Download } from 'lucide-react'
 import { PhysicalButton } from '@d3ro/ui/components/ds'
 import { d3roPalette, d3roTypo, d3roFontMono, d3roRadius, d3roShadow } from '@d3ro/ui/theme'
 import { useI18n } from '@d3ro/i18n'
@@ -54,7 +54,7 @@ export function ExportMenu({ onExport, onCopyToClipboard }: ExportMenuProps): Re
         onClick={handleOpen}
         sx={{ height: 32, fontSize: d3roTypo.engrave.size }}
       >
-        <FileDownloadIcon sx={{ fontSize: 14, mr: 0.5 }} />
+        <Download size={14} style={{ marginRight: 4 }} />
         {t('meeting.exportFormat')}
       </PhysicalButton>
 

apps/desktop/src/renderer/components/meeting/MeetingChatPanel.tsx

@@ -3,10 +3,7 @@
 
 import { useState, useCallback, useEffect, useRef, useMemo } from 'react'
 import { Box, TextField, IconButton, Tooltip } from '@mui/material'
-import SendIcon from '@mui/icons-material/Send'
-import DeleteSweepIcon from '@mui/icons-material/DeleteSweep'
-import ExpandLessIcon from '@mui/icons-material/ExpandLess'
-import ExpandMoreIcon from '@mui/icons-material/ExpandMore'
+import { Send, Trash2, ChevronUp, ChevronDown } from 'lucide-react'
 import { PhosphorText } from '@d3ro/ui/components/ds'
 import { PhysicalButton } from '@d3ro/ui/components/ds'
 import { isImeComposingEvent } from '../../utils/keyboard'
@@ -187,16 +184,16 @@ export function MeetingChatPanel({ sessionId }: MeetingChatPanelProps): React.Re
             onClick={handleClear}
             disabled={messages.length === 0 && !streaming}
           >
-            <DeleteSweepIcon sx={{ fontSize: 15, color: d3roPalette.text.inactive }} />
+            <Trash2 size={15} style={{ color: d3roPalette.text.inactive }} />
           </IconButton>
         </Tooltip>
 
         <Tooltip title={collapsed ? t('meeting.chatExpand') : t('meeting.chatCollapse')}>
           <IconButton size="small" onClick={handleToggleCollapse}>
             {collapsed ? (
-              <ExpandLessIcon sx={{ fontSize: 15, color: d3roPalette.text.inactive }} />
+              <ChevronUp size={15} style={{ color: d3roPalette.text.inactive }} />
             ) : (
-              <ExpandMoreIcon sx={{ fontSize: 15, color: d3roPalette.text.inactive }} />
+              <ChevronDown size={15} style={{ color: d3roPalette.text.inactive }} />
             )}
           </IconButton>
         </Tooltip>
@@ -408,7 +405,7 @@ export function MeetingChatPanel({ sessionId }: MeetingChatPanelProps): React.Re
               disabled={!inputValue.trim() || streaming}
               sx={{ flexShrink: 0, height: 36, minWidth: 36, px: 1 }}
             >
-              <SendIcon sx={{ fontSize: 14 }} />
+              <Send size={14} />
             </PhysicalButton>
           </Box>
         </>

apps/desktop/src/renderer/components/meeting/MeetingDetailTabs.tsx

@@ -10,10 +10,7 @@ import {
   TextField,
   Tooltip,
 } from '@mui/material'
-import ArrowBackIcon from '@mui/icons-material/ArrowBack'
-import AddIcon from '@mui/icons-material/Add'
-import EditIcon from '@mui/icons-material/Edit'
-import CheckIcon from '@mui/icons-material/Check'
+import { ArrowLeft, Plus, Pencil, Check } from 'lucide-react'
 import { TranscriptTab } from './TranscriptTab'
 import { DocumentTab } from './DocumentTab'
 import { AddDocumentDialog } from './AddDocumentDialog'
@@ -231,7 +228,7 @@ export function MeetingDetailTabs({
         }}
       >
         <IconButton size="small" onClick={onBack}>
-          <ArrowBackIcon sx={{ fontSize: 18, color: d3roPalette.text.secondary }} />
+          <ArrowLeft size={18} style={{ color: d3roPalette.text.secondary }} />
         </IconButton>
 
         {editingTitle ? (
@@ -251,7 +248,7 @@ export function MeetingDetailTabs({
               autoFocus
             />
             <IconButton size="small" onClick={handleSaveTitle}>
-              <CheckIcon sx={{ fontSize: 16, color: d3roPalette.accent.amber }} />
+              <Check size={16} style={{ color: d3roPalette.accent.amber }} />
             </IconButton>
           </Box>
         ) : (
@@ -264,7 +261,7 @@ export function MeetingDetailTabs({
                 size="small"
                 onClick={() => { setEditingTitle(true); setTitleDraft(detail.title ?? '') }}
               >
-                <EditIcon sx={{ fontSize: 15, color: d3roPalette.text.inactive }} />
+                <Pencil size={15} style={{ color: d3roPalette.text.inactive }} />
               </IconButton>
             </Tooltip>
           </>
@@ -303,7 +300,7 @@ export function MeetingDetailTabs({
             <Tab key={doc.id} label={doc.title ?? t('meeting.untitled')} />
           ))}
           <Tab
-            icon={<AddIcon sx={{ fontSize: 16 }} />}
+            icon={<Plus size={16} />}
             label={t('meeting.addDocument')}
             iconPosition="start"
             sx={{ minWidth: 120 }}

apps/desktop/src/renderer/components/meeting/TranscriptTab.tsx

@@ -8,9 +8,7 @@ import { PhysicalButton } from '@d3ro/ui/components/ds'
 import { PhosphorText } from '@d3ro/ui/components/ds'
 import { d3roPalette, d3roFontMono, d3roTypo } from '@d3ro/ui/theme'
 import { useI18n } from '@d3ro/i18n'
-import FileDownloadIcon from '@mui/icons-material/FileDownload'
-import AutoFixHighIcon from '@mui/icons-material/AutoFixHigh'
-import RecordVoiceOverIcon from '@mui/icons-material/RecordVoiceOver'
+import { Download, WandSparkles, Speech } from 'lucide-react'
 
 interface TranscriptTabProps {
   sessionId: string
@@ -129,7 +127,7 @@ export function TranscriptTab({
             disabled={polishing || diarizing}
             sx={{ height: 30, fontSize: d3roTypo.engrave.size }}
           >
-            <AutoFixHighIcon sx={{ fontSize: 13, mr: 0.5 }} />
+            <WandSparkles size={13} style={{ marginRight: 4 }} />
             {polishing ? t('meeting.polishing') : t('meeting.polish')}
           </PhysicalButton>
           {onDiarize && (
@@ -139,7 +137,7 @@ export function TranscriptTab({
               disabled={polishing || diarizing}
               sx={{ height: 30, fontSize: d3roTypo.engrave.size }}
             >
-              <RecordVoiceOverIcon sx={{ fontSize: 13, mr: 0.5 }} />
+              <Speech size={13} style={{ marginRight: 4 }} />
               {diarizing ? t('meeting.diarizing') : t('meeting.diarize')}
             </PhysicalButton>
           )}
@@ -148,7 +146,7 @@ export function TranscriptTab({
             onClick={handleDownloadTxt}
             sx={{ height: 30, fontSize: d3roTypo.engrave.size }}
           >
-            <FileDownloadIcon sx={{ fontSize: 13, mr: 0.5 }} />
+            <Download size={13} style={{ marginRight: 4 }} />
             {t('meeting.downloadTranscript')}
           </PhysicalButton>
         </Box>