﻿html {
  position: relative;
  min-height: 100%;
}

body {
  font-family: "Inter", sans-serif;
  color: #222222;
}

code {
  font-family: "JetBrains Mono", monospace;
  font-variant-ligatures: none;
  border-radius: 5px;
  line-height: initial;
}

img {
  width: 100%;
  height: auto;
}

blockquote {
  border-left: 2px solid #8b6cef;
  padding: 0 0 0 16px;
  margin-inline-start: 0;
  margin-inline-end: 0;
}

a {
  color: #9275f0;
  outline: none;
  text-decoration-line: underline;
  text-decoration-thickness: auto;
}

a:hover {
  color: #a48cf2;
}

h1 .header-anchor,
h2 .header-anchor,
h3 .header-anchor,
h4 .header-anchor,
h5 .header-anchor,
h6 .header-anchor {
  visibility: hidden;
}

h1:hover .header-anchor,
h2:hover .header-anchor,
h3:hover .header-anchor,
h4:hover .header-anchor,
h5:hover .header-anchor,
h6:hover .header-anchor {
  visibility: visible;
}

.hljs {
  background-color: #fafafa;
}

.content {
  max-width: 700px;
  margin: 40px auto 80px;
  line-height: 1.5;
}

.center-message {
  position: absolute;
  text-align: center;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -60%);
}

#footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 40px;
  margin-top: 40px;
  text-align: center;
}

input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 4px;
  border: 1px solid #5c5c5c;
  flex-shrink: 0;
  padding: 0;
  margin: 0;
  margin-inline-end: 6px;
  width: 16px;
  height: 16px;
  position: relative;
  transition: box-shadow 0.15s ease-in-out;
}

input[type="checkbox"]:hover,
input[type="checkbox"]:active,
input[type="checkbox"]:focus {
  outline: 0;
  border-color: #ababab;
}

input[type="checkbox"]:checked {
  background-color: #9275f0;
  border-color: #9275f0;
}

input[type="checkbox"]:checked:hover {
  background-color: #a48cf2;
  border-color: #a48cf2;
}

input[type="checkbox"]:checked:after {
  content: "";
  top: -1px;
  left: -1px;
  position: absolute;
  width: 16px;
  height: 16px;
  display: block;
  background-color: #ffffff;
  -webkit-mask-position: 52% 52%;
  -webkit-mask-size: 65%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-image: url('data:image/svg+xml; utf8, <svg width="12px" height="10px" viewBox="0 0 12 8" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"><g transform="translate(-4.000000, -6.000000)" fill="%23000000"><path d="M8.1043257,14.0367999 L4.52468714,10.5420499 C4.32525014,10.3497722 4.32525014,10.0368095 4.52468714,9.8424863 L5.24777413,9.1439454 C5.44721114,8.95166768 5.77142411,8.95166768 5.97086112,9.1439454 L8.46638057,11.5903727 L14.0291389,6.1442083 C14.2285759,5.95193057 14.5527889,5.95193057 14.7522259,6.1442083 L15.4753129,6.84377194 C15.6747499,7.03604967 15.6747499,7.35003511 15.4753129,7.54129009 L8.82741268,14.0367999 C8.62797568,14.2290777 8.3037627,14.2290777 8.1043257,14.0367999"></path></g></g></svg>');
}

@media (prefers-color-scheme: dark) {
  body {
    color: #dadada;
    background-color: #1e1e1e;
  }

  .hljs {
    background-color: #242424;
  }

  input[type="checkbox"]:checked:after {
    background-color: #1e1e1e;
  }
}

@media print {
  #footer {
    position: relative;
  }
}
