xinyu-pro 0.21.0

package/lib/types.ts

@@ -0,0 +1,117 @@
+// lib/types.ts - TypeScript 类型定义
+
+/** 世界卡片设定（完全由用户自定义字段组成） */
+export type WorldSetting = Record<string, unknown>;
+
+/** 字段输入类型 */
+export type FieldType = 'text' | 'textarea' | 'select' | 'checkbox' | 'slider';
+
+/** 下拉选项 */
+export interface SelectOption {
+  label: string;
+  value: string;
+}
+
+/** 世界卡片字段定义 */
+export interface WorldCardField {
+  id: string;                    // 唯一标识
+  key: string;                   // 数据键名（如 title, era, custom_field_1）
+  label: string;                 // 显示名称
+  type: FieldType;               // 输入类型
+  value: string | string[] | boolean | number;  // 当前值
+  placeholder?: string;          // 占位文本
+  required?: boolean;            // 是否必填
+  editableBeforeGame?: boolean;  // 是否允许在游戏前编辑
+  // select 类型专属
+  options?: SelectOption[];
+  allowCustomOption?: boolean;   // 下拉框是否允许用户输入自定义选项
+  // slider 类型专属
+  min?: number;
+  max?: number;
+  step?: number;
+}
+
+/** 世界卡片模板 */
+export interface WorldCardTemplate {
+  id: string;
+  name: string;                  // 模板名称
+  svgContent: string;            // SVG 代码
+  fields: WorldCardField[];      // 字段定义列表
+  plugins?: string[];            // 关联的插件 ID 列表（开始游戏时自动启用）
+  createdAt: string;
+  updatedAt: string;
+}
+
+/** 对话消息 */
+export interface ChatMessage {
+  role: 'user' | 'assistant' | 'system' | 'notice';
+  content: string;
+}
+
+/** 游戏会话 */
+export interface GameSession {
+  id: string;
+  worldSetting: WorldSetting;
+  messages: ChatMessage[];
+  createdAt: string;
+  updatedAt: string;
+}
+
+/** 主题定义 */
+export interface Theme {
+  id: string;
+  name: string;
+  description: string;
+  variables: Record<string, string>;
+  isDark: boolean;
+  /** 导入的主题预览数据 */
+  preview?: {
+    type: 'svg' | 'json';
+    content: string;  // SVG 代码或 JSON 字符串
+  };
+}
+
+/** 主题配置 */
+export interface ThemeConfig {
+  presets: Theme[];
+  activeThemeId: string;
+  customTheme: Theme | null;
+  /** 用户导入的主题列表 */
+  importedThemes: Theme[];
+}
+
+/** 应用设置 */
+export interface AppSettings {
+  // API 配置
+  aiApiKey: string;
+  aiApiBase: string;
+  aiModel: string;
+  aiTemperature: number;
+  aiMaxTokens: number;
+  // 对话偏好
+  systemPromptExtra: string;  // 用户追加的全局 system prompt
+  // 数据管理
+  maxHistorySessions: number; // 最大保留历史会话数
+  // 插件提示控制
+  pluginToastEnabled: boolean; // 是否显示插件 toast 消息
+  pluginToastLevels: ('info' | 'success' | 'warning' | 'error')[]; // 允许显示的消息级别
+}
+
+/** API 请求体（含可选配置覆盖） */
+export interface ChatRequest {
+  worldSetting: WorldSetting;
+  messages: ChatMessage[];
+  apiConfig?: {
+    apiKey: string;
+    apiBase: string;
+    model: string;
+    temperature: number;
+    maxTokens: number;
+    systemPromptExtra: string;
+  };
+}
+
+/** API 响应体 */
+export interface ChatResponse {
+  content: string;
+}

package/lib/version.ts

@@ -0,0 +1,55 @@
+// lib/version.ts - 版本号管理与校验工具
+
+import versionData from '../version.json';
+
+/** 应用版本信息 */
+export const APP_VERSION: string = versionData.version;
+export const APP_NAME: string = versionData.displayName;
+export const APP_DESCRIPTION: string = versionData.description;
+
+/**
+ * 解析语义化版本号为可比较的数字数组
+ * "1.2.3" → [1, 2, 3]
+ * "1.2.3-beta.1" → [1, 2, 3]（忽略预发布标识）
+ */
+export function parseSemver(version: string): number[] {
+  const match = version.match(/^(\d+)\.(\d+)\.(\d+)/);
+  if (!match) return [0, 0, 0];
+  return [parseInt(match[1], 10), parseInt(match[2], 10), parseInt(match[3], 10)];
+}
+
+/**
+ * 比较两个语义化版本号
+ * @returns -1 (a < b), 0 (a == b), 1 (a > b)
+ */
+export function compareSemver(a: string, b: string): number {
+  const pa = parseSemver(a);
+  const pb = parseSemver(b);
+  for (let i = 0; i < 3; i++) {
+    if (pa[i] < pb[i]) return -1;
+    if (pa[i] > pb[i]) return 1;
+  }
+  return 0;
+}
+
+/**
+ * 检查当前应用版本是否满足插件要求的最低版本
+ * @param minVersion 插件声明的最低版本（如 "0.2.0"）
+ * @returns { satisfied: boolean, current: string, required: string }
+ */
+export function checkAppVersion(minVersion: string): {
+  satisfied: boolean;
+  current: string;
+  required: string;
+} {
+  const current = APP_VERSION;
+  const satisfied = compareSemver(current, minVersion) >= 0;
+  return { satisfied, current, required: minVersion };
+}
+
+/**
+ * 版本号格式化显示
+ */
+export function formatVersion(version: string): string {
+  return `v${version}`;
+}

package/next.config.mjs

@@ -0,0 +1,43 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  eslint: {
+    ignoreDuringBuilds: true,
+  },
+  typescript: {
+    ignoreBuildErrors: true,
+  },
+  async headers() {
+    const cspValue = [
+      "default-src 'self'",
+      "script-src 'self' 'unsafe-eval' 'unsafe-inline' https://cdn.jsdelivr.net",
+      "style-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net",
+      "img-src 'self' data: blob: https://cdn.jsdelivr.net",
+      "connect-src 'self' https://cdn.jsdelivr.net",
+      "font-src 'self' https://cdn.jsdelivr.net",
+      "frame-src 'none'",
+      "object-src 'none'",
+    ].join('; ');
+    return [
+      {
+        source: '/game/:id*',
+        headers: [
+          {
+            key: 'Content-Security-Policy',
+            value: cspValue,
+          },
+        ],
+      },
+      {
+        source: '/extensions/edit/:id*',
+        headers: [
+          {
+            key: 'Content-Security-Policy',
+            value: cspValue,
+          },
+        ],
+      },
+    ];
+  },
+};
+
+export default nextConfig;

package/package.json

@@ -0,0 +1,56 @@
+{
+  "name": "xinyu-pro",
+  "version": "0.21.0",
+  "private": false,
+  "description": "星语 Pro - AI 驱动的互动叙事平台",
+  "author": "RestRegular",
+  "license": "MIT",
+  "bin": {
+    "xinyu": "bin/cli.js"
+  },
+  "files": [
+    "bin/",
+    "app/",
+    "components/",
+    "lib/",
+    "plugins/",
+    "public/",
+    "styles/",
+    "next.config.mjs",
+    "tailwind.config.ts",
+    "tsconfig.json",
+    "postcss.config.mjs",
+    ".env.example",
+    "version.json"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "dev": "next dev",
+    "build": "next build",
+    "start": "next start",
+    "lint": "next lint",
+    "prepublishOnly": "next build"
+  },
+  "dependencies": {
+    "@fortawesome/fontawesome-free": "^7.2.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@types/node": "^20",
+    "@types/react": "^18",
+    "@types/react-dom": "^18",
+    "adm-zip": "^0.5.17",
+    "mysql2": "^3.22.2",
+    "next": "14.2.35",
+    "postcss": "^8",
+    "react": "^18",
+    "react-dom": "^18",
+    "tailwindcss": "^3.4.1",
+    "typescript": "^5"
+  },
+  "devDependencies": {
+    "@types/adm-zip": "^0.5.8",
+    "eslint": "^8",
+    "eslint-config-next": "14.2.35"
+  }
+}

package/postcss.config.mjs

@@ -0,0 +1,8 @@
+/** @type {import('postcss-load-config').Config} */
+const config = {
+  plugins: {
+    tailwindcss: {},
+  },
+};
+
+export default config;

package/public/templates/atlantis.svg

@@ -0,0 +1,63 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 560" width="400" height="560">
+  <defs>
+    <linearGradient id="bg" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" style="stop-color:#1a0a2e;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#0d0520;stop-opacity:1" />
+    </linearGradient>
+    <linearGradient id="gold" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#d4a843;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#f0d080;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+
+  <!-- 背景 -->
+  <rect width="400" height="560" rx="16" fill="url(#bg)" />
+
+  <!-- 装饰边框 -->
+  <rect x="12" y="12" width="376" height="536" rx="12" fill="none" stroke="url(#gold)" stroke-width="1.5" opacity="0.6" />
+  <rect x="20" y="20" width="360" height="520" rx="8" fill="none" stroke="url(#gold)" stroke-width="0.5" opacity="0.3" />
+
+  <!-- 顶部装饰 -->
+  <line x1="100" y1="60" x2="300" y2="60" stroke="url(#gold)" stroke-width="1" opacity="0.4" />
+  <circle cx="200" cy="60" r="4" fill="url(#gold)" opacity="0.6" />
+  <circle cx="100" cy="60" r="2" fill="url(#gold)" opacity="0.4" />
+  <circle cx="300" cy="60" r="2" fill="url(#gold)" opacity="0.4" />
+
+  <!-- 标题区 -->
+  <text x="200" y="100" text-anchor="middle" fill="url(#gold)" font-size="24" font-weight="bold" font-family="serif">失落的亚特兰蒂斯</text>
+  <text x="200" y="125" text-anchor="middle" fill="#a89bc2" font-size="12" font-family="sans-serif">神话时代末期 · 深海之城</text>
+
+  <!-- 分隔线 -->
+  <line x1="60" y1="145" x2="340" y2="145" stroke="url(#gold)" stroke-width="0.5" opacity="0.3" />
+
+  <!-- 内容区域装饰 -->
+  <text x="60" y="175" fill="#6b5f85" font-size="10" font-family="sans-serif">叙事基调</text>
+  <text x="60" y="195" fill="#e8e0f0" font-size="13" font-family="sans-serif">史诗悲壮</text>
+
+  <text x="60" y="225" fill="#6b5f85" font-size="10" font-family="sans-serif">核心冲突</text>
+  <text x="60" y="245" fill="#e8e0f0" font-size="13" font-family="sans-serif">亚特兰蒂斯即将沉没，</text>
+  <text x="60" y="265" fill="#e8e0f0" font-size="13" font-family="sans-serif">你必须在文明毁灭前找到</text>
+  <text x="60" y="285" fill="#e8e0f0" font-size="13" font-family="sans-serif">拯救这座深海之城的方法。</text>
+
+  <text x="60" y="315" fill="#6b5f85" font-size="10" font-family="sans-serif">主要势力</text>
+  <text x="60" y="335" fill="#d4a843" font-size="12" font-family="sans-serif">🔮 祭司团 · ⚔️ 王室卫队 · 🌊 深渊教团</text>
+
+  <!-- 底部装饰 -->
+  <line x1="60" y1="365" x2="340" y2="365" stroke="url(#gold)" stroke-width="0.5" opacity="0.3" />
+  <circle cx="200" cy="500" r="20" fill="none" stroke="url(#gold)" stroke-width="1" opacity="0.3" />
+  <circle cx="200" cy="500" r="12" fill="none" stroke="url(#gold)" stroke-width="0.5" opacity="0.2" />
+  <text x="200" y="505" text-anchor="middle" fill="url(#gold)" font-size="14">✦</text>
+
+  <!-- 嵌入式世界数据 -->
+  <script type="application/json" id="world-data">
+  {
+    "title": "失落的亚特兰蒂斯",
+    "era": "神话时代末期",
+    "location": "深海之城亚特兰蒂斯",
+    "tone": "史诗悲壮",
+    "coreConflict": "亚特兰蒂斯即将沉没，你必须在文明毁灭前找到拯救这座深海之城的方法。古老的预言指向三件神器，但每一件都由强大的守护者看管。",
+    "keyFactions": ["祭司团", "王室卫队", "深渊教团"],
+    "aiPrompt": "以庄重而富有诗意的语调叙述。注重描写海洋的光影、古老建筑的壮美和角色内心的挣扎。NPC 对话应带有神话时代的典雅气质。"
+  }
+  </script>
+</svg>

package/public/templates/cyber-city.svg

@@ -0,0 +1,68 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 560" width="400" height="560">
+  <defs>
+    <linearGradient id="cyberBg" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" style="stop-color:#0a0a0a;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#0d1a0d;stop-opacity:1" />
+    </linearGradient>
+    <linearGradient id="neonGreen" x1="0%" y1="0%" x2="100%" y2="0%">
+      <stop offset="0%" style="stop-color:#00ff88;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#00cc66;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+
+  <!-- 背景 -->
+  <rect width="400" height="560" rx="4" fill="url(#cyberBg)" />
+
+  <!-- 扫描线效果 -->
+  <pattern id="scanlines" width="400" height="4" patternUnits="userSpaceOnUse">
+    <line x1="0" y1="0" x2="400" y2="0" stroke="#00ff88" stroke-width="0.3" opacity="0.1" />
+  </pattern>
+  <rect width="400" height="560" fill="url(#scanlines)" />
+
+  <!-- 边框 -->
+  <rect x="8" y="8" width="384" height="544" rx="2" fill="none" stroke="#00ff88" stroke-width="1" opacity="0.5" />
+
+  <!-- 角落装饰 -->
+  <polyline points="8,30 8,8 30,8" fill="none" stroke="#00ff88" stroke-width="2" />
+  <polyline points="370,8 392,8 392,30" fill="none" stroke="#00ff88" stroke-width="2" />
+  <polyline points="8,530 8,552 30,552" fill="none" stroke="#00ff88" stroke-width="2" />
+  <polyline points="370,552 392,552 392,530" fill="none" stroke="#00ff88" stroke-width="2" />
+
+  <!-- 标题 -->
+  <text x="200" y="80" text-anchor="middle" fill="#00ff88" font-size="22" font-weight="bold" font-family="monospace">霓虹都市 2099</text>
+  <text x="200" y="105" text-anchor="middle" fill="#406040" font-size="11" font-family="monospace">[ 赛博朋克 · 新东京地下城 ]</text>
+
+  <!-- 分隔线 -->
+  <line x1="40" y1="125" x2="360" y2="125" stroke="#00ff88" stroke-width="0.5" opacity="0.3" />
+
+  <!-- 数据标签 -->
+  <text x="40" y="155" fill="#406040" font-size="10" font-family="monospace">&gt; 叙事基调</text>
+  <text x="40" y="175" fill="#e0ffe0" font-size="13" font-family="monospace">暗黑赛博朋克</text>
+
+  <text x="40" y="205" fill="#406040" font-size="10" font-family="monospace">&gt; 核心冲突</text>
+  <text x="40" y="225" fill="#e0ffe0" font-size="12" font-family="monospace">巨型企业的 AI 系统失控，</text>
+  <text x="40" y="245" fill="#e0ffe0" font-size="12" font-family="monospace">整个城市的神经链接被劫持。</text>
+  <text x="40" y="265" fill="#e0ffe0" font-size="12" font-family="monospace">你是一名地下黑客，</text>
+  <text x="40" y="285" fill="#e0ffe0" font-size="12" font-family="monospace">必须在 72 小时内找到</text>
+  <text x="40" y="305" fill="#e0ffe0" font-size="12" font-family="monospace">关闭 AI 的后门代码。</text>
+
+  <text x="40" y="335" fill="#406040" font-size="10" font-family="monospace">&gt; 主要势力</text>
+  <text x="40" y="355" fill="#00ff88" font-size="11" font-family="monospace">[ 荒坂集团 ] [ 地下抵抗军 ] [ AI 网络 ]</text>
+
+  <!-- 底部装饰 -->
+  <line x1="40" y1="385" x2="360" y2="385" stroke="#00ff88" stroke-width="0.5" opacity="0.3" />
+  <text x="200" y="510" text-anchor="middle" fill="#00ff88" font-size="10" font-family="monospace" opacity="0.4">[ SYSTEM READY ]</text>
+
+  <!-- 嵌入式世界数据 -->
+  <script type="application/json" id="world-data">
+  {
+    "title": "霓虹都市 2099",
+    "era": "2099年，赛博朋克时代",
+    "location": "新东京地下城",
+    "tone": "暗黑赛博朋克",
+    "coreConflict": "巨型企业的 AI 系统失控，整个城市的神经链接被劫持。你是一名地下黑客，必须在 72 小时内找到关闭 AI 的后门代码。城市的每一个角落都布满了监控无人机和企业安保。",
+    "keyFactions": ["荒坂集团", "地下抵抗军", "AI 网络"],
+    "aiPrompt": "以冷峻简洁的赛博朋克风格叙述。使用科技术语和黑客行话。场景描写注重新东京的霓虹灯光、雨水和电子噪音。NPC 对话简洁有力，带有未来都市的冷漠感。"
+  }
+  </script>
+</svg>

package/public/templates/jianghu.svg

@@ -0,0 +1,69 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 560" width="400" height="560">
+  <defs>
+    <linearGradient id="parchBg" x1="0%" y1="0%" x2="0%" y2="100%">
+      <stop offset="0%" style="stop-color:#f8f0e0;stop-opacity:1" />
+      <stop offset="100%" style="stop-color:#e8dcc8;stop-opacity:1" />
+    </linearGradient>
+  </defs>
+
+  <!-- 背景 -->
+  <rect width="400" height="560" rx="8" fill="url(#parchBg)" />
+
+  <!-- 纸张纹理 -->
+  <filter id="paper">
+    <feTurbulence type="fractalNoise" baseFrequency="0.04" numOctaves="5" result="noise" />
+    <feDiffuseLighting in="noise" lighting-color="#f8f0e0" surfaceScale="2">
+      <feDistantLight azimuth="45" elevation="55" />
+    </feDiffuseLighting>
+  </filter>
+  <rect width="400" height="560" rx="8" fill="url(#parchBg)" filter="url(#paper)" opacity="0.3" />
+
+  <!-- 装饰边框 -->
+  <rect x="16" y="16" width="368" height="528" rx="4" fill="none" stroke="#8b4513" stroke-width="2" opacity="0.4" />
+  <rect x="24" y="24" width="352" height="512" rx="2" fill="none" stroke="#8b4513" stroke-width="0.5" opacity="0.2" />
+
+  <!-- 角落花纹 -->
+  <circle cx="40" cy="40" r="8" fill="none" stroke="#8b4513" stroke-width="1" opacity="0.3" />
+  <circle cx="360" cy="40" r="8" fill="none" stroke="#8b4513" stroke-width="1" opacity="0.3" />
+  <circle cx="40" cy="520" r="8" fill="none" stroke="#8b4513" stroke-width="1" opacity="0.3" />
+  <circle cx="360" cy="520" r="8" fill="none" stroke="#8b4513" stroke-width="1" opacity="0.3" />
+
+  <!-- 标题 -->
+  <text x="200" y="90" text-anchor="middle" fill="#3a2a1a" font-size="26" font-weight="bold" font-family="serif">江湖行</text>
+  <text x="200" y="118" text-anchor="middle" fill="#6a5a4a" font-size="12" font-family="serif">南宋末年 · 临安城</text>
+
+  <!-- 分隔线 -->
+  <line x1="80" y1="138" x2="320" y2="138" stroke="#8b4513" stroke-width="0.5" opacity="0.3" />
+  <circle cx="200" cy="138" r="3" fill="#8b4513" opacity="0.3" />
+
+  <!-- 内容 -->
+  <text x="50" y="170" fill="#9a8a7a" font-size="11" font-family="serif">【叙事基调】</text>
+  <text x="50" y="192" fill="#3a2a1a" font-size="14" font-family="serif">武侠江湖</text>
+
+  <text x="50" y="222" fill="#9a8a7a" font-size="11" font-family="serif">【核心冲突】</text>
+  <text x="50" y="244" fill="#3a2a1a" font-size="13" font-family="serif">蒙古铁骑南下，南宋江山风雨飘摇。</text>
+  <text x="50" y="266" fill="#3a2a1a" font-size="13" font-family="serif">你是一名流浪剑客，身怀绝世武功，</text>
+  <text x="50" y="288" fill="#3a2a1a" font-size="13" font-family="serif">却卷入了一场关乎天下命运的阴谋。</text>
+  <text x="50" y="310" fill="#3a2a1a" font-size="13" font-family="serif">传说中的《九阴真经》残卷散落江湖，</text>
+  <text x="50" y="332" fill="#3a2a1a" font-size="13" font-family="serif">各方势力明争暗斗。</text>
+
+  <text x="50" y="362" fill="#9a8a7a" font-size="11" font-family="serif">【主要势力】</text>
+  <text x="50" y="384" fill="#8b4513" font-size="12" font-family="serif">⚔️ 少林武当 · 🗡️ 暗影阁 · 🏯 朝廷</text>
+
+  <!-- 底部装饰 -->
+  <line x1="80" y1="410" x2="320" y2="410" stroke="#8b4513" stroke-width="0.5" opacity="0.3" />
+  <text x="200" y="490" text-anchor="middle" fill="#8b4513" font-size="20" opacity="0.3">⚔</text>
+
+  <!-- 嵌入式世界数据 -->
+  <script type="application/json" id="world-data">
+  {
+    "title": "江湖行",
+    "era": "南宋末年",
+    "location": "临安城",
+    "tone": "武侠江湖",
+    "coreConflict": "蒙古铁骑南下，南宋江山风雨飘摇。你是一名流浪剑客，身怀绝世武功，却卷入了一场关乎天下命运的阴谋。传说中的《九阴真经》残卷散落江湖，各方势力明争暗斗。",
+    "keyFactions": ["少林武当", "暗影阁", "朝廷"],
+    "aiPrompt": "以古典武侠小说的风格叙述，注重描写武功招式、江湖义气和人物情感。场景描写融入山水意境。NPC 对话带有古风韵味，适当使用成语和诗词。"
+  }
+  </script>
+</svg>

package/public/templates//351/255/224/346/263/225/344/270/226/347/225/214.svg

@@ -0,0 +1,137 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 560">
+  <defs>
+    <!-- 背景渐变 -->
+    <radialGradient id="bg-grad" cx="50%" cy="50%" r="70%">
+      <stop offset="0%" stop-color="#1B0F3A" />
+      <stop offset="100%" stop-color="#080112" />
+    </radialGradient>
+    
+    <!-- 金色装饰渐变 -->
+    <linearGradient id="gold-grad" x1="0%" y1="0%" x2="100%" y2="100%">
+      <stop offset="0%" stop-color="#D4AF37" />
+      <stop offset="50%" stop-color="#FFDF73" />
+      <stop offset="100%" stop-color="#B8860B" />
+    </linearGradient>
+
+    <!-- 标题发光效果 -->
+    <filter id="glow" x="-20%" y="-20%" width="140%" height="140%">
+      <feGaussianBlur stdDeviation="3" result="blur" />
+      <feComposite in="SourceGraphic" in2="blur" operator="over" />
+    </filter>
+
+    <!-- 标题背后微光 -->
+    <radialGradient id="glow-grad" cx="50%" cy="50%" r="50%">
+      <stop offset="0%" stop-color="#FFD700" stop-opacity="0.15" />
+      <stop offset="100%" stop-color="#FFD700" stop-opacity="0" />
+    </radialGradient>
+
+    <!-- 角落符文装饰 -->
+    <g id="corner-ornament">
+      <circle cx="0" cy="0" r="14" fill="none" stroke="url(#gold-grad)" stroke-width="1.5" />
+      <circle cx="0" cy="0" r="9" fill="none" stroke="url(#gold-grad)" stroke-width="1" stroke-dasharray="2,2" />
+      <path d="M 0,-14 L 3,-5 L 14,0 L 3,5 L 0,14 L -3,5 L -14,0 L -3,-5 Z" fill="url(#gold-grad)" />
+    </g>
+
+    <!-- 装饰星芒 -->
+    <path id="star" d="M 0,-8 L 2,-2 L 8,0 L 2,2 L 0,8 L -2,2 L -8,0 L -2,-2 Z" fill="url(#gold-grad)" />
+  </defs>
+
+  <!-- 背景层 -->
+  <rect width="400" height="560" fill="url(#bg-grad)" />
+  
+  <!-- 背景隐藏魔法阵 -->
+  <g opacity="0.06" stroke="#D4AF37" fill="none">
+    <circle cx="200" cy="290" r="150" stroke-width="2" />
+    <circle cx="200" cy="290" r="130" stroke-width="1.5" stroke-dasharray="10,5" />
+    <polygon points="200,140 260,250 350,290 260,330 200,440 140,330 50,290 140,250" stroke-width="1.5" />
+    <polygon points="200,160 245,245 320,290 245,335 200,420 155,335 80,290 155,245" stroke-width="1" />
+  </g>
+
+  <!-- 装饰边框 -->
+  <rect x="10" y="10" width="380" height="540" fill="none" stroke="url(#gold-grad)" stroke-width="2" rx="15" />
+  <rect x="15" y="15" width="370" height="530" fill="none" stroke="url(#gold-grad)" stroke-width="1" stroke-dasharray="5,5" rx="12" />
+
+  <!-- 角落符文 -->
+  <use href="#corner-ornament" x="25" y="25" />
+  <use href="#corner-ornament" x="375" y="25" />
+  <use href="#corner-ornament" x="25" y="535" />
+  <use href="#corner-ornament" x="375" y="535" />
+
+  <!-- 魔法尘埃 / 漂浮星芒 -->
+  <use href="#star" transform="translate(60, 60) scale(0.6)" opacity="0.7" />
+  <use href="#star" transform="translate(340, 100) scale(0.4)" opacity="0.5" />
+  <use href="#star" transform="translate(80, 480) scale(0.5)" opacity="0.6" />
+  <use href="#star" transform="translate(320, 510) scale(0.7)" opacity="0.8" />
+  <use href="#star" transform="translate(150, 130) scale(0.3)" opacity="0.9" />
+  <use href="#star" transform="translate(260, 130) scale(0.3)" opacity="0.9" />
+  <use href="#star" transform="translate(200, 40) scale(1.2)" opacity="0.8" />
+
+  <!-- 标题区域 -->
+  <circle cx="200" cy="75" r="80" fill="url(#glow-grad)" />
+  <text x="200" y="78" font-family="'Times New Roman', Times, serif" font-size="48" fill="url(#gold-grad)" text-anchor="middle" font-weight="bold" filter="url(#glow)" letter-spacing="4">魔法世界</text>
+  
+  <!-- 标题装饰线 -->
+  <path d="M 100 95 Q 200 105 300 95" fill="none" stroke="url(#gold-grad)" stroke-width="2" />
+  <path d="M 120 102 Q 200 110 280 102" fill="none" stroke="url(#gold-grad)" stroke-width="1" />
+  <use href="#star" transform="translate(200, 105) scale(1.5)" />
+
+  <!-- 信息背景面板 -->
+  <rect x="30" y="120" width="340" height="365" fill="#000000" opacity="0.4" rx="10" />
+
+  <!-- 信息内容 -->
+  <!-- 时代 -->
+  <text x="40" y="122" font-size="12" fill="url(#gold-grad)">✦</text>
+  <text x="55" y="122" font-family="Georgia, serif" font-size="14" fill="#C5A55A" font-weight="bold" letter-spacing="2">时 代</text>
+  <text x="55" y="142" font-family="Georgia, serif" font-size="16" fill="#F4E8D1">中世纪魔法纪元</text>
+  <line x1="55" y1="157" x2="350" y2="157" stroke="url(#gold-grad)" stroke-width="0.5" opacity="0.6" />
+
+  <!-- 地点 -->
+  <text x="40" y="182" font-size="12" fill="url(#gold-grad)">✦</text>
+  <text x="55" y="182" font-family="Georgia, serif" font-size="14" fill="#C5A55A" font-weight="bold" letter-spacing="2">地 点</text>
+  <text x="55" y="202" font-family="Georgia, serif" font-size="16" fill="#F4E8D1">霍格沃茨魔法学院</text>
+  <line x1="55" y1="217" x2="350" y2="217" stroke="url(#gold-grad)" stroke-width="0.5" opacity="0.6" />
+
+  <!-- 基调 -->
+  <text x="40" y="242" font-size="12" fill="url(#gold-grad)">✦</text>
+  <text x="55" y="242" font-family="Georgia, serif" font-size="14" fill="#C5A55A" font-weight="bold" letter-spacing="2">基 调</text>
+  <text x="55" y="262" font-family="Georgia, serif" font-size="16" fill="#F4E8D1">史诗</text>
+  <line x1="55" y1="277" x2="350" y2="277" stroke="url(#gold-grad)" stroke-width="0.5" opacity="0.6" />
+
+  <!-- 核心冲突 -->
+  <text x="40" y="302" font-size="12" fill="url(#gold-grad)">✦</text>
+  <text x="55" y="302" font-family="Georgia, serif" font-size="14" fill="#C5A55A" font-weight="bold" letter-spacing="2">核心冲突</text>
+  <text x="55" y="322" font-family="Georgia, serif" font-size="15" fill="#F4E8D1">光明与黑暗的魔法大战，</text>
+  <text x="55" y="342" font-family="Georgia, serif" font-size="15" fill="#F4E8D1">魔法的滥用导致世界失衡</text>
+  <line x1="55" y1="357" x2="350" y2="357" stroke="url(#gold-grad)" stroke-width="0.5" opacity="0.6" />
+
+  <!-- 关键阵营 -->
+  <text x="40" y="382" font-size="12" fill="url(#gold-grad)">✦</text>
+  <text x="55" y="382" font-family="Georgia, serif" font-size="14" fill="#C5A55A" font-weight="bold" letter-spacing="2">关键阵营</text>
+  <text x="55" y="402" font-family="Georgia, serif" font-size="15" fill="#F4E8D1">
+    <tspan>光明教廷</tspan><tspan dx="20">·</tspan><tspan dx="20">黑暗议会</tspan>
+  </text>
+  <text x="55" y="424" font-family="Georgia, serif" font-size="15" fill="#F4E8D1">
+    <tspan>龙族隐修会</tspan><tspan dx="20">·</tspan><tspan dx="20">精灵王国</tspan>
+  </text>
+  <line x1="55" y1="435" x2="350" y2="435" stroke="url(#gold-grad)" stroke-width="0.5" opacity="0.6" />
+
+  <!-- 世界之声（AI提示）区域 -->
+  <rect x="30" y="440" width="340" height="80" fill="#000000" fill-opacity="0.3" stroke="url(#gold-grad)" stroke-width="1" rx="5" />
+  <text x="200" y="458" font-family="Georgia, serif" font-size="12" fill="url(#gold-grad)" text-anchor="middle" font-weight="bold">✧ 世界之声 ✧</text>
+  <text x="40" y="475" font-family="sans-serif" font-size="10" fill="#B8A788" font-style="italic">“作为一名专业的游戏主持，你将用生动、富有</text>
+  <text x="40" y="488" font-family="sans-serif" font-size="10" fill="#B8A788" font-style="italic">神秘感的语言描述场景，推动剧情发展，并适当</text>
+  <text x="40" y="501" font-family="sans-serif" font-size="10" fill="#B8A788" font-style="italic">扮演NPC引导玩家探索。”</text>
+
+  <!-- 嵌入式世界设定数据 -->
+  <script type="application/json" id="world-data">
+{
+  "title": "魔法世界",
+  "era": "中世纪魔法纪元",
+  "location": "霍格沃茨魔法学院",
+  "tone": "史诗",
+  "coreConflict": "光明与黑暗的魔法大战，魔法的滥用导致世界失衡",
+  "keyFactions": "光明教廷、黑暗议会、龙族隐修会、精灵王国",
+  "aiPrompt": "作为一名专业的游戏主持，你将用生动、富有神秘感的语言描述场景，推动剧情发展，并适当扮演NPC引导玩家探索。"
+}
+  </script>
+</svg>