🎮 Crypto Puzzle - 数字迷宫

一个多层解密谜题游戏，为 Rusted Heart 游戏做宣传。

🎯 游戏特色

• 伪装404页面 - 看起来像真的错误页面
• Konami Code解锁 - 经典的秘籍输入
• 动态频谱分析 - 调节频率发现隐藏信息
• 故障效果 - 矩阵雨和glitch视觉效果
• 隐藏元素寻宝 - 盲找可点击区域
• 47/48双重陷阱 - 真假线索混合
• Boss关卡 - 多重条件同时满足
• 控制台交互 - 符合Rusted Heart的隐藏剧情设计
• 粒子背景 - 动态科幻视觉效果

🕹️ 游戏流程

1. 伪装入口

页面初始显示404错误，需要输入 Konami Code 解锁：

↑ ↑ ↓ ↓ ← → ← → B A

2. 频率解密

调节频率滑块，在不同频率段会显示：

• 47 is a lie (45-55Hz) - 陷阱分支！ 会进入假结局
• 48 is the answer (75-85Hz) - 正确路径

⚠️ 重要：选择47会进入一个精心设计的假结局，让你以为游戏完成了，但几秒后会揭示这是陷阱，需要重新选择正确路径！

3. 系统故障

点击"解码信号"后页面进入故障状态，需要在控制台输入：

fix()

4. 隐藏寻宝

在页面中找到3个隐藏的可点击区域。如果找不到，可以在控制台输入：

debug()

5. 最终Boss关

同时满足以下条件：

• 按住 Ctrl + Shift + Alt
• 在控制台输入 reveal()

🎨 技术实现

• React - 主框架
• Canvas - 频谱图和粒子效果
• Web Audio API - 音效生成
• CSS动画 - 各种视觉效果
• Konami Code - 经典游戏秘籍

🚀 运行项目

# 安装依赖
yarn install

# 启动开发服务器
yarn start

# 构建生产版本
yarn build

🎵 控制台命令

打开浏览器控制台(F12)可使用以下命令：

• fix() - 修复系统故障
• debug() - 显示隐藏元素
• reveal() - 最终揭示答案

🎮 关于 Rusted Heart

这是一个关于选择与真相的游戏预告。在即将到来的游戏中：

• 明线剧情会导向坏结局
• 真正的故事隐藏在控制台交互中
• 只有愿意探索隐藏内容的玩家才能发现好结局

完成真结局后，你还能看到完整的技术栈介绍，了解这个解密游戏用到的所有前端技术！

GitHub: https://github.com/AptS-1547/Rusted-Heart

🎓 教育价值

这个项目特别适合编程新生学习：

技术栈涵盖

• React基础: 组件化、Hooks、状态管理
• CSS进阶: 动画、变换、渐变、网格布局
• JavaScript APIs: Canvas、Web Audio、事件处理
• 交互设计: hover效果、过渡动画、响应式布局
• 创意编程: 粒子系统、矩阵雨、故障效果

学习重点

1. React Hooks - useState, useEffect, useRef, useCallback
2. CSS动画 - @keyframes, transitions, transforms
3. Canvas绘图 - 2D绘图API、动画循环
4. 事件处理 - 键盘监听、鼠标交互
5. 状态管理 - 复杂状态的设计和更新
6. 组件设计 - 可复用组件的封装

---

"47是谎言，48才是答案。有时候最明显的路径，往往不是正确的路径。"