.btn {
  border-radius: 4px;
  color: #1a171b;
  display: inline-block;
  font-family: "Helvetica Neue",Helvetica,sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 22px;
  padding: 5px 7px 3px;
  position: relative;
  text-decoration: none;
}
.btn > span {
  margin-left: 19px;
}
.btn > svg {
  position: absolute;
  left: 7px;
  top: 7px;
}
.liberapay {background-color: #f6c915;}
.paypal {background-color: #60cdff;}
.grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-areas: "list screenshot";
}
.list {grid-area: list;}
.screenshot {
  grid-area: screenshot;
  justify-self: center;
  text-align: center;
  filter: var(--img-filter);
}
.screenshot img {
  width: 100%;
}
ul {
  list-style-type: disc;
  margin-top: 0.3em;
  margin-bottom: 0;
  margin-left: 1.6em;
  margin-right: 0;
  padding: 0;
}
li {
  break-inside: avoid;
  margin-bottom: 0.1em;
}
a:where(:not([role='button'])) {
  color: light-dark(#36c, #88a3e8);
  text-decoration:none
}
a:where(:not([role='button'])):visited {
  color: light-dark(#6a60b0, #a799cd)
}
a:where(:not([role='button'])):visited:hover {
  color: light-dark(#534fa3, #c5b9dd)
}
a:where(:not([role='button'])):visited:active {
  color: light-dark(#353262, #d9d0e9)
}
a:where(:not([role='button'])):hover {
  color: light-dark(#3056a9, #a6bbf5);
  text-decoration:underline
}
a:where(:not([role='button'])):active {
  color: light-dark(#233566, #b6d4fb);
  text-decoration:underline
}
a:where(:not([role='button'])):focus-visible {
  outline:solid 2px #36c
}
select {
  cursor: pointer;
}
p {
  margin: 0.5em 0 1em 0;
}
h1, h2 {
  margin: 0 0 0.25em 0;
}

@media (width < 600px) {
  .grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "screenshot"
      "list";
  }
  .screenshot img {
    width: 90%;
  }
}
.files {display: none;}
.active {display: grid;}
.active-option {display: inherit;}

:root {
  color-scheme: light dark;
  --img-filter: none;
}
body {
  background-color: light-dark(#ffffff, #101418);
  color: light-dark(#202122, #eaecf0)
}
@media (prefers-color-scheme: dark) {
  :root {
    --img-filter: invert(1);
  }
}
