maxim.dolgolyov/Learn_System
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(textbooks): миграция контента Физики 9 — §1-36 + ЛР11

Browse Source 
- migrate_phys9_ch4.js: первая итерация (§31-36 → ch4)
- migrate_phys9_content.js: обобщённый скрипт для ch1-3 (§1-30) + ch5 (ЛР11 из монолита)

Каждая глава:
- Получает CSS-блок монолита (стили .para-hero, .fcard, .def-box и т.д.)
- Подключает Font Awesome CDN для иконок в section-title
- HTML-тела параграфов вставляются в STUB-builder'ы заменой по regex
- Эмодзи (нарушают правило проекта) и orphaned <i> теги удаляются на этапе clean()

Размеры после миграции:
- ch1 (кинематика, §1-14): 136 КБ
- ch2 (динамика, §15-24): 127 КБ
- ch3 (статика, §25-30): 100 КБ
- ch4 (законы сохранения, §31-36): 133 КБ
- ch5 (лаб. практикум): 90 КБ (только ЛР11 заполнен, ЛР1-10 и ЛР12 — STUB)

Источник physics_9.html сохранён для возможной повторной миграции.
This commit is contained in:
Maxim Dolgolyov
2026-05-29 23:40:30 +03:00
parent 073cc3c06d
commit 31e03923ca
7 changed files with 5950 additions and 186 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/textbooks/physics_9_ch5.html
+554 -6
View File
@@ -8,6 +8,7 @@
<title>Физика 9 · Глава 5 · «Лабораторный практикум»</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"
onload="renderMathInElement(document.body,{delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false})"></script>
@@ -160,6 +161,394 @@ a{color:inherit;text-decoration:none}
.psel-card .psel-done{position:absolute;top:6px;right:6px;width:18px;height:18px;border-radius:50%;background:#10b981;display:none;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(16,185,129,.45);z-index:2}
.psel-card .psel-done svg{width:11px;height:11px;stroke:#fff;fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.psel-card.done .psel-done{display:flex}
/* === MONOLITH CSS (migrated from physics_9.html) === */
:root{
--pri:#1d4ed8; --pri2:#1e40af;
--acc:#0ea5e9;
--ok:#10b981; --ok-bg:#d1fae5;
--fail:#ef4444; --fail-bg:#fee2e2;
--warn:#f59e0b; --warn-bg:#fef3c7;
--bg:#eff6ff; --card:#fff;
--text:#1e293b; --muted:#64748b;
--border:#dbeafe;
--sh:0 2px 10px rgba(30,64,175,.08)
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Inter',sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}
.dark{--bg:#0f172a;--card:#1e293b;--text:#e2e8f0;--muted:#94a3b8;--border:#1e3a5f}
/* ── Шапка ── */
.hdr{background:linear-gradient(135deg,#1e40af 0%,#0284c7 55%,#0ea5e9 100%);color:#fff;padding:18px 20px 16px;text-align:center}
.hdr h1{font-size:1.3rem;font-weight:900}
.hdr p{font-size:.8rem;opacity:.85;margin-top:3px}
/* ── Табы ── */
.tabs{display:flex;flex-wrap:wrap;gap:4px;padding:8px 10px;background:var(--card);border-bottom:1px solid var(--border)}
.tabs::-webkit-scrollbar{display:none}
.tab{padding:8px 14px;border:2px solid var(--border);border-radius:10px;font-size:.74rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:.18s;background:var(--card);color:var(--muted);flex-shrink:0}
.tab:hover{border-color:var(--pri);color:var(--pri)}
.tab.active{background:var(--pri);color:#fff;border-color:var(--pri)}
/* ── Контент ── */
.content{max-width:780px;margin:0 auto;padding:16px 14px;display:none}
.content.active{display:block}
/* ── Справочник: карточки формул ── */
.section-title{font-size:1.05rem;font-weight:800;margin-bottom:12px;color:var(--pri);display:flex;align-items:center;gap:8px}
.section-title i{opacity:.7}
.formula-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:20px}
@media(max-width:560px){.formula-grid{grid-template-columns:1fr}}
.fcard{background:var(--card);border:2px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:var(--sh);transition:transform .18s,box-shadow .18s}
.fcard:hover{transform:translateY(-2px);box-shadow:0 6px 22px rgba(29,78,216,.12)}
.fcard.highlight{border-color:var(--pri);background:linear-gradient(135deg,rgba(29,78,216,.04),rgba(14,165,233,.04))}
.fcard h3{font-size:.8rem;font-weight:700;color:var(--pri);text-transform:uppercase;letter-spacing:.06em;margin-bottom:8px}
.fcard .main-f{font-size:1.05rem;font-weight:700;text-align:center;margin:8px 0;padding:10px;background:rgba(29,78,216,.06);border-radius:9px}
.fcard p{font-size:.83rem;color:var(--muted);line-height:1.7;margin-top:6px}
.fcard ul{font-size:.83rem;color:var(--muted);line-height:1.8;padding-left:18px;margin-top:6px}
/* ── Пример задачи ── */
.example-box{background:var(--card);border:2px solid #bfdbfe;border-left:5px solid var(--pri);border-radius:12px;padding:18px 20px;margin-bottom:20px;box-shadow:var(--sh)}
.example-box h3{font-size:.88rem;font-weight:700;color:var(--pri);margin-bottom:10px}
.example-box .cond{font-size:.87rem;background:rgba(29,78,216,.05);border-radius:8px;padding:10px 14px;line-height:1.8;margin-bottom:10px}
.example-box .sol{font-size:.86rem;line-height:1.9}
.given-table{width:100%;border-collapse:collapse;margin:8px 0;font-size:.82rem}
.given-table td{padding:4px 10px;border:1px solid var(--border)}
.given-table tr:first-child td{background:rgba(29,78,216,.04)}
.given-table tr:last-child td{background:rgba(16,185,129,.05)}
.given-table td:first-child{font-weight:700;width:38%;color:var(--pri)}
/* ── Вопросы (теоретические) ── */
.q-list{font-size:.85rem;line-height:1.9;color:var(--muted);padding-left:20px}
.q-list li{margin-bottom:4px}
/* ── Задачи: интерактив ── */
.score-bar{display:flex;gap:10px;align-items:center;justify-content:center;margin-bottom:14px;font-size:.85rem;font-weight:600}
.chip{padding:5px 14px;border-radius:50px;display:flex;align-items:center;gap:5px}
.chip-ok{background:var(--ok-bg);color:#065f46}
.chip-tot{background:var(--card);color:var(--muted);border:1px solid var(--border)}
.prog-wrap{width:100%;height:6px;background:var(--border);border-radius:3px;overflow:hidden;margin-bottom:16px}
.prog-fill{height:100%;background:linear-gradient(90deg,var(--pri),var(--acc));border-radius:3px;transition:width .4s}
.task-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px 22px;box-shadow:var(--sh);margin-bottom:12px}
.task-num{font-size:.72rem;font-weight:700;color:var(--acc);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px}
.task-text{font-size:.97rem;font-weight:700;line-height:1.85;margin-bottom:14px}
.task-hint{font-size:.8rem;color:var(--muted);margin-top:4px;margin-bottom:12px;display:flex;align-items:flex-start;gap:6px}
.task-hint i{margin-top:2px;color:var(--warn);flex-shrink:0}
.ans-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.ans-inp{width:110px;padding:11px 10px;border:2px solid var(--border);border-radius:10px;font-size:1.05rem;font-family:'JetBrains Mono',monospace;text-align:center;outline:none;background:var(--card);color:var(--text);transition:.18s}
.ans-inp:focus{border-color:var(--pri);box-shadow:0 0 0 3px rgba(29,78,216,.12)}
.unit-lbl{font-size:.82rem;color:var(--muted);font-weight:600;white-space:nowrap}
.btn{padding:11px 20px;border:none;border-radius:10px;font-weight:700;font-size:.84rem;cursor:pointer;transition:.18s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.btn:active{transform:scale(.96)}
.btn-pri{background:var(--pri);color:#fff}.btn-pri:hover{background:var(--pri2)}
.btn-ghost{background:transparent;border:2px solid var(--border);color:var(--muted)}.btn-ghost:hover{border-color:var(--pri);color:var(--pri)}
.btn-next{background:var(--ok);color:#fff}.btn-next:hover{filter:brightness(1.1)}
.feedback{padding:13px 18px;border-radius:11px;font-size:.87rem;font-weight:600;display:none;line-height:1.7;margin-top:10px}
.feedback.show{display:block;animation:pop .28s ease}
.fb-ok{background:var(--ok-bg);color:#065f46}
.fb-fail{background:var(--fail-bg);color:#991b1b}
@keyframes pop{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}
/* ── Итог ── */
.summary{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:28px;text-align:center;box-shadow:var(--sh);display:none}
.summary.show{display:block;animation:pop .35s ease}
.summary h2{font-size:1.2rem;font-weight:800;margin-bottom:8px}
.big-score{font-size:3.5rem;font-weight:900;color:var(--pri);line-height:1;margin:10px 0}
.sum-grade{color:var(--muted);font-size:.9rem;margin-bottom:20px}
.sum-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
/* ── Справочник (плавающая кнопка) ── */
.ref-toggle{position:fixed;bottom:16px;right:16px;z-index:60;width:46px;height:46px;border-radius:13px;background:var(--pri);color:#fff;border:none;cursor:pointer;display:grid;place-items:center;font-size:1.1rem;box-shadow:0 4px 14px rgba(29,78,216,.3)}
.ref-panel{position:fixed;bottom:72px;right:16px;z-index:60;width:300px;max-height:72vh;overflow-y:auto;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px 18px;box-shadow:0 8px 30px rgba(0,0,0,.15);display:none;font-size:.8rem;line-height:1.85;scrollbar-width:thin}
.ref-panel.show{display:block;animation:pop .2s ease}
.ref-panel h3{font-size:.84rem;font-weight:700;color:var(--pri);margin:12px 0 4px}.ref-panel h3:first-child{margin-top:0}
.ref-panel .rf{background:rgba(29,78,216,.06);border-radius:8px;padding:6px 10px;margin:3px 0;text-align:center}
/* ── Para-hero баннеры ── */
.para-hero{border-radius:18px;padding:22px 24px;margin-bottom:22px;position:relative;overflow:hidden}
.para-hero::after{content:'';position:absolute;right:-28px;top:-28px;width:150px;height:150px;border-radius:50%;opacity:.13;pointer-events:none}
.ph-31{background:linear-gradient(135deg,#1e3a8a 0%,#1d4ed8 55%,#3b82f6 100%);color:#fff}
.ph-31::after{background:#bfdbfe}
.ph-32{background:linear-gradient(135deg,#0c4a6e 0%,#0369a1 55%,#0ea5e9 100%);color:#fff}
.ph-32::after{background:#bae6fd}
.ph-33{background:linear-gradient(135deg,#064e3b 0%,#065f46 55%,#10b981 100%);color:#fff}
.ph-33::after{background:#a7f3d0}
.ph-34{background:linear-gradient(135deg,#78350f 0%,#92400e 55%,#d97706 100%);color:#fff}
.ph-34::after{background:#fde68a}
.ph-35{background:linear-gradient(135deg,#4c1d95 0%,#6d28d9 55%,#8b5cf6 100%);color:#fff}
.ph-35::after{background:#ddd6fe}
.ph-36{background:linear-gradient(135deg,#134e4a 0%,#0f766e 55%,#2dd4bf 100%);color:#fff}
.ph-36::after{background:#99f6e4}
.para-hero .ph-label{font-size:.7rem;font-weight:700;opacity:.7;letter-spacing:.1em;text-transform:uppercase;margin-bottom:5px}
.para-hero h2{font-size:1.12rem;font-weight:900;margin-bottom:8px;line-height:1.3}
.para-hero .ph-formula{display:inline-block;font-size:1rem;background:rgba(255,255,255,.17);border-radius:10px;padding:7px 16px;margin:2px 0 8px;font-weight:700;border:1px solid rgba(255,255,255,.22)}
.para-hero .ph-desc{font-size:.79rem;opacity:.87;line-height:1.65;margin-bottom:10px}
.para-hero .ph-tags{display:flex;flex-wrap:wrap;gap:6px}
.para-hero .ph-tag{background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.25);border-radius:20px;padding:3px 11px;font-size:.7rem;font-weight:700}
/* ── Запомни! ── */
.remember-box{background:linear-gradient(135deg,rgba(239,68,68,.06),rgba(220,38,38,.03));border:2px solid rgba(239,68,68,.3);border-radius:13px;padding:14px 17px;margin:16px 0}
.remember-box-title{font-weight:800;font-size:.82rem;color:#b91c1c;margin-bottom:8px;display:flex;align-items:center;gap:7px}
.dark .remember-box{border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.07)}
.dark .remember-box-title{color:#fca5a5}
.remember-box ul{padding-left:18px;margin:0}
.remember-box li,.remember-box p{font-size:.83rem;color:var(--text);line-height:1.9;margin:0}
/* ── Частые ошибки ── */
.mistakes-box{background:linear-gradient(135deg,rgba(245,158,11,.06),rgba(251,191,36,.03));border:2px solid rgba(245,158,11,.35);border-radius:13px;padding:14px 17px;margin:16px 0}
.mistakes-box-title{font-weight:800;font-size:.82rem;color:#92400e;margin-bottom:8px;display:flex;align-items:center;gap:7px}
.dark .mistakes-box{border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.07)}
.dark .mistakes-box-title{color:#fcd34d}
.mistakes-box ul{padding-left:18px;margin:0}
.mistakes-box li{font-size:.83rem;color:var(--text);line-height:1.9}
/* ── Шаги решения ── */
.sol-steps{list-style:none;padding:0;margin:8px 0}
.sol-steps li{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;font-size:.86rem;line-height:1.75}
.step-n{min-width:24px;height:24px;border-radius:50%;background:var(--pri);color:#fff;font-size:.69rem;font-weight:800;display:grid;place-items:center;margin-top:1px;flex-shrink:0}
/* ── Интерактивные схемы ── */
.idiag{background:var(--card);border:2px solid var(--border);border-radius:14px;padding:16px 18px;margin:14px 0;box-shadow:var(--sh)}
.idiag h3{font-size:.79rem;font-weight:700;color:var(--pri);text-transform:uppercase;letter-spacing:.05em;margin-bottom:12px;display:flex;align-items:center;gap:6px}
.idiag-2col{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}
@media(max-width:560px){.idiag-2col{grid-template-columns:1fr}}
.slider-row{display:flex;align-items:center;gap:10px;margin:8px 0;font-size:.82rem;flex-wrap:wrap}
.slider-lbl{min-width:90px;font-weight:600;color:var(--text);flex-shrink:0}
.slider-val{min-width:72px;font-weight:800;color:var(--pri);font-family:'JetBrains Mono',monospace;font-size:.82rem;flex-shrink:0}
input[type=range]{flex:1;min-width:100px;accent-color:var(--pri);cursor:pointer}
.idiag-result{background:rgba(29,78,216,.08);border-radius:10px;padding:10px 14px;margin-top:10px;font-size:.9rem;font-weight:700;text-align:center;font-family:'JetBrains Mono',monospace;letter-spacing:.02em;border:1px solid rgba(29,78,216,.15)}
.work-pos{color:#065f46;font-weight:900}.work-zero{color:#92400e;font-weight:900}.work-neg{color:#991b1b;font-weight:900}
/* ── Цепочка вывода формулы ── */
.fchain{display:flex;flex-wrap:wrap;align-items:center;gap:8px;background:rgba(29,78,216,.04);border:1px solid var(--border);border-radius:11px;padding:11px 15px;margin:10px 0;font-size:.82rem}
.fchain-step{background:var(--card);border:1.5px solid var(--border);border-radius:8px;padding:4px 12px;font-family:'JetBrains Mono',monospace;font-size:.8rem;font-weight:600}
.fchain-arrow{color:var(--muted);font-weight:700}
.fchain-note{font-size:.73rem;color:var(--muted);font-style:italic}
/* ── Объяснение по-человечески ── */
.student-box{background:linear-gradient(135deg,rgba(254,243,199,.7),rgba(255,237,213,.7));border:1.5px solid #f59e0b;border-radius:14px;padding:16px 18px;margin:16px 0;line-height:1.75}
.dark .student-box{background:linear-gradient(135deg,rgba(120,80,0,.18),rgba(100,50,0,.18));border-color:#d97706}
.student-box-title{font-weight:800;font-size:.88rem;color:#92400e;margin-bottom:10px;display:flex;align-items:center;gap:7px}
.dark .student-box-title{color:#fbbf24}
.student-box p{margin:0 0 9px;font-size:.84rem;color:var(--text)}
.student-box p:last-child{margin-bottom:0}
.student-box b{color:#92400e}
.dark .student-box b{color:#fbbf24}
/* ── Тема ── */
.theme-btn{position:fixed;top:12px;right:12px;z-index:60;width:38px;height:38px;border-radius:10px;background:var(--card);border:1px solid var(--border);cursor:pointer;display:grid;place-items:center;font-size:1rem;box-shadow:var(--sh);color:var(--text)}
/* ── Para badge (сложные задачи) ── */
.para-badge{display:inline-flex;align-items:center;padding:2px 8px;background:rgba(29,78,216,.13);color:var(--pri);border-radius:6px;font-size:.68rem;font-weight:800;margin-left:7px;letter-spacing:.03em}
.para-badge.b32{background:rgba(14,165,233,.13);color:#0284c7}
.para-badge.b33{background:rgba(16,185,129,.13);color:#059669}
.para-badge.b34{background:rgba(245,158,11,.13);color:#d97706}
.para-badge.b35{background:rgba(109,40,217,.13);color:#6d28d9}
.para-badge.b36{background:rgba(15,118,110,.13);color:#0f766e}
/* ── §1–14 Кинематика Para-heroes ── */
.ph-1{background:linear-gradient(135deg,#7f1d1d 0%,#dc2626 55%,#f97316 100%);color:#fff}
.ph-1::after{background:#fed7aa}
.ph-2{background:linear-gradient(135deg,#134e4a 0%,#0d9488 55%,#2dd4bf 100%);color:#fff}
.ph-2::after{background:#99f6e4}
.ph-3{background:linear-gradient(135deg,#500724 0%,#be185d 55%,#f472b6 100%);color:#fff}
.ph-3::after{background:#fce7f3}
.ph-4{background:linear-gradient(135deg,#431407 0%,#b45309 55%,#fbbf24 100%);color:#fff}
.ph-4::after{background:#fde68a}
.ph-5{background:linear-gradient(135deg,#1e3a8a 0%,#1d4ed8 55%,#60a5fa 100%);color:#fff}
.ph-5::after{background:#bfdbfe}
.ph-6{background:linear-gradient(135deg,#14532d 0%,#15803d 55%,#4ade80 100%);color:#fff}
.ph-6::after{background:#bbf7d0}
.ph-7{background:linear-gradient(135deg,#2e1065 0%,#7c3aed 55%,#c4b5fd 100%);color:#fff}
.ph-7::after{background:#ede9fe}
.ph-8{background:linear-gradient(135deg,#082f49 0%,#0284c7 55%,#7dd3fc 100%);color:#fff}
.ph-8::after{background:#e0f2fe}
.ph-9{background:linear-gradient(135deg,#1a2e05 0%,#4d7c0f 55%,#a3e635 100%);color:#fff}
.ph-9::after{background:#d9f99d}
.ph-10{background:linear-gradient(135deg,#4c0519 0%,#be123c 55%,#fb7185 100%);color:#fff}
.ph-10::after{background:#ffe4e6}
.ph-11{background:linear-gradient(135deg,#1e1b4b 0%,#3730a3 55%,#a5b4fc 100%);color:#fff}
.ph-11::after{background:#e0e7ff}
.ph-12{background:linear-gradient(135deg,#7c2d12 0%,#c2410c 55%,#fb923c 100%);color:#fff}
.ph-12::after{background:#ffedd5}
.ph-13{background:linear-gradient(135deg,#2e1065 0%,#6d28d9 55%,#ddd6fe 100%);color:#fff}
.ph-13::after{background:#f5f3ff}
.ph-14{background:linear-gradient(135deg,#164e63 0%,#0e7490 55%,#67e8f9 100%);color:#fff}
.ph-14::after{background:#cffafe}
.para-badge.b1{background:rgba(220,38,38,.13);color:#dc2626}
.para-badge.b2{background:rgba(13,148,136,.13);color:#0d9488}
.para-badge.b3{background:rgba(190,24,93,.13);color:#be185d}
.para-badge.b4{background:rgba(180,83,9,.13);color:#b45309}
.para-badge.b5{background:rgba(29,78,216,.13);color:#1d4ed8}
.para-badge.b6{background:rgba(21,128,61,.13);color:#15803d}
.para-badge.b7{background:rgba(124,58,237,.13);color:#7c3aed}
.para-badge.b8{background:rgba(2,132,199,.13);color:#0284c7}
.para-badge.b9{background:rgba(77,124,15,.13);color:#4d7c0f}
.para-badge.b10{background:rgba(190,18,60,.13);color:#be123c}
.para-badge.b11{background:rgba(55,48,163,.13);color:#3730a3}
.para-badge.b12{background:rgba(194,65,12,.13);color:#c2410c}
.para-badge.b13{background:rgba(109,40,217,.13);color:#6d28d9}
.para-badge.b14{background:rgba(14,116,144,.13);color:#0e7490}
/* ── §15–21 Para-heroes ── */
.ph-15{background:linear-gradient(135deg,#7c2d12 0%,#c2410c 55%,#f97316 100%);color:#fff}
.ph-15::after{background:#fed7aa}
.ph-16{background:linear-gradient(135deg,#881337 0%,#be123c 55%,#f43f5e 100%);color:#fff}
.ph-16::after{background:#fecdd3}
.ph-17{background:linear-gradient(135deg,#4a044e 0%,#7e22ce 55%,#d946ef 100%);color:#fff}
.ph-17::after{background:#f5d0fe}
.ph-18{background:linear-gradient(135deg,#082f49 0%,#155e75 55%,#22d3ee 100%);color:#fff}
.ph-18::after{background:#a5f3fc}
.ph-19{background:linear-gradient(135deg,#500724 0%,#9d174d 55%,#f472b6 100%);color:#fff}
.ph-19::after{background:#fbcfe8}
.ph-20{background:linear-gradient(135deg,#1c1917 0%,#44403c 55%,#a8a29e 100%);color:#fff}
.ph-20::after{background:#e7e5e4}
.ph-21{background:linear-gradient(135deg,#1e1b4b 0%,#3730a3 55%,#818cf8 100%);color:#fff}
.ph-21::after{background:#c7d2fe}
.ph-22{background:linear-gradient(135deg,#0c4a6e 0%,#0369a1 55%,#38bdf8 100%);color:#fff}
.ph-22::after{background:#bae6fd}
.ph-23{background:linear-gradient(135deg,#14532d 0%,#166534 55%,#4ade80 100%);color:#fff}
.ph-23::after{background:#bbf7d0}
.ph-24{background:linear-gradient(135deg,#3b0764 0%,#7e22ce 55%,#c084fc 100%);color:#fff}
.ph-24::after{background:#e9d5ff}
.ph-25{background:linear-gradient(135deg,#052e16 0%,#065f46 55%,#34d399 100%);color:#fff}
.ph-25::after{background:#a7f3d0}
.ph-26{background:linear-gradient(135deg,#2e1065 0%,#6d28d9 55%,#c084fc 100%);color:#fff}
.ph-26::after{background:#e9d5ff}
.ph-27{background:linear-gradient(135deg,#431407 0%,#b45309 55%,#fbbf24 100%);color:#fff}
.ph-27::after{background:#fde68a}
.ph-28{background:linear-gradient(135deg,#0f2027 0%,#203a43 55%,#2c5364 100%);color:#fff}
.ph-28::after{background:#a5f3fc}
.ph-29{background:linear-gradient(135deg,#001845 0%,#0041a8 55%,#0099ff 100%);color:#fff}
.ph-29::after{background:#bfdbfe}
.ph-30{background:linear-gradient(135deg,#064e3b 0%,#065f46 55%,#34d399 100%);color:#fff}
.ph-30::after{background:#a7f3d0}
.para-badge.b15{background:rgba(194,65,12,.13);color:#c2410c}
.para-badge.b16{background:rgba(190,18,60,.13);color:#be123c}
.para-badge.b17{background:rgba(126,34,206,.13);color:#7e22ce}
.para-badge.b18{background:rgba(21,94,117,.13);color:#155e75}
.para-badge.b19{background:rgba(157,23,77,.13);color:#9d174d}
.para-badge.b20{background:rgba(68,64,60,.13);color:#44403c}
.para-badge.b21{background:rgba(55,48,163,.13);color:#3730a3}
.para-badge.b22{background:rgba(3,105,161,.13);color:#0369a1}
.para-badge.b23{background:rgba(22,101,52,.13);color:#166534}
.para-badge.b24{background:rgba(126,34,206,.13);color:#7e22ce}
.para-badge.b25{background:rgba(6,95,70,.13);color:#065f46}
.para-badge.b26{background:rgba(109,40,217,.13);color:#6d28d9}
.para-badge.b27{background:rgba(180,83,9,.13);color:#b45309}
.para-badge.b28{background:rgba(32,58,67,.13);color:#203a43}
.para-badge.b29{background:rgba(0,65,168,.13);color:#0041a8}
.para-badge.b30{background:rgba(6,95,70,.13);color:#065f46}
/* ── Misc ── */
.dark .ans-inp{background:#0f172a;color:#e2e8f0}
.dark .fcard{background:#1e293b}.dark .example-box{background:#1e293b}
.katex{font-size:1em!important}
.info-badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:.72rem;font-weight:700;background:rgba(14,165,233,.12);color:#0284c7;margin-left:8px}
hr.divider{border:none;border-top:1px solid var(--border);margin:20px 0}
/* ── Навигация по задачам ── */
.nav-dots{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:14px}
.nav-dot{min-width:30px;height:30px;padding:0 6px;border-radius:7px;border:2px solid var(--border);background:var(--card);font-size:.72rem;font-weight:700;cursor:pointer;display:grid;place-items:center;transition:.15s;color:var(--muted);font-family:'JetBrains Mono',monospace}
.nav-dot:hover{border-color:var(--pri);color:var(--pri)}
.nav-dot.nd-cur{background:var(--pri);border-color:var(--pri);color:#fff}
.nav-dot.nd-ok{background:var(--ok-bg);border-color:var(--ok);color:#065f46}
.nav-dot.nd-fail{background:var(--fail-bg);border-color:var(--fail);color:#991b1b}
/* ── Life-examples grid ── */
.life-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:14px 0}
.life-item{background:var(--card);border:1.5px solid var(--border);border-radius:12px;padding:12px 10px;text-align:center}
.life-item .li-icon{font-size:1.9rem;margin-bottom:5px}
.life-item .li-title{font-size:.79rem;font-weight:700;color:var(--text);margin-bottom:3px}
.life-item .li-desc{font-size:.71rem;color:var(--muted);line-height:1.55}
/* ── Insight (physics aha) box ── */
.insight-box{background:linear-gradient(135deg,rgba(99,102,241,.07),rgba(139,92,246,.04));border:2px solid rgba(99,102,241,.22);border-radius:13px;padding:14px 17px;margin:16px 0}
.insight-title{font-weight:800;font-size:.82rem;color:#4f46e5;margin-bottom:7px;display:flex;align-items:center;gap:7px}
.dark .insight-box{background:rgba(99,102,241,.08);border-color:rgba(139,92,246,.3)}
.dark .insight-title{color:#a5b4fc}
.insight-box p{font-size:.83rem;color:var(--text);line-height:1.8;margin:0 0 6px}
.insight-box p:last-child{margin:0}
/* ── μ table ── */
.mu-tbl{width:100%;border-collapse:collapse;font-size:.8rem;margin:8px 0}
.mu-tbl th{background:rgba(68,64,60,.1);padding:5px 8px;text-align:center;font-weight:700;border:1px solid var(--border)}
.mu-tbl td{padding:4px 8px;text-align:center;border:1px solid var(--border)}
.mu-tbl tr:hover td{background:rgba(29,78,216,.04)}
/* ── Solve-steps ── */
.solve-box{background:var(--card);border:1.5px solid var(--border);border-radius:12px;padding:14px 18px;margin:14px 0}
.solve-box h4{font-size:.82rem;font-weight:800;color:var(--pri);margin-bottom:10px;display:flex;align-items:center;gap:6px}
/* ── Canvas physics panels ── */
.cv-wrap{position:relative;margin:10px 0}
.cv-wrap canvas{width:100%;border-radius:10px;display:block}
.cv-playbtn{margin-top:6px;padding:7px 18px;border:none;border-radius:8px;background:var(--pri);color:#fff;font-weight:700;font-size:.8rem;cursor:pointer;transition:.15s}
.cv-playbtn:hover{filter:brightness(1.1)}
/* ── Para-pills ── */
.para-pill{padding:6px 13px;border:2px solid var(--border);border-radius:10px;font-size:.74rem;font-weight:700;cursor:pointer;white-space:nowrap;transition:.18s;background:var(--card);color:var(--muted);flex-shrink:0}
.para-pill:hover{border-color:var(--pri);color:var(--pri)}
.para-pill.active{background:var(--pri);color:#fff;border-color:var(--pri)}
/* ── MCQ ── */
.mcq-opts{display:flex;flex-direction:column;gap:8px;margin-top:4px}
.mcq-opt{width:100%;text-align:left;padding:11px 16px;border:2px solid var(--border);border-radius:10px;background:var(--card);color:var(--text);font-size:.9rem;font-weight:500;cursor:pointer;transition:.18s;line-height:1.5;font-family:inherit}
.mcq-opt:hover:not(:disabled){border-color:var(--pri);background:rgba(29,78,216,.05);color:var(--text)}
.mcq-opt:disabled{cursor:default}
.mcq-opt.mcq-cor{border-color:var(--ok)!important;background:var(--ok-bg)!important;color:#065f46!important;font-weight:700}
.mcq-opt.mcq-wrong{border-color:var(--fail)!important;background:var(--fail-bg)!important;color:#991b1b!important}
/* ── Def / info box ── */
.def-box{background:rgba(29,78,216,.05);border-left:4px solid var(--pri);border-radius:10px;padding:12px 16px;margin-bottom:16px;font-size:.87rem;line-height:1.8}
/* ── Лаб. №11 ── */
.ph-lab{background:linear-gradient(135deg,#7f1d1d 0%,#b91c1c 55%,#ef4444 100%);color:#fff}
.ph-lab::after{background:#fca5a5}
.lab11-tbl{width:100%;border-collapse:collapse;font-size:.83rem;font-family:'JetBrains Mono',monospace}
.lab11-tbl th{background:rgba(29,78,216,.07);padding:7px 8px;text-align:center;font-weight:700;font-size:.74rem;border:1px solid var(--border)}
.lab11-tbl td{padding:6px 8px;text-align:center;border:1px solid var(--border);background:var(--card)}
.lab11-tbl tr:hover td{background:rgba(29,78,216,.04)}
.lab11-tbl tr.lab11-avg td{background:rgba(29,78,216,.09);font-weight:800;color:var(--pri)}
/* ── Тетрадные вычисления (Лаб. №11) ── */
.nb-wrap{
background-color:#fffef2;
background-image:
linear-gradient(90deg,transparent 33px,rgba(239,68,68,.22) 33px,rgba(239,68,68,.22) 35px,transparent 35px),
repeating-linear-gradient(transparent 0,transparent 26px,#bfdbfe 26px,#bfdbfe 27px);
border:1px solid #fde68a;border-radius:13px;
padding:14px 18px 14px 46px;
font-size:.82rem;line-height:27px;color:var(--text);
margin:16px 0;overflow:hidden
}
.dark .nb-wrap{
background-color:#14120a;
background-image:
linear-gradient(90deg,transparent 33px,rgba(185,28,28,.30) 33px,rgba(185,28,28,.30) 35px,transparent 35px),
repeating-linear-gradient(transparent 0,transparent 26px,rgba(30,58,95,.75) 26px,rgba(30,58,95,.75) 27px);
border-color:#422006
}
.nb-hdr{font-size:.87rem;font-weight:800;color:#b45309;letter-spacing:.03em;margin-bottom:1px}
.dark .nb-hdr{color:#fbbf24}
.nb-dado{display:grid;grid-template-columns:1fr 1fr;gap:0 16px;margin-bottom:4px}
@media(max-width:440px){.nb-dado{grid-template-columns:1fr}}
.nb-clbl{font-weight:800;color:var(--pri);text-decoration:underline;text-underline-offset:2px}
.nb-div{border:none;border-top:1.5px solid #fde68a;margin:4px 0}
.dark .nb-div{border-color:#422006}
.nb-sh{font-weight:800;color:var(--pri);margin:2px 0}
.nb-step{margin:2px 0}
.nb-step b{color:#1e293b;font-weight:700}
.dark .nb-step b{color:#e2e8f0}
.nb-i{display:block;padding-left:18px}
.nb-v{color:#1d4ed8;font-weight:800;font-family:'JetBrains Mono',monospace}
.dark .nb-v{color:#93c5fd}
.nb-box{display:inline-block;background:rgba(29,78,216,.11);border:1.5px solid rgba(29,78,216,.22);
border-radius:5px;padding:0 7px;font-weight:800;font-family:'JetBrains Mono',monospace;color:#1d4ed8}
.dark .nb-box{background:rgba(147,197,253,.11);border-color:rgba(147,197,253,.28);color:#93c5fd}
.nb-ok{color:#065f46;font-weight:800}.nb-bad{color:#991b1b;font-weight:800}
.nb-ans{border-top:2px solid #fde68a;margin-top:6px;padding-top:4px;font-weight:800;font-size:.85rem}
.dark .nb-ans{border-color:#422006}
/* === END MONOLITH CSS === */
</style>
</head>
<body>
@@ -675,12 +1064,171 @@ function build_lr10(){
function build_lr11(){
const box = document.getElementById('lr11-body');
let html = '';
html += makeCard('theory', "Проверка закона сохранения импульса", "ЛР 11", `
<p><b>Проверка закона сохранения импульса</b> — лабораторная работа в разработке (Phase 5+).</p>
<p>Здесь появятся: <b>Цель · Оборудование · Проверьте себя · Вывод расчётных формул · Ход работы · Таблица измерений · Контрольные вопросы · Суперзадание</b> — по канве учебника Исаченковой 2019.</p>
<p style="margin-top:10px;padding:10px 14px;background:var(--sec-acc-soft);border-radius:9px;font-size:.92rem">
<b>Phase 0:</b> создан скелет. <b>Phase 5:</b> наполнение ЛР пошаговой работой с интерактивной таблицей измерений.
</p>
html += makeCard('lab', "Проверка закона сохранения импульса", "ЛР 11", `
<div class="content" id="tab-lab11">
<div class="para-hero ph-lab">
<div class="ph-label"> Лабораторная работа № 11</div>
<h2>Проверка закона сохранения импульса</h2>
<div class="ph-formula">$m_1 l_1 = m_1 l_1' + m_2 l_2'$</div>
<div class="ph-desc">Шар скатывается с лотка и сталкивается у края стола со вторым шаром. По дальностям полёта проверяем ЗСИ и вычисляем погрешности.</div>
<div class="ph-tags">
<span class="ph-tag">Задачи 1–7 хода работы</span>
<span class="ph-tag">Анализ погрешностей</span>
<span class="ph-tag">H = 15 см (фиксировано)</span>
</div>
</div>
<div class="fcard" style="margin-bottom:16px">
<h3> Принцип метода</h3>
<p style="font-size:.84rem;line-height:1.85;margin-top:8px;color:var(--text)">
Оба шара вылетают горизонтально с одной высоты H, поэтому время полёта одинаково:
$t = \\sqrt{2H/g}$. Скорость пропорциональна дальности: $v = l/t$.
Подставляя в ЗСИ $m_1 v_0 = m_1 v_1' + m_2 v_2'$, получаем рабочую формулу:
</p>
<div style="text-align:center;margin:10px 0;padding:10px 16px;background:rgba(185,28,28,.07);border-radius:9px;font-size:1.05rem;font-weight:800">
$m_1 l_1 = m_1 l_1' + m_2 l_2'$
</div>
<p style="font-size:.82rem;color:var(--muted);margin-top:6px">
$l_1$ — дальность шара 1 <em>без</em> столкновения; $l_1'$, $l_2'$ — дальности шаров <em>после</em> столкновения.
</p>
</div>
<div class="idiag">
<h3> Виртуальная установка — траектории</h3>
<canvas id="cvLab11" width="540" height="195" style="width:100%;border-radius:10px;display:block;background:var(--bg)"></canvas>
<div style="margin-top:14px;display:grid;grid-template-columns:1fr 1fr;gap:6px 18px">
<div class="slider-row">
<span class="slider-lbl" style="min-width:56px">m₁</span>
<input type="range" id="l11m1" min="100" max="400" value="200" step="10" oninput="updLab11()">
<span class="slider-val" id="l11m1v">200</span><span style="font-size:.76rem;color:var(--muted);margin-left:2px">г</span>
</div>
<div class="slider-row">
<span class="slider-lbl" style="min-width:56px">m₂</span>
<input type="range" id="l11m2" min="50" max="300" value="100" step="10" oninput="updLab11()">
<span class="slider-val" id="l11m2v">100</span><span style="font-size:.76rem;color:var(--muted);margin-left:2px">г</span>
</div>
<div class="slider-row" style="grid-column:1/3">
<span class="slider-lbl" style="min-width:56px">h лотка</span>
<input type="range" id="l11h" min="5" max="25" value="15" step="1" oninput="updLab11()">
<span class="slider-val" id="l11hv">15</span><span style="font-size:.76rem;color:var(--muted);margin-left:2px">см</span>
</div>
</div>
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:12px;font-size:.82rem">
<div class="idiag-result">l₁ = <b id="l11r1">—</b> м</div>
<div class="idiag-result">l₁' = <b id="l11r1p">—</b> м</div>
<div class="idiag-result">l₂' = <b id="l11r2p">—</b> м</div>
</div>
</div>
<div style="margin:20px 0">
<div class="section-title"> Таблица измерений</div>
<div style="overflow-x:auto;border-radius:12px;border:1px solid var(--border)">
<table class="lab11-tbl">
<thead><tr>
<th>№</th><th>m₁, кг</th><th>m₂, кг</th>
<th>l₁, м</th><th>l₁', м</th><th>l₂', м</th>
</tr></thead>
<tbody id="lab11tb"></tbody>
</table>
</div>
<div style="display:flex;gap:10px;margin-top:12px;flex-wrap:wrap;align-items:center">
<button class="btn btn-pri" id="lab11b1" onclick="lab11add()"> Провести опыт</button>
<button class="btn btn-ghost" onclick="lab11all()"> Все 5 опытов</button>
<button class="btn btn-ghost" style="margin-left:auto" onclick="lab11reset()"> Сначала</button>
</div>
</div>
<div id="lab11vrf" style="display:none">
<hr class="divider">
<div class="section-title"> Проверка закона и погрешности</div>
<div id="lab11nb"></div>
<div id="lab11cn" style="padding:14px 18px;border-radius:12px;font-size:.88rem;font-weight:700;line-height:1.7;margin-top:12px"></div>
</div>
<hr class="divider">
<div class="section-title"> Контрольные вопросы</div>
<ol class="q-list">
<li>Как направлен импульс тела?</li>
<li>При каких условиях выполняется закон сохранения импульса?</li>
<li>Почему для системы двух шаров можно применять закон сохранения импульса?</li>
</ol>
<hr class="divider">
<div class="section-title"> Суперзадание</div>
<div style="background:var(--card);border:2px solid var(--warn);border-radius:12px;padding:16px 20px;font-size:.93rem;line-height:1.75">
Можно ли утверждать, что суммарный импульс шаров не будет изменяться и при их дальнейшем полёте по параболической траектории вплоть до соударения с поверхностью стола? Ответ аргументируйте.
</div>
<div style="text-align:center;margin-top:12px">
<button onclick="toggleSuperAns()" id="superAnsBtn" style="background:var(--pri);color:#fff;border:none;border-radius:10px;padding:9px 22px;font-size:.88rem;font-weight:700;cursor:pointer;transition:filter .15s">
&nbsp; Показать решение
</button>
</div>
<div id="superAns" style="display:none;margin-top:14px">
<div class="nb-wrap">
<div class="nb-hdr">&nbsp; Решение</div>
<div style="background:var(--warn-bg);border-left:4px solid var(--warn);border-radius:0 8px 8px 0;padding:12px 16px;margin:12px 0;font-size:.91rem;line-height:1.7;color:#78350f">
<b>Ответ: нет — суммарный вектор импульса изменяется.</b><br>
Однако горизонтальная составляющая суммарного импульса остаётся постоянной, и именно она измеряется в опыте.
</div>
<hr class="nb-div">
<div class="nb-sh">Аргументация:</div>
<div class="nb-step">
<b>1.&nbsp; Какие силы действуют на шары в полёте?</b><br>
<span class="nb-i">После удара оба шара летят по параболе. На каждый из них действует <em>только сила тяжести</em> (трение воздуха пренебрежимо мало).</span>
<span class="nb-i">Сила тяжести — <em>внешняя</em> сила по отношению к системе «шар 1 + шар 2».</span>
</div>
<div class="nb-step">
<b>2.&nbsp; Как изменяется суммарный вектор импульса?</b><br>
<span class="nb-i">По второму закону Ньютона для системы тел:</span>
<span class="nb-i" style="font-style:normal">&nbsp;&nbsp;&nbsp;<span class="nb-box">Δ<b>p</b>&nbsp;= <b>F</b><sub>внеш</sub>·Δt = (m₁+m₂)·<b>g</b>·Δt</span></span>
<span class="nb-i">За каждую секунду полёта суммарный импульс приобретает направленную <em>вертикально вниз</em> добавку. Значит, суммарный вектор импульса непрерывно изменяется.</span>
</div>
<div class="nb-step">
<b>3.&nbsp; Почему опыт всё равно верифицирует закон сохранения импульса?</b><br>
<span class="nb-i">Сила тяжести направлена строго вертикально → горизонтальная проекция внешней силы равна нулю:</span>
<span class="nb-i" style="font-style:normal">&nbsp;&nbsp;&nbsp;<span class="nb-box">F<sub>внеш, x</sub> = 0 &nbsp;⟹&nbsp; p<sub>1x</sub> + p<sub>2x</sub> = const</span></span>
<span class="nb-i">Горизонтальные скорости шаров <em>не меняются</em> в течение всего полёта.</span>
<span class="nb-i">Горизонтальная дальность l = v<sub>x</sub> · t<sub>пад</sub>, причём <em>время падения одинаково</em> для обоих шаров (одна высота стола).</span>
<span class="nb-i">Следовательно, l ∝ v<sub>x</sub> ∝ p<sub>x</sub> — расстояния пропорциональны горизонтальным импульсам, которые и сохраняются.</span>
</div>
<!-- SVG диаграмма -->
<div style="margin:14px 0 6px;text-align:center">
<svg width="420" height="160" viewBox="0 0 420 160" style="max-width:100%;font-family:inherit">
<!-- стол -->
<rect x="0" y="68" width="120" height="6" fill="var(--pri)" rx="2"/>
<rect x="0" y="74" width="120" height="80" fill="rgba(29,78,216,.07)" rx="2"/>
<!-- пол -->
<line x1="120" y1="154" x2="420" y2="154" stroke="var(--border)" stroke-width="2"/>
<!-- вертикальная линия края стола -->
<line x1="120" y1="74" x2="120" y2="154" stroke="var(--border)" stroke-width="1.5" stroke-dasharray="4,3"/>
<!-- траектория шар 1 (быстрый) -->
<path d="M120 71 Q210 71 310 154" fill="none" stroke="var(--pri)" stroke-width="2.2" stroke-dasharray="6,3"/>
<!-- траектория шар 2 (медленнее) -->
<path d="M120 71 Q175 71 240 154" fill="none" stroke="var(--acc)" stroke-width="2.2" stroke-dasharray="6,3"/>
<!-- точка удара -->
<circle cx="120" cy="71" r="5" fill="var(--warn)" stroke="#fff" stroke-width="1.5"/>
<!-- стрелка g -->
<line x1="380" y1="40" x2="380" y2="90" stroke="#ef4444" stroke-width="2"/>
<polygon points="380,95 375,83 385,83" fill="#ef4444"/>
<text x="387" y="72" font-size="13" fill="#ef4444" font-weight="700">g</text>
<!-- стрелка p_total (меняется) -->
<line x1="200" y1="95" x2="200" y2="130" stroke="#ef4444" stroke-width="1.5" stroke-dasharray="3,2"/>
<line x1="200" y1="95" x2="255" y2="95" stroke="var(--pri)" stroke-width="1.5"/>
<line x1="200" y1="95" x2="248" y2="127" stroke="#6d28d9" stroke-width="2"/>
<polygon points="248,132 241,122 252,120" fill="#6d28d9"/>
<text x="258" y="131" font-size="11" fill="#6d28d9" font-weight="700">p&#x20D7;&#x2211;</text>
<text x="257" y="93" font-size="10" fill="var(--pri)">p&#x20D7;<tspan font-size="9">&#x2211;x</tspan></text>
<text x="178" y="133" font-size="10" fill="#ef4444">Δp&#x20D7;<tspan font-size="9">&#x2211;</tspan></text>
<!-- метки шаров -->
<text x="315" y="150" font-size="11" fill="var(--pri)" font-weight="700">шар 1</text>
<text x="243" y="150" font-size="11" fill="var(--acc)" font-weight="700">шар 2</text>
<!-- удар -->
<text x="126" y="66" font-size="11" fill="var(--warn)" font-weight="700">удар</text>
</svg>
<div style="font-size:.78rem;color:var(--muted);margin-top:2px">
p⃗<sub>∑</sub> — суммарный вектор импульса нарастает вниз; горизонтальная составляющая p<sub>∑x</sub> постоянна
</div>
</div>
<div class="nb-ans" style="background:var(--ok-bg);border-color:var(--ok);color:#065f46">
<b>Вывод:</b> Суммарный <em>вектор</em> импульса системы изменяется под действием силы тяжести. Но его горизонтальная составляющая сохраняется во всё время полёта. Именно это свойство лежит в основе опыта: расстояния на столе отражают горизонтальные скорости, а горизонтальные импульсы не изменяются ни во время удара, ни после него.
</div>
</div>
</div>
</div>
`);
html += secNav('lr10', 'lr12');
html += readButton('lr11');