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

  html {
    font-size: var(--cds-base-unit);
    box-sizing: border-box;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
    word-break: normal;
    tab-size: 4;
  }

  body {
    font-family: var(--cds-font-family), Arial, sans-serif;
    font-size: var(--cds-font-size-200);
    line-height: var(--cds-font-line-height-300);
    letter-spacing: 0;
    scroll-behavior: smooth;
    text-rendering: optimizeSpeed;
  }

  body,
  h1,
  h2,
  h3,
  h4,
  p,
  ul,
  ol,
  li,
  figure,
  figcaption,
  blockquote,
  dl,
  dd {
    margin: 0;
  }

  ol, ul {
    padding: 0;
    list-style: none;
  }

  blockquote, q {
    quotes: none;

    &:before,
    &:after {
      content: none;
    }
  }

  a:not([class]) {
    text-decoration-skip-ink: auto;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
  }

  img {
    max-width: 100%;
    display: block;
  }

  input,
  button,
  textarea,
  select {
    font-family: inherit;
  }

  /**
    Если пользователь отключил анимацию в ОС
    @see https://developer.mozilla.org/ru/docs/Web/CSS/@media/prefers-reduced-motion
   */
  @media (prefers-reduced-motion: reduce) {
    * {
      animation-duration: 0.01ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 0.01ms !important;
      scroll-behavior: auto !important;
    }
  }

  /**
    Internet Explorer 11 :|
   */
  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    details, summary, main {
      display: block;
    }

    template {
      display: none;
    }

    svg:not(:root) {
      overflow: hidden;
    }

    button {
      overflow: visible;
    }

    textarea {
      overflow: auto;
    }

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