/********** TAGS **********/
* {
  box-sizing: border-box;

  &:target {
    padding-top: var(--ani-target-margins);
    margin-top: -var(--ani-target-margins);
  }
}

html {
  font-size: var(--ani-html-font-size);
  scroll-behavior: smooth;
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  margin: var(--ani-body-margin);
  padding: var(--ani-body-padding);
  max-width: var(--ani-body-max-width);
  line-height: var(--ani-body-line-height);
  font-size: var(--ani-body-font-size);
  font-family: var(--ani-sans-serif);
  overflow-wrap: var(--ani-body-overflow);
}

main {
  text-align: var(--ani-main-text-align);
}

article {
  margin-bottom: var(--ani-article-margin-bottom);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: var(--ani-title-margin);
  font-family: var(--ani-serif);
  text-align: var(--ani-title-text-align);
  text-transform: var(--ani-title-text-transform);
  font-size: var(--ani-title-font-size);
}

ul {
  margin: var(--ani-ul-margin);
  padding: var(--ani-ul-padding);
  list-style: var(--ani-ul-style);
}

table {
  margin: var(--ani-table-margin);
  border-collapse: var(--ani-table-border-collapse);
  text-align: var(--ani-table-text-align);
  vertical-align: var(--ani-table-vertical-align);
  font-family: var(--ani-monospace);
}

figure {
  margin: var(--ani-figure-margin);
}

img,
video {
  max-width: var(--ani-img-max-width);
  height: var(--ani-img-height);
  object-fit: var(--ani-img-object-fit);
}

code,
pre {
  overflow: var(--ani-code-overflow);
  margin: var(--ani-code-margin);
  padding: var(--ani-code-padding);
  width: var(--ani-code-width);
  font-family: var(--ani-monospace);
  text-align: var(--ani-code-text-align);
  white-space: var(--ani-code-white-space);
}

p {
  margin: var(--ani-p-margin);
}

a {
  text-decoration: var(--ani-a-text-decoration);
  outline: var(--ani-a-outline);
  color: var(--ani-a-color);
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  cursor: var(--ani-button-cursor);
}