知海观澜

界面说明

### 首页
- 欢迎界面和导航入口
- 知识挑战快速入口
- 每日知识任务
- 额外功能入口（收藏夹、节日、颜色等）
- 涂色绘本入口

### 海洋生物页面
- 6大生物分类卡片
- 点击分类查看该类别下的所有生物
- 生物卡片显示emoji、名称、描述
- 右上角⭐收藏按钮
- 点击卡片学习获得5个贝壳
-海洋工具箱：47个工具

### 海洋知识页面
- 4大知识分类卡片
- 点击分类查看该类别下的知识点
- 手风琴式展开/收起设计
- 每个知识点右侧有⭐收藏按钮
- 展开查看详细内容，学习获得3个贝壳


### 海洋保护页面
- 海洋面临的威胁警示
- 6个保护行动卡片（每个2个贝壳）
- 6个海洋法律法规（每个3个贝壳）
- 可展开查看法规详细内容
- 名人名言激励

### 收藏夹页面
- 收藏统计（总数、知识、生物）
- 标签切换（全部/知识/生物）
- 收藏内容卡片展示
- 点击⭐取消收藏
- 空状态提示

### 奖励页面
- 当前贝壳数量显示
- 22种勋章展示
- 按分类筛选勋章
- 点击兑换勋章
- 我的勋章展示

## 互动游戏

### 拼图游戏 (puzzle.html)
- 使用animal_img中的12张海洋动物图片
- 3种难度：3×3、4×4、5×5
- 拖动拼图块完成图片
- 完成后获得贝壳奖励（5-15个）
- 记录移动次数和用时

### 清洁海洋小游戏 (ocean-cleanup-game.html)
- 点击清理海洋垃圾
- 6种垃圾类型（塑料瓶、塑料袋、易拉罐等）
- 不要点击海洋生物（会扣分）
- 连击系统，连续点击获得额外加分
- 60秒倒计时挑战
- 达到100分获得贝壳奖励
- 最高分记录保存

### 食物链构建游戏 (food-chain.html)
- 5个关卡，难度递增
- 拖拽生物卡片到正确的营养级
- 支持桌面端和移动端拖拽
- 关卡主题：
- 关卡1：简单食物链（4个生物）
- 关卡2：珊瑚礁食物链（5个生物）
- 关卡3：深海食物链（4个生物）
- 关卡4：极地食物链（5个生物）
- 关卡5：复杂食物网（6个生物）
- 提示系统帮助学习
- 完成关卡获得贝壳奖励（5-13个）
- 进度自动保存

## 实用工具

### 3D模型查看器 (model3d.html)
- 海豚的6个角度视图
- 点击缩略图切换视角
- 点击主图片自动切换下一个视角
- 视角包括：正面、背面、左侧、右侧、顶部、底部
- 观看完成获得5个贝壳

### 单位换算器 (unit-converter.html)
- 5种换算类型：
- 速度换算（节、公里/小时、米/秒、英里/小时）
- 距离换算（海里、公里、米、英里）
- 深度换算（英寻、英尺、米、英寸）
- 压力换算（大气压、巴、帕斯卡、psi、水深）
- 温度换算（摄氏度、华氏度、开尔文）
- 实时双向换算
- 常用换算参考提示
- 海洋专业单位支持

### 海洋术语库 (glossary.html)
- 收录60+个常用海洋专业术语
- 中英文对照
- 包含定义和分类
- 支持搜索功能（中英文、定义、分类）
- 字母导航快速定位
- 术语分类：
- 海洋地理
- 海洋生物
- 海洋物理
- 海洋生态
- 海洋环境
- 航海术语
- 海洋资源

工具箱完整列表（8个）：

盐度计算器
声速计算器
浮力计算器
压强计算器
碳排放计算器
船只油耗估算
赤潮预警
海洋能潜力