/* ============================================================
   Оформление содержимого материалов (тело лекции, словарь, страницы).
   Эти стили подхватываются визуальным редактором Битрикса.
   ============================================================ */

.article{max-width:68ch;font-size:18px;line-height:1.72;color:var(--text)}
.article p{margin:0 0 1.05em}
.article b,.article strong{font-weight:600;color:var(--ink)}
.article h2{margin:1.9em 0 .55em;font:700 25px/1.25 var(--serif);color:var(--ink);letter-spacing:-.012em}
.article h3{margin:1.6em 0 .45em;font:700 20px/1.3 var(--serif);color:var(--ink)}
.article ul,.article ol{margin:0 0 1.05em;padding-left:1.4em}
.article li{margin-bottom:.4em}
.article a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(181,68,43,.32)}
.article a:hover{border-bottom-color:var(--accent)}
.article img{margin:1.4em 0;border-radius:2px}
.article hr{border:0;border-top:1px solid var(--rule-soft);margin:2em 0}

/* цитата / важное замечание */
.article blockquote{
  margin:1.6em 0;padding:2px 0 2px 20px;border-left:2px solid var(--accent);
  font:400 17.5px/1.6 var(--serif);color:var(--ink);
}
.article blockquote p:last-child{margin-bottom:0}

/* пояснительный абзац — класс есть в перенесённых материалах */
.article p.comment,.comment{
  padding:16px 18px;margin:1.5em 0;background:var(--surface);
  border-left:2px solid var(--rule);font-size:16px;color:var(--muted);
}

/* видеовставка — класс есть в перенесённых материалах */
.article .video,.video{margin:1.7em 0}
.article .video p,.video p{margin:0 0 .5em;font-size:14.5px;color:var(--muted)}
.article .video iframe,.video iframe{
  display:block;width:100%;max-width:680px;aspect-ratio:16/9;height:auto;border:0;background:var(--ink);
}

/* таблицы */
.article table{width:100%;border-collapse:collapse;margin:1.6em 0;font-size:16px}
.article th,.article td{padding:10px 12px;border-bottom:1px solid var(--rule-soft);text-align:left;vertical-align:top}
.article th{font-weight:600;color:var(--ink);border-bottom-color:var(--rule)}

/* ---------- Словарь терминов ---------- */
.glossary{margin:0;max-width:74ch}
.glossary__item{padding:15px 0;border-bottom:1px solid var(--rule-soft)}
.glossary__term{margin:0 0 4px;font:700 18px/1.35 var(--serif);color:var(--ink)}
.glossary__def{margin:0;font-size:16.5px;line-height:1.6;color:var(--text)}
.glossary__source{display:inline-block;margin-top:6px;font-size:13.5px;color:var(--muted);text-decoration:none}
.glossary__source:hover{color:var(--accent)}

/* ---------- Заглушка для пустого раздела ---------- */
.empty{
  padding:28px 0;font-size:16.5px;color:var(--muted);max-width:56ch;
}
.empty a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(181,68,43,.32)}

/* ---------- Четыре режима показа теории ---------- */
/* Слои: t-th теория, t-ex объяснение, t-eg пример. По умолчанию (m-plain) всё видно одинаково. */
/* теория заметно плотнее и темнее, объяснение — светлее основного текста: различие сразу видно */
.article.m-study .t-th,
.article.m-repeat .t-th,
.article.m-fix .t-th{font-weight:600;color:var(--ink)}
.article.m-study .t-ex,
.article.m-repeat .t-ex{font-weight:400;color:#586471}
.article.m-study .t-eg{font-style:italic;color:var(--muted)}
.article.m-repeat .t-eg{display:none}
.article.m-fix .t-ex,.article.m-fix .t-eg{display:none}
.article.m-fix p:not(:has(.t-th)){display:none}

.modes{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 22px;padding:0;border:0}
.modes__legend{padding:0;margin-right:6px;font-size:13.5px;color:var(--muted)}
.modes__item{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border:1px solid var(--rule);border-radius:3px;font-size:14px;color:var(--text);cursor:pointer;background:var(--surface)}
.modes__item:hover{border-color:var(--ink)}
.modes__item:has(input:checked){border-color:var(--accent);color:var(--accent)}
.modes__item input{margin:0}
@media print{.modes{display:none}}