Spaces:

coldandcode
/

nicecatch

Running

App Files Files Community

coldandcode commited on Apr 1, 2025

Commit

6470db1

verified ·

1 Parent(s): 2fac7c1

Add 2 files

Browse files

Files changed (2) hide show

README.md +7 -5
index.html +957 -19

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Nicecatch
-emoji: 🌍
-colorFrom: yellow
-colorTo: indigo
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: nicecatch
+emoji: 🐳
+colorFrom: blue
+colorTo: blue
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,957 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="zh">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>命运编织者 - 预言契约游戏</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;700&family=EB+Garamond:wght@400;600&display=swap');
+        :root {
+            --gold: #D4AF37;
+            --dark-purple: #1A102B;
+            --light-purple: #3E2A5C;
+            --blood-red: #8B0000;
+            --emerald: #50C878;
+        }
+        body {
+            font-family: 'EB Garamond', serif;
+            background-color: var(--dark-purple);
+            color: white;
+            background-image:
+                radial-gradient(circle at 10% 20%, rgba(62, 42, 92, 0.6) 0%, transparent 20%),
+                radial-gradient(circle at 90% 80%, rgba(212, 175, 55, 0.3) 0%, transparent 20%);
+        }
+        .title-font {
+            font-family: 'Cinzel', serif;
+        }
+        .gold-text {
+            color: var(--gold);
+            text-shadow: 0 0 5px rgba(212, 175, 55, 0.5);
+        }
+        .prophecy-card {
+            background: linear-gradient(135deg, rgba(62, 42, 92, 0.8) 0%, rgba(26, 16, 43, 0.9) 100%);
+            border: 1px solid var(--gold);
+            position: relative;
+            transition: all 0.3s ease;
+        }
+        .prophecy-card:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.3);
+        }
+        .prophecy-card::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            right: 0;
+            height: 3px;
+            background: linear-gradient(90deg, var(--gold), var(--emerald), var(--gold));
+            opacity: 0.7;
+        }
+        .fate-point {
+            width: 30px;
+            height: 30px;
+            background-color: var(--gold);
+            clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
+            display: inline-flex;
+            align-items: center;
+            justify-content: center;
+            color: black;
+            font-weight: bold;
+        }
+        .health-bar {
+            height: 8px;
+            background-color: rgba(139, 0, 0, 0.3);
+        }
+        .progress-bar {
+            height: 100%;
+            background: linear-gradient(90deg, var(--blood-red), #FF4500);
+            transition: width 0.5s ease;
+        }
+        .action-button {
+            background: linear-gradient(to bottom, rgba(62, 42, 92, 0.8), rgba(26, 16, 43, 0.9));
+            border: 1px solid var(--gold);
+            transition: all 0.3s ease;
+        }
+        .action-button:hover {
+            background: linear-gradient(to bottom, rgba(62, 42, 92, 0.9), rgba(26, 16, 43, 1));
+            transform: translateY(-2px);
+        }
+        .modal-overlay {
+            background: rgba(0, 0, 0, 0.8);
+            backdrop-filter: blur(5px);
+        }
+        .modal-content {
+            background: linear-gradient(135deg, rgba(62, 42, 92, 0.9) 0%, rgba(26, 16, 43, 1) 100%);
+            border: 2px solid var(--gold);
+        }
+        .card-back {
+            background: linear-gradient(135deg, #3E2A5C 0%, #1A102B 100%);
+            border: 2px solid var(--gold);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            color: var(--gold);
+        }
+        .card-back::before {
+            content: '';
+            position: absolute;
+            top: 5px;
+            left: 5px;
+            right: 5px;
+            bottom: 5px;
+            border: 1px solid rgba(212, 175, 55, 0.3);
+        }
+        .tooltip {
+            visibility: hidden;
+            width: 200px;
+            background-color: rgba(26, 16, 43, 0.95);
+            color: white;
+            text-align: center;
+            border: 1px solid var(--gold);
+            padding: 10px;
+            position: absolute;
+            z-index: 1;
+            bottom: 125%;
+            left: 50%;
+            transform: translateX(-50%);
+            opacity: 0;
+            transition: opacity 0.3s;
+        }
+        .has-tooltip:hover .tooltip {
+            visibility: visible;
+            opacity: 1;
+        }
+        @keyframes glow {
+            0% { box-shadow: 0 0 5px rgba(212, 175, 55, 0.5); }
+            50% { box-shadow: 0 0 20px rgba(212, 175, 55, 0.8); }
+            100% { box-shadow: 0 0 5px rgba(212, 175, 55, 0.5); }
+        }
+        .glowing {
+            animation: glow 2s infinite;
+        }
+        .divine-border {
+            position: relative;
+        }
+        .divine-border::after {
+            content: '';
+            position: absolute;
+            top: -2px;
+            left: -2px;
+            right: -2px;
+            bottom: -2px;
+            border: 1px solid transparent;
+            background: linear-gradient(90deg, var(--gold), var(--emerald), var(--gold)) border-box;
+            -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
+            -webkit-mask-composite: destination-out;
+            mask-composite: exclude;
+            pointer-events: none;
+        }
+    </style>
+</head>
+<body class="min-h-screen p-4">
+    <div class="max-w-6xl mx-auto">
+        <!-- 游戏标题 -->
+        <header class="text-center mb-8">
+            <h1 class="title-font text-5xl mb-2 gold-text">命运编织者</h1>
+            <p class="text-xl text-gray-300">预言与契约的交织游戏</p>
+        </header>
+        <!-- 游戏主界面 -->
+        <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
+            <!-- 左侧：玩家区域 -->
+            <div class="bg-black bg-opacity-30 p-4 rounded-lg">
+                <div class="flex justify-between items-center mb-4">
+                    <h2 class="title-font text-2xl gold-text">玩家</h2>
+                    <div class="flex items-center space-x-2">
+                        <span class="fate-point">FP</span>
+                        <span id="player-fate" class="text-xl">5</span>
+                    </div>
+                </div>
+                <div class="mb-4">
+                    <div class="flex justify-between text-sm mb-1">
+                        <span>命运之力</span>
+                        <span id="player-health">100/100</span>
+                    </div>
+                    <div class="health-bar">
+                        <div id="player-health-bar" class="progress-bar" style="width: 100%"></div>
+                    </div>
+                </div>
+                <div class="grid grid-cols-2 gap-4 mb-4">
+                    <button id="attack-btn" class="action-button py-2 px-4 rounded text-center">
+                        <i class="fas fa-sword mr-2"></i>攻击
+                    </button>
+                    <button id="defend-btn" class="action-button py-2 px-4 rounded text-center">
+                        <i class="fas fa-shield-alt mr-2"></i>防御
+                    </button>
+                    <button id="potion-btn" class="action-button py-2 px-4 rounded text-center">
+                        <i class="fas fa-flask mr-2"></i>药水
+                    </button>
+                    <button id="prophecy-btn" class="action-button py-2 px-4 rounded text-center">
+                        <i class="fas fa-eye mr-2"></i>预言
+                    </button>
+                </div>
+                <h3 class="title-font text-lg gold-text mb-2">预言契约</h3>
+                <div id="player-prophecies" class="space-y-3">
+                    <!-- 预言卡牌将通过JS动态添加 -->
+                    <div class="text-center py-4 text-gray-500">暂无激活的预言</div>
+                </div>
+            </div>
+            <!-- 中间：战斗日志 -->
+            <div class="bg-black bg-opacity-30 p-4 rounded-lg">
+                <h2 class="title-font text-2xl gold-text mb-4 text-center">战斗日志</h2>
+                <div id="battle-log" class="h-96 overflow-y-auto space-y-2 text-sm">
+                    <div class="text-center py-16 text-gray-500">
+                        <p>命运即将展开...</p>
+                        <p class="mt-4">使用预言能力来改变战斗走向</p>
+                    </div>
+                </div>
+                <div class="mt-4 flex justify-between">
+                    <span id="turn-counter" class="text-gray-300">回合: 1</span>
+                    <button id="end-turn-btn" class="action-button py-2 px-6 rounded">
+                        结束回合 <i class="fas fa-hourglass-end ml-2"></i>
+                    </button>
+                </div>
+            </div>
+            <!-- 右侧：敌人区域 -->
+            <div class="bg-black bg-opacity-30 p-4 rounded-lg">
+                <div class="flex justify-between items-center mb-4">
+                    <h2 class="title-font text-2xl gold-text">命运守望者</h2>
+                    <div class="flex items-center space-x-2">
+                        <span class="fate-point">FP</span>
+                        <span id="enemy-fate" class="text-xl">5</span>
+                    </div>
+                </div>
+                <div class="mb-4">
+                    <div class="flex justify-between text-sm mb-1">
+                        <span>命运之力</span>
+                        <span id="enemy-health">100/100</span>
+                    </div>
+                    <div class="health-bar">
+                        <div id="enemy-health-bar" class="progress-bar" style="width: 100%"></div>
+                    </div>
+                </div>
+                <div class="mb-6 text-center">
+                    <div id="enemy-avatar" class="w-32 h-32 mx-auto bg-gray-800 rounded-full flex items-center justify-center text-4xl mb-2 glowing">
+                        <i class="fas fa-question"></i>
+                    </div>
+                    <p class="text-sm text-gray-300">命运正注视着你的一举一动</p>
+                </div>
+                <h3 class="title-font text-lg gold-text mb-2">敌人预言</h3>
+                <div id="enemy-prophecies" class="space-y-3">
+                    <!-- 敌人的预言卡牌将通过JS动态添加 -->
+                    <div class="text-center py-4 text-gray-500">暂无激活的预言</div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 预言选择模态框 -->
+    <div id="prophecy-modal" class="fixed inset-0 flex items-center justify-center z-50 hidden modal-overlay">
+        <div class="w-full max-w-3xl p-6 rounded-lg modal-content">
+            <div class="flex justify-between items-center mb-4">
+                <h3 class="title-font text-2xl gold-text">编织你的预言</h3>
+                <button id="close-prophecy-modal" class="text-gray-400 hover:text-white">
+                    <i class="fas fa-times"></i>
+                </button>
+            </div>
+            <div class="mb-4">
+                <p class="text-gray-300 mb-2">选择你的预言契约类型：</p>
+                <div class="grid grid-cols-3 gap-4 mb-6">
+                    <button data-type="self-fulfilling" class="action-button py-2 divine-border active:bg-gray-800">
+                        <i class="fas fa-hand-sparkles mr-2"></i>自我实现
+                    </button>
+                    <button data-type="future-loan" class="action-button py-2 divine-border active:bg-gray-800">
+                        <i class="fas fa-hand-holding-usd mr-2"></i>未来贷款
+                    </button>
+                    <button data-type="alter-prophecy" class="action-button py-2 divine-border active:bg-gray-800">
+                        <i class="fas fa-edit mr-2"></i>篡改预言
+                    </button>
+                </div>
+                <div id="prophecy-options" class="grid grid-cols-1 md:grid-cols-3 gap-4">
+                    <!-- 预言选项将通过JS动态添加 -->
+                </div>
+            </div>
+            <div class="mt-6">
+                <div class="bg-gray-900 bg-opacity-50 p-4 rounded">
+                    <h4 class="title-font text-lg gold-text mb-2">当前选择的预言：</h4>
+                    <div id="selected-prophecy" class="text-gray-300 italic">
+                        暂无选择的预言
+                    </div>
+                    <div class="mt-4">
+                        <div class="flex items-center mb-2">
+                            <span class="w-24">消耗FP:</span>
+                            <span id="prophecy-cost" class="font-bold">0</span>
+                        </div>
+                        <div class="flex items-center">
+                            <span class="w-24">奖励:</span>
+                            <span id="prophecy-reward" class="font-bold">无</span>
+                        </div>
+                    </div>
+                </div>
+                <div class="mt-4 flex justify-end space-x-3">
+                    <button id="cancel-prophecy-btn" class="action-button py-2 px-4">
+                        取消
+                    </button>
+                    <button id="confirm-prophecy-btn" class="action-button py-2 px-4 bg-gradient-to-r from-green-700 to-emerald-700">
+                        确认预言
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+    <!-- 游戏结束模态框 -->
+    <div id="game-over-modal" class="fixed inset-0 flex items-center justify-center z-50 hidden modal-overlay">
+        <div class="w-full max-w-md p-6 rounded-lg modal-content">
+            <h3 class="title-font text-3xl gold-text text-center mb-4">游戏结束</h3>
+            <p id="game-over-message" class="text-center text-xl mb-6">命运已经做出了它的裁决...</p>
+            <div class="text-center">
+                <button id="restart-game-btn" class="action-button py-2 px-6 text-lg">
+                    <i class="fas fa-redo mr-2"></i>重新开始
+                </button>
+            </div>
+        </div>
+    </div>
+    <script>
+        document.addEventListener('DOMContentLoaded', () => {
+            // 游戏状态
+            const gameState = {
+                player: {
+                    health: 100,
+                    maxHealth: 100,
+                    fatePoints: 5,
+                    deck: ['攻击', '防御', '药水', '攻击', '防御'],
+                    prophecies: []
+                },
+                enemy: {
+                    health: 100,
+                    maxHealth: 100,
+                    fatePoints: 5,
+                    prophecies: []
+                },
+                turn: 1,
+                gameOver: false
+            };
+            // 预言类型
+            const prophecyTypes = {
+                'self-fulfilling': {
+                    name: '自我实现预言',
+                    description: '设定一个条件，如果在特定回合内实现，将获得奖励',
+                    examples: [
+                        {
+                            condition: '在3回合内对敌人造成50点伤害',
+                            reward: '+15攻击力',
+                            cost: 3,
+                            turnsToFulfill: 3,
+                            currentTurn: 0,
+                            fulfilled: false
+                        },
+                        {
+                            condition: '在2回合内不使用药水',
+                            reward: '下一次药水效果翻倍',
+                            cost: 2,
+                            turnsToFulfill: 2,
+                            currentTurn: 0,
+                            fulfilled: false
+                        },
+                        {
+                            condition: '连续3回合使用防御',
+                            reward: '永久+10最大生命值',
+                            cost: 3,
+                            turnsToFulfill: 3,
+                            currentTurn: 0,
+                            fulfilled: false
+                        }
+                    ]
+                },
+                'future-loan': {
+                    name: '未来贷款',
+                    description: '立即获得奖励，但如果未来无法偿还，将受到惩罚',
+                    examples: [
+                        {
+                            reward: '立即恢复30生命值',
+                            repayment: '3回合内失去15生命值',
+                            cost: 2,
+                            turnsToRepay: 3,
+                            currentTurn: 0,
+                            repaid: false
+                        },
+                        {
+                            reward: '下一次攻击造成双倍伤害',
+                            repayment: '下回合无法攻击',
+                            cost: 2,
+                            turnsToRepay: 1,
+                            currentTurn: 0,
+                            repaid: false
+                        },
+                        {
+                            reward: '立即获得2FP',
+                            repayment: '3回合内失去3FP',
+                            cost: 1,
+                            turnsToRepay: 3,
+                            currentTurn: 0,
+                            repaid: false
+                        }
+                    ]
+                },
+                'alter-prophecy': {
+                    name: '篡改预言',
+                    description: '修改现有的预言条件或奖励',
+                    examples: [
+                        {
+                            original: '对方使用攻击卡牌没有对我造成伤害。奖励为获取该攻击卡牌',
+                            alteration: '获取两张该攻击卡牌',
+                            cost: 4
+                        },
+                        {
+                            original: '我受到敌人攻击时没有受到伤害。奖励为+5FP',
+                            alteration: '我使用攻击卡牌没有对我造成伤害',
+                            cost: 3
+                        },
+                        {
+                            original: '我在3回合内不使用药水。奖励为+10防御',
+                            alteration: '我在5回合内不使用药水。奖励为+20防御',
+                            cost: 5
+                        }
+                    ]
+                }
+            };
+            // DOM元素
+            const elements = {
+                playerHealth: document.getElementById('player-health'),
+                playerHealthBar: document.getElementById('player-health-bar'),
+                playerFate: document.getElementById('player-fate'),
+                enemyHealth: document.getElementById('enemy-health'),
+                enemyHealthBar: document.getElementById('enemy-health-bar'),
+                enemyFate: document.getElementById('enemy-fate'),
+                turnCounter: document.getElementById('turn-counter'),
+                battleLog: document.getElementById('battle-log'),
+                playerProphecies: document.getElementById('player-prophecies'),
+                enemyProphecies: document.getElementById('enemy-prophecies'),
+                // 按钮
+                attackBtn: document.getElementById('attack-btn'),
+                defendBtn: document.getElementById('defend-btn'),
+                potionBtn: document.getElementById('potion-btn'),
+                prophecyBtn: document.getElementById('prophecy-btn'),
+                endTurnBtn: document.getElementById('end-turn-btn'),
+                // 模态框
+                prophecyModal: document.getElementById('prophecy-modal'),
+                closeProphecyModal: document.getElementById('close-prophecy-modal'),
+                cancelProphecyBtn: document.getElementById('cancel-prophecy-btn'),
+                confirmProphecyBtn: document.getElementById('confirm-prophecy-btn'),
+                prophecyOptions: document.getElementById('prophecy-options'),
+                selectedProphecy: document.getElementById('selected-prophecy'),
+                prophecyCost: document.getElementById('prophecy-cost'),
+                prophecyReward: document.getElementById('prophecy-reward'),
+                gameOverModal: document.getElementById('game-over-modal'),
+                gameOverMessage: document.getElementById('game-over-message'),
+                restartGameBtn: document.getElementById('restart-game-btn')
+            };
+            // 当前选择的预言
+            let selectedProphecy = null;
+            // 初始化游戏
+            initGame();
+            // 事件监听器
+            elements.attackBtn.addEventListener('click', () => playerAction('attack'));
+            elements.defendBtn.addEventListener('click', () => playerAction('defend'));
+            elements.potionBtn.addEventListener('click', () => playerAction('potion'));
+            elements.prophecyBtn.addEventListener('click', showProphecyModal);
+            elements.endTurnBtn.addEventListener('click', endTurn);
+            elements.closeProphecyModal.addEventListener('click', hideProphecyModal);
+            elements.cancelProphecyBtn.addEventListener('click', hideProphecyModal);
+            elements.confirmProphecyBtn.addEventListener('click', confirmProphecy);
+            elements.restartGameBtn.addEventListener('click', initGame);
+            // 预言类型选择按钮
+            document.querySelectorAll('[data-type]').forEach(button => {
+                button.addEventListener('click', () => {
+                    const type = button.dataset.type;
+                    showProphecyOptions(type);
+                });
+            });
+            function initGame() {
+                // 重置游戏状态
+                gameState.player.health = 100;
+                gameState.player.fatePoints = 5;
+                gameState.player.prophecies = [];
+                gameState.enemy.health = 100;
+                gameState.enemy.fatePoints = 5;
+                gameState.enemy.prophecies = [];
+                gameState.turn = 1;
+                gameState.gameOver = false;
+                // 更新UI
+                updateHealthDisplay();
+                updateFateDisplay();
+                updateTurnDisplay();
+                // 清空战斗日志
+                elements.battleLog.innerHTML = `
+                    <div class="text-center py-16 text-gray-500">
+                        <p>命运即将展开...</p>
+                        <p class="mt-4">使用预言能力来改变战斗走向</p>
+                    </div>
+                `;
+                // 清空预言显示
+                elements.playerProphecies.innerHTML = '<div class="text-center py-4 text-gray-500">暂无激活的预言</div>';
+                elements.enemyProphecies.innerHTML = '<div class="text-center py-4 text-gray-500">暂无激活的预言</div>';
+                // 隐藏模态框
+                elements.prophecyModal.classList.add('hidden');
+                elements.gameOverModal.classList.add('hidden');
+                // 添加初始日志
+                addToLog('命运编织正准备开始...');
+                // 敌人随机行动
+                setTimeout(enemyTurn, 1000);
+            }
+            function updateHealthDisplay() {
+                // 更新玩家生命值
+                const playerHealthPercent = (gameState.player.health / gameState.player.maxHealth) * 100;
+                elements.playerHealth.textContent = `${gameState.player.health}/${gameState.player.maxHealth}`;
+                elements.playerHealthBar.style.width = `${playerHealthPercent}%`;
+                // 更新敌人生命值
+                const enemyHealthPercent = (gameState.enemy.health / gameState.enemy.maxHealth) * 100;
+                elements.enemyHealth.textContent = `${gameState.enemy.health}/${gameState.enemy.maxHealth}`;
+                elements.enemyHealthBar.style.width = `${enemyHealthPercent}%`;
+            }
+            function updateFateDisplay() {
+                elements.playerFate.textContent = gameState.player.fatePoints;
+                elements.enemyFate.textContent = gameState.enemy.fatePoints;
+            }
+            function updateTurnDisplay() {
+                elements.turnCounter.textContent = `回合: ${gameState.turn}`;
+            }
+            function addToLog(message, type = 'info') {
+                const logEntry = document.createElement('div');
+                let icon = '';
+                let textColor = 'text-gray-300';
+                switch(type) {
+                    case 'damage':
+                        icon = '<i class="fas fa-bolt mr-2"></i>';
+                        textColor = 'text-red-400';
+                        break;
+                    case 'heal':
+                        icon = '<i class="fas fa-heart mr-2"></i>';
+                        textColor = 'text-green-400';
+                        break;
+                    case 'prophecy':
+                        icon = '<i class="fas fa-eye mr-2"></i>';
+                        textColor = 'text-yellow-400';
+                        break;
+                    case 'fate':
+                        icon = '<i class="fas fa-star mr-2"></i>';
+                        textColor = 'text-purple-400';
+                        break;
+                    default:
+                        icon = '<i class="fas fa-info-circle mr-2"></i>';
+                }
+                logEntry.innerHTML = `<span class="${textColor}">${icon}${message}</span>`;
+                elements.battleLog.appendChild(logEntry);
+                elements.battleLog.scrollTop = elements.battleLog.scrollHeight;
+            }
+            function playerAction(action) {
+                if (gameState.gameOver) return;
+                switch(action) {
+                    case 'attack':
+                        const playerDamage = Math.floor(Math.random() * 15) + 10;
+                        gameState.enemy.health -= playerDamage;
+                        addToLog(`你对敌人造成了${playerDamage}点伤害`, 'damage');
+                        break;
+                    case 'defend':
+                        // 防御可以减少下回合受到的伤害
+                        addToLog('你采取了防御姿态，下回合受到的伤害减少30%', 'info');
+                        break;
+                    case 'potion':
+                        const healAmount = Math.floor(Math.random() * 20) + 15;
+                        gameState.player.health = Math.min(gameState.player.maxHealth, gameState.player.health + healAmount);
+                        addToLog(`你使用药水恢复了${healAmount}点生命值`, 'heal');
+                        break;
+                }
+                updateHealthDisplay();
+                checkGameOver();
+            }
+            function enemyTurn() {
+                if (gameState.gameOver) return;
+                // 简单AI：随机选择攻击或防御
+                const actions = ['attack', 'defend'];
+                const action = actions[Math.floor(Math.random() * actions.length)];
+                switch(action) {
+                    case 'attack':
+                        const enemyDamage = Math.floor(Math.random() * 12) + 8;
+                        gameState.player.health -= enemyDamage;
+                        addToLog(`敌人对你造成了${enemyDamage}点伤害`, 'damage');
+                        break;
+                    case 'defend':
+                        addToLog('敌人采取了防御姿态', 'info');
+                        break;
+                }
+                updateHealthDisplay();
+                checkGameOver();
+            }
+            function endTurn() {
+                if (gameState.gameOver) return;
+                // 检查预言完成情况
+                checkProphecies();
+                gameState.turn++;
+                updateTurnDisplay();
+                // 每回合恢复1FP，最多5点
+                gameState.player.fatePoints = Math.min(5, gameState.player.fatePoints + 1);
+                gameState.enemy.fatePoints = Math.min(5, gameState.enemy.fatePoints + 1);
+                updateFateDisplay();
+                addToLog(`进入第${gameState.turn}回合`, 'info');
+                // 敌人行动
+                setTimeout(enemyTurn, 1000);
+            }
+            function checkGameOver() {
+                if (gameState.player.health <= 0) {
+                    gameState.player.health = 0;
+                    gameState.gameOver = true;
+                    updateHealthDisplay();
+                    showGameOver(false);
+                } else if (gameState.enemy.health <= 0) {
+                    gameState.enemy.health = 0;
+                    gameState.gameOver = true;
+                    updateHealthDisplay();
+                    showGameOver(true);
+                }
+            }
+            function showGameOver(playerWon) {
+                if (playerWon) {
+                    elements.gameOverMessage.textContent = '命运眷顾着你！你取得了胜利！';
+                    elements.gameOverMessage.className = 'text-center text-xl mb-6 text-emerald-400';
+                } else {
+                    elements.gameOverMessage.textContent = '命运对你不再微笑...你被击败了';
+                    elements.gameOverMessage.className = 'text-center text-xl mb-6 text-red-400';
+                }
+                elements.gameOverModal.classList.remove('hidden');
+            }
+            function showProphecyModal() {
+                if (gameState.gameOver) return;
+                selectedProphecy = null;
+                elements.selectedProphecy.textContent = '暂无选择的预言';
+                elements.prophecyCost.textContent = '0';
+                elements.prophecyReward.textContent = '无';
+                // 清空之前的选项
+                elements.prophecyOptions.innerHTML = '';
+                elements.prophecyModal.classList.remove('hidden');
+            }
+            function hideProphecyModal() {
+                elements.prophecyModal.classList.add('hidden');
+            }
+            function showProphecyOptions(type) {
+                // 清空之前的选项
+                elements.prophecyOptions.innerHTML = '';
+                const typeData = prophecyTypes[type];
+                // 创建预言选项卡片
+                typeData.examples.forEach((prophecy, index) => {
+                    const card = document.createElement('div');
+                    card.className = 'prophecy-card p-4 rounded cursor-pointer';
+                    card.dataset.index = index;
+                    let content = `<h4 class="font-bold mb-2 gold-text">${typeData.name}</h4>`;
+                    if (type === 'self-fulfilling') {
+                        content += `
+                            <p class="text-sm mb-2">条件: ${prophecy.condition}</p>
+                            <p class="text-sm">奖励: ${prophecy.reward}</p>
+                        `;
+                    } else if (type === 'future-loan') {
+                        content += `
+                            <p class="text-sm mb-2">奖励: ${prophecy.reward}</p>
+                            <p class="text-sm">偿还: ${prophecy.repayment}</p>
+                        `;
+                    } else if (type === 'alter-prophecy') {
+                        content += `
+                            <p class="text-sm mb-2">原预言: ${prophecy.original}</p>
+                            <p class="text-sm">篡改为: ${prophecy.alteration}</p>
+                        `;
+                    }
+                    content += `<div class="mt-3 text-right text-xs"><span class="gold-text">FP: ${prophecy.cost}</span></div>`;
+                    card.innerHTML = content;
+                    card.addEventListener('click', () => {
+                        selectProphecy(type, index);
+                    });
+                    elements.prophecyOptions.appendChild(card);
+                });
+            }
+            function selectProphecy(type, index) {
+                const prophecy = JSON.parse(JSON.stringify(prophecyTypes[type].examples[index]));
+                prophecy.type = type;
+                selectedProphecy = prophecy;
+                // 更新UI显示选择的预言
+                if (type === 'self-fulfilling') {
+                    elements.selectedProphecy.innerHTML = `
+                        <p><span class="gold-text">条件:</span> ${prophecy.condition}</p>
+                        <p><span class="gold-text">奖励:</span> ${prophecy.reward}</p>
+                        <p><span class="gold-text">持续回合:</span> ${prophecy.turnsToFulfill}</p>
+                    `;
+                } else if (type === 'future-loan') {
+                    elements.selectedProphecy.innerHTML = `
+                        <p><span class="gold-text">奖励:</span> ${prophecy.reward}</p>
+                        <p><span class="gold-text">偿还:</span> ${prophecy.repayment}</p>
+                    `;
+                } else if (type === 'alter-prophecy') {
+                    elements.selectedProphecy.innerHTML = `
+                        <p><span class="gold-text">原预言:</span> ${prophecy.original}</p>
+                        <p><span class="gold-text">篡改为:</span> ${prophecy.alteration}</p>
+                    `;
+                }
+                elements.prophecyCost.textContent = prophecy.cost;
+                elements.prophecyReward.textContent = prophecy.type === 'future-loan' ? prophecy.reward : (prophecy.reward || prophecy.alteration);
+            }
+            function confirmProphecy() {
+                if (!selectedProphecy || gameState.player.fatePoints < selectedProphecy.cost) {
+                    addToLog('命运之力不足，无法完成预言契约', 'prophecy');
+                    hideProphecyModal();
+                    return;
+                }
+                // 支付命运点数
+                gameState.player.fatePoints -= selectedProphecy.cost;
+                updateFateDisplay();
+                // 添加预言到玩家列表
+                const prophecyCopy = JSON.parse(JSON.stringify(selectedProphecy));
+                // 根据预言类型处理
+                if (prophecyCopy.type === 'future-loan') {
+                    // 立即给予奖励
+                    if (prophecyCopy.reward.includes('生命值')) {
+                        const healAmount = parseInt(prophecyCopy.reward.match(/\d+/)[0]);
+                        gameState.player.health = Math.min(gameState.player.maxHealth, gameState.player.health + healAmount);
+                        addToLog(`预言贷款生效: ${prophecyCopy.reward}`, 'prophecy');
+                    } else if (prophecyCopy.reward.includes('FP')) {
+                        const fpGain = parseInt(prophecyCopy.reward.match(/\d+/)[0]);
+                        gameState.player.fatePoints += fpGain;
+                        addToLog(`预言贷款生效: ${prophecyCopy.reward}`, 'prophecy');
+                    }
+                    updateHealthDisplay();
+                    updateFateDisplay();
+                }
+                gameState.player.prophecies.push(prophecyCopy);
+                displayPlayerProphecies();
+                addToLog(`你制定了一个新的预言契约: "${prophecyCopy.type === 'alter-prophecy' ? prophecyCopy.alteration : prophecyCopy.condition}"`, 'prophecy');
+                hideProphecyModal();
+            }
+            function displayPlayerProphecies() {
+                if (gameState.player.prophecies.length === 0) {
+                    elements.playerProphecies.innerHTML = '<div class="text-center py-4 text-gray-500">暂无激活的预言</div>';
+                    return;
+                }
+                elements.playerProphecies.innerHTML = '';
+                gameState.player.prophecies.forEach((prophecy, index) => {
+                    const card = document.createElement('div');
+                    card.className = 'prophecy-card p-3 rounded text-sm';
+                    let content = `<h4 class="font-bold mb-1 gold-text">${prophecyTypes[prophecy.type].name}</h4>`;
+                    if (prophecy.type === 'self-fulfilling') {
+                        const progress = Math.min(prophecy.currentTurn / prophecy.turnsToFulfill * 100, 100);
+                        content += `
+                            <p class="mb-1">条件: ${prophecy.condition}</p>
+                            <p class="mb-1">奖励: ${prophecy.reward}</p>
+                            <div class="w-full bg-gray-700 rounded h-2 mb-1">
+                                <div class="bg-gradient-to-r from-yellow-500 to-red-500 h-2 rounded" style="width: ${progress}%"></div>
+                            </div>
+                            <p class="text-xs">${prophecy.currentTurn}/${prophecy.turnsToFulfill}回合</p>
+                        `;
+                    } else if (prophecy.type === 'future-loan') {
+                        const progress = Math.min(prophecy.currentTurn / prophecy.turnsToRepay * 100, 100);
+                        content += `
+                            <p class="mb-1">奖励已获得: ${prophecy.reward}</p>
+                            <p class="mb-1">偿还: ${prophecy.repayment}</p>
+                            <div class="w-full bg-gray-700 rounded h-2 mb-1">
+                                <div class="bg-gradient-to-r from-green-500 to-blue-500 h-2 rounded" style="width: ${progress}%"></div>
+                            </div>
+                            <p class="text-xs">${prophecy.currentTurn}/${prophecy.turnsToRepay}回合</p>
+                        `;
+                    } else if (prophecy.type === 'alter-prophecy') {
+                        content += `
+                            <p class="mb-1">原预言: ${prophecy.original}</p>
+                            <p class="mb-1">篡改为: ${prophecy.alteration}</p>
+                            <p class="text-xs mt-1">已生效</p>
+                        `;
+                    }
+                    card.innerHTML = content;
+                    elements.playerProphecies.appendChild(card);
+                });
+            }
+            function checkProphecies() {
+                // 检查玩家预言
+                gameState.player.prophecies.forEach(prophecy => {
+                    if (prophecy.type === 'self-fulfilling') {
+                        prophecy.currentTurn++;
+                        // 检查是否完成
+                        if (prophecy.currentTurn >= prophecy.turnsToFulfill && !prophecy.fulfilled) {
+                            // 这里应该检查实际条件是否满足，简单示例中我们假设都满足
+                            prophecy.fulfilled = true;
+                            grantProphecyReward(prophecy);
+                            addToLog(`预言实现: ${prophecy.condition}! 获得奖励: ${prophecy.reward}`, 'prophecy');
+                        }
+                    } else if (prophecy.type === 'future-loan' && !prophecy.repaid) {
+                        prophecy.currentTurn++;
+                        // 检查是否需要偿还
+                        if (prophecy.currentTurn >= prophecy.turnsToRepay) {
+                            prophecy.repaid = true;
+                            repayFutureLoan(prophecy);
+                            addToLog(`预言贷款到期: ${prophecy.repayment}`, 'prophecy');
+                        }
+                    }
+                });
+                // 过滤掉已完成的预言
+                gameState.player.prophecies = gameState.player.prophecies.filter(p =>
+                    (p.type === 'self-fulfilling' && !p.fulfilled) ||
+                    (p.type === 'future-loan' && !p.repaid) ||
+                    (p.type === 'alter-prophecy')
+                );
+                displayPlayerProphecies();
+                // 敌人也会有自己的预言逻辑（简单示例中省略）
+            }
+            function grantProphecyReward(prophecy) {
+                if (prophecy.reward.includes('攻击力')) {
+                    // 增强玩家攻击力
+                    addToLog('你的攻击变得更加强大了', 'fate');
+                } else if (prophecy.reward.includes('药水效果')) {
+                    // 下一次药水效果更好
+                    addToLog('你的药水力量增强了', 'fate');
+                } else if (prophecy.reward.includes('生命值')) {
+                    const hpGain = parseInt(prophecy.reward.match(/\d+/)[0]);
+                    gameState.player.maxHealth += hpGain;
+                    gameState.player.health += hpGain;
+                    addToLog('你的最大生命值增加了', 'fate');
+                    updateHealthDisplay();
+                }
+            }
+            function repayFutureLoan(prophecy) {
+                if (prophecy.repayment.includes('生命值')) {
+                    const hpLoss = parseInt(prophecy.repayment.match(/\d+/)[0]);
+                    gameState.player.health = Math.max(0, gameState.player.health - hpLoss);
+                    addToLog(`你失去了${hpLoss}点生命值作为预言偿还`, 'damage');
+                    updateHealthDisplay();
+                } else if (prophecy.repayment.includes('FP')) {
+                    const fpLoss = parseInt(prophecy.repayment.match(/\d+/)[0]);
+                    gameState.player.fatePoints = Math.max(0, gameState.player.fatePoints - fpLoss);
+                    addToLog(`你失去了${fpLoss}点命运之力作为预言偿还`, 'fate');
+                    updateFateDisplay();
+                } else if (prophecy.repayment.includes('无法攻击')) {
+                    addToLog('你需要休息一回合来偿还预言', 'info');
+                    // 这里可以标记玩家下回合不能攻击
+                }
+                checkGameOver();
+            }
+        });
+    </script>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - <a href="https://enzostvs-deepsite.hf.space?remix=coldandcode/nicecatch" style="color: #fff;text-decoration: underline;" target="_blank" >🧬 Remix</a></p></body>
+</html>