Files
Learn_System/frontend/textbooks/physics_9_ch5.html
T
Maxim Dolgolyov 1f17fb40dc fix(textbooks): извлечён общий widget CSS — phys-textbook-widgets.css
Жалоба пользователя по Физике 8 (но проблема общая для Phys 8 и Phys 9):
страницы глав используют классы .wg/.dnd-pool/.dnd-chip/.btn/.score-display/
.feedback/.actions/.sliders/.spoiler/.drop-box в HTML-разметке, но CSS-правила
для них живут только в physics_10_ch1.html. Из-за этого карточки-задания,
chip'ы drag-and-drop, кнопки и feedback-блоки в Phys 8 и Phys 9 рендерились
без стилей (как обычный текст).

- extract_widget_css.cjs: вытягивает CSS-блок (.btn..pre-.col-side) из
  physics_10_ch1.html в frontend/css/phys-textbook-widgets.css (6.4 КБ)
- Подключает <link> в 11 файлов: physics_8_ch1/ch2/ch3/hub/lab,
  physics_9_ch1..ch5, physics_9_hub
- migrate_phys9_content.js теперь инжектит ссылку на widget CSS при будущих
  миграциях (рядом с FA CDN)
2026-05-30 09:16:24 +03:00

1399 lines
103 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<!doctype html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
<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="/css/phys-textbook-widgets.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>
<script src="/js/api.js" defer></script>
<script src="/js/xp.js" defer></script>
<script src="/js/phys.js" defer></script>
<script src="/js/phys9_legacy.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800;900&family=Unbounded:wght@700;800;900&family=JetBrains+Mono:wght@500;700&display=swap" rel="stylesheet">
<style>
:root{
--bg:#fafafa; --card:#fff; --card-soft:#f8fafc; --text:#0f172a; --ink:#0f172a; --muted:#64748b;
--border:#e2e8f0; --sh:0 1px 3px rgba(0,0,0,.06); --sh2:0 4px 14px rgba(0,0,0,.08);
--pri:#0891b2; --pri2:#0e7490; --pri-soft:#cffafe;
--acc:#22d3ee; --acc2:#0891b2; --acc-soft:#cffafe;
--ok:#10b981; --ok-bg:#d1fae5; --warn:#f59e0b; --warn-bg:#fef3c7;
--bad:#ef4444; --fail:#dc2626; --fail-bg:#fee2e2;
}
.dark{--bg:#0a0e1a; --card:#0f1727; --card-soft:#13192a; --text:#dbeafe; --ink:#dbeafe; --muted:#7c8fab; --border:#1e2a44}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{font-family:'Inter',system-ui,sans-serif;background:var(--bg);color:var(--text);line-height:1.55;font-size:15px}
button,input,select,textarea{font-family:inherit;font-size:inherit}
button{cursor:pointer;border:0;background:transparent;color:inherit}
a{color:inherit;text-decoration:none}
.ic{width:16px;height:16px;display:inline-block;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.hdr{position:relative;background:linear-gradient(110deg,#164e63 0%,#0891b2 55%,#22d3ee 100%);color:#fff;padding:46px 22px 30px;overflow:hidden;border-bottom:2px solid rgba(255,255,255,.2);min-height:130px}
.hdr::before{content:'ГЛАВА 5';position:absolute;right:-12px;top:50%;transform:translateY(-50%);font-family:'Unbounded',sans-serif;font-size:clamp(5rem,15vw,11rem);font-weight:900;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.12);line-height:1;pointer-events:none;user-select:none;z-index:0}
.hdr-row{position:relative;z-index:1;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.hdr h1{font-family:'Unbounded',sans-serif;font-size:1.5rem;font-weight:900;letter-spacing:-.01em;line-height:1.3;padding-top:4px}
.hdr-sub{font-size:.85rem;opacity:.88;margin-top:6px;font-weight:500;line-height:1.4}
.hdr-side{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hdr-btn{padding:7px 12px;border-radius:9px;background:rgba(255,255,255,.14);color:#fff;font-weight:600;font-size:.82rem;display:inline-flex;align-items:center;gap:6px;transition:background .15s;text-decoration:none}
.hdr-btn:hover{background:rgba(255,255,255,.24)}
.main{max-width:1240px;margin:0 auto;padding:22px;width:100%;display:grid;grid-template-columns:1fr 280px;gap:24px}
@media(max-width:980px){.main{grid-template-columns:1fr;padding:14px}}
.col-main{min-width:0}
.hero{background:linear-gradient(135deg,var(--pri-soft) 0%,var(--acc-soft) 50%,var(--pri-soft) 100%);background-size:200% 200%;animation:heroShift 12s ease-in-out infinite;border:1px solid var(--border);border-radius:18px;padding:24px 22px;margin-bottom:24px;position:relative;overflow:hidden}
@keyframes heroShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.hero::before{content:'&Delta;t';position:absolute;right:0;top:-30px;font-size:clamp(2rem,12vw,8rem);font-weight:900;color:var(--pri);opacity:.10;line-height:1;pointer-events:none;font-family:'Unbounded',sans-serif}
.hero h2{font-family:'Unbounded',sans-serif;font-size:1.55rem;font-weight:800;color:var(--pri2);margin-bottom:10px;letter-spacing:-.01em}
.hero p{font-size:.95rem;color:var(--text);opacity:.88;margin-bottom:14px;max-width:640px}
.hero-row{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.btn-primary{padding:11px 22px;background:linear-gradient(135deg,var(--pri),var(--pri2));color:#fff;border-radius:11px;font-weight:700;font-size:.92rem;display:inline-flex;align-items:center;gap:8px;box-shadow:var(--sh2);transition:transform .15s,box-shadow .15s}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 28px rgba(0,0,0,.18)}
.hero-progress{flex:1;min-width:200px;max-width:280px}
.hp-label{font-size:.74rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;display:block;margin-bottom:5px}
.hp-bar{height:8px;background:rgba(0,0,0,.12);border-radius:5px;overflow:hidden}
.hp-fill{height:100%;background:linear-gradient(90deg,var(--pri),var(--acc));border-radius:5px;width:0%;transition:width .6s cubic-bezier(.16,1,.3,1)}
.hp-text{font-size:.78rem;color:var(--muted);font-weight:700;margin-top:4px;display:block}
.hero-xp-badge{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:linear-gradient(135deg,var(--warn,#f59e0b),var(--pri));color:#fff;border-radius:99px;font-size:.82rem;font-weight:800;letter-spacing:.02em;box-shadow:0 4px 12px rgba(0,0,0,.18);font-family:'Unbounded',sans-serif}
.psel{margin-bottom:24px}
.psel-title{font-size:.72rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px}
.psel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.psel-card{background:var(--card);border:1.5px solid var(--border);border-radius:13px;padding:14px;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s;text-align:left;position:relative}
.psel-card:hover{transform:translateY(-3px);box-shadow:var(--sh2);border-color:var(--pri)}
.psel-card.active{border-color:var(--pri);background:linear-gradient(135deg,var(--pri-soft),var(--card));box-shadow:var(--sh2)}
.psel-card.active::after{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--pri),var(--acc));border-radius:13px 13px 0 0}
.psel-num{font-family:'Unbounded',sans-serif;font-size:.72rem;font-weight:800;color:var(--pri);text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}
.psel-name{font-size:.86rem;font-weight:700;color:var(--text);line-height:1.3;margin-bottom:8px}
.psel-prog{height:4px;background:rgba(0,0,0,.10);border-radius:3px;overflow:hidden}
.psel-prog-fill{height:100%;background:var(--pri);width:0%;transition:width .4s}
.psel-card.final{background:linear-gradient(135deg,var(--acc-soft),var(--pri-soft))}
.psel-card.final .psel-num{color:var(--warn)}
.sec[id="sec-lr1"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr2"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr3"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr4"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr5"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr6"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr7"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr8"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr9"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr10"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr11"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-lr12"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec[id="sec-final5"]{ --sec-acc:#0891b2; --sec-acc-d:#0e7490; --sec-acc-soft:#cffafe; }
.sec{display:none;position:relative;animation:fadeIn .35s ease}
.sec.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sec::before{content:attr(data-watermark);position:absolute;right:-20px;top:10%;font-family:'Unbounded',sans-serif;font-size:clamp(6rem,18vw,14rem);font-weight:900;color:transparent;-webkit-text-stroke:1.5px var(--sec-acc-soft,var(--pri-soft));line-height:1;pointer-events:none;user-select:none;z-index:0;opacity:.35}
.sec-header{margin-bottom:22px;padding-bottom:14px;border-bottom:2px solid var(--sec-acc-soft,var(--pri-soft));position:relative;z-index:1}
.sec-num{display:inline-block;padding:4px 10px;background:linear-gradient(135deg,var(--sec-acc,var(--pri)),var(--sec-acc-d,var(--pri2)));color:#fff;border-radius:7px;font-family:'Unbounded',sans-serif;font-size:.78rem;font-weight:800;letter-spacing:.04em;margin-bottom:8px}
.sec-h{font-family:'Unbounded',sans-serif;font-size:1.6rem;font-weight:800;color:var(--sec-acc-d,var(--pri2));letter-spacing:-.01em;line-height:1.25}
.card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px 20px;margin-bottom:16px;box-shadow:0 1px 3px rgba(0,0,0,.04),0 8px 24px rgba(0,0,0,.04);position:relative;z-index:1;transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s}
.card:hover{transform:translateY(-2px);box-shadow:0 4px 10px rgba(0,0,0,.06),0 16px 36px rgba(0,0,0,.08)}
.card-header{display:flex;align-items:center;gap:10px;margin-bottom:12px;padding-bottom:10px;border-bottom:1px dashed var(--border)}
.card-icon{width:32px;height:32px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:#fff}
.card-icon.theory{background:#8b5cf6}.card-icon.example{background:#10b981}.card-icon.lab{background:#0891b2}.card-icon.rule{background:#ec4899}
.card-icon .ic{width:18px;height:18px}
.card-title{font-family:'Unbounded',sans-serif;font-size:.82rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);flex:1}
.card-num{font-size:.74rem;font-weight:700;color:var(--muted);background:var(--sec-acc-soft,var(--pri-soft));padding:3px 7px;border-radius:5px}
.card-body{font-size:.94rem;line-height:1.65}
.card-body p{margin-bottom:8px}
.card-body p:last-child{margin-bottom:0}
.btn{padding:8px 16px;border-radius:8px;background:var(--card);color:var(--text);border:1.5px solid var(--border);font-weight:600;font-size:.88rem;transition:background .15s,border-color .15s,transform .1s}
.btn:hover{background:var(--sec-acc-soft,var(--pri-soft));border-color:var(--sec-acc,var(--pri))}
.btn:active{transform:scale(.96)}
.btn.primary{background:var(--sec-acc,var(--pri));color:#fff;border-color:var(--sec-acc,var(--pri))}
.btn.primary:hover{background:var(--sec-acc-d,var(--pri2));border-color:var(--sec-acc-d,var(--pri2))}
.col-side{position:sticky;top:14px;align-self:start;height:fit-content;max-height:calc(100vh - 28px);overflow-y:auto}
.sidecard{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:16px;margin-bottom:14px;box-shadow:var(--sh)}
.sidecard h4{font-family:'Unbounded',sans-serif;font-size:.74rem;font-weight:800;color:var(--pri2);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.sidecard-row{margin-bottom:8px;font-size:.86rem;line-height:1.6}
.sidecard-row b{color:var(--pri);font-weight:700}
.sidecard-row:last-child{margin-bottom:0}
@media(max-width:980px){.col-side{position:static;max-height:none}}
.xp-card{background:linear-gradient(135deg,var(--acc-soft),var(--pri-soft));border:1.5px solid var(--acc);border-radius:12px;padding:14px;margin-bottom:14px}
.xp-card-title{font-size:.68rem;font-weight:800;color:var(--acc2);text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.xp-level{font-size:1.1rem;font-weight:900;color:var(--acc2);font-family:'Unbounded',sans-serif}
.xp-bar{height:9px;background:rgba(0,0,0,.10);border-radius:6px;overflow:hidden;margin:7px 0}
.xp-fill{height:100%;background:linear-gradient(90deg,var(--acc),var(--pri));border-radius:6px;transition:width .5s cubic-bezier(.4,0,.2,1)}
.xp-nums{font-size:.74rem;color:var(--muted);display:flex;justify-content:space-between}
.sec-nav{display:flex;gap:10px;margin-top:24px;padding-top:20px;border-top:1px solid var(--border);justify-content:space-between;flex-wrap:wrap}
.foot{text-align:center;padding:30px 16px;color:var(--muted);font-size:.78rem;border-top:1px solid var(--border);margin-top:30px}
.ach-popup{position:fixed;top:80px;right:18px;background:linear-gradient(135deg,var(--pri),var(--acc));color:#fff;padding:12px 18px;border-radius:11px;font-weight:700;font-size:.9rem;box-shadow:0 8px 28px rgba(0,0,0,.32);z-index:1002;display:none;align-items:center;gap:8px;max-width:340px}
.ach-popup.show{display:flex}
.col-side-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.42);z-index:9990;display:none}
.col-side-backdrop.show{display:block}
@media(max-width:980px){
.col-side{position:fixed;top:0;right:0;height:100vh;width:300px;max-width:88vw;background:var(--bg);box-shadow:-12px 0 24px rgba(0,0,0,.18);padding:18px 16px;overflow-y:auto;transform:translateX(100%);transition:transform .25s ease;z-index:9991;max-height:none}
.col-side.open{transform:none}
}
.search-modal{position:fixed;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(4px);z-index:9993;display:none;align-items:flex-start;justify-content:center;padding-top:14vh}
.search-modal.show{display:flex}
.search-box{background:var(--bg);border:1px solid var(--border);border-radius:14px;width:560px;max-width:92vw;max-height:70vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.4)}
.search-input{padding:14px 16px;font-size:1rem;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);outline:none}
.search-results{flex:1;overflow-y:auto;padding:6px 0}
.search-row{display:block;padding:8px 16px;cursor:pointer;border-bottom:1px solid var(--border);text-align:left;background:transparent;border:0;width:100%;color:var(--text)}
.search-row:hover,.search-row.active{background:var(--sec-acc-soft,var(--pri-soft))}
.search-row .sr-kind{font-size:.7rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;margin-bottom:2px}
.search-row .sr-title{font-weight:700;font-size:.92rem;color:var(--text)}
.search-row .sr-desc{font-size:.8rem;color:var(--muted);margin-top:2px}
.search-empty{padding:20px;text-align:center;color:var(--muted);font-size:.88rem}
.search-foot{padding:8px 14px;border-top:1px solid var(--border);font-size:.74rem;color:var(--muted);display:flex;gap:14px}
.search-foot kbd{padding:2px 6px;background:var(--card);border:1px solid var(--border);border-radius:4px;font-family:'JetBrains Mono',monospace;font-size:.72rem}
.psel-card{position:relative}
.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}
/* ── §1521 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>
<header class="hdr">
<div class="hdr-row">
<div>
<h1>Физика 9 · Глава 5</h1>
<div class="hdr-sub">12 лабораторных работ: погрешности · ускорение · окружность · Гук · трение · бросок · рычаг · блоки · наклонная плоскость · Архимед · импульс · энергия</div>
</div>
<div class="hdr-side">
<a href="/textbook/physics-9" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg> К физике 9</a>
<button id="search-btn" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7"/><path d="m21 21-4-4"/></svg> Поиск</button>
<button id="sidebar-btn" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><line x1="4" y1="6" x2="20" y2="6"/><line x1="4" y1="12" x2="20" y2="12"/><line x1="4" y1="18" x2="14" y2="18"/></svg> Шпаргалка</button>
<button id="theme-btn" class="hdr-btn"><svg class="ic" viewBox="0 0 24 24"><path d="M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z"/></svg><span id="theme-lab">Тёмная</span></button>
</div>
</div>
</header>
<main class="main">
<div class="col-main">
<section class="hero">
<h2>Лабораторный практикум — физика руками</h2>
<p>12 классических лабораторных работ. Каждая: цель, оборудование, вывод формул, ход работы, таблица измерений, контрольные вопросы и суперзадание.</p>
<div class="hero-row">
<button class="btn-primary" onclick="goTo('lr1')"><svg class="ic" viewBox="0 0 24 24"><polygon points="6 4 20 12 6 20 6 4" fill="currentColor" stroke="none"/></svg> Начать ЛР 1</button>
<div class="hero-progress">
<span class="hp-label">Прогресс по главе</span>
<div class="hp-bar"><div id="hero-hp-fill" class="hp-fill"></div></div>
<span id="hero-hp-text" class="hp-text">0%</span>
</div>
<div id="hero-xp-badge" class="hero-xp-badge"></div>
</div>
</section>
<section class="psel">
<div class="psel-title">Лабораторные работы</div>
<div id="psel-grid" class="psel-grid"></div>
</section>
<section id="sec-lr1" class="sec" data-watermark="&Delta;"><div class="sec-header"><span class="sec-num">ЛР 1</span><h2 class="sec-h">Определение абсолютной и относительной погрешностей прямых измерений</h2></div><div id="lr1-body"></div></section>
<section id="sec-lr2" class="sec" data-watermark="a"><div class="sec-header"><span class="sec-num">ЛР 2</span><h2 class="sec-h">Измерение ускорения при равноускоренном движении</h2></div><div id="lr2-body"></div></section>
<section id="sec-lr3" class="sec" data-watermark="&omega;"><div class="sec-header"><span class="sec-num">ЛР 3</span><h2 class="sec-h">Изучение движения тела по окружности</h2></div><div id="lr3-body"></div></section>
<section id="sec-lr4" class="sec" data-watermark="k"><div class="sec-header"><span class="sec-num">ЛР 4</span><h2 class="sec-h">Проверка закона Гука</h2></div><div id="lr4-body"></div></section>
<section id="sec-lr5" class="sec" data-watermark="&mu;"><div class="sec-header"><span class="sec-num">ЛР 5</span><h2 class="sec-h">Измерение коэффициента трения скольжения</h2></div><div id="lr5-body"></div></section>
<section id="sec-lr6" class="sec" data-watermark="v_0"><div class="sec-header"><span class="sec-num">ЛР 6</span><h2 class="sec-h">Изучение движения тела, брошенного горизонтально</h2></div><div id="lr6-body"></div></section>
<section id="sec-lr7" class="sec" data-watermark="l_1F_1"><div class="sec-header"><span class="sec-num">ЛР 7</span><h2 class="sec-h">Проверка условия равновесия рычага</h2></div><div id="lr7-body"></div></section>
<section id="sec-lr8" class="sec" data-watermark="F=P/2"><div class="sec-header"><span class="sec-num">ЛР 8</span><h2 class="sec-h">Изучение неподвижного и подвижного блоков</h2></div><div id="lr8-body"></div></section>
<section id="sec-lr9" class="sec" data-watermark="&eta;"><div class="sec-header"><span class="sec-num">ЛР 9</span><h2 class="sec-h">Изучение наклонной плоскости и измерение её КПД</h2></div><div id="lr9-body"></div></section>
<section id="sec-lr10" class="sec" data-watermark="F_A"><div class="sec-header"><span class="sec-num">ЛР 10</span><h2 class="sec-h">Изучение выталкивающей силы</h2></div><div id="lr10-body"></div></section>
<section id="sec-lr11" class="sec" data-watermark="&sum;p"><div class="sec-header"><span class="sec-num">ЛР 11</span><h2 class="sec-h">Проверка закона сохранения импульса</h2></div><div id="lr11-body"></div></section>
<section id="sec-lr12" class="sec" data-watermark="E"><div class="sec-header"><span class="sec-num">ЛР 12</span><h2 class="sec-h">Проверка закона сохранения механической энергии</h2></div><div id="lr12-body"></div></section>
<section id="sec-final5" class="sec" data-watermark="&#9733;"><div class="sec-header"><span class="sec-num" style="background:linear-gradient(135deg,#0891b2,#22d3ee)"></span><h2 class="sec-h">Финал главы</h2></div><div id="final5-body"></div></section>
</div>
<aside class="col-side" id="col-side"><div id="sidebar-content"></div></aside>
<div class="col-side-backdrop" id="col-side-backdrop"></div>
</main>
<footer class="foot">Интерактивный учебник «Физика 9» · Глава 5 · «Лабораторный практикум» · LearnSpace</footer>
<div id="ach-popup" class="ach-popup"><svg class="ic" viewBox="0 0 24 24" style="width:22px;height:22px"><polygon points="12,2 22,20 2,20"/></svg><span id="ach-text">Достижение!</span></div>
<div id="search-modal" class="search-modal" role="dialog">
<div class="search-box">
<input type="text" id="search-input" class="search-input" placeholder="Поиск…" autocomplete="off">
<div id="search-results" class="search-results"></div>
<div class="search-foot"><span><kbd>↑↓</kbd> навигация</span><span><kbd>Enter</kbd> открыть</span><span><kbd>Esc</kbd> закрыть</span></div>
</div>
</div>
<script>
'use strict';
const STATE = { current:'lr1', progress:{}, achievements:new Map(), xp:0, level:1 };
const TOTAL_PARAS = 13;
const _TB_SLUG = 'physics-9-ch5';
const PARAS = [
{ id:"lr1", num:"ЛР 1", name:"Определение абсолютной и относительной погрешностей прямых измерений", sub:"$\\Delta t$, $\\varepsilon_t$" },
{ id:"lr2", num:"ЛР 2", name:"Измерение ускорения при равноускоренном движении", sub:"$a = 2l/t^2$" },
{ id:"lr3", num:"ЛР 3", name:"Изучение движения тела по окружности", sub:"$a_n = 4\\pi^2 R/T^2$" },
{ id:"lr4", num:"ЛР 4", name:"Проверка закона Гука", sub:"$k = F/x$" },
{ id:"lr5", num:"ЛР 5", name:"Измерение коэффициента трения скольжения", sub:"$\\mu = F_{тр}/P$" },
{ id:"lr6", num:"ЛР 6", name:"Изучение движения тела, брошенного горизонтально", sub:"$v_0 = l\\sqrt{g/(2h)}$" },
{ id:"lr7", num:"ЛР 7", name:"Проверка условия равновесия рычага", sub:"$F_1 l_1 = F_2 l_2$" },
{ id:"lr8", num:"ЛР 8", name:"Изучение неподвижного и подвижного блоков", sub:"$P h_1 = F h_2$" },
{ id:"lr9", num:"ЛР 9", name:"Изучение наклонной плоскости и измерение её КПД", sub:"$\\eta = mgh/A_{сов}$" },
{ id:"lr10", num:"ЛР 10", name:"Изучение выталкивающей силы", sub:"$F_A = F_1 - F_2$" },
{ id:"lr11", num:"ЛР 11", name:"Проверка закона сохранения импульса", sub:"$m_1 l_1 = m_1 l_1' + m_2 l_2'$" },
{ id:"lr12", num:"ЛР 12", name:"Проверка закона сохранения механической энергии", sub:"$F|x| = ml^2 g/(2h)$" },
{ id:"final5", num:'\u2605', name:'Финал главы', sub:"Итоги · боссы главы 5", final:true }
];
PARAS.forEach(p => { STATE.progress[p.id] = 0; });
function calcLevel(xp){ return Math.floor(Math.sqrt((xp||0)/100))+1; }
function _xpForLevel(lv){ return (lv-1)*(lv-1)*100; }
const ACH_LABELS = {
start:"Начало главы 5!",
lr1_done:"Определение абсолютной и относительной погрешностей прямых измерений освоен!",
lr2_done:"Измерение ускорения при равноускоренном движении освоен!",
lr3_done:"Изучение движения тела по окружности освоен!",
lr4_done:"Проверка закона Гука освоен!",
lr5_done:"Измерение коэффициента трения скольжения освоен!",
lr6_done:"Изучение движения тела, брошенного горизонтально освоен!",
lr7_done:"Проверка условия равновесия рычага освоен!",
lr8_done:"Изучение неподвижного и подвижного блоков освоен!",
lr9_done:"Изучение наклонной плоскости и измерение её КПД освоен!",
lr10_done:"Изучение выталкивающей силы освоен!",
lr11_done:"Проверка закона сохранения импульса освоен!",
lr12_done:"Проверка закона сохранения механической энергии освоен!",
ch5_done:"Глава 5 пройдена!"
};
function loadProgress(){
try{
const s=localStorage.getItem('physics9_ch5_progress'); if(s) Object.assign(STATE.progress, JSON.parse(s));
const a=localStorage.getItem('physics9_ch5_achievements');
if(a){ const p=JSON.parse(a); if(Array.isArray(p)) p.forEach(id=>STATE.achievements.set(id, ACH_LABELS[id]||id)); else if(p&&typeof p==='object'){ for(const[id,t] of Object.entries(p)) STATE.achievements.set(id,(t&&t!==id)?t:(ACH_LABELS[id]||id)); } }
STATE.xp=+(localStorage.getItem('physics9_xp')||0); STATE.level=calcLevel(STATE.xp);
}catch(e){}
}
function saveProgress(){
try{
localStorage.setItem('physics9_ch5_progress', JSON.stringify(STATE.progress));
localStorage.setItem('physics9_ch5_achievements', JSON.stringify(Object.fromEntries(STATE.achievements)));
localStorage.setItem('physics9_xp', String(STATE.xp));
}catch(e){}
}
function bumpProgress(key, delta){
STATE.progress[key]=Math.max(0,Math.min(100,(STATE.progress[key]||0)+delta));
saveProgress(); refreshProgressUI();
if(STATE.progress[key]>=50) markParaRead(key);
}
const _markedRead=new Set();
let _pendingProgressBody=null, _progressTimer=null;
function _flushProgress(){
const body=_pendingProgressBody; _pendingProgressBody=null; if(!body) return;
const tok=(window.LS&&LS.getToken)?LS.getToken():''; if(!tok) return;
fetch('/api/textbooks/'+_TB_SLUG+'/progress',{method:'POST',headers:{'Content-Type':'application/json','Authorization':'Bearer '+tok},body:JSON.stringify(body),keepalive:true}).catch(()=>{});
}
function _queueProgress(patch){ _pendingProgressBody=Object.assign(_pendingProgressBody||{},patch); if(_progressTimer) clearTimeout(_progressTimer); _progressTimer=setTimeout(_flushProgress, 600); }
function markLastPara(id){ _queueProgress({last_para:id}); }
function markParaRead(id){ if(_markedRead.has(id)) return; _markedRead.add(id); _queueProgress({mark_read:id}); }
window.addEventListener('beforeunload', _flushProgress);
function loadServerReadState(){
const tok=(window.LS&&LS.getToken)?LS.getToken():''; if(!tok) return;
fetch('/api/textbooks/'+_TB_SLUG,{headers:{'Authorization':'Bearer '+tok}}).then(r=>r.ok?r.json():null).then(d=>{
if(!d||!d.progress) return;
(d.progress.read||[]).forEach(k=>{_markedRead.add(k); if((STATE.progress[k]||0)<50) STATE.progress[k]=100;});
saveProgress(); refreshProgressUI();
}).catch(()=>{});
}
function addXp(n,src){
if(!n) return;
const prev=STATE.level; STATE.xp=Math.max(0,(STATE.xp||0)+n); STATE.level=calcLevel(STATE.xp);
saveProgress(); refreshProgressUI();
if(window.LS&&window.LS.xp) window.LS.xp.add(n,'physics9-ch5-'+(src||'misc'));
if(STATE.level>prev){
const pop=document.getElementById('ach-popup');
if(pop){ document.getElementById('ach-text').textContent='Уровень '+STATE.level+'!'; pop.classList.add('show'); setTimeout(()=>pop.classList.remove('show'),2600); }
}
}
function refreshProgressUI(){
const total=Math.round(Object.values(STATE.progress).reduce((a,b)=>a+b,0)/TOTAL_PARAS);
const f=document.getElementById('hero-hp-fill'); if(f) f.style.width=total+'%';
const t=document.getElementById('hero-hp-text'); if(t) t.textContent=total+'% пройдено';
document.querySelectorAll('[data-prog-card]').forEach(el=>{ const k=el.dataset.progCard; const fl=el.querySelector('.psel-prog-fill'); if(fl) fl.style.width=(STATE.progress[k]||0)+'%'; });
const xpBadge=document.getElementById('hero-xp-badge');
if(xpBadge){ xpBadge.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:13px;height:13px"><polygon points="12 2 22 20 2 20"/></svg> Ур. '+STATE.level+' \xb7 '+(STATE.xp||0)+' XP'; }
if(STATE.current && document.getElementById('sidebar-content')){ try{ buildSidebar(STATE.current); }catch(e){} }
refreshDoneMarks();
}
function refreshDoneMarks(){
try{
document.querySelectorAll('.psel-card').forEach(c=>{
const id = c.dataset.id || c.dataset.progCard;
if(!id) return;
const pct = +STATE.progress[id] || 0;
if(!c.querySelector('.psel-done')){
const s = document.createElement('span');
s.className = 'psel-done';
s.setAttribute('title','Прочитано');
s.innerHTML = '<svg viewBox="0 0 24 24"><polyline points="20 6 9 17 4 12"/></svg>';
c.appendChild(s);
}
c.classList.toggle('done', pct >= 50);
});
}catch(e){}
}
function achievement(id,text){
if(STATE.achievements.has(id)) return;
STATE.achievements.set(id, text||ACH_LABELS[id]||id); saveProgress();
const pop=document.getElementById('ach-popup');
if(pop){ document.getElementById('ach-text').textContent=text||ACH_LABELS[id]||id; pop.classList.add('show'); setTimeout(()=>pop.classList.remove('show'),3300); }
addXp(20,'ach-'+id);
}
function buildParaSelector(){
const g=document.getElementById('psel-grid'); g.innerHTML='';
PARAS.forEach(p=>{
const card=document.createElement('div');
card.className='psel-card'+(p.final?' final':'');
card.dataset.id=p.id; card.dataset.progCard=p.id;
card.innerHTML='<div class="psel-num">'+p.num+'</div><div class="psel-name">'+p.name+'</div><div class="psel-prog"><div class="psel-prog-fill"></div></div>';
card.addEventListener('click', ()=>goTo(p.id));
g.appendChild(card);
});
}
const BUILT=new Set();
const BUILDERS = { lr1:()=>build_lr1(), lr2:()=>build_lr2(), lr3:()=>build_lr3(), lr4:()=>build_lr4(), lr5:()=>build_lr5(), lr6:()=>build_lr6(), lr7:()=>build_lr7(), lr8:()=>build_lr8(), lr9:()=>build_lr9(), lr10:()=>build_lr10(), lr11:()=>build_lr11(), lr12:()=>build_lr12(), final5:()=>build_final5() };
function ensureBuilt(id){ if(BUILT.has(id)) return; const fn=BUILDERS[id]; if(fn){ fn(); BUILT.add(id); } }
function goTo(id){
STATE.current=id; ensureBuilt(id);
document.querySelectorAll('.sec').forEach(s=>s.classList.remove('active'));
const el=document.getElementById('sec-'+id); if(el) el.classList.add('active');
document.querySelectorAll('.psel-card').forEach(c=>c.classList.toggle('active', c.dataset.id===id));
buildSidebar(id);
window.scrollTo({top:0,behavior:'smooth'});
if((STATE.progress[id]||0)<10) bumpProgress(id, 10);
if(window.renderMathInElement) setTimeout(()=>renderMath(el), 0);
// Auto-init legacy simulations: call upd<N>() / startAnim<N>() / draw<N>() if defined in phys9_legacy.js.
if(id.startsWith('p')){
const n = id.slice(1);
setTimeout(()=>{
['upd','startAnim','init','draw'].forEach(prefix=>{
const fn = window[prefix + n];
if(typeof fn === 'function'){ try{ fn(); }catch(e){ console.warn(prefix + n + ' init:', e.message); } }
});
}, 50);
} else if(id.startsWith('lr')){
const n = id.slice(2);
setTimeout(()=>{
['updLab','drawLab'].forEach(prefix=>{
const fn = window[prefix + n];
if(typeof fn === 'function'){ try{ fn(); }catch(e){} }
});
}, 50);
}
markLastPara(id);
}
const SIDEBARS = {
lr1:{title:"Шпаргалка ЛР 1",rows:[["Цель","$\\Delta t$, $\\varepsilon_t$"],["Обор.","мерная лента, шарик, секундомер"],["Формула","$\\varepsilon_t = \\Delta t/\\langle t\\rangle \\cdot 100\\%$"]]},
lr2:{title:"Шпаргалка ЛР 2",rows:[["Цель","измерить $a$ при равноускор."],["Обор.","жёлоб, шарик, секундомер"],["Формула","$a = 2l/t^2$"]]},
lr3:{title:"Шпаргалка ЛР 3",rows:[["Цель","$T$, $a_n$, $\\omega$, $v$"],["Обор.","штатив, нить, шарик"],["Формула","$a_n = 4\\pi^2 R/T^2$"]]},
lr4:{title:"Шпаргалка ЛР 4",rows:[["Цель","$k$ пружины"],["Обор.","штатив, динамометр, грузы"],["Формула","$k = mg/|x|$"]]},
lr5:{title:"Шпаргалка ЛР 5",rows:[["Цель","$\\mu$ дерево/дерево"],["Обор.","брусок, доска, динамометр"],["Формула","$\\mu = F_{упр}/P$"]]},
lr6:{title:"Шпаргалка ЛР 6",rows:[["Цель","$v_0$ гориз. бросок"],["Обор.","лоток, шарик, копир. бумага"],["Формула","$v_0 = l\\sqrt{g/(2h)}$"]]},
lr7:{title:"Шпаргалка ЛР 7",rows:[["Цель","правило рычага"],["Обор.","рычаг, грузы"],["Формула","$F_1 l_1 = F_2 l_2$"]]},
lr8:{title:"Шпаргалка ЛР 8",rows:[["Цель","выигр. подв. блока"],["Обор.","блоки, динамометр"],["Формула","$P h_1 = F h_2$"]]},
lr9:{title:"Шпаргалка ЛР 9",rows:[["Цель","КПД накл. плоскости"],["Обор.","доска, брусок, динамометр"],["Формула","$\\eta = mgh/(F_{упр}l)\\cdot 100\\%$"]]},
lr10:{title:"Шпаргалка ЛР 10",rows:[["Цель","$F_A$ для разных жидк."],["Обор.","цилиндры, динамометр, вода, соль"],["Формула","$F_A = F_{упр1} - F_{упр2}$"]]},
lr11:{title:"Шпаргалка ЛР 11",rows:[["Цель","проверить ЗСИ"],["Обор.","лоток, два шара, бумага"],["Формула","$m_1 l_1 = m_1 l_1' + m_2 l_2'$"]]},
lr12:{title:"Шпаргалка ЛР 12",rows:[["Цель","проверить ЗСЭ"],["Обор.","лоток, шар, пружина, бумага"],["Формула","$F|x| = ml^2g/(2h)$"]]},
final5:{title:"Финал главы 5",rows:[["§§112","теория главы 5"],["Награда","+50 XP"]]}
};
const TIPS=[
{sec:"lr1",html:"ЛР1: погрешности прямых измерений. $\\Delta t = \\Delta t_{сист} + \\Delta t_{случ}$. Результат в интервальной форме: $t = \\langle t\\rangle \\pm \\Delta t$."},
{sec:"lr2",html:"ЛР2: ускорение шарика по наклонному жёлобу. $a = 2l/t^2$ (из $s = at^2/2$ при $v_0 = 0$)."},
{sec:"lr3",html:"ЛР3: движение по окружности. Измеряем $T$, считаем $a_n = 4\\pi^2 R/T^2$, $\\omega = 2\\pi/T$, $v = \\omega R$."},
{sec:"lr4",html:"ЛР4: закон Гука. Подвешиваем грузы, строим график $F_{упр}(x)$. Жёсткость $k = mg/|x|$."},
{sec:"lr5",html:"ЛР5: коэффициент трения скольжения дерева по дереву. $\\mu = F_{упр}/P$."},
{sec:"lr6",html:"ЛР6: тело, брошенное горизонтально. Измеряем дальность $l$ и высоту $h$. $v_0 = l\\sqrt{g/(2h)}$."},
{sec:"lr7",html:"ЛР7: условие равновесия рычага. Проверяем $F_1 l_1 = F_2 l_2$."},
{sec:"lr8",html:"ЛР8: блоки. Неподв. — без выигрыша; подвижный — выигрыш в силе в 2 раза, проигрыш в пути в 2 раза."},
{sec:"lr9",html:"ЛР9: КПД наклонной плоскости. $\\eta = A_{пол}/A_{сов} = mgh/(F_{упр}l)\\cdot 100\\%$. Сравниваем при 30° и 45°."},
{sec:"lr10",html:"ЛР10: выталкивающая сила Архимеда. $F_A = F_{упр1} - F_{упр2}$ (вес в воздухе минус вес в жидкости)."},
{sec:"lr11",html:"ЛР11: ЗСИ. Шар $m_1$ скатывается, сталкивается с покоящимся шаром $m_2$. Проверяем $m_1 l_1 = m_1 l_1' + m_2 l_2'$."},
{sec:"lr12",html:"ЛР12: ЗСЭ. Сжатая пружина → шар → дальность полёта. $F_{упр}|x| = ml^2 g/(2h)$."},
{sec:"final5",html:"Финал главы 5 — итоговый отчёт по 12 ЛР. В разработке (Phase 5+)."}
];
function buildSidebar(id){
const box=document.getElementById('sidebar-content');
const sb=SIDEBARS[id]||SIDEBARS[PARAS[0].id];
let html='';
const xpForLv=_xpForLevel(STATE.level), xpNext=_xpForLevel(STATE.level+1);
const xpInLv=STATE.xp-xpForLv, xpRange=xpNext-xpForLv;
const xpPct=xpRange>0?Math.round(xpInLv/xpRange*100):100;
html+='<div class="xp-card"><div class="xp-card-title"><span>XP-прогресс</span><span class="xp-level">Ур. '+STATE.level+'</span></div><div class="xp-bar"><div class="xp-fill" style="width:'+xpPct+'%"></div></div><div class="xp-nums"><span>'+STATE.xp+' XP</span><span>'+xpNext+' XP</span></div></div>';
html+='<div class="sidecard"><h4>'+sb.title+'</h4>';
sb.rows.forEach(([k,v])=>{ html+='<div class="sidecard-row"><b>'+k+'</b>'+(v?' \u2014 '+v:'')+'</div>'; });
html+='</div>';
const tip=TIPS.find(t=>t.sec===id)||TIPS[0];
if(tip){
html+='<div class="sidecard" style="background:linear-gradient(135deg,var(--warn-bg,#fef3c7),var(--pri-soft));border-color:var(--warn,#f59e0b)"><h4 style="color:#92400e;display:flex;align-items:center;gap:6px"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:14px;height:14px"><polygon points="12,2 22,20 2,20"/></svg>Подсказка</h4><div class="sidecard-row" style="margin-bottom:0;font-size:.84rem;line-height:1.55">'+tip.html+'</div></div>';
}
if(STATE.achievements.size>0){
html+='<div class="sidecard"><h4>Достижения <span style="color:var(--warn);float:right">'+STATE.achievements.size+'</span></h4>';
[...STATE.achievements.values()].slice(-4).forEach(text=>{ html+='<div class="sidecard-row" style="font-size:.78rem;color:var(--ok)">&#10003; '+text+'</div>'; });
html+='</div>';
}
box.innerHTML=html;
if(window.renderMathInElement) try{ renderMath(box); }catch(e){}
}
function initTheme(){
const t=localStorage.getItem('physics9_ch5_theme')||'light';
if(t==='dark') document.documentElement.classList.add('dark');
document.getElementById('theme-lab').textContent=t==='dark'?'Светлая':'Тёмная';
document.getElementById('theme-btn').addEventListener('click', ()=>{
document.documentElement.classList.toggle('dark');
const dark=document.documentElement.classList.contains('dark');
localStorage.setItem('physics9_ch5_theme', dark?'dark':'light');
document.getElementById('theme-lab').textContent=dark?'Светлая':'Тёмная';
});
}
function renderMath(root){ if(window.renderMathInElement){ try{ renderMathInElement(root, {delimiters:[{left:'$$',right:'$$',display:true},{left:'$',right:'$',display:false},{left:'\\[',right:'\\]',display:true},{left:'\\(',right:'\\)',display:false}],throwOnError:false}); }catch(e){} } }
const ICONS = {
theory:'<svg class="ic" viewBox="0 0 24 24"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>',
example:'<svg class="ic" viewBox="0 0 24 24"><path d="M9 18h6"/><path d="M10 22h4"/><path d="M12 2a7 7 0 0 0-4 13c1 1 2 2 2 4h4c0-2 1-3 2-4a7 7 0 0 0-4-13z"/></svg>',
lab:'<svg class="ic" viewBox="0 0 24 24"><path d="M10 2v7.5L4.5 19a2 2 0 0 0 1.7 3h11.6a2 2 0 0 0 1.7-3L14 9.5V2"/><line x1="9" y1="2" x2="15" y2="2"/></svg>',
rule:'<svg class="ic" viewBox="0 0 24 24"><path d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9"/><path d="M10.3 21a1.94 1.94 0 0 0 3.4 0"/></svg>',
};
function makeCard(kind, title, num, body){
const labels = {theory:'Теория',example:'Пример',lab:'Лабораторная работа',rule:'Правило'};
return '<div class="card"><div class="card-header"><div class="card-icon '+kind+'">'+ICONS[kind]+'</div><div class="card-title">'+(labels[kind]||'')+(title&&title!==labels[kind]?' \xb7 '+title:'')+'</div>'+(num?'<div class="card-num">'+num+'</div>':'')+'</div><div class="card-body">'+body+'</div></div>';
}
function secNav(prev, next){
const NAMES = {lr1:'ЛР1',lr2:'ЛР2',lr3:'ЛР3',lr4:'ЛР4',lr5:'ЛР5',lr6:'ЛР6',lr7:'ЛР7',lr8:'ЛР8',lr9:'ЛР9',lr10:'ЛР10',lr11:'ЛР11',lr12:'ЛР12',final5:'Финал'};
let h='<div class="sec-nav">';
h+=prev?'<button class="btn" onclick="goTo(\''+prev+'\')"><svg class="ic" viewBox="0 0 24 24"><polyline points="15 18 9 12 15 6"/></svg> '+NAMES[prev]+'</button>':'<span></span>';
h+=next?'<button class="btn primary" onclick="goTo(\''+next+'\')">'+NAMES[next]+' <svg class="ic" viewBox="0 0 24 24"><polyline points="9 18 15 12 9 6"/></svg></button>':'<span></span>';
h+='</div>'; return h;
}
function readButton(paraId){
const p = PARAS.find(x => x.id === paraId);
const labelTail = p && p.final ? 'финал' : (p ? p.num : '?');
return '<div style="margin-top:18px;display:flex;justify-content:center">'
+'<button class="btn primary" id="'+paraId+'-read-btn">'
+'<svg class="ic" viewBox="0 0 24 24"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"/><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"/></svg>'
+' Я прочитал — '+labelTail+' (+10 XP)'
+'</button></div>';
}
function wireReadBtn(paraId){
const btn = document.getElementById(paraId+'-read-btn'); if(!btn) return;
btn.addEventListener('click', ()=>{
addXp(10, paraId+'-read'); bumpProgress(paraId, 30);
btn.textContent='Прочитано! +10 XP'; btn.disabled=true; btn.style.opacity=.6;
const aId = paraId+'_done';
if(ACH_LABELS[aId]) achievement(aId);
});
}
/* ===== STUB BUILDERS — наполнение в Phase 5 ===== */
function build_lr1(){
const box = document.getElementById('lr1-body');
let html = '';
html += makeCard('theory', "Определение абсолютной и относительной погрешностей прямых измерений", "ЛР 1", `
<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 += secNav(null, 'lr2');
html += readButton('lr1');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr1');
}
function build_lr2(){
const box = document.getElementById('lr2-body');
let html = '';
html += makeCard('theory', "Измерение ускорения при равноускоренном движении", "ЛР 2", `
<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 += secNav('lr1', 'lr3');
html += readButton('lr2');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr2');
}
function build_lr3(){
const box = document.getElementById('lr3-body');
let html = '';
html += makeCard('theory', "Изучение движения тела по окружности", "ЛР 3", `
<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 += secNav('lr2', 'lr4');
html += readButton('lr3');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr3');
}
function build_lr4(){
const box = document.getElementById('lr4-body');
let html = '';
html += makeCard('theory', "Проверка закона Гука", "ЛР 4", `
<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 += secNav('lr3', 'lr5');
html += readButton('lr4');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr4');
}
function build_lr5(){
const box = document.getElementById('lr5-body');
let html = '';
html += makeCard('theory', "Измерение коэффициента трения скольжения", "ЛР 5", `
<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 += secNav('lr4', 'lr6');
html += readButton('lr5');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr5');
}
function build_lr6(){
const box = document.getElementById('lr6-body');
let html = '';
html += makeCard('theory', "Изучение движения тела, брошенного горизонтально", "ЛР 6", `
<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 += secNav('lr5', 'lr7');
html += readButton('lr6');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr6');
}
function build_lr7(){
const box = document.getElementById('lr7-body');
let html = '';
html += makeCard('theory', "Проверка условия равновесия рычага", "ЛР 7", `
<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 += secNav('lr6', 'lr8');
html += readButton('lr7');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr7');
}
function build_lr8(){
const box = document.getElementById('lr8-body');
let html = '';
html += makeCard('theory', "Изучение неподвижного и подвижного блоков", "ЛР 8", `
<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 += secNav('lr7', 'lr9');
html += readButton('lr8');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr8');
}
function build_lr9(){
const box = document.getElementById('lr9-body');
let html = '';
html += makeCard('theory', "Изучение наклонной плоскости и измерение её КПД", "ЛР 9", `
<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 += secNav('lr8', 'lr10');
html += readButton('lr9');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr9');
}
function build_lr10(){
const box = document.getElementById('lr10-body');
let html = '';
html += makeCard('theory', "Изучение выталкивающей силы", "ЛР 10", `
<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 += secNav('lr9', 'lr11');
html += readButton('lr10');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr10');
}
function build_lr11(){
const box = document.getElementById('lr11-body');
let html = '';
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">Задачи 17 хода работы</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');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr11');
}
function build_lr12(){
const box = document.getElementById('lr12-body');
let html = '';
html += makeCard('theory', "Проверка закона сохранения механической энергии", "ЛР 12", `
<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 += secNav('lr11', 'final5');
html += readButton('lr12');
box.innerHTML = html;
renderMath(box);
wireReadBtn('lr12');
}
function build_final5(){
const box = document.getElementById('final5-body');
let html = '';
html += makeCard('theory', "Финал главы 5", "★", `
<div class="formula-grid" style="margin-bottom:20px">
<div class="fcard highlight"><h3>Погрешности</h3>
<div class="main-f">$\\Delta x = \\Delta x_{\\text{сист}} + \\Delta x_{\\text{случ}}$</div>
<p>$\\varepsilon_x = \\dfrac{\\Delta x}{\\langle x\\rangle}\\cdot 100\\%$ · итог: $x = \\langle x\\rangle \\pm \\Delta x$</p>
</div>
<div class="fcard"><h3>Ключевые формулы 12 ЛР</h3>
<div class="main-f">$a = \\dfrac{2l}{t^2}$, $\\mu = \\dfrac{F_{\\text{тр}}}{P}$, $F_A = F_1 - F_2$</div>
<p>$k = F/x$ · $\\eta = \\dfrac{A_{\\text{пол}}}{A_{\\text{сов}}}$ · $v_0 = l\\sqrt{g/(2h)}$</p>
</div>
<div class="fcard"><h3>Проверка законов</h3>
<div class="main-f">ЗСИ · ЗСЭ · условие равновесия</div>
<p>ЛР7: $F_1 \\ell_1 = F_2 \\ell_2$ · ЛР11: $m_1 l_1 = m_1 l_1' + m_2 l_2'$ · ЛР12: $F|x| = ml^2 g/(2h)$</p>
</div>
</div>
<div class="section-title"><i class="fas fa-star"></i> Контрольные вопросы по практикуму</div>
<div class="task-card">
<div class="task-num">Вопрос 1</div>
<div class="task-text">При пяти повторных измерениях времени получены значения: $4{,}8$ · $5{,}0$ · $5{,}2$ · $4{,}9$ · $5{,}1$ с. Найдите среднее значение $\\langle t\\rangle$.</div>
<div class="task-hint">$\\langle t\\rangle = (t_1 + t_2 + t_3 + t_4 + t_5)/5$.</div>
<div class="ans-row"><input type="number" class="ans-inp" id="fin5-q1" step="any"><span class="unit-lbl">с</span>
<button class="btn btn-pri" onclick="checkNum('fin5-q1', 5.0, 'с', 0.02)">Проверить</button></div>
<div class="feedback" id="fb-fin5-q1"></div>
</div>
<div class="task-card">
<div class="task-num">Вопрос 2</div>
<div class="task-text">В ЛР2 шарик прошёл по жёлобу длину $l = 0{,}80$ м за $t = 1{,}0$ с. Найдите модуль ускорения шарика.</div>
<div class="task-hint">$a = 2l/t^2$.</div>
<div class="ans-row"><input type="number" class="ans-inp" id="fin5-q2" step="any"><span class="unit-lbl">м/с²</span>
<button class="btn btn-pri" onclick="checkNum('fin5-q2', 1.6, 'м/с²', 0.05)">Проверить</button></div>
<div class="feedback" id="fb-fin5-q2"></div>
</div>
<div class="task-card">
<div class="task-num">Вопрос 3</div>
<div class="task-text">В ЛР4 при подвешивании груза массой $m = 0{,}2$ кг пружина растянулась на $x = 4$ см. Найдите жёсткость пружины. $g = 10$ м/с².</div>
<div class="task-hint">$k = mg/x$.</div>
<div class="ans-row"><input type="number" class="ans-inp" id="fin5-q3" step="any"><span class="unit-lbl">Н/м</span>
<button class="btn btn-pri" onclick="checkNum('fin5-q3', 50, 'Н/м', 0.5)">Проверить</button></div>
<div class="feedback" id="fb-fin5-q3"></div>
</div>
<div class="task-card">
<div class="task-num">Вопрос 4</div>
<div class="task-text">В ЛР6 шарик упал на пол с высоты $h = 0{,}8$ м, пройдя по горизонтали $l = 1{,}6$ м. Найдите начальную горизонтальную скорость шарика. $g = 10$ м/с².</div>
<div class="task-hint">$v_0 = l\\sqrt{g/(2h)}$. Подставьте численно.</div>
<div class="ans-row"><input type="number" class="ans-inp" id="fin5-q4" step="any"><span class="unit-lbl">м/с</span>
<button class="btn btn-pri" onclick="checkNum('fin5-q4', 4, 'м/с', 0.1)">Проверить</button></div>
<div class="feedback" id="fb-fin5-q4"></div>
</div>
<div class="task-card">
<div class="task-num">Вопрос 5</div>
<div class="task-text">В ЛР10 цилиндр в воздухе весил $F_1 = 1{,}0$ Н, а полностью погружённый в воду — $F_2 = 0{,}6$ Н. Найдите модуль выталкивающей силы.</div>
<div class="task-hint">$F_A = F_1 - F_2$.</div>
<div class="ans-row"><input type="number" class="ans-inp" id="fin5-q5" step="any"><span class="unit-lbl">Н</span>
<button class="btn btn-pri" onclick="checkNum('fin5-q5', 0.4, 'Н', 0.02)">Проверить</button></div>
<div class="feedback" id="fb-fin5-q5"></div>
</div>
`);
html += secNav('lr12', null);
html += readButton('final5');
box.innerHTML = html;
renderMath(box);
wireReadBtn('final5');
}
/* ===== Search ===== */
const SEARCH_INDEX = (function(){
const arr=[];
PARAS.forEach(p=>arr.push({kind: p.id.startsWith('lr')?'Лабораторная':(p.final?'Финал':'Параграф'),title:p.num+' '+p.name,desc:p.sub||'',sec:p.id}));
return arr;
})();
function initSearch(){
const modal=document.getElementById('search-modal'),inp=document.getElementById('search-input'),out=document.getElementById('search-results'),btn=document.getElementById('search-btn');
if(!modal||!inp||!out) return;
let cur=0,rows=[];
function score(q,it){ const t=(it.title+' '+it.desc).toLowerCase(); if(t.includes(q)) return 100+(it.title.toLowerCase().startsWith(q)?50:0); let s=0; q.split(/\s+/).forEach(w=>{if(w&&t.includes(w))s+=10;}); return s; }
function rank(q){ q=q.trim().toLowerCase(); if(!q) return SEARCH_INDEX.slice(0,12); return SEARCH_INDEX.map(it=>({it,s:score(q,it)})).filter(x=>x.s>0).sort((a,b)=>b.s-a.s).slice(0,20).map(x=>x.it); }
function render(){ cur=0; if(!rows.length){out.innerHTML='<div class="search-empty">Ничего не найдено</div>';return;} out.innerHTML=rows.map((r,i)=>'<button class="search-row'+(i===0?' active':'')+'" data-i="'+i+'"><div class="sr-kind">'+r.kind+'</div><div class="sr-title">'+r.title+'</div>'+(r.desc?'<div class="sr-desc">'+(r.desc.length>90?r.desc.slice(0,90)+'…':r.desc)+'</div>':'')+'</button>').join(''); out.querySelectorAll('.search-row').forEach(b=>b.addEventListener('click',()=>{cur=+b.dataset.i;pick();})); }
function pick(){ const r=rows[cur]; if(!r) return; close(); goTo(r.sec); }
function move(d){ const items=out.querySelectorAll('.search-row'); if(!items.length) return; items[cur]&&items[cur].classList.remove('active'); cur=(cur+d+items.length)%items.length; items[cur].classList.add('active'); items[cur].scrollIntoView({block:'nearest'}); }
function open(){ modal.classList.add('show'); inp.value=''; rows=rank(''); render(); setTimeout(()=>inp.focus(),50); }
function close(){ modal.classList.remove('show'); }
btn&&btn.addEventListener('click',open);
modal.addEventListener('click',e=>{if(e.target===modal)close();});
inp.addEventListener('input',()=>{rows=rank(inp.value);render();});
inp.addEventListener('keydown',e=>{ if(e.key==='ArrowDown'){e.preventDefault();move(1);}else if(e.key==='ArrowUp'){e.preventDefault();move(-1);}else if(e.key==='Enter'){e.preventDefault();pick();}else if(e.key==='Escape'){e.preventDefault();close();} });
document.addEventListener('keydown',e=>{ if((e.ctrlKey||e.metaKey)&&(e.key==='k'||e.key==='K')){ e.preventDefault(); if(modal.classList.contains('show')) close(); else open(); } });
}
function initSidebarToggle(){
const side=document.getElementById('col-side'),back=document.getElementById('col-side-backdrop'),btn=document.getElementById('sidebar-btn');
if(!side||!btn) return;
function open(){ side.classList.add('open'); back.classList.add('show'); }
function close(){ side.classList.remove('open'); back.classList.remove('show'); }
btn.addEventListener('click',()=>{ if(side.classList.contains('open')) close(); else open(); });
back.addEventListener('click',close);
document.addEventListener('keydown',e=>{ if(e.key==='Escape') close(); });
}
function init(){
loadProgress(); initTheme(); initSidebarToggle(); initSearch();
buildParaSelector(); refreshProgressUI(); loadServerReadState(); goTo(PARAS[0].id);
setTimeout(()=>achievement('start'), 600);
if(window.LS&&window.LS.xp){
window.LS.xp.load().then(function(s){ if(s&&s.xp>STATE.xp){ STATE.xp=s.xp; STATE.level=calcLevel(STATE.xp); saveProgress(); refreshProgressUI(); if(STATE.current) buildSidebar(STATE.current); } });
}
}
document.addEventListener('DOMContentLoaded', init);
</script>
</body>
</html>