*,
*:after,
*:before {
   box-sizing: border-box;
}

html, body {
   height: 100%;

   margin: 0;

   background-color: #353535;

   /* overscroll-behavior здесь НЕ задаём. Ставили none, чтобы убрать рывок у
      подвала на планшете, но вместе с ним пропадает и обновление страницы
      вытягиванием сверху – на телефоне это привычный жест. Рывок оказался не в
      резиновой прокрутке, а в восстановлении позиции браузером и в поздних
      пересчётах раскладки (см. script.js), и лечится там. */
}

/* Место под вертикальный скроллбар зарезервировано всегда: страница одной
   вкладки/длины со скроллбаром, другой – без, и центрированный макет прыгал
   по горизонтали на ширину скроллбара (при классических, не overlay,
   скроллбарах). both-edges – резерв с обеих сторон, иначе страница без
   скролла асимметрична (справа лишние 15px); без поддержки both-edges
   браузер остаётся на первой строке. На overlay-скроллбарах оба правила
   ничего не меняют */
html {
   scrollbar-gutter: stable;
   scrollbar-gutter: stable both-edges;
}

h1, h2, h3, h4, h5, h6, p {
   margin: 0;
}

/* Атрибут hidden должен прятать элемент всегда. Браузер даёт ему display: none,
   но любое правило с классом (например, display: flex у пунктов меню) это
   перебивает – из-за чего пункт «Управление» показывался обычным пользователям.
   Правило общее, чтобы такая же дырка не завелась в другом месте */
[hidden] {
   display: none !important;
}