请帮我创建一个「**智慧班级抽奖系统**」网页，面向教师用户，用于课堂随机点名、班级活动抽奖等场景。要求如下：

### 页面风格
- 整体风格：清新活泼的教育风格，但不失专业感
- 主色调：渐变蓝紫色 + 明亮点缀色
- 字体：圆润易读，优先使用阿里巴巴普惠体
- 背景：淡雅渐变 + 漂浮气球/星星粒子效果，营造轻松愉悦氛围

### 核心功能
1. **顶部标题区**
   - 显示"智慧班级抽奖"主标题
   - 副标题可自定义活动名称（如"六一儿童节抽奖"），点击可修改
   - 右侧显示已抽取人数统计

2. **名字滚动展示区**（核心功能）
   - 中央大字显示滚动中的名字
   - 名字切换时有流畅的淡入淡出/滑动效果
   - 滚动速度可调节（慢/中/快三档）
   - 支持最多500人的名单容量

3. **控制面板**
   - 大号"开始"按钮（绿色，醒目）
   - 大号"停止"按钮（红色，醒目）
   - "重置"按钮（灰色）
   - 抽取人数设置（1-10人，可多抽）

4. **中奖名单展示区**
   - 抽中者以金色卡片形式展示
   - 显示抽取序号（第一位/第二位...）
   - 点击可移除已中奖者（防止重复）

5. **名单管理**
   - 支持粘贴导入名单（一行一个姓名）
   - 支持手动逐个添加
   - 名单本地存储，刷新不丢失
   - 支持导出/导入名单为TXT

6. **历史记录**（全栈功能）
   - 抽奖完成后，调用 Edge Functions 将中奖信息（姓名、时间、活动名称）写入 KV Storage
   - 新增「历史记录」按钮，点击后弹窗展示最近的抽奖记录（从 KV Storage 读取）
   - 支持按活动名称筛选历史记录
   - 显示 KV 连接状态（绿色已连接/红色未连接）
   - KV 不可用时优雅降级，仅使用本地存储

### 技术要求
- 纯前端 HTML5 + CSS3 + 原生 JavaScript
- 响应式设计，支持大屏投影模式和普通屏幕
- 使用 EdgeOne Makers Edge Functions 处理 API 请求
- 使用 KV Storage 持久化存储抽奖数据
- API 设计：GET /api/records 获取记录，POST /api/records 新增记录，DELETE /api/records 清空记录
- 前端用 fetch 调用，保持现有 UI 风格一致
- KV 绑定变量名为 LOTTERY_KV
- 所有静态资源内联或使用公共CDN
- 必须使用 edgeone-pages-skills 的部署模板
- 部署到 EdgeOne Makers 后可公开访问

### 交互细节
- 开始按钮：点击后名字快速滚动，同时播放"嗖嗖嗖"音效
- 停止按钮：点击后名字减速，最后缓缓停在获奖者
- 中奖瞬间：配合庆祝音效 + 金色光芒动画 + 彩纸飘落效果
- 键盘支持：按空格键开始/停止，按F键全屏，方便老师投影操作

### 附加彩蛋
- 鼠标点击特效（点击出现爱心/星星）
- 页面背景根据时间变化（白天蓝色调/夜晚深蓝调）
- 支持全屏模式，适合投影使用