请实现一个以**酸碱强弱、电离程度、pH与稀释鉴别**为主题的交互可视化网页。

用户在四个实验阶段中操作pH仪和粒子视窗，比较已知样品，进行十倍稀释，最后依据两杯近同pH溶液的实际测量鉴别强弱酸。仪器、粒子比例、测量卡与结果必须来自同一套样品状态。

## 1. 核心操作与科学模型

采用25°C理想溶液模型，只包含单元强酸、单元弱酸和单元强碱，分析浓度C位于0.0001–0.100 mol/L。每阶段的配方固定，浓度只能通过一次十倍稀释改变；不混合中和，不加入弱碱或滴定。

强酸[H⁺]=C，强碱[OH⁻]=C；弱酸Ka=1.00×10⁻⁵，主离子浓度x=[H⁺]=(√(Ka²+4KaC)−Ka)/2，解离度α=x/C。pH=−log₁₀[H⁺]；强碱由pOH=−log₁₀[OH⁻]、pH=14−pOH求得。完全解离样品α=1。另一种H⁺或OH⁻浓度按Kw=1.00×10⁻¹⁴互推；本范围忽略水对主离子浓度的微小修正，不声称高浓度活度计算。

“测量pH”与“观察粒子”分别产生仪器读数和粒子观察，未操作时显示未测量或待观察。粒子按离子、未解离溶质的比例示意，附定量解离度，不能把少量图标说成真实分子数。若显示导电指示，明确它只是离子浓度代理，没有考虑迁移率，不作为不同离子真实电导率的比较。

“十倍稀释”使当前C除以10，每份原样只允许一次；“重新取原样”恢复该杯本阶段初始配方并清空活动仪器读数，已保存卡片不改变。一般阶段显示已知配方；最后的匿名鉴别阶段只显示A/B编号及已测结果，提交前隐藏类型、原始浓度、Ka、酸名和直接点名强弱的公式分支，仪器标题、粒子图例、说明与反馈也不能提前给出身份。

## 2. 实验阶段与任务目标

各阶段开始时仪器未测量，样品未稀释。固定配方不提供自由修改入口；记录必须来自本阶段实际操作仪器取得的结果。

| 阶段 | 初态与允许操作 | 提交通过条件 |
| --- | --- | --- |
| 酸碱测量 | C=0.010 mol/L，初始强酸；切换强酸/强碱，操作pH仪与粒子视窗 | 先保存强酸再保存强碱的实际测量与观察，pH分别2.00±0.01、12.00±0.01，均完全解离，明确碱的计算依据为OH⁻ |
| 同浓度强弱 | C=0.010 mol/L，初始强酸；切换强酸/弱酸并测量观察 | 保存同浓度两态的pH、α与离子比例；弱酸pH=3.51±0.02、0<α<1 |
| 十倍稀释 | 弱酸C=0.010 mol/L；测量、一次十倍稀释或重新取原样 | 保存同一份样品的原样及稀释后记录；后者C=0.001 mol/L、pH=4.02±0.02，α增加，并显示实际ΔpH |
| 近同pH鉴别 | 固定实现配方A为强酸0.001 mol/L、B为弱酸0.100 mol/L，提交前界面隐藏这些配方；初始选中A，两杯均为原样 | 各杯分别完成原样与一次十倍稀释后的pH测量及粒子观察，保存四份记录，再选择两杯身份并提交；A判强酸、B判弱酸，依据各自ΔpH与解离比例解释 |

pH仪显示到0.01，保存内部计算值供差值与容差判断；最后两杯初次pH均显示约3.00，不能仅凭初次近同pH判定。每份记录含样品编号、原样或稀释标记、配对来源、pH、α及粒子快照；一般阶段另含已知配方，匿名阶段提交前不在卡片中显示隐藏配方。

A/B有独立活动状态与历史，切换杯子不能重新配方或自动稀释。原样和稀释记录必须来自同一杯、同一次原样的前后操作；重新取原样后开始新一组配对，不能把旧原样与新一轮稀释拼接。仪器先前读数在样品改变后失效，须重新测量和观察。

## 3. 数值与视觉一致性

当前杯子、浓度、pH、离子比例与测量卡指向同一份样品。稀释后的粒子示意区分浓度降低和解离比例升高，不能以图标数量不变声称浓度不变，也不能把弱酸画成单纯少量的完全解离强酸。未解离分子、H⁺、OH⁻及对应反离子有稳定形状和图例。

十倍稀释可表现为取定量原液再用水定容至十倍体积，明确取样与定容含义，避免在同一杯中无说明地无限加水。pH色带是仪器结果，不是未测量时溶液自行显色。保存卡锁定当时观察，活动样品修改不回写历史；匿名阶段仅测量得到的α等结果可见，不以隐藏浓度铭牌代替实验。

## 4. 连续交互与多阶段流程

提供“开始本阶段”“测量pH”“观察粒子”“保存本次记录”、按阶段开放的样品切换/稀释/取原样、“提交结果”“重试本阶段”“下一阶段”和“重新开始全部阶段”。四阶段在同一会话中依次完成，目标与进度持续可见。

开始前可观察预览，开始后才取得有效证据。保存只收录已有仪器结果，不自动生成缺少的测量；已保存卡片只读。恢复原样可重新实验而不删除旧卡，但提交使用本阶段完整的配对记录。阶段四两杯都需要独立证据和身份选择，不能因猜对身份就跳过测量。

提交未通过保留仪器、样品和记录，解释缺失测量、配对或选择，允许继续补测并提交；匿名样品身份与计算分支只在提交后的反馈中揭示。通过后冻结本阶段与摘要，等待主动推进。重试恢复本阶段全部原样、清空本阶段记录与选择，保留前面进度；下一阶段清理旧卡片活动状态和过渡动画。最终汇总四阶段，全部重新开始清空进度；重复稀释不能越过一次限制或让其他杯子同时改变。

## 5. 结果与科学反馈

逐项展示pH、解离度、稀释前后差值、目标与记录完整性。区分未测量、未观察粒子、缺少另一样品、缺少原样记录、原样与稀释态配错、尚未稀释以及身份判断不符，不能只显示成功或失败。

可展开科学信息区在已知样品阶段代入相应关系，解释强弱与浓度是不同概念、碱的pH为什么要从OH⁻计算，以及弱酸稀释时α增加但pH变化不严格等于0.5。匿名阶段提交前只解释仪器与稀释操作，不展示身份分支；提交后分别对A/B展示实际ΔpH、解离比例与计算依据，不把“两杯起初都约3.00”解释成同种配方。

## 6. 游戏风格、美学与可用性

**游戏风格：《Papers, Please》式证物桌 ×《Ace Attorney》式案卷与指认呈现。** 采用“电光侦探社”的场景概念，在青紫霓虹与黄铜暖灯照亮的实验桌上检验四份案件工单。二维或2.5D固定视角突出样品、仪器和证据卡，鉴别由科学测量完成。

- **场景与材质**：深色木桌、玻璃样品杯、黄铜探头、纸质案卷和圆形显微观察窗。环境具有1920年代侦探所质感，近景灯罩和证物袋不能挡住pH读数或A/B编号。
- **科学操作的游戏化呈现**：pH探头和显微观察窗各有明确测量动作，稀释瓶完成定量取样与定容，原样瓶对应重新取样。保存将实际测量写成证物卡，不能把点击装饰工具或翻案卷当成测量。
- **阶段场景重点**：酸碱检验台并列强酸/强碱pH与解离证据；强弱案呈同浓度对照；稀释案呈同杯前后配对；双样终审按A/B各放两张证物卡。最后一案的隐藏信息从仪器、标题到卡片一致执行。
- **颜色与信息层级**：pH色带配数字刻度与酸碱文字，未解离分子和离子使用不同形状与文字图例；C与α分列。当前杯、已保存卡、原样/稀释标记清楚区分，不能仅靠溶液颜色透露匿名身份。
- **反馈动效**：测量灯响应后才生成读数，稀释完成使活动结果失效、复测后写入新卡；旧卡保持不变。提交后用实际证据揭示身份，未通过保留现场，不自动补齐其他杯的记录。

四阶段沿用统一世界观、材质和界面，通过样品安排和证据关系产生变化。科学观察区是主体，粒子、仪器和反馈来自同一状态。参考游戏用于视觉与交互质感，素材自行创作，不加入调查点预算、惩罚生命、随机换嫌疑人、限时或额外故事分支。

默认1440×900下当前样品、主要仪器、目标和操作无需横向滚动；窄屏可重排并纵向滚动。案卷与解释可收起，不盖住测量或稀释按钮；结果和异常兼有文字或图标。音效可选并可静音，构图、绘图技术及代码实现自行设计。

## 7. 交付要求

提供完整可运行的纯前端网页，以 `index.html` 为入口，通过本地HTTP服务即可打开。附源码、运行说明和已完成的自检说明。

核心流程不依赖后端或外部网络，依赖与资源随项目提供。代码组织、内部命名、绘图技术与算法实现由你决定。界面使用中文，数值明确标注单位。