### 🎯 八年级地理识图大赛互动网页

你是一名初中地理教师兼前端开发专家，擅长使用原生HTML/CSS/JavaScript创建课堂互动工具。你的任务是生成一个**八年级上册“美丽中国识图大赛”课堂交互式网页**，用于小组竞赛答题。

## 网页功能要求

### 核心流程
1. **共8个小组**，每组推选一名主答题人，其他组员可提醒，累计作答时间为1分钟。
2. 每组依次展示随机抽取的省级行政区轮廓或图片，学生需**按顺序完整**说出该省级行政区的“全称-简称-行政中心”（若有多个简称，需将多个简称全部说出，简称顺序不限）。
3. 老师根据学生回答，点击“正确”或“错误”按钮：
   - 点击“正确”：计入正确答题总数，自动进入下一题；
   - 点击“错误”：不计入正确数，自动进入下一题；
   - 点击“暂停”：可暂停计时，用于老师讲解错因。
4. 每组答题结束时（60秒倒计时归零或点击“下一组”），系统展示本组正确答题总数并切换到下一组。
5. **时间到时若当前题未回答完整，则当前题不计入统计**（但该题已耗时，自动结束本组）。

### 必备按钮与界面元素
- “开始”按钮：启动当前组计时；
- “暂停/继续”按钮：暂停或恢复计时；
- “正确”按钮：当前题回答正确，计1分并切下一题；
- “错误”按钮：当前题回答错误，不计分并切下一题；
- “下一组”按钮：结束当前组，切换到下一组并重置计时；
- 实时显示：当前组号、正确答题总数、倒计时（如60秒）、当前题目图片。

### 题库与难度控制
- 内置中国34个省级行政区数据，包含：全称、简称（如有多个用顿号分开）、行政中心、对应图片URL或SVG轮廓。
- 网页自动从题库中随机抽取题目，但需满足**每组难度递进**：
  - 题号越靠后，难度越高；
  - 难度分级参考：行政区名称常见易懂、简称与全称相似度高的题放前面；名称复杂、有多个简称、或简称与名称不相像、或省级行政区为特别行政区/自治区的题放后面。
- 每组题目由系统重新随机排序，但每个组抽到的题目数量尽量均衡（例如可以设置每组的备选库相同，抽取顺序不同）。

### 竞赛积分规则
- 本页需计算每组最终正确答题总数，用于“以每组最终回答的题数计算积分，最多的小组积8分，依次类推，最少的小组积1分”的后续登记。页面可显示各组排名。

## 界面与交互细节
- 页面采用中文，按钮标注清晰、醒目；适合教室投影或大屏使用。
- 页面配色舒适，体现“美丽中国”主题（可加入中国地图元素或淡雅的国风配色）。
- 答题图片区域需显示当前省级行政区图片，不显示名称信息；图片切换时有加载提示。
- 所有功能应基于**纯前端实现**，不依赖付费API、不需要后端、不使用额外框架，优先使用免费模型资源；不限制主流浏览器（Chrome、Edge、Safari、Firefox等均可运行）。

## 输出要求
- 生成一个完整的HTML文件代码，包含内嵌CSS和JavaScript，可直接在浏览器中打开使用。
- 代码含必要注释，便于老师自行修改题库图片或难度顺序。
- 在代码中内置全部省级行政区数据；图片可使用网上免费的SVG/PNG链接，或使用基于canvas绘制的占位轮廓（若无法加载图片，至少显示该行政区名称代码，并高亮提示老师更换图片URL）。

## 质量要求
1. 计时准确：倒计时采用`setInterval`或`requestAnimationFrame`实现，暂停后恢复时间精确。
2. 状态逻辑完整：开始后正确、错误、暂停等按钮可用性正确；未开始时不可切题。
3. 题组切换有序：8组循环完成后可重新开始新的一轮比赛。
4. 错误答题处理：当前题点击“错误”后立即计入总题数并按错误处理，不计入正确数，但需在界面短暂显示“回答错误，正确答案为：全称-简称-行政中心”的提示（便于老师解释），2~3秒后自动进入下一题。
5. 暂停时锁定“正确/错误”按钮，防止老师误操作；恢复后继续。

请直接输出完整HTML代码。