[游戏名] — 圣地巡礼冒险地图

# 杀戮尖塔风格冒险地图 HTML 模板 > **核心原则：AI 只替换数据，不重新生成 HTML 结构。** ## 默认风格 **游戏内UI风**（半透明深色面板 + 高亮标记色 + 任务侧栏感） ## 风格映射 — CSS 变量替换生成时，用对应风格的 CSS 变量替换模板中 `:root` 区块： | 风格 | CSS 变量值 | |------|-----------| | 游戏内UI风 | `--bg:#0d1117; --canvas:rgba(22,27,34,0.95); --border:#30363d; --text:#c9d1d9; --text-dim:#8b949e; --accent:#58a6ff; --green:#3fb950; --gold:#d29922; --red:#f85149; --purple:#bc8cff; --pixel-font:'SF Mono',Monaco,Consolas,monospace;` | | 复古羊皮纸 | `--bg:#1a1208; --canvas:rgba(42,31,20,0.95); --border:#8b4513; --text:#d4c5a9; --text-dim:#a09070; --accent:#daa520; --green:#228b22; --gold:#daa520; --red:#c41e3a; --purple:#8b6914; --pixel-font:'Noto Serif SC','Songti SC',Georgia,serif;` | | 旅行手账风 | `--bg:#f5f0e8; --canvas:#faf6ee; --border:#8b7355; --text:#3d2b1f; --text-dim:#a08060; --accent:#c41e3a; --green:#2d8a4e; --gold:#d4a017; --red:#c41e3a; --purple:#6b4c8a; --pixel-font:'Noto Serif SC','Songti SC','SimSun',Georgia,serif;` | | 现代极简卡片 | `--bg:#f8f9fa; --canvas:#ffffff; --border:#e9ecef; --text:#212529; --text-dim:#868e96; --accent:#4263eb; --green:#20c997; --gold:#fcc419; --red:#fa5252; --purple:#7950f2; --pixel-font:-apple-system,'PingFang SC','Microsoft YaHei',sans-serif;` | | 像素复古 | `--bg:#1a1a2e; --canvas:#16213e; --border:#0f3460; --text:#e0e0e0; --text-dim:#888; --accent:#e94560; --green:#4ecca3; --gold:#f0c040; --red:#e94560; --purple:#a855f7; --pixel-font:'SF Mono',Monaco,Consolas,'Courier New',monospace;` | | 都市霓虹 | `--bg:#0a0a1a; --canvas:#1a0a2e; --border:#2a1a4e; --text:#e0e0e0; --text-dim:#888; --accent:#ff2d55; --green:#00ff88; --gold:#ffd700; --red:#ff2d55; --purple:#a855f7; --pixel-font:'SF Mono',Monaco,Consolas,monospace;` | | 和风武士 | `--bg:#1a1a2e; --canvas:#2a1a1e; --border:#3a2a2e; --text:#e0e0e0; --text-dim:#888; --accent:#ff6b6b; --green:#4ecdc4; --gold:#d4a574; --red:#ff6b6b; --purple:#a78bfa; --pixel-font:'Noto Serif SC','Hiragino Sans',sans-serif;` | | 中国古风 | `--bg:#1a0a0a; --canvas:#2a1a1a; --border:#3a2a1a; --text:#e0d5c5; --text-dim:#a09080; --accent:#c41e3a; --green:#2d8a4e; --gold:#d4a017; --red:#c41e3a; --purple:#8b5cf6; --pixel-font:'Noto Serif SC','Songti SC','SimSun',serif;` | | 科幻未来 | `--bg:#0a0a1a; --canvas:#0a1a2a; --border:#1a2a3a; --text:#e0e0e0; --text-dim:#888; --accent:#00d4ff; --green:#00ff88; --gold:#ffffff; --red:#ff4444; --purple:#a855f7; --pixel-font:'SF Mono',Monaco,Consolas,monospace;` | ## 完整 HTML 模板 ```html [游戏名] — 圣地巡礼冒险地图

⚔️ [游戏名] 圣地巡礼 · [日期]

🎮 Lv.[等级]

📍 [出发城市] → [取景地城市]

💰 ¥[预算]

📖 世界观 · [游戏名]

[LORE_TEXT]

🎒 旅行贴士 · 行前必看

🗺️ 冒险路线

📍 打卡

0/0

💰 冒险经费总览

✈️ 传送门（交通）

¥[FLIGHT_TOTAL]/人

🔥 存档点（住宿）

¥[HOTEL_TOTAL]/[NIGHTS]晚

🎫 副本门票（景点）

¥[POI_TOTAL]

🍜 回血道具（餐饮）

¥[FOOD_TOTAL]

📊 合计

¥[TOTAL]/人

``` ## 使用方式生成 HTML 时： 1. 读取本文件的完整 HTML 模板 2. 根据用户选择的风格，替换 `:root` 中的 CSS 变量 3. 替换所有 `[占位符]` 4. 为每个行程节点生成 HTML 卡片，替换 `` 和 `` 之间的内容 5. 替换 `[LORE_TEXT]`、`[GAME_IMAGE_URL]`、`[REALITY_IMAGE_URL]` 等背景故事内容 6. 替换预算区域的 `[FLIGHT_TOTAL]`、`[HOTEL_TOTAL]` 等 7. 输出完整 HTML 文件 ## 节点 HTML 模板每个节点替换为以下格式： ```html

🏠 [城市名] — 冒险起点

[日期] · 出发

📖 故事
[出发故事]

✈️ [航班号] 传送门

[出发时间] · [出发站] → [到达站] · [耗时]

[航班描述]

💡 [推荐理由]

¥[价格]/人

🛒 飞猪购买

⚔️ [景点名] 主线副本

[日期] [时间] · 预计 [耗时]

🎮 游戏中

🌍 现实中

🎮 游戏中

[游戏描述]

🌍 现实中

[现实描述]

📖 剧情概要

[剧情概要：描述游戏中与此地相关的关键剧情段落，2-3句话]

🗣️ [角色名]

"[与此地相关的游戏台词或经典对白]"

🗣️ [角色名]

"[另一句相关台词]"

📖 剧情关联
[剧情关联描述：现实地点与游戏剧情的联系]

[景点门票/体验]

💡 [推荐理由]

¥[价格]

🛒 飞猪购买

🔥 [酒店名] 存档点

[入住日期] · [地址]

📖 剧情概要

[剧情概要：描述游戏中与此存档点/休息地相关的关键剧情]

🗣️ [角色名]

"[与此地相关的游戏台词或经典对白]"

💤 HP 回复

8小时深度睡眠

☕ MP 回复

[早餐信息] + WiFi

[酒店名] · [星级/评分]

💡 [推荐理由]

¥[价格]/晚

🛒 飞猪购买

🛒 [美食/体验名] 回血道具

[时间] · [地址]

📖 剧情概要

[剧情概要：描述游戏中与此食物/道具相关的关键剧情或角色互动]

🗣️ [角色名]

"[与此食物/道具相关的游戏台词]"

🎮 Buff 效果

[Buff效果]

🌍 现实

[现实描述] · ⭐ [评分]

[美食/体验名]

💡 [推荐理由]

¥[价格]/人

🛒 飞猪购买

```