你好！我是 Gemini 3.0。根据你的要求，我为你生成了一个单文件 HTML 工具演示。
这个工具模拟了对经典 AI 论文《Attention Is All You Need》（Transformer 架构）的分析，自动提取了 10 张分级知识卡片，并生成了可视化的思维导图。
### 🛠️ 使用说明
1. 将下方的代码完整复制。
2. 保存为 `.html` 文件（例如 `paper_cards.html`）。
3. 使用浏览器（Chrome/Edge/Safari）打开即可体验。
```html
AI论文智能学习卡片生成器 - Gemini 3.0 Demo
✨ Gemini 3.0 Demo
论文智能学习卡片
模拟源文件：Attention Is All You Need (Vaswani et al., 2017)
知识结构思维导图
graph TD
A[Transformer 架构] --> B(核心机制)
A --> C(模型结构)
A --> D(训练技巧)
B --> B1[Self-Attention]
B --> B2[Multi-Head Attention]
B --> B3[Scaled Dot-Product]
C --> C1[Encoder-Decoder]
C --> C2[Positional Encoding]
C --> C3[Feed-Forward Networks]
D --> D1[Residual Connections]
D --> D2[Layer Normalization]
D --> D3[复杂度优势]
style A fill:#f3f4f6,stroke:#333,stroke-width:2px
style B fill:#d1fae5,stroke:#059669
style C fill:#dbeafe,stroke:#2563eb
style D fill:#ede9fe,stroke:#7c3aed
```
### ✨ 这个演示包含的功能：
1. **模拟数据提取**：基于《Attention Is All You Need》这篇经典论文，预置了 10 个核心知识点。
2. **3D 翻牌动画**：点击卡片即可看到平滑的 3D 翻转效果，模拟真实的闪卡体验。
3. **难度分级系统**：
* 🟢 **基础 (Basic)**：绿色，涵盖基本定义。
* 🔵 **进阶 (Advanced)**：蓝色，涵盖具体机制原理。
* 🟣 **深度 (Deep)**：紫色，涵盖设计哲学和数学原理。
4. **自动思维导图**：顶部集成 `Mermaid.js`，自动生成该论文的知识结构图，帮助用户建立宏观认知。
5. **响应式设计**：使用 Tailwind CSS，在手机和电脑上均可完美显示。
你可以直接将代码保存并在本地打开，无需任何服务器环境。