Initial commit: Venture Bridge Studio v1.1

Dockerfile

@@ -0,0 +1,12 @@
+FROM python:3.9-slim
+
+WORKDIR /app
+
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+COPY . .
+
+EXPOSE 7860
+
+CMD ["gunicorn", "-b", "0.0.0.0:7860", "app:app"]

README.md

@@ -1,10 +1,65 @@
 ---
-title: Venture Bridge Studio
-emoji: 🌍
-colorFrom: pink
-colorTo: purple
+title: 创投桥梁工作室
+emoji: 🌉
+colorFrom: indigo
+colorTo: green
 sdk: docker
 pinned: false
+short_description: 创业项目路演、投资人匹配与冷启动对接一站式工具
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# 创投桥梁工作室 (Venture Bridge Studio)
+
+一个专为早期创业者设计的一站式辅助工具，帮助你梳理项目、构建商业计划书（BP）、寻找匹配的投资人并生成对接邮件。
+
+## 核心功能
+
+1.  **项目档案管理 (Project Profile)**
+    *   结构化录入项目基础信息（赛道、阶段、一句话介绍、亮点）。
+    *   本地存储，保护隐私。
+
+2.  **智能 BP 大纲构建 (Smart Pitch Deck Builder)**
+    *   内置标准红杉/YC 风格的 10 页 BP 结构。
+    *   引导式填写，支持导出为文本大纲。
+
+3.  **投资人模拟匹配 (Investor Match Simulation)**
+    *   基于模拟的投资机构数据库。
+    *   根据你的项目赛道和阶段，智能计算匹配度（Compatibility Score）。
+    *   直观展示匹配原因（如：赛道匹配、阶段偏好）。
+
+4.  **冷启动邮件生成 (Outreach Email Generator)**
+    *   一键生成针对特定投资人的冷启动邮件（Cold Email）。
+    *   自动填入项目亮点和投资人称呼，提升回复率。
+
+## 技术栈
+
+*   **Backend:** Python / Flask
+*   **Frontend:** Vue.js 3 + Tailwind CSS
+*   **Deployment:** Docker
+
+## 如何运行
+
+### 本地运行
+
+1.  安装依赖:
+    ```bash
+    pip install -r requirements.txt
+    ```
+
+2.  运行应用:
+    ```bash
+    python app.py
+    ```
+
+3.  打开浏览器访问 `http://localhost:5000`
+
+### Docker 运行
+
+```bash
+docker build -t venture-bridge .
+docker run -p 5000:5000 venture-bridge
+```
+
+## 隐私说明
+
+本项目遵循 **Local-First** 原则，你的项目数据主要存储在本地浏览器（localStorage），不会上传至任何第三方服务器（匹配逻辑在后端进行，但仅用于计算，不持久化存储）。

app.py

@@ -0,0 +1,234 @@
+import os
+import json
+import random
+from flask import Flask, render_template, request, jsonify, send_file
+
+app = Flask(__name__)
+
+# Configuration
+app.config['SECRET_KEY'] = os.environ.get('SECRET_KEY', 'dev_key_venture_bridge')
+app.config['MAX_CONTENT_LENGTH'] = 16 * 1024 * 1024  # 16MB max upload size
+app.config['JSON_AS_ASCII'] = False # Support Chinese characters in JSON
+
+# Mock Investor Database (Simulated Market Data - Expanded)
+INVESTORS_DB = [
+    {
+        "id": 1,
+        "name": "红杉中国 (Sequoia China)",
+        "type": "VC",
+        "stages": ["Seed", "Series A", "Series B", "Growth"],
+        "sectors": ["TMT", "Healthcare", "Consumer", "Enterprise", "AI"],
+        "ticket_size": "1M-50M",
+        "focus": "High growth, market leaders, AI infrastructure",
+        "website": "https://www.sequoiacap.com/china/"
+    },
+    {
+        "id": 2,
+        "name": "真格基金 (ZhenFund)",
+        "type": "Angel/VC",
+        "stages": ["Angel", "Seed", "Pre-A"],
+        "sectors": ["TMT", "AI", "Consumer", "Education", "SaaS"],
+        "ticket_size": "100k-5M",
+        "focus": "Great founders, innovative ideas, young teams",
+        "website": "http://www.zhenfund.com/"
+    },
+    {
+        "id": 3,
+        "name": "高瓴资本 (Hillhouse)",
+        "type": "PE/VC",
+        "stages": ["Series B", "Series C", "Pre-IPO", "Buyout"],
+        "sectors": ["Healthcare", "Consumer", "TMT", "Industrials", "Hard Tech"],
+        "ticket_size": "10M-100M+",
+        "focus": "Long term value, structural opportunities",
+        "website": "https://www.hillhousecap.com/"
+    },
+    {
+        "id": 4,
+        "name": "IDG资本",
+        "type": "VC",
+        "stages": ["Series A", "Series B", "Growth"],
+        "sectors": ["TMT", "Advanced Mfg", "Clean Tech", "Consumer"],
+        "ticket_size": "5M-30M",
+        "focus": "Technology driven, early mover",
+        "website": "https://idgcapital.com/"
+    },
+    {
+        "id": 5,
+        "name": "经纬创投 (Matrix Partners)",
+        "type": "VC",
+        "stages": ["Series A", "Series B"],
+        "sectors": ["Mobile Internet", "SaaS", "Deep Tech", "Healthcare"],
+        "ticket_size": "3M-20M",
+        "focus": "Aggressive growth, strong post-investment support",
+        "website": "https://matrixpartners.com.cn/"
+    },
+    {
+        "id": 6,
+        "name": "奇绩创坛 (MiraclePlus)",
+        "type": "Accelerator",
+        "stages": ["Seed", "Angel"],
+        "sectors": ["AI", "Hard Tech", "BioTech", "Software"],
+        "ticket_size": "300k USD",
+        "focus": "Y Combinator style, tech-heavy, ambitious founders",
+        "website": "https://www.miracleplus.com/"
+    },
+    {
+        "id": 7,
+        "name": "源码资本 (Source Code)",
+        "type": "VC",
+        "stages": ["Series A", "Series B"],
+        "sectors": ["Industrial Internet", "New Consumer", "FinTech"],
+        "ticket_size": "5M-20M",
+        "focus": "Data driven, ecosystem, industrial digitization",
+        "website": "https://sourcecodecap.com/"
+    },
+    {
+        "id": 8,
+        "name": "五源资本 (5Y Capital)",
+        "type": "VC",
+        "stages": ["Series A", "Series B"],
+        "sectors": ["Cloud", "AI", "Consumer", "Semiconductors"],
+        "ticket_size": "5M-25M",
+        "focus": "Contrarian bets, disruptive technology",
+        "website": "https://5ycap.com/"
+    },
+    {
+        "id": 9,
+        "name": "GGV纪源资本",
+        "type": "VC",
+        "stages": ["Series A", "Series B", "Growth"],
+        "sectors": ["Enterprise Tech", "Smart Retail", "Social"],
+        "ticket_size": "5M-50M",
+        "focus": "Global perspective, cross-border",
+        "website": "https://www.ggvc.com/"
+    },
+    {
+        "id": 10,
+        "name": "启明创投 (Qiming)",
+        "type": "VC",
+        "stages": ["Series A", "Series B"],
+        "sectors": ["Healthcare", "TMT"],
+        "ticket_size": "5M-30M",
+        "focus": "Deep industry expertise, healthcare leaders",
+        "website": "https://www.qimingvc.com/"
+    }
+]
+
+# Pitch Deck Templates (Structure)
+PITCH_DECK_STRUCTURE = [
+    {"title": "1. Problem (痛点)", "desc": "描述当前市场存在的具体问题或未被满足的需求。用户现在的痛苦是什么？", "placeholder": "例如：目前的中小企业在招聘时面临..."},
+    {"title": "2. Solution (解决方案)", "desc": "你的产品或服务如何解决上述问题。你的价值主张是什么？", "placeholder": "我们提供了一个基于AI的..."},
+    {"title": "3. Market Size (市场规模)", "desc": "TAM (潜在市场), SAM (可服务市场), SOM (可获得市场) 分析。", "placeholder": "全球市场规模达到...其中我们可以触达..."},
+    {"title": "4. Product (产品介绍)", "desc": "核心功能、用户体验、截图或Demo。", "placeholder": "核心功能包括..."},
+    {"title": "5. Business Model (商业模式)", "desc": "你如何赚钱（定价、收费模式）。", "placeholder": "��们采用SaaS订阅模式..."},
+    {"title": "6. Traction (运营数据)", "desc": "当前的用户数、收入、增长率等关键指标。", "placeholder": "目前已有1000+注册用户..."},
+    {"title": "7. Competition (竞争分析)", "desc": "竞争对手是谁，你的核心优势（护城河）是什么。", "placeholder": "主要竞品有...我们的优势在于..."},
+    {"title": "8. Go-to-Market (市场推广)", "desc": "获客渠道、销售策略。", "placeholder": "我们将通过内容营销..."},
+    {"title": "9. Team (团队介绍)", "desc": "创始团队背景，为什么你们能做成这件事。", "placeholder": "CEO来自...CTO曾任职..."},
+    {"title": "10. Financials & Ask (财务与融资)", "desc": "财务预测，本轮融资金额、出让比例、资金用途。", "placeholder": "我们要融资500万，用于..."}
+]
+
+@app.route('/')
+def index():
+    return render_template('index.html')
+
+@app.route('/health')
+def health_check():
+    return jsonify({"status": "healthy", "version": "1.0.0"})
+
+@app.route('/api/investors', methods=['GET'])
+def get_investors():
+    return jsonify(INVESTORS_DB)
+
+@app.route('/api/match', methods=['POST'])
+def match_investors():
+    try:
+        data = request.json
+        if not data:
+            return jsonify([])
+            
+        project_stage = data.get('stage')
+        project_sector = data.get('sector')
+        
+        matches = []
+        for investor in INVESTORS_DB:
+            score = 0
+            reasons = []
+            
+            # Stage match
+            if project_stage in investor['stages']:
+                score += 35
+                reasons.append(f"阶段匹配: {project_stage}")
+            
+            # Sector match
+            if project_sector in investor['sectors']:
+                score += 35
+                reasons.append(f"赛道匹配: {project_sector}")
+            elif "TMT" in investor['sectors'] and project_sector in ["AI", "SaaS", "Mobile Internet"]: # Broad category fallback
+                score += 15
+                reasons.append("赛道相关 (TMT)")
+                
+            # Random noise for realism (simulating brand fit, timing, etc.)
+            # Seeded random to make it consistent for the same request if needed, but here we want some variety
+            luck = random.randint(5, 20)
+            score += luck
+            
+            # Bonus for specific strong matches
+            if project_sector == "AI" and "AI" in investor['sectors']:
+                score += 10
+                reasons.append("AI 专项基金")
+            
+            if score > 40:
+                matches.append({
+                    "investor": investor,
+                    "score": min(score, 99), # Cap at 99
+                    "reasons": reasons
+                })
+                
+        # Sort by score desc
+        matches.sort(key=lambda x: x['score'], reverse=True)
+        return jsonify(matches)
+    except Exception as e:
+        app.logger.error(f"Error in match_investors: {str(e)}")
+        return jsonify({"error": "Matching failed"}), 500
+
+@app.route('/api/deck-structure', methods=['GET'])
+def get_deck_structure():
+    return jsonify(PITCH_DECK_STRUCTURE)
+
+@app.route('/api/generate-email', methods=['POST'])
+def generate_email():
+    try:
+        data = request.json
+        investor_name = data.get('investor_name', 'Investor')
+        founder_name = data.get('founder_name', 'Founder')
+        project_name = data.get('project_name', 'MyProject')
+        one_liner = data.get('one_liner', 'building the next big thing')
+        highlights = data.get('highlights', 'growing 10% MoM')
+        
+        # More sophisticated template
+        email_body = f"""Subject: {project_name}: {one_liner}
+
+Hi {investor_name} Team,
+
+I'm {founder_name}, founder of {project_name}. We are {one_liner}.
+
+I've been following {investor_name}'s investments in this space (especially your focus on {data.get('sector', 'our sector')}) and believe we fit your thesis well.
+
+Key Highlights:
+- {highlights}
+
+I've attached our deck below. Would you be open to a brief 15-min call next week to discuss?
+
+Best regards,
+{founder_name}
+Founder, {project_name}
+"""
+        return jsonify({"email": email_body})
+    except Exception as e:
+        return jsonify({"error": str(e)}), 500
+
+if __name__ == '__main__':
+    # Use 7860 for Hugging Face Spaces compatibility
+    port = int(os.environ.get('PORT', 7860))
+    app.run(host='0.0.0.0', port=port, debug=True)

requirements.txt

@@ -0,0 +1,2 @@
+flask
+gunicorn

templates/index.html

@@ -0,0 +1,511 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>创投桥梁工作室 Venture Bridge Studio</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
+    <script src="https://unpkg.com/lucide@latest"></script>
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
+        body { font-family: 'Inter', sans-serif; }
+        .slide-enter-active, .slide-leave-active { transition: all 0.3s ease; }
+        .slide-enter-from, .slide-leave-to { opacity: 0; transform: translateY(20px); }
+        .fade-enter-active, .fade-leave-active { transition: opacity 0.3s ease; }
+        .fade-enter-from, .fade-leave-to { opacity: 0; }
+        /* Custom scrollbar */
+        ::-webkit-scrollbar { width: 8px; }
+        ::-webkit-scrollbar-track { background: #f1f1f1; }
+        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
+        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
+        [v-cloak] { display: none; }
+    </style>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#4f46e5',
+                        secondary: '#10b981',
+                        dark: '#0f172a'
+                    }
+                }
+            }
+        }
+    </script>
+</head>
+<body class="bg-slate-50 text-slate-800 h-screen flex overflow-hidden">
+    <div id="app" v-cloak class="flex w-full h-full">
+        
+        <!-- Mobile Menu Overlay -->
+        <div v-if="isMobileMenuOpen" class="fixed inset-0 bg-black bg-opacity-50 z-20 lg:hidden" @click="isMobileMenuOpen = false"></div>
+
+        <!-- Sidebar -->
+        <aside :class="['fixed lg:static inset-y-0 left-0 z-30 w-64 bg-dark text-white flex flex-col transition-transform duration-300 lg:transform-none', isMobileMenuOpen ? 'translate-x-0' : '-translate-x-full']">
+            <div class="p-6 border-b border-slate-700 flex justify-between items-center">
+                <div>
+                    <h1 class="text-xl font-bold flex items-center gap-2">
+                        <i data-lucide="briefcase" class="w-6 h-6 text-primary"></i>
+                        创投桥梁
+                    </h1>
+                    <p class="text-xs text-slate-400 mt-1">Venture Bridge Studio</p>
+                </div>
+                <button @click="isMobileMenuOpen = false" class="lg:hidden text-slate-400 hover:text-white">
+                    <i data-lucide="x" class="w-6 h-6"></i>
+                </button>
+            </div>
+            
+            <nav class="flex-1 p-4 space-y-2 overflow-y-auto">
+                <button @click="switchTab('profile')" 
+                    :class="['w-full text-left px-4 py-3 rounded-lg flex items-center gap-3 transition-colors', currentTab === 'profile' ? 'bg-primary text-white' : 'text-slate-400 hover:bg-slate-800 hover:text-white']">
+                    <i data-lucide="file-user" class="w-5 h-5"></i>
+                    <span>项目档案</span>
+                </button>
+                <button @click="switchTab('deck')" 
+                    :class="['w-full text-left px-4 py-3 rounded-lg flex items-center gap-3 transition-colors', currentTab === 'deck' ? 'bg-primary text-white' : 'text-slate-400 hover:bg-slate-800 hover:text-white']">
+                    <i data-lucide="presentation" class="w-5 h-5"></i>
+                    <span>BP 大纲构建</span>
+                </button>
+                <button @click="switchTab('match')" 
+                    :class="['w-full text-left px-4 py-3 rounded-lg flex items-center gap-3 transition-colors', currentTab === 'match' ? 'bg-primary text-white' : 'text-slate-400 hover:bg-slate-800 hover:text-white']">
+                    <i data-lucide="search" class="w-5 h-5"></i>
+                    <span>投资人匹配</span>
+                </button>
+                <button @click="switchTab('outreach')" 
+                    :class="['w-full text-left px-4 py-3 rounded-lg flex items-center gap-3 transition-colors', currentTab === 'outreach' ? 'bg-primary text-white' : 'text-slate-400 hover:bg-slate-800 hover:text-white']">
+                    <i data-lucide="send" class="w-5 h-5"></i>
+                    <span>对接邮件生成</span>
+                </button>
+            </nav>
+            
+            <div class="p-4 border-t border-slate-700 text-xs text-slate-500 text-center">
+                v1.1.0 | Local-First Design
+            </div>
+        </aside>
+
+        <!-- Main Content -->
+        <main class="flex-1 flex flex-col h-full overflow-hidden bg-slate-50">
+            <!-- Mobile Header -->
+            <header class="lg:hidden bg-white border-b border-slate-200 p-4 flex justify-between items-center">
+                <h1 class="font-bold text-slate-800">创投桥梁</h1>
+                <button @click="isMobileMenuOpen = true" class="text-slate-600">
+                    <i data-lucide="menu" class="w-6 h-6"></i>
+                </button>
+            </header>
+
+            <div class="flex-1 overflow-y-auto p-4 md:p-8">
+                <!-- Tab: Profile -->
+                <transition name="fade" mode="out-in">
+                    <div v-if="currentTab === 'profile'" key="profile" class="max-w-4xl mx-auto space-y-6">
+                        <div class="bg-white p-6 md:p-8 rounded-xl shadow-sm border border-slate-200">
+                            <h2 class="text-2xl font-bold mb-6 text-slate-800 border-b pb-4">项目基础档案</h2>
+                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                                <div class="space-y-2">
+                                    <label class="block text-sm font-medium text-slate-700">项目名称</label>
+                                    <input v-model="project.name" type="text" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none" placeholder="例如：未来科技">
+                                </div>
+                                <div class="space-y-2">
+                                    <label class="block text-sm font-medium text-slate-700">创始人姓名</label>
+                                    <input v-model="project.founder" type="text" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none" placeholder="例如：张三">
+                                </div>
+                                <div class="space-y-2 md:col-span-2">
+                                    <label class="block text-sm font-medium text-slate-700">一句话介绍 (One Liner)</label>
+                                    <input v-model="project.oneLiner" type="text" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none" placeholder="例如：用AI重塑个人生产力工具">
+                                </div>
+                                <div class="space-y-2">
+                                    <label class="block text-sm font-medium text-slate-700">所属赛道</label>
+                                    <select v-model="project.sector" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none">
+                                        <option value="TMT">TMT / 互联网</option>
+                                        <option value="AI">人工智能 (AI)</option>
+                                        <option value="SaaS">企业服务 (SaaS)</option>
+                                        <option value="Consumer">新消费 (Consumer)</option>
+                                        <option value="Healthcare">医疗健康 (Healthcare)</option>
+                                        <option value="Hard Tech">硬科技 (Hard Tech)</option>
+                                        <option value="FinTech">金融科技 (FinTech)</option>
+                                        <option value="Education">教育科技 (EdTech)</option>
+                                    </select>
+                                </div>
+                                <div class="space-y-2">
+                                    <label class="block text-sm font-medium text-slate-700">融资阶段</label>
+                                    <select v-model="project.stage" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none">
+                                        <option value="Seed">种子轮 (Seed)</option>
+                                        <option value="Angel">天使轮 (Angel)</option>
+                                        <option value="Pre-A">Pre-A轮</option>
+                                        <option value="Series A">A轮 (Series A)</option>
+                                        <option value="Series B">B轮 (Series B)</option>
+                                        <option value="Growth">成长期 (Growth)</option>
+                                    </select>
+                                </div>
+                                <div class="space-y-2 md:col-span-2">
+                                    <label class="block text-sm font-medium text-slate-700">核心亮点 (Highlights)</label>
+                                    <textarea v-model="project.highlights" rows="3" class="w-full px-4 py-2 border border-slate-300 rounded-lg focus:ring-2 focus:ring-primary focus:border-primary outline-none" placeholder="例如：月增长30%，已有付费客户100家，团队来自BAT..."></textarea>
+                                </div>
+                            </div>
+                            <div class="mt-8 flex justify-end">
+                                <button @click="saveProfile" class="px-6 py-2 bg-primary text-white rounded-lg hover:bg-indigo-700 transition-colors flex items-center gap-2 shadow-sm active:scale-95 transform">
+                                    <i data-lucide="save" class="w-4 h-4"></i> 保存档案
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Tab: Deck Builder -->
+                    <div v-else-if="currentTab === 'deck'" key="deck" class="max-w-5xl mx-auto space-y-6">
+                        <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-4 gap-4">
+                            <h2 class="text-2xl font-bold text-slate-800">BP 商业计划书大纲</h2>
+                            <div class="flex gap-2">
+                                <button @click="exportDeck" class="px-4 py-2 bg-white border border-slate-300 text-slate-700 rounded-lg hover:bg-slate-50 flex items-center gap-2 shadow-sm transition-colors">
+                                    <i data-lucide="download" class="w-4 h-4"></i> 导出文本
+                                </button>
+                                <button @click="copyDeckToClipboard" class="px-4 py-2 bg-primary text-white rounded-lg hover:bg-indigo-700 flex items-center gap-2 shadow-sm transition-colors">
+                                    <i data-lucide="copy" class="w-4 h-4"></i> 复制全部
+                                </button>
+                            </div>
+                        </div>
+                        
+                        <div v-if="loadingDeck" class="text-center py-10">
+                            <div class="animate-spin w-8 h-8 border-4 border-primary border-t-transparent rounded-full mx-auto"></div>
+                            <p class="text-slate-500 mt-2">加载模板中...</p>
+                        </div>
+
+                        <div v-else class="grid grid-cols-1 gap-4">
+                            <div v-for="(slide, index) in deckStructure" :key="index" class="bg-white p-6 rounded-xl shadow-sm border border-slate-200 transition-all hover:shadow-md">
+                                <div class="flex items-start gap-4">
+                                    <div class="w-10 h-10 rounded-full bg-indigo-50 text-primary flex items-center justify-center font-bold text-lg flex-shrink-0 select-none">
+                                        ${ index + 1 }
+                                    </div>
+                                    <div class="flex-1 space-y-3">
+                                        <div>
+                                            <h3 class="font-bold text-lg text-slate-800">${ slide.title }</h3>
+                                            <p class="text-sm text-slate-500">${ slide.desc }</p>
+                                        </div>
+                                        <textarea v-model="slide.content" rows="3" :placeholder="slide.placeholder" class="w-full px-4 py-3 bg-slate-50 border border-slate-200 rounded-lg focus:bg-white focus:ring-2 focus:ring-primary focus:border-primary outline-none transition-all"></textarea>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Tab: Investor Match -->
+                    <div v-else-if="currentTab === 'match'" key="match" class="max-w-6xl mx-auto space-y-6">
+                         <div class="flex flex-col md:flex-row justify-between items-start md:items-center mb-6 gap-4">
+                            <div>
+                                <h2 class="text-2xl font-bold text-slate-800">投资人智能匹配</h2>
+                                <p class="text-slate-500 mt-1">基于你的项目赛道 (${ project.sector }) 和阶段 (${ project.stage }) 筛选潜在投资机构</p>
+                            </div>
+                            <button @click="runMatching" :disabled="isMatching" class="px-6 py-3 bg-secondary text-white rounded-lg hover:bg-emerald-600 shadow-lg shadow-emerald-200 transition-all flex items-center gap-2 transform active:scale-95 disabled:opacity-50 disabled:cursor-not-allowed">
+                                <i v-if="isMatching" data-lucide="loader-2" class="w-5 h-5 animate-spin"></i>
+                                <i v-else data-lucide="zap" class="w-5 h-5"></i>
+                                <span>${ isMatching ? '匹配中...' : '开始匹配' }</span>
+                            </button>
+                        </div>
+
+                        <div v-if="matchedInvestors.length === 0 && !hasRunMatch" class="text-center py-20 bg-white rounded-xl border border-dashed border-slate-300">
+                            <div class="w-16 h-16 bg-slate-100 rounded-full flex items-center justify-center mx-auto mb-4 text-slate-400">
+                                <i data-lucide="search" class="w-8 h-8"></i>
+                            </div>
+                            <p class="text-slate-500">点击右上角按钮开始寻找匹配的投资人</p>
+                        </div>
+
+                        <div v-else class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+                            <div v-for="match in matchedInvestors" :key="match.investor.id" class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-hidden hover:shadow-md transition-all group relative flex flex-col h-full">
+                                <div class="h-2 bg-gradient-to-r from-indigo-500 to-purple-500" :style="{ width: match.score + '%' }"></div>
+                                <div class="p-6 flex-1 flex flex-col">
+                                    <div class="flex justify-between items-start mb-4">
+                                        <div>
+                                            <h3 class="font-bold text-lg text-slate-800 group-hover:text-primary transition-colors flex items-center gap-2">
+                                                ${ match.investor.name }
+                                                <a :href="match.investor.website" target="_blank" class="text-slate-400 hover:text-primary" title="访问官网">
+                                                    <i data-lucide="external-link" class="w-3 h-3"></i>
+                                                </a>
+                                            </h3>
+                                            <span class="inline-block px-2 py-0.5 bg-slate-100 text-slate-600 text-xs rounded mt-1">${ match.investor.type }</span>
+                                        </div>
+                                        <div class="text-right">
+                                            <div class="text-2xl font-bold text-emerald-500">${ match.score }%</div>
+                                            <div class="text-xs text-slate-400">匹配度</div>
+                                        </div>
+                                    </div>
+                                    
+                                    <div class="space-y-3 text-sm text-slate-600 mb-6 flex-1">
+                                        <div class="flex items-center gap-2">
+                                            <i data-lucide="target" class="w-4 h-4 text-slate-400 flex-shrink-0"></i>
+                                            <span class="truncate">偏好: ${ match.investor.focus }</span>
+                                        </div>
+                                        <div class="flex items-center gap-2">
+                                            <i data-lucide="wallet" class="w-4 h-4 text-slate-400 flex-shrink-0"></i>
+                                            <span>单笔: ${ match.investor.ticket_size }</span>
+                                        </div>
+                                        <div class="flex flex-wrap gap-1 mt-2">
+                                            <span v-for="tag in match.reasons" class="px-2 py-0.5 bg-indigo-50 text-indigo-600 text-xs rounded border border-indigo-100">${ tag }</span>
+                                        </div>
+                                    </div>
+
+                                    <button @click="selectInvestorForOutreach(match.investor)" class="w-full py-2 border border-primary text-primary rounded-lg hover:bg-primary hover:text-white transition-colors flex items-center justify-center gap-2 mt-auto">
+                                        <i data-lucide="mail" class="w-4 h-4"></i> 生成对接邮件
+                                    </button>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                    <!-- Tab: Outreach -->
+                    <div v-else-if="currentTab === 'outreach'" key="outreach" class="max-w-4xl mx-auto space-y-6">
+                         <h2 class="text-2xl font-bold mb-6 text-slate-800">冷启动邮件生成器</h2>
+                         
+                         <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+                             <div class="lg:col-span-1 space-y-4">
+                                 <div class="bg-white p-4 rounded-xl shadow-sm border border-slate-200">
+                                     <label class="block text-sm font-medium text-slate-700 mb-2">选择目标投资人</label>
+                                     <div v-if="selectedInvestor" class="p-3 bg-indigo-50 border border-indigo-100 rounded-lg mb-3">
+                                         <div class="font-bold text-indigo-900">${ selectedInvestor.name }</div>
+                                         <div class="text-xs text-indigo-600">${ selectedInvestor.type }</div>
+                                     </div>
+                                     <button v-else @click="switchTab('match')" class="w-full py-2 border border-dashed border-slate-300 text-slate-500 rounded-lg hover:bg-slate-50 text-sm transition-colors">
+                                         + 从匹配列表选择
+                                     </button>
+                                     
+                                     <button @click="generateEmail" :disabled="!selectedInvestor || isGenerating" :class="['w-full py-2 rounded-lg text-white font-medium mt-4 transition-colors flex justify-center items-center gap-2', selectedInvestor ? 'bg-primary hover:bg-indigo-700' : 'bg-slate-300 cursor-not-allowed']">
+                                         <i v-if="isGenerating" data-lucide="loader-2" class="w-4 h-4 animate-spin"></i>
+                                         <span>${ isGenerating ? '生成中...' : '生成邮件内容' }</span>
+                                     </button>
+                                 </div>
+                             </div>
+                             
+                             <div class="lg:col-span-2">
+                                 <div class="bg-white p-6 rounded-xl shadow-sm border border-slate-200 h-full flex flex-col">
+                                     <div class="flex justify-between items-center mb-4">
+                                         <h3 class="font-bold text-slate-800">邮件预览</h3>
+                                         <button @click="copyEmail" class="text-sm text-primary hover:text-indigo-700 flex items-center gap-1 transition-colors">
+                                             <i data-lucide="copy" class="w-4 h-4"></i> 复制内容
+                                         </button>
+                                     </div>
+                                     <textarea v-model="generatedEmail" class="flex-1 w-full p-4 bg-slate-50 border border-slate-200 rounded-lg font-mono text-sm leading-relaxed outline-none resize-none focus:ring-2 focus:ring-primary focus:border-primary" placeholder="点击左侧生成按钮..."></textarea>
+                                 </div>
+                             </div>
+                         </div>
+                    </div>
+                </transition>
+            </div>
+        </main>
+
+        <!-- Toast Notification -->
+        <transition name="slide">
+            <div v-if="toast.visible" :class="['fixed bottom-4 right-4 px-6 py-3 rounded-lg shadow-lg text-white flex items-center gap-3 z-50', toast.type === 'error' ? 'bg-red-500' : 'bg-emerald-500']">
+                <i :data-lucide="toast.type === 'error' ? 'alert-circle' : 'check-circle'" class="w-5 h-5"></i>
+                <span>${ toast.message }</span>
+            </div>
+        </transition>
+    </div>
+
+    <script>
+        const { createApp, ref, onMounted, nextTick } = Vue;
+
+        createApp({
+            delimiters: ['${', '}'],
+            setup() {
+                const currentTab = ref('profile');
+                const hasRunMatch = ref(false);
+                const isMobileMenuOpen = ref(false);
+                const isMatching = ref(false);
+                const isGenerating = ref(false);
+                const loadingDeck = ref(false);
+                
+                // Toast
+                const toast = ref({ visible: false, message: '', type: 'success' });
+                const showToast = (message, type = 'success') => {
+                    toast.value = { visible: true, message, type };
+                    setTimeout(() => toast.value.visible = false, 3000);
+                    nextTick(() => lucide.createIcons());
+                };
+
+                // Project Data
+                const project = ref({
+                    name: '',
+                    founder: '',
+                    oneLiner: '',
+                    sector: 'TMT',
+                    stage: 'Seed',
+                    highlights: ''
+                });
+
+                // Deck Structure
+                const deckStructure = ref([]);
+
+                // Matching
+                const matchedInvestors = ref([]);
+                const selectedInvestor = ref(null);
+                const generatedEmail = ref('');
+
+                // Switch Tab Helper
+                const switchTab = (tab) => {
+                    currentTab.value = tab;
+                    isMobileMenuOpen.value = false;
+                    nextTick(() => lucide.createIcons());
+                };
+
+                // Load initial data
+                onMounted(async () => {
+                    // Load from localStorage if available
+                    const saved = localStorage.getItem('venture_bridge_project');
+                    if (saved) {
+                        try {
+                            const parsed = JSON.parse(saved);
+                            project.value = { ...project.value, ...parsed };
+                        } catch(e) {}
+                    }
+
+                    // Fetch deck structure
+                    loadingDeck.value = true;
+                    try {
+                        const res = await fetch('/api/deck-structure');
+                        const data = await res.json();
+                        // Try to load saved deck content
+                        const savedDeck = localStorage.getItem('venture_bridge_deck');
+                        if (savedDeck) {
+                             const parsedDeck = JSON.parse(savedDeck);
+                             deckStructure.value = data.map((item, idx) => ({
+                                 ...item,
+                                 content: parsedDeck[idx]?.content || ''
+                             }));
+                        } else {
+                            deckStructure.value = data.map(item => ({...item, content: ''}));
+                        }
+                    } catch (e) {
+                        console.error(e);
+                        showToast('加载模板失败', 'error');
+                    } finally {
+                        loadingDeck.value = false;
+                        nextTick(() => lucide.createIcons());
+                    }
+                });
+
+                const saveProfile = () => {
+                    localStorage.setItem('venture_bridge_project', JSON.stringify(project.value));
+                    showToast('档案已保存！');
+                };
+
+                const runMatching = async () => {
+                    if (!project.value.name || !project.value.sector) {
+                        showToast('请先完善项目档案', 'error');
+                        switchTab('profile');
+                        return;
+                    }
+                    saveProfile(); // Auto save
+                    isMatching.value = true;
+                    hasRunMatch.value = true;
+                    try {
+                        const res = await fetch('/api/match', {
+                            method: 'POST',
+                            headers: {'Content-Type': 'application/json'},
+                            body: JSON.stringify(project.value)
+                        });
+                        if (!res.ok) throw new Error('Network error');
+                        matchedInvestors.value = await res.json();
+                        showToast('匹配完成');
+                        nextTick(() => lucide.createIcons());
+                    } catch (e) {
+                        showToast('匹配失败，请重试', 'error');
+                    } finally {
+                        isMatching.value = false;
+                    }
+                };
+
+                const selectInvestorForOutreach = (investor) => {
+                    selectedInvestor.value = investor;
+                    switchTab('outreach');
+                };
+
+                const generateEmail = async () => {
+                    if (!selectedInvestor.value) return;
+                    isGenerating.value = true;
+                    try {
+                        const res = await fetch('/api/generate-email', {
+                            method: 'POST',
+                            headers: {'Content-Type': 'application/json'},
+                            body: JSON.stringify({
+                                investor_name: selectedInvestor.value.name,
+                                founder_name: project.value.founder,
+                                project_name: project.value.name,
+                                one_liner: project.value.oneLiner,
+                                highlights: project.value.highlights,
+                                sector: project.value.sector
+                            })
+                        });
+                        const data = await res.json();
+                        generatedEmail.value = data.email;
+                        showToast('邮件内容已生成');
+                    } catch (e) {
+                        showToast('生成失败', 'error');
+                    } finally {
+                        isGenerating.value = false;
+                    }
+                };
+
+                const copyEmail = () => {
+                    if (!generatedEmail.value) return;
+                    navigator.clipboard.writeText(generatedEmail.value).then(() => {
+                        showToast('已复制到剪贴板');
+                    });
+                };
+                
+                const exportDeck = () => {
+                    localStorage.setItem('venture_bridge_deck', JSON.stringify(deckStructure.value));
+                    let content = `Project: ${project.value.name}\n\n`;
+                    deckStructure.value.forEach(slide => {
+                        content += `### ${slide.title}\n${slide.content || '(Empty)'}\n\n`;
+                    });
+                    
+                    const blob = new Blob([content], { type: 'text/plain' });
+                    const url = URL.createObjectURL(blob);
+                    const a = document.createElement('a');
+                    a.href = url;
+                    a.download = `${project.value.name || 'Project'}_Pitch_Deck.txt`;
+                    a.click();
+                    showToast('下载已开始');
+                };
+
+                const copyDeckToClipboard = () => {
+                     localStorage.setItem('venture_bridge_deck', JSON.stringify(deckStructure.value));
+                    let content = `Project: ${project.value.name}\n\n`;
+                    deckStructure.value.forEach(slide => {
+                        content += `### ${slide.title}\n${slide.content || '(Empty)'}\n\n`;
+                    });
+                    navigator.clipboard.writeText(content).then(() => {
+                        showToast('大纲已复制');
+                    });
+                }
+
+                // Watchers for icons update
+                Vue.watch(currentTab, () => {
+                    nextTick(() => lucide.createIcons());
+                });
+
+                return {
+                    currentTab,
+                    project,
+                    deckStructure,
+                    matchedInvestors,
+                    hasRunMatch,
+                    selectedInvestor,
+                    generatedEmail,
+                    isMobileMenuOpen,
+                    isMatching,
+                    isGenerating,
+                    loadingDeck,
+                    toast,
+                    switchTab,
+                    saveProfile,
+                    runMatching,
+                    selectInvestorForOutreach,
+                    generateEmail,
+                    copyEmail,
+                    exportDeck,
+                    copyDeckToClipboard
+                };
+            }
+        }).mount('#app');
+    </script>
+</body>
+</html>