:root {
  background-color: #231e39;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url(./assets/inter-latin-400-normal.woff2) format("woff2"), ;
}

body {
  margin: 40px auto;
  max-width: 650px;
  line-height: 1.6;
  font-size: 18px;
  padding: 0 10px;
  font-family:
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Helvetica,
    Arial,
    sans-serif,
    "Apple Color Emoji",
    "Segoe UI Emoji";
}

.smallbar {
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Helvetica,
    Arial,
    sans-serif,
    "Apple Color Emoji",
    "Segoe UI Emoji";
}

#domains {
  font-size: 14px;
  background-color: #f1f1f1;
  white-space: pre-wrap;
}

a {
  color: #07a;
  text-decoration: none;
}
a:hover {
  color: #4882e0;
}

h1,
h2,
h3 {
  line-height: 1.2;
}

.hazel,
h1 {
  color: #ffd1dc;
}

ul {
  list-style-type: none;
  margin-top: 0px;
}

p {
  margin-bottom: 9px;
}

li::before {
  content: "- ";
}

ul.socials li::before {
  content: none;
}

ul.socials li {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 4px;
}

.socials .social-icon {
  width: 16px;
  height: 16px;
}

.ts a:hover {
  color: #ffff;
}

@media (prefers-color-scheme: dark) {
  body,
  input,
  textarea {
    background-color: #231e39;
    color: white;
  }

  input,
  textarea {
    border-radius: 1px;
    border-color: #75374a;
  }

  #domains {
    background-color: #2b2b2b;
    word-wrap: break-word;
  }

  a {
    color: #3391ff;
  }

  .socials .icon-invert {
    filter: invert(1);
  }
}

#turnstile {
  width: 300px;
  height: 72.9px;
}

hr {
  border-color: #ffd1dc;
  border-style: solid;
}