// Phase 1.3 — заменяет оставшиеся IV-6 stubs §2, §4, §5, §7, §9, §10, §11
// на реальные интерактивы.
'use strict';
const fs = require('fs');
const path = require('path');

const DST = path.join(__dirname, '..', '..', 'frontend', 'textbooks', 'physics_8_ch1.html');
let h = fs.readFileSync(DST, 'utf8');

function makeStubText(n) {
  return `/* IV6 — flagship интерактив (заглушка Phase 1, наполнение в Phase 1.${n}) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Новый интерактив §${n}</div></div>'
    +'<div class="wg-help">Готовится: интерактивная визуализация с drag-and-drop для углубления темы. Скоро будет доступна.</div>'
    +'<div style="padding:30px;text-align:center;color:var(--p8-muted);font-style:italic">'
      +'<svg viewBox="0 0 24 24" style="width:32px;height:32px;stroke:currentColor;fill:none;stroke-width:1.5;opacity:.4"><circle cx="12" cy="12" r="9"/><path d="M12 7v5l3 2"/></svg>'
      +'<div style="margin-top:8px;font-size:.86rem">Phase 1.${n} — coming soon</div>'
    +'</div>'
    +'</div>';`;
}

function replaceStub(pid, n, widgetHtml, initFn) {
  const stubLF = makeStubText(n);
  const stubCRLF = stubLF.replace(/\n/g, '\r\n');
  let stubText = null;
  if (h.includes(stubLF)) stubText = stubLF;
  else if (h.includes(stubCRLF)) stubText = stubCRLF;
  if (!stubText) { console.warn(`${pid}: stub not found`); return false; }
  const eol = stubText === stubCRLF ? '\r\n' : '\n';
  const widget = widgetHtml.trim().replace(/\n/g, eol);
  h = h.replace(stubText, widget);
  h = h.replace(`wireReadBtn('${pid}');`, `wireReadBtn('${pid}');\n  _init${pid.toUpperCase()}_iv6();`);
  const fnStart = h.indexOf(`function build_${pid}()`);
  const fnEnd = h.indexOf('\n}\n', fnStart);
  h = h.slice(0, fnEnd + 3) + '\n' + initFn.trim() + '\n' + h.slice(fnEnd + 3);
  console.log(`${pid}: replaced`);
  return true;
}

// ============================================================
// §2 — Drag-piston (compress gas / supply heat)
// ============================================================
const P2_HTML = `/* IV6 — Piston (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Поршень — два способа изменить U</div></div>'
    +'<div class="wg-help">Двигай поршень — газ сжимается и нагревается (работа над газом → ΔU > 0). Или подавай тепло — U растёт без работы. Сравни графики.</div>'
    +'<div class="p8-sandbox" id="p2-iv6-sandbox" style="height:240px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap">'
      +'<div class="p8-scrubber" style="flex:1;min-width:180px"><span class="p8-scrubber-label">Сжатие</span><input type="range" id="p2-iv6-comp" min="0" max="100" step="1" value="0"><span class="p8-scrubber-value"><span id="p2-iv6-comp-val">0</span><span class="p8-unit">%</span></span></div>'
      +'<div class="p8-scrubber" style="flex:1;min-width:180px"><span class="p8-scrubber-label">Q</span><input type="range" id="p2-iv6-q" min="0" max="500" step="10" value="0"><span class="p8-scrubber-value"><span id="p2-iv6-q-val">0</span><span class="p8-unit">Дж</span></span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">T</span><span class="p8-readout-value" id="p2-iv6-t">20</span><span class="p8-readout-unit">°C</span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">U</span><span class="p8-readout-value" id="p2-iv6-u">100</span></div>'
    +'</div>'
    +'</div>';`;

const P2_INIT = `
function _initP2_iv6(){
  const sb = document.getElementById('p2-iv6-sandbox');
  if (!sb || !window.P8Helpers) return;
  const svg = P8Helpers.svg.create(560, 240);
  svg.setAttribute('width','100%'); svg.setAttribute('height','100%'); svg.style.display='block';
  sb.appendChild(svg);
  const state = { comp: 0, q: 0 };
  function render(){
    svg.innerHTML = '';
    /* Cylinder */
    const compFraction = state.comp / 100;
    const cylX = 80, cylY = 60, cylW = 320, cylH = 120;
    const pistonX = cylX + cylW * (0.2 + compFraction * 0.5);
    svg.appendChild(P8Helpers.svg.el('rect', { x: cylX, y: cylY, width: cylW, height: cylH, rx: 8, fill: 'none', stroke: '#0f172a', 'stroke-width': 2 }));
    /* Gas region (compressed = brighter, hotter) */
    const T = 20 + compFraction * 60 + state.q * 0.1;
    const gasColor = P8Helpers.thermal.tempColor(T / 200);
    svg.appendChild(P8Helpers.svg.el('rect', { x: cylX + 2, y: cylY + 2, width: pistonX - cylX - 4, height: cylH - 4, rx: 6, fill: gasColor, opacity: 0.6 }));
    /* Molecules — count grows with T */
    const numMol = Math.round(8 + T * 0.3);
    for (let i = 0; i < numMol; i++) {
      const px = cylX + 8 + Math.random() * (pistonX - cylX - 16);
      const py = cylY + 8 + Math.random() * (cylH - 16);
      svg.appendChild(P8Helpers.svg.el('circle', { cx: px, cy: py, r: 3, fill: '#fff', opacity: 0.7 }));
    }
    /* Piston */
    svg.appendChild(P8Helpers.svg.el('rect', { x: pistonX - 6, y: cylY - 8, width: 12, height: cylH + 16, fill: '#475569', stroke: '#0f172a' }));
    svg.appendChild(P8Helpers.svg.el('rect', { x: pistonX + 6, y: cylY + cylH/2 - 6, width: 100, height: 12, fill: '#94a3b8', stroke: '#0f172a' }));
    /* Heat source if q>0 */
    if (state.q > 0) {
      svg.appendChild(P8Helpers.svg.el('rect', { x: cylX + 60, y: cylY + cylH + 4, width: 60, height: 12, fill: '#dc2626', rx: 4 }));
      svg.appendChild(P8Helpers.svg.el('text', { x: cylX + 90, y: cylY + cylH + 32, 'font-family':"'Inter',sans-serif", 'font-size':10, 'font-weight':700, fill:'#dc2626', 'text-anchor':'middle', text: 'Q = '+state.q+' Дж' }));
    }
    if (state.comp > 0) {
      svg.appendChild(P8Helpers.svg.el('text', { x: pistonX + 56, y: cylY + cylH/2 - 14, 'font-family':"'Inter',sans-serif", 'font-size':10, 'font-weight':700, fill:'#475569', 'text-anchor':'middle', text: 'A над газом' }));
    }
    /* Readouts */
    document.getElementById('p2-iv6-t').textContent = Math.round(T);
    document.getElementById('p2-iv6-u').textContent = Math.round(100 + compFraction * 60 + state.q * 0.5);
  }
  document.getElementById('p2-iv6-comp').oninput = ev => {
    state.comp = +ev.target.value;
    document.getElementById('p2-iv6-comp-val').textContent = state.comp;
    render();
  };
  document.getElementById('p2-iv6-q').oninput = ev => {
    state.q = +ev.target.value;
    document.getElementById('p2-iv6-q-val').textContent = state.q;
    render();
  };
  render();
}
`;
replaceStub('p2', 2, P2_HTML, P2_INIT);

// ============================================================
// §4 — Convection cell
// ============================================================
const P4_HTML = `/* IV6 — Convection (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Конвекция — нагретая вода поднимается</div></div>'
    +'<div class="wg-help">Двигай мощность горелки. Частицы воды поднимаются вверх по центру (тёплые, менее плотные) и опускаются по краям (остывшие, плотнее) — это конвекционная ячейка.</div>'
    +'<div class="p8-sandbox" id="p4-iv6-sandbox" style="height:280px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap">'
      +'<div class="p8-scrubber" style="flex:1;min-width:200px"><span class="p8-scrubber-label">Мощность</span><input type="range" id="p4-iv6-pwr" min="0" max="100" step="1" value="40"><span class="p8-scrubber-value"><span id="p4-iv6-pwr-val">40</span><span class="p8-unit">%</span></span></div>'
      +'<button class="btn primary" id="p4-iv6-play">Пуск</button>'
      +'<button class="btn" id="p4-iv6-pause">Стоп</button>'
    +'</div>'
    +'</div>';`;

const P4_INIT = `
function _initP4_iv6(){
  const sb = document.getElementById('p4-iv6-sandbox');
  if (!sb || !window.P8Helpers || !window.P8Anim) return;
  const W = 560, H = 280;
  const canvas = document.createElement('canvas');
  canvas.width = W; canvas.height = H;
  canvas.style.width = '100%'; canvas.style.height = '100%'; canvas.style.display = 'block';
  sb.appendChild(canvas);
  const ctx = canvas.getContext('2d');
  let power = 40;
  /* Particles in convection loops */
  const particles = [];
  const NP = 60;
  for (let i = 0; i < NP; i++) {
    particles.push({
      x: 60 + Math.random() * (W - 120),
      y: 40 + Math.random() * (H - 100),
      angle: Math.random() * 2 * Math.PI,
      speed: 0.3 + Math.random() * 0.4,
      r: 2.5 + Math.random() * 1.5
    });
  }
  function step(dt){
    /* Clear */
    ctx.clearRect(0, 0, W, H);
    /* Container */
    ctx.strokeStyle = '#0f172a';
    ctx.lineWidth = 2;
    ctx.strokeRect(40, 20, W - 80, H - 60);
    /* Burner */
    ctx.fillStyle = '#475569';
    ctx.fillRect(180, H - 30, 200, 16);
    /* Flame */
    const flameH = (power / 100) * 16;
    ctx.fillStyle = '#dc2626';
    ctx.fillRect(200, H - 30 - flameH, 160, flameH);
    /* Particles — convection loop: rise in center, fall on edges */
    const cx = W / 2;
    particles.forEach(p => {
      const dx = p.x - cx;
      const localTemp = Math.max(0, 1 - (p.y - 40) / (H - 100)); /* bottom = hot */
      /* Vertical velocity: up in center (proportional to power), down on sides */
      let vy = 0;
      if (Math.abs(dx) < 80) {
        vy = -p.speed * (power / 50) * (0.6 + localTemp);
      } else {
        vy = p.speed * 0.4;
      }
      /* Horizontal: drift inward at top, outward at bottom */
      let vx = 0;
      if (p.y < 60) vx = -dx * 0.005 * (power / 50);
      else if (p.y > H - 70) vx = dx * 0.008 * (power / 50);
      p.x += vx * dt * 60;
      p.y += vy * dt * 60;
      /* Constrain */
      if (p.x < 50) p.x = 50;
      if (p.x > W - 50) p.x = W - 50;
      if (p.y < 30) p.y = 30;
      if (p.y > H - 38) p.y = H - 38;
      /* Color by temp (hotter = closer to bottom and rising) */
      const tempVal = localTemp * (power / 100);
      ctx.fillStyle = P8Helpers.thermal.tempColor(tempVal * 0.7 + 0.15);
      ctx.beginPath();
      ctx.arc(p.x, p.y, p.r, 0, 2 * Math.PI);
      ctx.fill();
    });
  }
  const raf = P8Anim.raf(dt => step(Math.min(dt, 0.05)));
  document.getElementById('p4-iv6-pwr').oninput = ev => {
    power = +ev.target.value;
    document.getElementById('p4-iv6-pwr-val').textContent = power;
  };
  document.getElementById('p4-iv6-play').onclick = () => {
    if (!raf.running) { raf.start(); if (window.addXp) addXp(10, 'p4-iv6-conv'); }
  };
  document.getElementById('p4-iv6-pause').onclick = () => raf.stop();
  /* Auto-start on first view */
  raf.start();
  step(0);
}
`;
replaceStub('p4', 4, P4_HTML, P4_INIT);

// ============================================================
// §5 — Radiation balance (3 bodies under lamp)
// ============================================================
const P5_HTML = `/* IV6 — Radiation (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Излучение — какой цвет нагревается быстрее?</div></div>'
    +'<div class="wg-help">Под лампой — три тела разного цвета: чёрное, белое, зеркальное. Двигай мощность лампы, наблюдай, как растёт T каждого. Чёрное поглощает почти всё, белое — мало, зеркало — почти ничего.</div>'
    +'<div class="p8-sandbox" id="p5-iv6-sandbox" style="height:240px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap">'
      +'<div class="p8-scrubber" style="flex:1;min-width:200px"><span class="p8-scrubber-label">Лампа</span><input type="range" id="p5-iv6-lamp" min="0" max="100" step="1" value="60"><span class="p8-scrubber-value"><span id="p5-iv6-lamp-val">60</span><span class="p8-unit">%</span></span></div>'
      +'<button class="btn primary" id="p5-iv6-play">Старт</button>'
      +'<button class="btn" id="p5-iv6-reset">Сброс</button>'
    +'</div>'
    +'</div>';`;

const P5_INIT = `
function _initP5_iv6(){
  const sb = document.getElementById('p5-iv6-sandbox');
  if (!sb || !window.P8Helpers || !window.P8Anim) return;
  const svg = P8Helpers.svg.create(560, 240);
  svg.setAttribute('width','100%'); svg.setAttribute('height','100%'); svg.style.display='block';
  sb.appendChild(svg);
  let lampPower = 60;
  const bodies = [
    { name: 'Чёрное',   absorption: 0.95, fill: '#0f172a', x: 130, T: 20 },
    { name: 'Белое',    absorption: 0.20, fill: '#f1f5f9', x: 280, T: 20 },
    { name: 'Зеркало',  absorption: 0.05, fill: '#cbd5e1', x: 430, T: 20 }
  ];
  let running = false;
  function render(){
    svg.innerHTML = '';
    /* Lamp */
    svg.appendChild(P8Helpers.svg.el('rect', { x: 240, y: 8, width: 80, height: 20, fill: '#facc15', rx: 4 }));
    svg.appendChild(P8Helpers.svg.el('text', { x: 280, y: 22, 'font-family':"'Unbounded',sans-serif", 'font-size':10, 'font-weight':800, fill:'#0f172a', 'text-anchor':'middle', text: lampPower+'%' }));
    /* Radiation rays */
    bodies.forEach(b => {
      const len = lampPower * 1.2;
      const opacity = lampPower / 100;
      svg.appendChild(P8Helpers.svg.el('line', {
        x1: 280, y1: 28, x2: b.x, y2: 130,
        stroke: '#fde047', 'stroke-width': 2,
        opacity: opacity, 'stroke-dasharray': '4 3'
      }));
    });
    /* Bodies */
    bodies.forEach(b => {
      const g = P8Helpers.svg.el('g', { transform: 'translate('+b.x+',150)' });
      g.appendChild(P8Helpers.svg.el('rect', { x:-32, y:-12, width:64, height:48, rx:5, fill: b.fill, stroke:'#0f172a', 'stroke-width':1.5 }));
      g.appendChild(P8Helpers.svg.el('text', { x:0, y:-22, 'font-family':"'Inter',sans-serif", 'font-size':11, 'font-weight':700, fill:'#0f172a', 'text-anchor':'middle', text: b.name }));
      /* Glow when warm */
      const tempNorm = Math.min(1, (b.T - 20) / 80);
      if (tempNorm > 0.05) {
        g.appendChild(P8Helpers.svg.el('rect', { x:-36, y:-16, width:72, height:56, rx:8, fill: 'none', stroke: P8Helpers.thermal.tempColor(tempNorm*0.5 + 0.5), 'stroke-width': 4, opacity: 0.5 + tempNorm * 0.5 }));
      }
      svg.appendChild(g);
      /* T readout */
      svg.appendChild(P8Helpers.svg.el('text', { x: b.x, y: 220, 'font-family':"'JetBrains Mono',monospace", 'font-size':12, 'font-weight':800, fill: P8Helpers.thermal.tempColor(tempNorm*0.5 + 0.4), 'text-anchor':'middle', text: 'T='+Math.round(b.T)+'°C' }));
    });
  }
  const raf = P8Anim.raf(dt => {
    if (!running) return;
    bodies.forEach(b => {
      b.T += dt * (lampPower / 100) * b.absorption * 10;
      if (b.T > 120) b.T = 120;
    });
    render();
  });
  document.getElementById('p5-iv6-lamp').oninput = ev => {
    lampPower = +ev.target.value;
    document.getElementById('p5-iv6-lamp-val').textContent = lampPower;
    render();
  };
  document.getElementById('p5-iv6-play').onclick = () => {
    if (!running) { running = true; raf.start(); if (window.addXp) addXp(10, 'p5-iv6-rad'); }
  };
  document.getElementById('p5-iv6-reset').onclick = () => {
    running = false; raf.stop();
    bodies.forEach(b => b.T = 20);
    render();
  };
  render();
}
`;
replaceStub('p5', 5, P5_HTML, P5_INIT);

// ============================================================
// §7 — Q = qm fuel burn
// ============================================================
const P7_HTML = `/* IV6 — Fuel burn (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Тепло сгорания: $Q = qm$</div></div>'
    +'<div class="wg-help">Выбери топливо и его массу — посчитаем выделенное тепло и нагрев воды массой 1 кг ($c=4200$). $Q = qm$, $\\\\Delta T = Q / (cm_в)$.</div>'
    +'<div class="p8-sandbox" id="p7-iv6-sandbox" style="height:220px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap;align-items:center">'
      +'<div class="p8-palette" style="margin:0;padding:6px;background:transparent">'
        +'<button class="p8-palette-item" data-fuel="wood">Дрова (q=10 МДж/кг)</button>'
        +'<button class="p8-palette-item" data-fuel="coal">Уголь (q=29 МДж/кг)</button>'
        +'<button class="p8-palette-item" data-fuel="gas">Газ (q=44 МДж/кг)</button>'
      +'</div>'
    +'</div>'
    +'<div style="margin-top:6px;display:flex;gap:14px;flex-wrap:wrap">'
      +'<div class="p8-scrubber" style="flex:1;min-width:200px"><span class="p8-scrubber-label">Масса топлива</span><input type="range" id="p7-iv6-m" min="0.01" max="1" step="0.01" value="0.1"><span class="p8-scrubber-value"><span id="p7-iv6-m-val">0.10</span><span class="p8-unit">кг</span></span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">Q</span><span class="p8-readout-value" id="p7-iv6-q">1.0</span><span class="p8-readout-unit">МДж</span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">ΔT воды</span><span class="p8-readout-value" id="p7-iv6-dt">238</span><span class="p8-readout-unit">К</span></div>'
    +'</div>'
    +'</div>';`;

const P7_INIT = `
function _initP7_iv6(){
  const sb = document.getElementById('p7-iv6-sandbox');
  if (!sb || !window.P8Helpers) return;
  const svg = P8Helpers.svg.create(560, 220);
  svg.setAttribute('width','100%'); svg.setAttribute('height','100%'); svg.style.display='block';
  sb.appendChild(svg);
  const fuels = {
    wood: { q: 10e6, color: '#a16207' },
    coal: { q: 29e6, color: '#1e293b' },
    gas:  { q: 44e6, color: '#3b82f6' }
  };
  let activeFuel = 'wood';
  let mass = 0.1;
  function render(){
    svg.innerHTML = '';
    const f = fuels[activeFuel];
    /* Vessel with water */
    svg.appendChild(P8Helpers.svg.el('rect', { x: 200, y: 30, width: 160, height: 100, fill: 'rgba(125, 211, 252, .55)', stroke: '#0f172a', 'stroke-width': 2, rx: 5 }));
    /* Fuel pile */
    const pileH = 10 + mass * 50;
    svg.appendChild(P8Helpers.svg.el('rect', { x: 240, y: 140 + (40 - pileH), width: 80, height: pileH, fill: f.color, rx: 3 }));
    /* Flame */
    const Q = f.q * mass;
    const intensity = Math.min(1, Q / 5e6);
    svg.appendChild(P8Helpers.svg.el('rect', { x: 230, y: 130 - intensity * 20, width: 100, height: 12 + intensity * 15, fill: '#dc2626', opacity: 0.85, rx: 4 }));
    /* Steam if hot enough */
    const cm = 4200 * 1;
    const dT = Q / cm;
    if (dT > 60) {
      [0, 1, 2].forEach(i => {
        svg.appendChild(P8Helpers.svg.el('circle', { cx: 240 + i * 40, cy: 20 - intensity * 10, r: 6 + intensity * 2, fill: '#cbd5e1', opacity: 0.7 }));
      });
    }
    /* Readouts */
    document.getElementById('p7-iv6-q').textContent = (Q / 1e6).toFixed(2);
    document.getElementById('p7-iv6-dt').textContent = Math.round(dT);
  }
  document.querySelectorAll('#p7-iv6-sandbox ~ * [data-fuel]').forEach(btn => {
    btn.onclick = ev => {
      activeFuel = ev.currentTarget.dataset.fuel;
      document.querySelectorAll('[data-fuel]').forEach(b => b.style.outline = '');
      ev.currentTarget.style.outline = '2px solid var(--p8-brand,#7c3aed)';
      render();
    };
  });
  /* Click on palette items globally */
  Array.from(document.querySelectorAll('[data-fuel]')).forEach(btn => {
    btn.onclick = ev => {
      activeFuel = btn.dataset.fuel;
      document.querySelectorAll('[data-fuel]').forEach(b => b.style.outline = '');
      btn.style.outline = '2px solid var(--p8-brand,#7c3aed)';
      render();
      if (window.addXp) addXp(5, 'p7-iv6-fuel-'+activeFuel);
    };
  });
  document.getElementById('p7-iv6-m').oninput = ev => {
    mass = +ev.target.value;
    document.getElementById('p7-iv6-m-val').textContent = mass.toFixed(2);
    render();
  };
  render();
}
`;
replaceStub('p7', 7, P7_HTML, P7_INIT);

// ============================================================
// §9 — λ-meter (Q = λm)
// ============================================================
const P9_HTML = `/* IV6 — Lambda meter (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Удельная теплота плавления: $Q = \\\\lambda m$</div></div>'
    +'<div class="wg-help">Выбери вещество и массу — рассчитаем энергию, нужную для полного плавления. $Q = \\\\lambda \\\\cdot m$, где $\\\\lambda$ — удельная теплота плавления.</div>'
    +'<div class="p8-sandbox" id="p9-iv6-sandbox" style="height:200px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap;align-items:center">'
      +'<select id="p9-iv6-mat" class="tinp" style="font-family:var(--p8-body)">'
        +'<option value="ice">Лёд (λ=330 кДж/кг)</option>'
        +'<option value="lead">Свинец (λ=25 кДж/кг)</option>'
        +'<option value="al">Алюминий (λ=380 кДж/кг)</option>'
        +'<option value="iron">Железо (λ=270 кДж/кг)</option>'
      +'</select>'
      +'<div class="p8-scrubber" style="flex:1;min-width:200px"><span class="p8-scrubber-label">Масса</span><input type="range" id="p9-iv6-m" min="0.1" max="5" step="0.1" value="1"><span class="p8-scrubber-value"><span id="p9-iv6-m-val">1.0</span><span class="p8-unit">кг</span></span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">Q</span><span class="p8-readout-value" id="p9-iv6-q">330</span><span class="p8-readout-unit">кДж</span></div>'
    +'</div>'
    +'</div>';`;

const P9_INIT = `
function _initP9_iv6(){
  const sb = document.getElementById('p9-iv6-sandbox');
  if (!sb || !window.P8Helpers) return;
  const svg = P8Helpers.svg.create(560, 200);
  svg.setAttribute('width','100%'); svg.setAttribute('height','100%'); svg.style.display='block';
  sb.appendChild(svg);
  const mats = {
    ice: { lambda: 330, color: '#bfdbfe', name: 'Лёд' },
    lead: { lambda: 25, color: '#9ca3af', name: 'Свинец' },
    al: { lambda: 380, color: '#cbd5e1', name: 'Алюминий' },
    iron: { lambda: 270, color: '#64748b', name: 'Железо' }
  };
  let mat = 'ice', mass = 1;
  function render(){
    svg.innerHTML = '';
    const m = mats[mat];
    const Q = m.lambda * mass;
    /* Block of material */
    const blockH = 50 + mass * 25;
    svg.appendChild(P8Helpers.svg.el('rect', { x: 100, y: 100 - blockH/2, width: 100, height: blockH, fill: m.color, stroke: '#0f172a', 'stroke-width': 2, rx: 6 }));
    svg.appendChild(P8Helpers.svg.el('text', { x: 150, y: 100, 'font-family':"'Inter',sans-serif", 'font-size':12, 'font-weight':700, fill:'#0f172a', 'text-anchor':'middle', text: m.name }));
    svg.appendChild(P8Helpers.svg.el('text', { x: 150, y: 116, 'font-family':"'JetBrains Mono',monospace", 'font-size':10, fill:'#0f172a', 'text-anchor':'middle', text: mass.toFixed(1)+' кг' }));
    /* Arrow Q → */
    const arrow = P8Helpers.svg.gradientArrow(svg, 220, 100, 360, 100, { colorFrom:'#fde047', colorTo:'#dc2626', width: 4, headSize: 16, glow: true });
    svg.appendChild(arrow);
    svg.appendChild(P8Helpers.svg.el('text', { x: 290, y: 88, 'font-family':"'Unbounded',sans-serif", 'font-size':13, 'font-weight':800, fill:'#dc2626', 'text-anchor':'middle', text: 'Q = '+Q+' кДж' }));
    /* Melted state */
    svg.appendChild(P8Helpers.svg.el('rect', { x: 380, y: 130, width: 100, height: blockH * 0.55, fill: m.color, opacity: 0.7, stroke: '#0f172a', 'stroke-width': 1.5, rx: 4 }));
    svg.appendChild(P8Helpers.svg.el('text', { x: 430, y: 156, 'font-family':"'Inter',sans-serif", 'font-size':11, 'font-weight':700, fill:'#0f172a', 'text-anchor':'middle', text: 'расплав' }));
    document.getElementById('p9-iv6-q').textContent = Q;
  }
  document.getElementById('p9-iv6-mat').onchange = ev => { mat = ev.target.value; render(); };
  document.getElementById('p9-iv6-m').oninput = ev => {
    mass = +ev.target.value;
    document.getElementById('p9-iv6-m-val').textContent = mass.toFixed(1);
    render();
  };
  render();
}
`;
replaceStub('p9', 9, P9_HTML, P9_INIT);

// ============================================================
// §10 — Evaporation rate
// ============================================================
const P10_HTML = `/* IV6 — Evaporation (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Скорость испарения зависит от...</div></div>'
    +'<div class="wg-help">Что разгоняет испарение? Температура, площадь поверхности и ветер. Двигай скрубберы и наблюдай качественно — стрелки от поверхности вверх.</div>'
    +'<div class="p8-sandbox" id="p10-iv6-sandbox" style="height:220px"></div>'
    +'<div style="margin-top:10px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px">'
      +'<div class="p8-scrubber"><span class="p8-scrubber-label">T</span><input type="range" id="p10-iv6-t" min="0" max="100" step="1" value="50"><span class="p8-scrubber-value"><span id="p10-iv6-t-val">50</span><span class="p8-unit">°C</span></span></div>'
      +'<div class="p8-scrubber"><span class="p8-scrubber-label">Площадь</span><input type="range" id="p10-iv6-s" min="0.01" max="1" step="0.01" value="0.3"><span class="p8-scrubber-value"><span id="p10-iv6-s-val">0.30</span><span class="p8-unit">м²</span></span></div>'
      +'<div class="p8-scrubber"><span class="p8-scrubber-label">Ветер</span><input type="range" id="p10-iv6-w" min="0" max="10" step="0.1" value="2"><span class="p8-scrubber-value"><span id="p10-iv6-w-val">2.0</span><span class="p8-unit">м/с</span></span></div>'
    +'</div>'
    +'<div style="margin-top:6px;display:flex;gap:10px"><div class="p8-readout"><span class="p8-readout-label">Скорость испарения</span><span class="p8-readout-value" id="p10-iv6-rate">—</span><span class="p8-readout-unit">отн.</span></div></div>'
    +'</div>';`;

const P10_INIT = `
function _initP10_iv6(){
  const sb = document.getElementById('p10-iv6-sandbox');
  if (!sb || !window.P8Helpers) return;
  const svg = P8Helpers.svg.create(560, 220);
  svg.setAttribute('width','100%'); svg.setAttribute('height','100%'); svg.style.display='block';
  sb.appendChild(svg);
  let T = 50, S = 0.3, W = 2;
  function render(){
    svg.innerHTML = '';
    /* Water surface */
    const surfaceW = 100 + S * 320;
    const surfaceX = (560 - surfaceW) / 2;
    svg.appendChild(P8Helpers.svg.el('rect', { x: surfaceX, y: 150, width: surfaceW, height: 60, fill: P8Helpers.thermal.tempColor(T/130), opacity: 0.85, stroke: '#0f172a', 'stroke-width': 2 }));
    svg.appendChild(P8Helpers.svg.el('text', { x: 280, y: 200, 'font-family':"'JetBrains Mono',monospace", 'font-size':10, 'font-weight':600, fill:'#fff', 'text-anchor':'middle', text: 'T='+T+'°C, S='+S.toFixed(2)+' м²' }));
    /* Evaporation rate (relative) */
    const rate = (T / 100) * (0.5 + S) * (0.5 + W / 10);
    const numArrows = Math.round(3 + rate * 12);
    for (let i = 0; i < numArrows; i++) {
      const x = surfaceX + (i + 0.5) / numArrows * surfaceW + (Math.random() - 0.5) * 8;
      const len = 30 + rate * 60 + Math.random() * 20;
      const skew = W * 6 * (Math.random() - 0.3);
      const arrow = P8Helpers.svg.gradientArrow(svg, x, 150, x + skew, 150 - len, { colorFrom: '#7dd3fc', colorTo: '#bae6fd', width: 1.5, headSize: 7 });
      if (arrow) svg.appendChild(arrow);
    }
    /* Wind indicator */
    if (W > 1) {
      svg.appendChild(P8Helpers.svg.el('text', { x: 510, y: 30, 'font-family':"'Inter',sans-serif", 'font-size':22, fill: '#64748b', text: '~'.repeat(Math.min(3, Math.round(W/2))) }));
      svg.appendChild(P8Helpers.svg.el('text', { x: 480, y: 50, 'font-family':"'Inter',sans-serif", 'font-size':10, 'font-weight':700, fill: '#64748b', text: 'ветер →' }));
    }
    document.getElementById('p10-iv6-rate').textContent = rate.toFixed(2);
  }
  document.getElementById('p10-iv6-t').oninput = ev => { T = +ev.target.value; document.getElementById('p10-iv6-t-val').textContent = T; render(); };
  document.getElementById('p10-iv6-s').oninput = ev => { S = +ev.target.value; document.getElementById('p10-iv6-s-val').textContent = S.toFixed(2); render(); };
  document.getElementById('p10-iv6-w').oninput = ev => { W = +ev.target.value; document.getElementById('p10-iv6-w-val').textContent = W.toFixed(1); render(); };
  render();
}
`;
replaceStub('p10', 10, P10_HTML, P10_INIT);

// ============================================================
// §11 — Pressure cooker (T_boil vs pressure)
// ============================================================
const P11_HTML = `/* IV6 — Pressure cooker (Phase 1.3) */
  h += '<div class="wg p8-iv6">'
    +'<div class="wg-header"><span class="wg-badge p8-badge p8-badge-thermal">IV-6</span><div class="wg-title">Скороварка — давление меняет $T_{кип}$</div></div>'
    +'<div class="wg-help">При нормальном давлении вода кипит при 100°C. В скороварке давление 2 атм — T кипения растёт до 120°C. В горах (0.7 атм) — снижается до 90°C. Кривая зависимости — упрощённая модель.</div>'
    +'<div class="p8-sandbox" id="p11-iv6-sandbox" style="height:240px"></div>'
    +'<div style="margin-top:10px;display:flex;gap:14px;flex-wrap:wrap">'
      +'<div class="p8-scrubber" style="flex:1;min-width:200px"><span class="p8-scrubber-label">Давление</span><input type="range" id="p11-iv6-p" min="0.5" max="3" step="0.05" value="1"><span class="p8-scrubber-value"><span id="p11-iv6-p-val">1.0</span><span class="p8-unit">атм</span></span></div>'
      +'<div class="p8-readout"><span class="p8-readout-label">T кипения</span><span class="p8-readout-value" id="p11-iv6-tboil">100</span><span class="p8-readout-unit">°C</span></div>'
    +'</div>'
    +'</div>';`;

const P11_INIT = `
function _initP11_iv6(){
  const sb = document.getElementById('p11-iv6-sandbox');
  if (!sb || !window.P8Helpers || !window.P8Anim) return;
  const W = 560, H = 240;
  const canvas = document.createElement('canvas');
  canvas.width = W; canvas.height = H;
  canvas.style.width = '100%'; canvas.style.height = '100%'; canvas.style.display = 'block';
  sb.appendChild(canvas);
  const ctx = canvas.getContext('2d');
  let pressure = 1;
  /* Approximate T_boil(p) — log curve */
  function Tboil(p){ return Math.round(100 + 20 * Math.log(p) / Math.log(2)); }
  const bubbles = [];
  function spawnBubble(){
    bubbles.push({ x: 100 + Math.random() * 250, y: 200, r: 3 + Math.random() * 5, vy: -0.5 - Math.random() * 1.5 });
    if (bubbles.length > 30) bubbles.shift();
  }
  function render(){
    ctx.clearRect(0, 0, W, H);
    /* Pot */
    ctx.strokeStyle = '#475569';
    ctx.lineWidth = 3;
    ctx.fillStyle = '#cbd5e1';
    ctx.fillRect(70, 80, 320, 130);
    ctx.strokeRect(70, 80, 320, 130);
    /* Lid */
    ctx.fillStyle = pressure > 1.3 ? '#475569' : '#94a3b8';
    ctx.fillRect(60, 70, 340, 12);
    ctx.strokeRect(60, 70, 340, 12);
    /* Water */
    const T = Tboil(pressure);
    const waterColor = T > 100 ? '#fb923c' : '#7dd3fc';
    ctx.fillStyle = waterColor;
    ctx.globalAlpha = 0.7;
    ctx.fillRect(75, 130, 310, 75);
    ctx.globalAlpha = 1;
    /* Steam if T high enough */
    const intensity = (pressure - 0.5) / 2.5;
    /* Bubbles */
    if (Math.random() < 0.3 + intensity * 0.5) spawnBubble();
    bubbles.forEach(b => {
      b.y += b.vy;
      ctx.fillStyle = '#fff';
      ctx.globalAlpha = 0.7;
      ctx.beginPath();
      ctx.arc(b.x, b.y, b.r, 0, 2 * Math.PI);
      ctx.fill();
      ctx.globalAlpha = 1;
    });
    /* Filter dead bubbles */
    for (let i = bubbles.length - 1; i >= 0; i--) if (bubbles[i].y < 130) bubbles.splice(i, 1);
    /* Pressure gauge */
    ctx.fillStyle = '#0f172a';
    ctx.font = "bold 14px 'JetBrains Mono', monospace";
    ctx.textAlign = 'left';
    ctx.fillText('P = '+pressure.toFixed(2)+' атм', 410, 110);
    ctx.fillText('T_кип = '+T+'°C', 410, 135);
    /* T arrow */
    ctx.strokeStyle = '#dc2626';
    ctx.lineWidth = 2;
    ctx.beginPath();
    ctx.moveTo(410, 150);
    ctx.lineTo(410, 150 - (T - 80) * 1.2);
    ctx.stroke();
    ctx.fillStyle = '#dc2626';
    ctx.beginPath();
    ctx.moveTo(410, 150 - (T - 80) * 1.2);
    ctx.lineTo(405, 150 - (T - 80) * 1.2 + 8);
    ctx.lineTo(415, 150 - (T - 80) * 1.2 + 8);
    ctx.fill();
  }
  const raf = P8Anim.raf(render);
  raf.start();
  document.getElementById('p11-iv6-p').oninput = ev => {
    pressure = +ev.target.value;
    document.getElementById('p11-iv6-p-val').textContent = pressure.toFixed(2);
    document.getElementById('p11-iv6-tboil').textContent = Tboil(pressure);
  };
}
`;
replaceStub('p11', 11, P11_HTML, P11_INIT);

fs.writeFileSync(DST, h);
console.log('ch1 final size:', h.length);

const scripts = [...h.matchAll(/<script>([\s\S]*?)<\/script>/g)];
for (const m of scripts) {
  try { new Function(m[1]); }
  catch (e) { console.error('JS PARSE FAIL:', e.message.slice(0, 200)); process.exit(1); }
}
console.log('inline JS parses OK');

const fns = [...h.matchAll(/function build_p(\d+)\(\)/g)].map(m => parseInt(m[1]));
console.log('Builders after:', fns.length, fns);
if (fns.length !== 11) { console.error('LOST BUILDERS!'); process.exit(1); }