const { useState } = React; // --- Components --- const SectionHeader = ({ icon, title, subtitle, color }) => ( <div className={`flex items-center gap-3 mb-6 pb-2 border-b-2 {color}\`}> <div className={\`p-2 rounded-lg text-white{color.replace('border-', 'bg-')}`}> <i className={`fas ${icon} text-xl`}>

); const CognitiveMap = () => { return ( ); }; const AccordionItem = ({ title, children }) => { const

$$isOpen, setIsOpen$$

= useState(false); return (

); }; const CoreConcepts = () => { return ( ); }; const DeepDive = () => { return ( ); }; const ThinkingModels = () => { return ( ); }; const ClassicCases = () => { const cases =

{ id: 1, title: "Na₂O₂的性质与电子转移", question: "关于反应 2Na₂O₂ + 2H₂O = 4NaOH + O₂↑，下列说法正确的是（ ）", options: \[ { label: "A", text: "Na₂O₂是氧化剂，H₂O是还原剂" }, { label: "B", text: "每生成1mol O₂，转移2mol电子" }, { label: "C", text: "Na₂O₂中阴阳离子个数比为1:1" }, { label: "D", text: "反应后溶液中滴加酚酞，溶液变红且不褪色" }

, logic:

$$"1. 标价态：Na₂O₂中O为-1价。产物NaOH中O为-2价，O₂中O为0价。H₂O中元素价态未变。", "2. 析本质：这是Na₂O₂自身的歧化反应。Na₂O₂既是氧化剂又是还原剂，H₂O仅作反应物。A错。", "3. 算电子：-1价O升至0价生成O₂。生成1mol O₂ (2个O原子)，需2mol O原子各失1e⁻。故转移2mol电子。B对。", "4. 查结构：Na₂O₂由2个Na⁺和1个O₂²⁻构成，离子比为2:1。C错。", "5. 辨现象：Na₂O₂具有强氧化性（漂白性），溶液先变红后褪色。D错。"$$

, variant: "变式：若将Na₂O₂投入FeCl₂溶液中，会观察到什么现象？（提示：产生气体+红褐色沉淀）" }, { id: 2, title: "Na₂CO₃与NaHCO₃的鉴别与转化", question: "下列关于Na₂CO₃和NaHCO₃的说法中，正确的是（ ）", options:

$${ label: "A", text: "热稳定性：Na₂CO₃ < NaHCO₃" }, { label: "B", text: "等质量的两种固体与足量盐酸反应，Na₂CO₃产生CO₂多" }, { label: "C", text: "除去Na₂CO₃固体中的NaHCO₃，可用加热法" }, { label: "D", text: "可用Ca(OH)₂溶液鉴别二者" }$$

, logic:

$$"1. 稳定性：NaHCO₃受热易分解，Na₂CO₃稳定。A错。", "2. 产气量：M(Na₂CO₃)=106, M(NaHCO₃)=84。等质量m时，n(NaHCO₃)大，故NaHCO₃产气多。B错。", "3. 除杂：利用NaHCO₃的热不稳定性，加热转化为Na₂CO₃。C对。", "4. 鉴别：二者均与Ca(OH)₂反应生成白色沉淀CaCO₃（NaHCO₃+Ca(OH)₂也能沉淀）。不能鉴别。D错。"$$

, variant: "变式：如何不用任何试剂鉴别Na₂CO₃溶液和稀盐酸？（互滴法）" }, { id: 3, title: "氯水的成分与性质探究", question: "向新制氯水中分别进行下列操作，现象及结论正确的是（ ）", options:

$${ label: "A", text: "加入AgNO₃溶液，产生白色沉淀，说明氯水含有Cl⁻" }, { label: "B", text: "加入石蕊试液，溶液变红，说明氯水呈酸性" }, { label: "C", text: "将鲜花放入氯水中，鲜花褪色，说明Cl₂有漂白性" }, { label: "D", text: "光照氯水，有气泡产生，该气体是Cl₂" }$$

, logic:

$$"1. 沉淀：Cl₂ + H₂O ⇌ H⁺ + Cl⁻ + HClO。Cl⁻ + Ag⁺ = AgCl↓。A对。", "2. 变色：含有H⁺变红，但含有HClO（强氧化性）会使红色褪去。现象应是先红后褪。B错。", "3. 漂白：Cl₂本身无漂白性，是反应生成的HClO漂白。干燥Cl₂不能使干燥红纸褪色。C错。", "4. 分解：2HClO =(光)= 2HCl + O₂↑。产生的气体是氧气。D错。"$$

, variant: "变式：久置氯水与新制氯水相比，pH值如何变化？（酸性增强，pH减小）" }, { id: 4, title: "阿伏加德罗常数(Nₐ)的陷阱", question: "设Nₐ为阿伏加德罗常数的值，下列说法正确的是（ ）", options:

$${ label: "A", text: "标准状况下，22.4 L H₂O 含有的分子数为 Nₐ" }, { label: "B", text: "1 mol/L K₂SO₄溶液中含有的K⁺数目为 2Nₐ" }, { label: "C", text: "常温常压下，32 g O₂ 和 O₃ 的混合气体中含有的氧原子数为 2Nₐ" }, { label: "D", text: "2.4 g Mg 与足量盐酸反应，转移的电子数为 0.1Nₐ" }$$

, logic:

$$"1. 标况状态：标况下H₂O是液体，不能用22.4L/mol计算。A错。", "2. 缺体积：只给了浓度，没有溶液体积，无法计算微粒数目。B错。", "3. 质量守恒：O₂和O₃均由O原子构成。32g混合物即32g O原子。n(O) = 32/16 = 2mol。C对。", "4. 电子转移：Mg为+2价金属。2.4g Mg = 0.1mol。转移电子 = 0.1 × 2 = 0.2mol。D错。"$$

, variant: "变式：标况下 22.4L Cl₂ 与足量 Fe 反应，转移电子数是多少？（提示：Cl₂是氧化剂，0价变-1价，转移2mol e⁻，与生成物FeCl₃无关）" }, { id: 5, title: "物质的量浓度配制误差分析", question: "配制 480 mL 1.0 mol/L NaOH溶液时，下列操作会导致所配浓度偏低的是（ ）", options:

$${ label: "A", text: "选用 500 mL 容量瓶进行配制" }, { label: "B", text: "定容时俯视刻度线" }, { label: "C", text: "转移溶液前容量瓶内有少量蒸馏水" }, { label: "D", text: "定容摇匀后发现液面低于刻度线，又加水补齐" }$$

, logic:

$$"1. 仪器规格：无480mL容量瓶，必须选500mL。计算溶质时也应按500mL计算。这是正确操作。A错。", "2. 定容读数：俯视 → 液面低 → V偏小 → c偏高。B错。", "3. 瓶底存水：不影响溶质n，也不影响最终溶液体积V。无影响。C错。", "4. 摇匀补水：摇匀后部分溶液粘在瓶塞下方，液面下降属正常。补水会导致V偏大 → c偏低。D对。"$$

, variant: "思考：若称量NaOH固体时，砝码和药品位置放反（使用了游码），浓度如何变化？（m偏小 → c偏低）" } ]; return (

); }; const App = () => { return ( ); }; const root = ReactDOM.createRoot(document.getElementById('root')); root.render();