        // ===== 문서 유형 분석 관련 =====
        const ANALYSIS_STEPS = [
            {id: 1, name: "문서 파싱"},
            {id: 2, name: "레이아웃 분석"},
            {id: 3, name: "맥락 분석"},
            {id: 4, name: "구조 분석"},
            {id: 5, name: "템플릿 추출"},
            {id: 6, name: "최종 검증"}
        ];


        // ===== 문서 유형 로드 =====
        async function loadDocTypes() {
            const container = document.getElementById('docTypeList');
            container.classList.add('loading');
            
            try {
                const response = await fetch('/api/doc-types');
                const data = await response.json();
                
                if (data.error) {
                    throw new Error(data.error);
                }
                
                docTypes = data;
                renderDocTypeList();
                
                // 첫 번째 활성화된 유형 선택
                const firstEnabled = docTypes.find(t => t.enabled);
                if (firstEnabled) {
                    selectDocType(firstEnabled.id);
                }
                
            } catch (error) {
                console.error('문서 유형 로드 실패:', error);
                container.innerHTML = '<div style="color:var(--ui-error);font-size:12px;">로드 실패</div>';
            } finally {
                container.classList.remove('loading');
            }
        }

        // ===== 문서 유형 리스트 렌더링 =====
        function renderDocTypeList() {
            const container = document.getElementById('docTypeList');
            
            // 기본 유형과 사용자 유형 분리
            const defaultTypes = docTypes.filter(t => t.isDefault);
            const userTypes = docTypes.filter(t => !t.isDefault);
            
            let html = defaultTypes.map(type => createDocTypeHTML(type)).join('');
            
            if (userTypes.length > 0) {
                html += '<div class="doc-type-divider"></div>';
                html += userTypes.map(type => createDocTypeHTML(type)).join('');
            }
            
            container.innerHTML = html;
            attachDocTypeEvents();
        }

        // ===== 개별 문서 유형 HTML 생성 =====
        function createDocTypeHTML(type) {
            const isSelected = currentDocType === type.id;
            const isDisabled = !type.enabled;
            
            return `
                <div class="doc-type-item ${isSelected ? 'selected' : ''} ${isDisabled ? 'disabled' : ''}" 
                     data-type="${type.id}">
                    <input type="radio" name="docType" ${isSelected ? 'checked' : ''} ${isDisabled ? 'disabled' : ''}>
                    <span class="label">${type.icon} ${type.name}</span>
                    ${type.badge ? `<span class="badge">${type.badge}</span>` : ''}
                    ${!type.isDefault ? `<button class="delete-btn" onclick="event.stopPropagation(); deleteDocType('${type.id}')" title="삭제">✕</button>` : ''}
                    
                    <div class="doc-type-preview">
                        <div class="preview-thumbnail ${type.thumbnailType || 'custom'}">
                            ${thumbnailTemplates[type.thumbnailType] || thumbnailTemplates.custom}
                        </div>
                        <div class="preview-title">${type.name}</div>
                        <div class="preview-desc">${type.description || ''}</div>
                        <div class="preview-features">
                            ${(type.features || []).map(f => `
                                <div class="preview-feature">
                                    <span class="icon">${f.icon || '✓'}</span> ${f.text || f}
                                </div>
                            `).join('')}
                        </div>
                    </div>
                </div>
            `;
        }

        // ===== 문서 유형 이벤트 연결 =====
        function attachDocTypeEvents() {
            document.querySelectorAll('.doc-type-item').forEach(item => {
                if (item.classList.contains('disabled')) return;
                
                // 클릭 이벤트
                item.onclick = () => selectDocType(item.dataset.type);
                
                // 호버 프리뷰 이벤트
                const preview = item.querySelector('.doc-type-preview');
                if (preview) {
                    item.addEventListener('mouseenter', () => {
                        const rect = item.getBoundingClientRect();
                        preview.style.top = (rect.top + rect.height / 2 - 150) + 'px';
                        preview.style.left = (rect.left - 295) + 'px';
                        preview.classList.add('show');
                    });
                    item.addEventListener('mouseleave', () => preview.classList.remove('show'));
                }
            });
        }

        // ===== 문서 유형 선택 =====
        function selectDocType(typeId) {
            const type = docTypes.find(t => t.id === typeId);
            if (!type || !type.enabled) return;
            
            currentDocType = typeId;
            
            // 선택 상태 업데이트
            document.querySelectorAll('.doc-type-item').forEach(item => {
                const isSelected = item.dataset.type === typeId;
                item.classList.toggle('selected', isSelected);
                const radio = item.querySelector('input[type="radio"]');
                if (radio) radio.checked = isSelected;
            });
            
            // 옵션 렌더링
            renderDocTypeOptions(type);
            
            // 버튼 텍스트 업데이트 (입력 상태도 반영)
            const generateBtnText = document.getElementById('generateBtnText');
            const hasFolder = typeof folderPath !== 'undefined' && folderPath && folderPath.trim() !== '';
            const hasLinks = typeof referenceLinks !== 'undefined' && referenceLinks && referenceLinks.length > 0;
            const hasHtml = typeof inputContent !== 'undefined' && inputContent && inputContent.trim() !== '';
            
            if (type.generateFlow === 'draft-first' && (hasFolder || (hasLinks && hasHtml))) {
                generateBtnText.textContent = '📋 목차 확인하기';
            } else {
                generateBtnText.textContent = '🚀 생성하기';
            }
            
            console.log('문서 유형 선택:', typeId);
        }

        // ===== 문서 유형별 옵션 렌더링 =====
        function renderDocTypeOptions(type) {
            const container = document.getElementById('docTypeOptionsContainer');
            
            if (!type.options) {
                container.innerHTML = '';
                return;
            }
            
            let html = '';
            
            // 페이지 구성 (기획서 - 새로운 구조)
            if (type.options.pageConfig) {
                const config = type.options.pageConfig;
                html += `
                    <div class="option-section">
                        <div class="option-title">페이지 구성</div>
                        <div class="option-group">
                            ${config.choices.map((opt, idx) => `
                                <div class="option-item ${opt.default ? 'selected' : ''}" onclick="selectPageConfig('${opt.value}', ${idx})">
                                    <input type="radio" name="pageConfig" value="${opt.value}" id="pageConfig${idx}" ${opt.default ? 'checked' : ''}>
                                    <label for="pageConfig${idx}">${opt.label}</label>
                                    ${opt.hasInput ? `
                                        <input type="number" 
                                               id="attachPages" 
                                               class="page-input" 
                                               value="${opt.inputDefault || 1}" 
                                               min="${opt.inputMin || 1}" 
                                               max="${opt.inputMax || 10}"
                                               onclick="event.stopPropagation(); selectPageConfig('${opt.value}', ${idx});"
                                               onchange="updateAttachPages(this.value)">
                                        <span class="page-input-suffix">${opt.inputSuffix || ''}</span>
                                    ` : ''}
                                </div>
                            `).join('')}
                        </div>
                    </div>
                `;
            }
            
            // 기존 페이지 옵션 (하위 호환)
            if (type.options.pageOptions) {
                html += `
                    <div class="option-section">
                        <div class="option-title">페이지 구성</div>
                        <div class="option-group">
                            ${type.options.pageOptions.map((opt, idx) => `
                                <div class="option-item ${opt.default ? 'selected' : ''}" onclick="selectPageOption('${opt.value}')">
                                    <input type="radio" name="pages" value="${opt.value}" id="page${idx}" ${opt.default ? 'checked' : ''}>
                                    <label for="page${idx}">${opt.label}</label>
                                </div>
                            `).join('')}
                        </div>
                    </div>
                `;
            }
            
            // 구성 요소 (보고서)
            if (type.options.components) {
                html += `
                    <div class="option-section">
                        <div class="option-title">보고서 구성</div>
                        <div class="option-group">
                            ${type.options.components.map(comp => `
                                <div class="option-item" style="cursor:${comp.required ? 'default' : 'pointer'}; ${comp.required ? 'opacity:0.6;' : ''}">
                                    <input type="checkbox" id="${comp.id}" ${comp.default ? 'checked' : ''} ${comp.required ? 'disabled' : ''}>
                                    <label for="${comp.id}">${comp.icon} ${comp.label}</label>
                                </div>
                            `).join('')}
                        </div>
                    </div>
                `;
            }
            
            // 슬라이드 수 (발표자료)
            if (type.options.slideCount) {
                html += `
                    <div class="option-section">
                        <div class="option-title">슬라이드 수</div>
                        <div class="option-group">
                            ${type.options.slideCount.map((opt, idx) => `
                                <div class="option-item ${opt.default ? 'selected' : ''}" onclick="selectSlideCount('${opt.value}')">
                                    <input type="radio" name="slideCount" value="${opt.value}" id="slide${idx}" ${opt.default ? 'checked' : ''}>
                                    <label for="slide${idx}">${opt.label}</label>
                                </div>
                            `).join('')}
                        </div>
                    </div>
                `;
            }
            
            container.innerHTML = html;
        }

        // ===== 페이지 구성 선택 (새로운 방식) =====
        var currentPageConfig = 'body-attach';
        let attachPageCount = 1;

        function selectPageConfig(value, idx) {
            currentPageConfig = value;
            
            document.querySelectorAll('#docTypeOptionsContainer .option-item').forEach(item => {
                const radio = item.querySelector('input[type="radio"][name="pageConfig"]');
                if (radio) {
                    const isSelected = radio.value === value;
                    item.classList.toggle('selected', isSelected);
                    radio.checked = isSelected;
                }
            });
            
            // 첨부 페이지 입력 활성화/비활성화
            const attachInput = document.getElementById('attachPages');
            if (attachInput) {
                attachInput.disabled = (value === 'body-only');
                attachInput.style.opacity = (value === 'body-only') ? '0.5' : '1';
            }
        }

        function updateAttachPages(value) {
            attachPageCount = parseInt(value) || 1;
            console.log('첨부 페이지 수:', attachPageCount);
        }

        // ===== 슬라이드 수 선택 =====
        function selectSlideCount(count) {
            document.querySelectorAll('#docTypeOptionsContainer .option-item').forEach(item => {
                const radio = item.querySelector('input[type="radio"][name="slideCount"]');
                if (radio) {
                    const isSelected = radio.value === count;
                    item.classList.toggle('selected', isSelected);
                    radio.checked = isSelected;
                }
            });
        }

        // 모달 열기
        function openDocTypeModal() {
            resetDocTypeModal();
            document.getElementById('addDocTypeModal').classList.add('active');
        }

        // 모달 닫기
        function closeAddDocTypeModal() {
            document.getElementById('addDocTypeModal').classList.remove('active');
            resetDocTypeModal();
        }

        // 모달 초기화
        function resetDocTypeModal() {
            analysisResult = null;
            
            // Step 표시 초기화
            document.getElementById('docTypeStep1').style.display = 'block';
            document.getElementById('docTypeStep2').style.display = 'none';
            document.getElementById('docTypeStep3').style.display = 'none';
            
            // 제목 초기화
            document.getElementById('addDocTypeModalTitle').textContent = '📄 문서 유형 추가';
            
            // 입력 초기화
            document.getElementById('newDocTypeName').value = '';
            document.getElementById('newDocTypeDesc').value = '';
            document.getElementById('newDocTypeFile').value = '';
            
            // 버튼 초기화
            const footer = document.getElementById('docTypeModalFooter');
            footer.style.display = 'flex';
            
            const actionBtn = document.getElementById('docTypeActionBtn');
            actionBtn.textContent = '분석 시작';
            actionBtn.onclick = startDocTypeAnalysis;
        }

        // 분석 시작
        function startDocTypeAnalysis() {
            const name = document.getElementById('newDocTypeName').value.trim();
            const file = document.getElementById('newDocTypeFile').files[0];
            
            if (!name) {
                alert('문서 유형 이름을 입력해주세요.');
                return;
            }
            if (!file) {
                alert('샘플 문서를 선택해주세요.');
                return;
            }
            
            // Step 2로 전환
            document.getElementById('docTypeStep1').style.display = 'none';
            document.getElementById('docTypeStep2').style.display = 'block';
            document.getElementById('addDocTypeModalTitle').textContent = '🔄 문서 분석 중...';
            
            // 푸터 버튼 숨기기
            document.getElementById('docTypeModalFooter').style.display = 'none';
            
            // 진행 단계 UI 생성
            renderAnalysisSteps();
            
            // 분석 시작
            performAnalysis(name, file);
        }

        // 진행 단계 렌더링
        function renderAnalysisSteps() {
            const container = document.getElementById('analysisSteps');
            container.innerHTML = ANALYSIS_STEPS.map(step => `
                <div class="analysis-step" id="analysisStep${step.id}">
                    <span class="step-icon">⏳</span>
                    <span class="step-name">Step ${step.id}: ${step.name}</span>
                    <span class="step-status">대기</span>
                </div>
            `).join('');
        }

        // 단계 상태 업데이트 (메시지 지원)
        function updateAnalysisStep(stepId, status, message = '') {
            const stepEl = document.getElementById(`analysisStep${stepId}`);
            if (!stepEl) return;
            
            const iconEl = stepEl.querySelector('.step-icon');
            const statusEl = stepEl.querySelector('.step-status');
            
            if (status === 'running') {
                iconEl.textContent = '🔄';
                iconEl.classList.add('spinning');
                statusEl.textContent = message || '진행중...';
                stepEl.classList.add('running');
            } else if (status === 'done') {
                iconEl.textContent = '✅';
                iconEl.classList.remove('spinning');
                statusEl.textContent = message || '완료';
                stepEl.classList.remove('running');
                stepEl.classList.add('done');
            } else if (status === 'error') {
                iconEl.textContent = '❌';
                iconEl.classList.remove('spinning');
                statusEl.textContent = message || '실패';
                stepEl.classList.add('error');
            }
            
            // 진행률 업데이트
            const doneCount = document.querySelectorAll('.analysis-step.done').length;
            const progress = Math.round((doneCount / ANALYSIS_STEPS.length) * 100);
            document.getElementById('analysisProgressBar').style.width = progress + '%';
            document.getElementById('analysisProgressText').textContent = `${progress}% 완료`;
        }

        // 분석 수행 (SSE 방식)
        async function performAnalysis(name, file) {
            console.log('🚀 performAnalysis 시작 (SSE 모드)');
            
            const formData = new FormData();
            formData.append('name', name);
            formData.append('description', document.getElementById('newDocTypeDesc').value.trim());
            formData.append('file', file);
            
            // XMLHttpRequest로 SSE 연결 (FormData 전송)
            const xhr = new XMLHttpRequest();
            xhr.open('POST', '/api/doc-types/analyze-stream', true);
            
            let buffer = '';
            
            xhr.onprogress = function() {
                const newData = xhr.responseText.substring(buffer.length);
                buffer = xhr.responseText;
                
                // SSE 메시지 파싱
                const lines = newData.split('\n');
                for (const line of lines) {
                    if (line.startsWith('data: ')) {
                        try {
                            const data = JSON.parse(line.substring(6));
                            handleSSEMessage(data);
                        } catch (e) {
                            console.warn('SSE 파싱 오류:', e);
                        }
                    }
                }
            };
            
            xhr.onerror = function() {
                console.error('❌ SSE 연결 오류');
                alert('서버 연결 오류');
                closeAddDocTypeModal();
            };
            
            xhr.ontimeout = function() {
                console.error('❌ SSE 타임아웃');
                alert('분석 시간 초과');
                closeAddDocTypeModal();
            };
            
            xhr.timeout = 120000; // 2분
            xhr.send(formData);
        }

        // SSE 메시지 처리
        function handleSSEMessage(data) {
            console.log('📨 SSE:', data);
            
            switch(data.type) {
                case 'progress':
                    updateAnalysisStep(data.step, data.status, data.message);
                    break;
                    
                case 'result':
                    console.log('✅ 분석 완료!');
                    analysisResult = data.data;
                    showAnalysisResult(data.data);
                    break;
                    
                case 'error':
                    console.error('❌ 분석 오류:', data.error);
                    alert('분석 중 오류: ' + data.error.message);
                    closeAddDocTypeModal();
                    break;
            }
        }

        // 분석 결과 표시 (v2.0 맥락 기반)
        function showAnalysisResult(data) {
            document.getElementById('docTypeStep2').style.display = 'none';
            document.getElementById('docTypeStep3').style.display = 'block';
            document.getElementById('addDocTypeModalTitle').textContent = '✅ 분석 완료';
            
            // 푸터 버튼 복원 및 변경
            const footer = document.getElementById('docTypeModalFooter');
            footer.style.display = 'flex';
            
            const actionBtn = document.getElementById('docTypeActionBtn');
            actionBtn.textContent = '저장';
            actionBtn.onclick = saveAnalyzedDocType;
            
            // v2.0: 맥락 정보
            const context = data.context || {};
            const structure = data.structure || {};
            const config = data.config || {};
            
            // 요약 표시
            document.getElementById('analysisResultSummary').innerHTML = `
                <div class="summary-item"><strong>유형:</strong> ${context.documentType || '?'}</div>
                <div class="summary-item"><strong>페이지:</strong> ${structure.pageEstimate || '?'}p</div>
                <div class="summary-item"><strong>섹션:</strong> ${(structure.sectionGuides || structure.sections)?.length || '?'}개</div>
            `;
            
            // 상세 결과 표시
            const sections = structure.sectionGuides || structure.sections || [];
            
            document.getElementById('analysisResultToc').innerHTML = `
                <div style="margin-bottom: 16px; padding: 12px; background: var(--ui-bg); border-radius: 6px;">
                    <h5 style="margin-bottom: 8px; font-size: 11px; color: var(--ui-accent);">📋 문서 맥락</h5>
                    <p style="font-size: 11px; color: var(--ui-dim); margin-bottom: 4px;"><strong>목적:</strong> ${context.purpose || '-'}</p>
                    <p style="font-size: 11px; color: var(--ui-dim); margin-bottom: 4px;"><strong>대상:</strong> ${context.audience || '-'}</p>
                    <p style="font-size: 11px; color: var(--ui-dim);"><strong>톤:</strong> ${context.tone || '-'}</p>
                </div>
                
                <h5 style="margin-bottom: 10px; font-size: 12px; color: var(--ui-dim);">📐 문서 구조</h5>
                <p style="font-size: 11px; color: var(--ui-text); margin-bottom: 10px;"><strong>논리 흐름:</strong> ${structure.logicFlow || '-'}</p>
                
                ${sections.length > 0 ? `
                    <ul class="toc-list">
                        ${sections.map(s => `
                            <li class="toc-level-${s.level || 1}">
                                <strong>${s.name || s.title}</strong>
                                <span style="font-size: 10px; color: var(--ui-dim); display: block;">${s.role || ''}</span>
                            </li>
                        `).join('')}
                    </ul>
                ` : `
                    <p style="font-size: 12px; color: var(--ui-warning);">⚠️ 구조를 파악하지 못했습니다.</p>
                `}
            `;
        }

        // 분석 결과 저장
        async function saveAnalyzedDocType() {
            if (!analysisResult || !analysisResult.config) {
                alert('저장할 분석 결과가 없습니다.');
                return;
            }
            
            const savedName = analysisResult.config.name;  // ← 미리 저장!
            
            const actionBtn = document.getElementById('docTypeActionBtn');
            actionBtn.disabled = true;
            actionBtn.textContent = '저장 중...';
            
            try {
                const response = await fetch('/api/doc-types', {
                    method: 'POST',
                    headers: {'Content-Type': 'application/json'},
                    body: JSON.stringify(analysisResult.config)
                });
                
                const data = await response.json();
                
                if (data.error) {
                    throw new Error(data.error);
                }
                
                closeAddDocTypeModal();
                loadDocTypes();
                loadUserTemplates();
                setStatus(`문서 유형 "${savedName}" 추가 완료`, true);  // ← 저장한 값 사용!
                
            } catch (error) {
                alert('저장 실패: ' + error.message);
            } finally {
                actionBtn.disabled = false;
                actionBtn.textContent = '저장';
            }
        }

        // ===== 문서 유형 삭제 =====
        async function deleteDocType(typeId) {
            if (!confirm('이 문서 유형을 삭제하시겠습니까?')) return;
            
            try {
                const response = await fetch(`/api/doc-types/${typeId}`, {
                    method: 'DELETE'
                });
                
                if (!response.ok) {
                    throw new Error('삭제 실패');
                }
                
                docTypes = docTypes.filter(t => t.id !== typeId);
                renderDocTypeList();
                
                // 삭제된 유형이 선택되어 있었으면 첫 번째로 변경
                if (currentDocType === typeId) {
                    const firstEnabled = docTypes.find(t => t.enabled);
                    if (firstEnabled) selectDocType(firstEnabled.id);
                }
                
                setStatus('문서 유형 삭제 완료', true);
                
            } catch (error) {
                alert('삭제 오류: ' + error.message);
            }
        }
