@font-face {
  font-family: "font";
  src: url("./unifont.ttf");
  font-display: optional;
}
* {
  font-family: Unifont, font, monospace !important;
  font-size: 16px;
  font-smooth: never !important;
  -webkit-font-smoothing: none !important;
}
body,
html {
  background-color: #131313;
  color: #efefef;
  margin: 0;
  padding: 0;
  border: 0;
}
p {
  margin: 1px;
}
abbr,
code {
  background-color: #363636;
}
pre {
  line-height: 16px;
}
img.emoji {
  max-width: 30px;
  max-height: 20px;
  width: auto;
  height: auto;
}
a {
  color: #a1d5e6;
  text-decoration: none;
}
a:visited {
  color: #82b5d9;
}
.link-dead { opacity: 0.5; }
.link-dead::before {
  content: "[?]";
}
ul {
  list-style-type: none;
}

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

.block {
  box-sizing: border-box;
  padding-bottom: 8px;
}
@media (min-width: 800px) {
  body {
    display: flex;
    flex-direction: column;
  }
  body > .block {
    margin: 0 auto;
    border-width: 0 0 0 1px;
    border-style: solid;
    border-color: #262626;
    width: 800px;
  }
  body > hr {
    width: 600px;
  }
}
h1 {
  font-size: 32px;
  padding: 8px 0;
}
h2 {
  font-size: 24px;
  padding: 4px 0;
}
h3 {
  font-size: 16px;
  padding: 2px 0;
}
h4 {
  font-size: 12px;
  padding: 1px 0;
}
h1, h2, h3, h4 {
  text-decoration: none;
  color: #efefef;
  background: #262626;
  box-sizing: border-box;
  margin: 1px 0 0;
}
h1::before, h2::before, h3::before, h4::before {
  content: "# ";
}
.spoiler {
  background: #363636;
  color: #363636;
  cursor: pointer;
  text-decoration: line-through;
}
.spoiler * { opacity: 0; }
.spoiler:hover { color: #787878; }
.spoiler:hover * { opacity: 0.3; }
.spoiler-ctrl { display: none; }
.spoiler-ctrl:checked ~ .spoiler { color: #efefef; text-decoration: none; }
.spoiler-ctrl:checked ~ .spoiler * { opacity: 1; }

details {
  border-width: 1px 0 1px 1px;
  border-style: solid;
  border-color: #262626;
}
pre {
  margin-left: 8px;
  border: 1px solid #262626;
  width: auto;
  display: inline-block;
  padding: 1px;
}
pre.terminal::before,
pre[data-title]::before {
  content: "st";
  background: #262626;
  display: block;
  padding: 1px 0 2px 1px;
}
pre[data-title]::before {
  content: attr(data-title);
}
details > summary {
  list-style-type: "[>] ";
  cursor: pointer;
}
details[open] > summary {
  list-style-type: "[V] ";
}
.pfp {
  width: 20px;
  height: 20px;
  object-fit: contain;
}
.f0 { color: #363636; }
.f1 { color: #8c3f52; }
.f2 { color: #6da18a; }
.f3 { color: #b39374; }
.f4 { color: #546799; }
.f5 { color: #433057; }
.f6 { color: #597080; }
.f7 { color: #a3a3a3; }
.f8 { color: #888888; }
.f9 { color: #bf6979; }
.fa { color: #86bf8f; }
.fb { color: #f0ebc0; }
.fc { color: #6699cc; }
.fd { color: #66294c; }
.fe { color: #a1d5e6; }
.ff { color: #dadada; }
.b0 { background: #363636; }
.b1 { background: #8c3f52; }
.b2 { background: #6da18a; }
.b3 { background: #b39374; }
.b4 { background: #546799; }
.b5 { background: #433057; }
.b6 { background: #597080; }
.b7 { background: #a3a3a3; }
.b8 { background: #888888; }
.b9 { background: #bf6979; }
.ba { background: #86bf8f; }
.bb { background: #f0ebc0; }
.bc { background: #6699cc; }
.bd { background: #66294c; }
.be { background: #a1d5e6; }
.bf { background: #dadada; }
