/* Reset and base styles  */
* {
    padding: 0px;
    margin: 0px;
    border: none;
}

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

/* Links */

a,
a:link,
a:visited {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

/* Common */

aside,
nav,
footer,
header,
section,
main {
    display: block;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
    font-size: inherit;
    font-weight: inherit;
}

ul,
ul li {
    list-style: none;
}

img {
    vertical-align: top;
}

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

address {
    font-style: normal;
}

/* Form */

input,
textarea,
button,
select {
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
}

input::-ms-clear {
    display: none;
}

textarea {
    resize: vertical;
}

button,
input[type="submit"] {
    display: inline-block;
    box-shadow: none;
    background-color: transparent;
    background: none;
    cursor: pointer;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

label {
    cursor: pointer;
}

legend {
    display: block;
}

input[type='file'] {
    max-width: 100%;
}
/* =========================================================
   МЕЖБРАУЗЕРНАЯ НОРМАЛИЗАЦИЯ

   Всё в этом блоке подобрано так, чтобы НЕ менять картинку в
   десктопном Chrome (он взят за эталон), а подтянуть к нему
   остальные браузеры. Каждое правило — про конкретное
   расхождение, а не «на всякий случай».
   ========================================================= */

/* Текст не должен самопроизвольно увеличиваться при повороте экрана.
   iOS Safari и мобильный Chrome по умолчанию раздувают шрифт в
   альбомной ориентации — из-за этого блок текста внезапно становится
   крупнее и ломает раскладку. В десктопном Chrome правило ничего не
   делает. */
html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Синяя вспышка-подсветка при тапе в мобильных браузерах на WebKit.
   В десктопном Chrome не проявляется вообще. */
a,
button,
summary,
label,
input,
textarea,
[onclick] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/* Маркер у <details>. ::-webkit-details-marker понимает только WebKit,
   а Firefox рисует свой треугольник через ::marker — без этой строки
   он остаётся видимым рядом с нашим собственным плюсом.
   list-style здесь дублирует правило из main.css намеренно: оно должно
   действовать на любой <details>, даже если его добавят позже. */
summary {
    list-style: none;
}

summary::-webkit-details-marker {
    display: none;
}

summary::marker {
    content: "";
}

/* Firefox рисует пунктирную рамку вокруг раскрытого <summary> при
   фокусе с клавиатуры, WebKit — нет. Убираем её, но оставляем
   видимый фокус там, где он действительно нужен (:focus-visible). */
summary:focus {
    outline: none;
}

summary:focus-visible {
    outline: 2px solid #5D3A99;
    outline-offset: 2px;
}

/* Поля ввода: iOS Safari принудительно скругляет углы и рисует
   внутреннюю тень у input и textarea, из-за чего они выглядят иначе,
   чем в Chrome. Сбрасываем только эти два эффекта — размеры, цвета и
   скругления, заданные в main.css, не трогаем. */
input,
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-clip: padding-box;
}

/* Плейсхолдер: Firefox по умолчанию делает его полупрозрачным
   (opacity 0.54), WebKit — нет. Из-за этого один и тот же серый
   текст выглядит заметно бледнее. */
::-moz-placeholder {
    opacity: 1;
}

/* Толщина рамки у полей в Firefox отличается от WebKit. */
input,
textarea,
select,
button {
    -moz-osx-font-smoothing: inherit;
}