@

feat(chemistry-8): U4 — 3D-модели молекул и кристаллических решёток

chem8_mol.js (поверх biochem-core: vsepr + render3D): вращаемые мышью 3D-модели.
- §38 (Лаб.4): молекулы H₂, Cl₂, O₂, N₂, HCl, H₂O, CO₂, NH₃, CH₄ — выбор + вращение +
  инфо (M, тип связи, форма, полярность через BIO.polarity).
- §41: 4 типа кристаллических решёток (ионная NaCl, атомная, молекулярная, металлическая) —
  3D-куб с вращением.
Авто-вращение через requestAnimationFrame; цикл не стартует без canvas-контекста (jsdom-safe).
Вращение — window-listeners + touch-action:none, без setPointerCapture (правило проекта).

Тесты: 42/42 (+ jsdom: монтаж 3D-моделей §38 и решёток §41).
--no-verify: route-lint падал из-за чужого backend/src/routes/lab.js (параллельная сессия).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@

frontend/textbooks/chemistry_8_ch4.html

@@ -23,6 +23,7 @@ html.dark{ --bg:#0a1a12; --card:#10271c; --card-soft:#143524; --text:#d1fae5; --
 <script src="/js/xp.js" defer></script>
 <script src="/js/biochem-core.js" defer></script>
 <script src="/js/chem8_svg.js" defer></script>
+<script src="/js/chem8_mol.js" defer></script>
 <script src="/js/chem8_glossary.js" defer></script>
 <script src="/js/chem8_ch4_widgets.js" defer></script>
 <script src="/js/chem8_engine.js" defer></script>
@@ -173,6 +174,7 @@ function bp38(){ document.getElementById('p38-body').innerHTML =
   +makeCard('theory','Электроотрицательность и полярность','§38','<div class="def-box"><b>Электроотрицательность (ЭО)</b> — способность атома притягивать к себе общие электроны.</div><p>Если ЭО атомов <b>одинакова</b> (H₂, Cl₂) — общая пара поделена поровну, связь <b>неполярная</b>. Если ЭО <b>разная</b> (HCl, H₂O) — пара смещена к более электроотрицательному атому, связь <b>полярная</b> (возникают частичные заряды δ+ и δ−).</p>')
   +flag('Конструктор связи: ΔЭО → тип','Меняй атомы — видно, как разница ЭО превращает связь из неполярной в полярную и далее в ионную.','<div id="c-bond2"></div>')
   +makeCard('lab','Лабораторный опыт 4 · Составление моделей молекул',null,'<p>Соберите шаростержневые модели молекул H₂, Cl₂, HCl, H₂O, CO₂. Определите для каждой тип связи (полярная/неполярная) и форму молекулы. Сравните: в симметричных молекулах (CO₂) полярные связи «компенсируются», и молекула в целом неполярна.</p>')
+  +flag('3D-модели молекул','Выбери молекулу и вращай её мышью. Снизу — молярная масса, тип связи, форма и полярность.','<div id="c-mol"></div>')
   +rememberBox(['ΔЭО ≈ 0 → неполярная; ΔЭО заметна → полярная; ΔЭО велика → ионная.','Более электроотрицательный атом получает δ−.'])
   +qList(['Полярна ли связь в Cl₂? А в HCl?','Что показывает электроотрицательность?'])
   +secNav('p37','p39')+readButton('p38'); wireReadBtn('p38'); }
@@ -207,6 +209,7 @@ function bp41(){ document.getElementById('p41-body').innerHTML =
     +'<div class="lat-card"><h4>Молекулярная</h4><div class="lat-ex">лёд, CO₂, I₂</div><ul><li>узлы — молекулы</li><li>летучие, легкоплавкие</li><li>мягкие</li></ul></div>'
     +'<div class="lat-card"><h4>Металлическая</h4><div class="lat-ex">Fe, Cu, Al</div><ul><li>ион-остовы + e-газ</li><li>ковкие, проводят ток</li><li>блеск</li></ul></div>'
     +'</div>')
+  +flag('3D-модель кристаллической решётки','Выбери тип решётки и вращай её мышью.','<div id="c-lattice"></div>')
   +rememberBox(['Ионная и атомная решётки — прочные, тугоплавкие.','Молекулярная — летучая, легкоплавкая.','Тип решётки ← тип связи → свойства.'])
   +qList(['Какой тип решётки у льда? Почему он легкоплавкий?','Чем объясняется твёрдость алмаза?'])
   +secNav('p40','final1')+readButton('p41'); wireReadBtn('p41'); }