/* Общие правила под любые экраны: телефоны, планшеты, десктоп, тёмная тема.
   Подключается на каждой странице сайта после её собственных стилей, поэтому
   здесь — только то, что касается всех сразу. Частности (сетки, отступы,
   размеры конкретных блоков) живут в самих страницах.

   Зачем: сайт открывают в основном с телефона, в том числе внутри Telegram,
   где высота окна прыгает вместе с панелью браузера, а по кнопкам попадают
   пальцем, а не курсором. */

html {
  /* Safari на айфоне сам увеличивает текст в альбомной ориентации. */
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Длинные ссылки, юзернеймы и слова без пробелов не должны растягивать
   страницу вширь: на телефоне это даёт горизонтальную прокрутку. */
body {
  overflow-wrap: break-word;
}

img, video, svg, canvas, iframe {
  max-width: 100%;
}
img, video {
  height: auto;
}

/* Вырез и «домашняя полоска» на телефонах: в альбомной ориентации контент
   иначе уезжает под скруглённый угол экрана. */
@supports (padding: max(0px)) {
  body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }
}

/* ── Сенсорные экраны ─────────────────────────────────────────────────────
   Палец попадает в цель от ~44px. Правила висят на pointer: coarse, чтобы
   на десктопе с мышью ничего не раздувалось. */
@media (pointer: coarse) {
  button,
  select,
  textarea,
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  .btn,
  .nav a,
  .toc-item,
  .page-tab,
  .source-btn,
  .action-btn {
    min-height: 44px;
  }

  input[type="checkbox"],
  input[type="radio"] {
    min-width: 22px;
    min-height: 22px;
  }

  /* iOS увеличивает всю страницу, когда фокусируется поле со шрифтом
     меньше 16px, и обратно уже не возвращает. */
  input,
  select,
  textarea {
    font-size: max(16px, 1em);
  }
}

/* Кому анимации мешают (системная настройка «уменьшить движение»). */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}