/* Reading tools used by the eight articles refreshed on 2026-09-14. */
.blog-page .article-tools {
  margin-block: 24px;
  padding: 20px 22px;
  border: 1px solid var(--border2);
  border-left: 4px solid var(--accent);
  border-radius: 10px;
  background: #fff0e4;
}
.blog-page .article-tools p { margin-top: 8px; }
.blog-page .article-toc {
  display: block;
  margin-block: 28px;
  padding: 0;
}
.blog-page .article-toc ul {
  margin-top: 10px;
  padding: 18px 22px 18px 40px;
}
.blog-page .article-toc a { display: inline; }
.blog-page .article-table-scroll {
  overflow-x: auto;
  margin-block: 24px;
  max-width: 100%;
  border-radius: 6px;
}
.blog-page .article-table-scroll table {
  display: table;
  width: 100%;
  min-width: 580px;
  margin-top: 0;
  overflow: visible;
  font-size: 16px;
  line-height: 1.5;
}
.blog-page .article-table-scroll caption {
  padding: 0 0 12px;
  text-align: left;
  font-weight: 700;
  color: var(--text);
}
.blog-page .article-table-scroll th,
.blog-page .article-table-scroll td { vertical-align: top; }
.blog-page .article-table-scroll:focus-visible,
.blog-page .article-tools a:focus-visible,
.blog-page .article-toc a:focus-visible {
  outline: 3px solid #9c3712;
  outline-offset: 3px;
}
.blog-page .blog-article [id] { scroll-margin-top: 100px; }
@media (max-width: 640px) {
  .blog-page .article-tools { padding: 16px; }
  .blog-page .article-toc { font-size: 15px; }
  .blog-page .article-table-scroll table { font-size: 14px; }
}
@media print {
  .blog-page .topbar, .blog-page .article-toc, .blog-page .article-tools { display: none; }
  .blog-page .article-table-scroll { overflow: visible; }
  .blog-page .article-table-scroll table { min-width: 0; font-size: 10pt; }
  .blog-page h2, .blog-page h3 { break-after: avoid; }
  .blog-page tr { break-inside: avoid; }
}

@media (max-width: 600px) {
  .blog-page .article-table-scroll::before {
    content: "Прокрутите таблицу вправо, чтобы увидеть все столбцы.";
    display: block;
    position: sticky;
    left: 0;
    width: 100%;
    margin-bottom: 10px;
    color: var(--text2);
    font-size: 12px;
    line-height: 1.5;
  }
  .blog-page .blog-article [id] { scroll-margin-top: 124px; }
}
