.blog-date {
  font-size: 16px;
}

.blog-entries {
  padding: 10px 0;
}

strong,
.emphasis {
  display: inline;
  color: #fff;
}

.blog-entry {
  display: flex;
  font-size: 16px;
  padding: 2px 0;
}
.blog-entry .link {
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 20px;
}

.blog-entry-date {
  flex-shrink: 0;
  padding-right: 8px;
}

code {
  background: rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  color: #fafafa;
  padding: 0 8px;
}

pre {
  background: rgba(0, 0, 0, 0.25);
  border-radius: 4px;
  color: #fafafa;
  font-size: 16px;
  overflow-x: auto;
  padding: 12px;
}
pre code {
  background: initial;
  padding: 0;
}

blockquote {
  border-left: 2px solid #dadce0;
  color: #dadce0;
  font-family: Garamond;
  font-size: 16px;
  line-height: 20px;
  padding: 6px 12px;
  margin: 0;
}
blockquote p {
  padding: 0;
}

.ac-quote {
  background: #010309;
  border-left: 2px solid #3b5489;
  color: #86bc4c;
  font-family: "IBM Plex Mono";
  font-size: 14px;
  line-height: 20px;
  margin-bottom: 8px;
  margin: 20px 0;
  padding: 6px 12px;
}
.ac-quote .attribution {
  padding-top: 20px;
}

.book {
  color: #fff;
  margin: 10px 0;
}

.author {
  color: #9a8585;
}

.tag {
  font-size: 12px;
  padding: 0 4px;
  white-space: nowrap;
}
.tag.year, .tag.chem {
  color: #cbbc87;
  background: rgba(209, 17, 17, 0.53);
}
.tag.fantasy, .tag.math {
  color: #abcb87;
  background: rgba(114, 209, 17, 0.53);
}
.tag.scifi, .tag.cs {
  color: #87c3cb;
  background: rgba(17, 122, 209, 0.53);
}
.tag.murderbot, .tag.eng {
  color: #c89fe4;
  background: rgba(141, 43, 226, 0.53);
}
.tag.discworld, .tag.phys {
  color: #d9e49f;
  background: rgba(221, 224, 136, 0.53);
}
.tag.expanse, .tag.mech {
  color: #e4bb9f;
  background: rgba(226, 118, 43, 0.53);
}
.tag.asoiaf {
  color: #c74479;
  background: rgba(79, 63, 226, 0.53);
}
.tag.other {
  color: #e7e8eb;
  background: rgba(137, 137, 171, 0.53);
}

@font-face {
  font-family: "IBM Plex Mono";
  src: url("/fonts/ibmplexmono.woff2") format("woff2");
}
@font-face {
  font-family: MarvinVisions;
  src: url("/fonts/MarvinVisionsBig-Bold.woff2") format("woff2");
}
html,
code {
  font-family: "IBM Plex Mono";
}

.title,
.tagline,
.name {
  font-family: MarvinVisions;
}

.whoami-theme .title,
.misc-theme .title,
.name {
  font-size: 40px;
  letter-spacing: 2px;
}

.tagline {
  letter-spacing: 1px;
}

.bad-kerning {
  letter-spacing: 4px;
}

.map {
  background: rgba(0, 0, 0, 0.7);
  border: 1px solid #444;
  cursor: w-resize;
  height: 175px;
  overflow: hidden;
  position: fixed;
  right: -155px;
  top: 5px;
  width: 175px;
  transition: transform 0.3s ease-in-out;
  transform: translate3d(0, 0, 0);
}

.map:hover {
  background: rgba(0, 0, 0, 0.8);
}

.map.visible {
  cursor: e-resize;
  transform: translate3d(-160px, 0, 0);
}

.map-home {
  border: 1px solid #888;
  height: 25px;
  left: 74px;
  position: absolute;
  top: 74px;
  width: 25px;
  z-index: 2;
}

.map-slider {
  position: relative;
  transition: left 0.3s ease-in-out, top 0.3s ease-in-out;
}

.map-panel {
  border: 1px dotted #cdcdcd;
  box-sizing: border-box;
  position: absolute;
  width: 25px;
  height: 25px;
  z-index: 1;
}

.pokemon-section {
  display: flex;
  flex-wrap: wrap;
  row-gap: 12px;
}

.pokemon {
  width: 250px;
}

.pokemon .mon-name {
  color: #fff;
}

.pokemon .detail {
  color: #9a8585;
}

.pokemon .type {
  border-radius: 4px;
  color: #fff;
  font-size: 14px;
  padding: 0 8px;
}

.pokemon .bug {
  background: #729f3f;
}

.pokemon .dragon {
  background: #7038f8;
}

.pokemon .electric {
  background: #eed535;
  color: #000;
}

.pokemon .fairy {
  background: #fdb9e9;
  color: #000;
}

.pokemon .fighting {
  background: #d56723;
}

.pokemon .fire {
  background: #fd7d24;
  color: #000;
}

.pokemon .ghost {
  background: #7b62a3;
}

.pokemon .ground {
  background: #e0c068;
  color: #000;
}

.pokemon .psychic {
  background: #f366b9;
}

.pokemon .rock {
  background: #a38c21;
}

.pokemon .steel {
  background: #9eb7b8;
  color: #000;
}

.pokemon .water {
  background: #4592c4;
}

.home-theme,
.home-minimap-bg {
  background: #222;
  color: #fafafa;
}

.blog-theme,
.canvas-theme,
.misc-theme,
.whoami-theme {
  background-size: 100% 100%, 16px 16px, 16px 16px;
  color: #ffffff;
}
.blog-theme .title,
.canvas-theme .title,
.misc-theme .title,
.whoami-theme .title {
  padding-top: 20px;
}
.blog-theme .section-title,
.canvas-theme .section-title,
.misc-theme .section-title,
.whoami-theme .section-title {
  color: #fff;
}
.blog-theme p,
.blog-theme .section,
.canvas-theme p,
.canvas-theme .section,
.misc-theme p,
.misc-theme .section,
.whoami-theme p,
.whoami-theme .section {
  color: #dadce0;
  padding-bottom: 20px;
}
.blog-theme ol, .blog-theme ul,
.canvas-theme ol,
.canvas-theme ul,
.misc-theme ol,
.misc-theme ul,
.whoami-theme ol,
.whoami-theme ul {
  color: #dadce0;
}
.blog-theme blockquote p,
.blog-theme ul p,
.blog-theme ol p,
.canvas-theme blockquote p,
.canvas-theme ul p,
.canvas-theme ol p,
.misc-theme blockquote p,
.misc-theme ul p,
.misc-theme ol p,
.whoami-theme blockquote p,
.whoami-theme ul p,
.whoami-theme ol p {
  padding-bottom: 0;
}
.blog-theme .section-content,
.canvas-theme .section-content,
.misc-theme .section-content,
.whoami-theme .section-content {
  padding-bottom: 4px;
}
.blog-theme .link,
.canvas-theme .link,
.misc-theme .link,
.whoami-theme .link {
  background-color: #fafafa;
  color: #222;
  display: inline-block;
}
.blog-theme .link:hover,
.canvas-theme .link:hover,
.misc-theme .link:hover,
.whoami-theme .link:hover {
  background-color: #dadada;
}

.blog-theme {
  background-image: radial-gradient(circle at bottom right, hsl(0, 54%, 13%) 0%, hsl(0, 54%, 13%) 10%, transparent 80%), linear-gradient(to right, #2f2f2f 1px, transparent 1px), linear-gradient(to bottom, #2f2f2f 1px, transparent 1px);
}

.misc-theme {
  background-image: radial-gradient(circle at top right, hsl(180, 54%, 13%) 0%, hsl(180, 54%, 13%) 10%, transparent 80%), linear-gradient(to right, #2f2f2f 1px, transparent 1px), linear-gradient(to bottom, #2f2f2f 1px, transparent 1px);
}

.whoami-theme {
  background-image: radial-gradient(circle at top left, hsl(300, 54%, 13%) 0%, hsl(300, 54%, 13%) 10%, transparent 80%), linear-gradient(to right, #2f2f2f 1px, transparent 1px), linear-gradient(to bottom, #2f2f2f 1px, transparent 1px);
}

.canvas-theme {
  background-image: radial-gradient(circle at bottom left, transparent 0%, transparent 10%, transparent 80%), linear-gradient(to right, #2f2f2f 1px, transparent 1px), linear-gradient(to bottom, #2f2f2f 1px, transparent 1px);
}

.blog-minimap-bg {
  background-color: hsl(0, 54%, 13%);
}

.misc-minimap-bg {
  background-color: hsl(180, 54%, 13%);
}

.whoami-minimap-bg {
  background-color: hsl(300, 54%, 13%);
}

.canvas-minimap-bg {
  background-color: hsl(210, 54%, 13%);
}

html,
body {
  overscroll-behavior: none;
}

body {
  background: #242424;
  overflow: hidden;
  margin: 0;
  position: fixed;
}

html,
body,
#panel-matrix,
.panel {
  height: 100%;
  width: 100%;
}

#panel-matrix {
  position: relative;
  transition: transform 0.25s ease-in-out;
}

.panel {
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 20px;
  position: absolute;
}
.panel::-webkit-scrollbar {
  width: 10px;
}
.panel::-webkit-scrollbar-track {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}
.panel::-webkit-scrollbar-thumb {
  background-color: #dadce0;
}

.home-panel {
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.home-panel .links {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  padding: 20px 0 40px;
  margin-left: -8px;
}

.home-panel .link {
  background-color: #fafafa;
  color: #222;
  margin: 8px;
}
.home-panel .link:hover {
  background-color: #dadada;
}

.panel-content {
  max-width: 800px;
}

.tagline {
  color: #fafafa;
  font-size: 20px;
}

.name {
  color: #ffc556;
}

.link {
  background-color: rgba(0, 0, 0, 0.2);
  cursor: pointer;
  padding: 0 12px;
  white-space: nowrap;
}
.link:hover {
  background-color: rgba(0, 0, 0, 0.4);
  text-decoration: none;
}

.nav-section {
  margin-top: 20px;
}

.nav-link {
  font-size: 20px;
}

.backlinks {
  display: flex;
  font-size: 13px;
  gap: 8px;
  padding: 34px 0 24px;
}
.backlinks .backlinks-title {
  flex-shrink: 0;
}
.backlinks .backlinks-content {
  display: flex;
  flex-grow: 1;
  flex-wrap: wrap;
  gap: 8px;
}

.title {
  font-size: 34px;
}

.subtitle {
  font-size: 16px;
}

ol,
ul {
  padding-bottom: 20px;
  padding-top: 12px;
  line-height: 22px;
}

p,
.section {
  font-size: 16px;
  line-height: 22px;
  margin: 0;
  padding: 12px 0;
}

ol p,
ul p {
  padding: 0;
}

.note-section {
  background: rgba(255, 255, 255, 0.1333333333);
  display: inline-block;
  padding: 12px;
  margin: 12px 0;
}

h1 {
  font-size: 22px;
  margin: 0;
  padding-top: 30px;
}

a:link,
a:visited,
a:hover,
a:focus {
  color: #8cb6ff;
}

a {
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

ol,
ul {
  margin: 0;
}

.loot {
  padding: 0 8px;
}
.loot.new-item {
  background: #4791ff;
  cursor: grab;
  color: #fff;
}
.loot.new-item:hover {
  background: #62a1ff;
  color: #fff;
}
.loot.owned-item {
  background: #e4edff;
  color: #000;
  cursor: not-allowed;
}

.block,
.long-block,
.square-block {
  margin: 12px 0;
}

.block {
  height: 100px;
  width: 162px;
}

.long-block {
  height: 30px;
  width: 100%;
}

.square-block {
  height: 200px;
  position: relative;
  width: 200px;
}

.square-block::before {
  bottom: 0;
  content: "";
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.hsl-block {
  background: linear-gradient(to right, #808080, #00f);
}

.hsl-block::before {
  background: linear-gradient(to bottom, #fff, #000);
  -webkit-mask: linear-gradient(to bottom, #fff, transparent, #fff);
  mask: linear-gradient(to bottom, #fff, transparent, #fff);
}

.hwb-block {
  background: linear-gradient(to right, #00f, #000);
}

.hwb-block::before {
  background: linear-gradient(to right, #fff, #808080);
  -webkit-mask: linear-gradient(to bottom, transparent, #fff);
  mask: linear-gradient(to bottom, transparent, #fff);
}

.named-color {
  border-radius: 4px;
  color: #fff;
  font-size: 16px;
  padding: 0 8px;
}

.secondary-text {
  color: #646464;
}

.secondary-text a {
  color: #556f9c;
}

.hieroglyphs {
  word-wrap: break-word;
  font-size: 36px;
}

.unicode-bird {
  align-items: center;
  display: flex;
}

.unicode-char {
  font-size: 60px;
  line-height: 60px;
  padding-right: 8px;
}

.feed-header:not(:first-child) {
  margin-top: 20px;
}

.feed {
  border-left: 2px dotted #fff;
  margin: 8px 0;
  padding-left: 10px;
}

.footnote {
  font-size: 12px;
}

.chromostereopsis-demo {
  background-color: red;
  background-size: 64px 64px;
  background-image: linear-gradient(to right, #222 0px, #222 32px, transparent 33px), linear-gradient(to bottom, #222 0px, #222 32px, transparent 33px), linear-gradient(to right, blue 16px, blue 48px, transparent 49px);
  width: 100%;
  height: 288px;
}

.canvas-panel {
  overflow: hidden;
  padding: 0;
}

.chalkboard {
  cursor: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 127 107" fill="none"><path d="M43.8443 100.381C43.2583 99.2059 40.3106 95.8586 36.509 92.2065C33.1541 88.9835 29.7569 85.8968 26.346 82.733C22.9273 79.5621 18.6112 75.4437 13.3299 70.8868C12.4984 70.1694 11.7924 71.5227 11.4432 72.4997C10.0299 76.4535 9.91016 80.8695 9.12292 84.7705C8.29759 88.8603 6.26401 92.5579 4.44093 96.6532C3.55981 98.6325 2.21831 100.456 1.2831 102.497C0.834299 103.477 0.445547 104.346 4.05261 104.793C24.4215 107.317 30.7854 104.946 36.5945 104.595C41.1281 104.322 46.3776 102.981 50.3824 99.234C55.093 94.8267 60.3043 89.284 65.2806 84.929C70.2487 80.5812 73.6582 77.5287 81.1942 70.2926C86.1364 65.5472 90.6062 62.435 93.8746 59.3749C97.3446 56.1258 100.641 53.1598 103.664 50.3483C107.902 46.4059 111.745 42.8014 114.865 40.0875C118.087 37.2863 120.803 34.5147 123.924 31.8008C124.738 31.0925 125.478 30.2767 125.63 29.4347C126.301 25.6999 119.863 23.665 116.852 20.8993C113.893 18.1819 110.789 14.9877 108.12 11.6774C105.199 8.05515 101.911 5.01992 98.9956 2.30306C98.2759 1.63224 97.4715 1.07189 96.5807 1.00923C92.7011 0.736362 89.9779 6.66925 86.7639 10.4753C83.2903 14.5886 80.2055 17.5861 76.6572 20.9962C73.6773 23.86 70.0521 25.6745 66.5451 27.9157C63.1968 30.0555 60.3803 32.781 56.78 35.5116C53.2377 38.1984 49.9272 41.1556 46.3225 43.9857C42.7466 46.7931 39.4682 48.9517 36.0618 51.5349C32.8093 54.0012 29.4058 56.2569 26.1961 58.6457C22.6906 61.3267 19.3433 63.8543 15.7401 67.019C14.8951 67.8518 14.2115 68.6232 12.3233 70.5868" stroke="white" stroke-width="8" stroke-linecap="round"/></svg>') 0 31, auto;
}

.chalkboard.dragging {
  cursor: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 115 102" fill="none"><path d="M29.5559 100.327C29.5559 99.6547 29.6339 96.3998 29.4162 94.1106C29.2577 92.4446 28.2812 90.9215 27.7415 89.3042C27.1301 87.472 26.3665 85.5773 25.5887 83.8397C24.5201 81.4526 21.544 79.5102 20.2056 78.4524C18.8613 77.39 17.4754 76.399 15.7594 74.805C14.3508 73.4966 12.9688 72.0144 11.5897 70.6945C10.343 69.5014 8.9385 68.5417 7.79929 67.4037C6.53646 66.1422 5.38684 64.4349 4.34934 62.8397C2.51974 60.0267 2.03383 57.6546 1.55457 56.0571C1.05653 54.397 0.874468 51.2861 1.08788 48.9771C1.24869 47.2373 1.89426 45.6881 2.5045 44.2097C3.12815 42.6987 4.52901 41.5381 5.88833 40.4983C7.53114 39.2415 9.41098 39.0611 10.9883 38.6016C12.5374 38.1503 14.137 37.9434 15.7143 37.743C17.441 37.5235 20.7392 37.4241 22.7059 37.6745C23.9472 37.8326 21.4886 35.0987 20.5103 33.78C19.4578 32.3612 17.901 31.1881 16.7014 29.8514C15.5164 28.5311 14.548 26.9615 13.3508 24.7693C12.3867 23.0039 9.91321 20.6213 12.1505 16.4513C14.9999 11.1408 12.9999 14.6408 14.9999 11.6408C15.4743 10.9292 17.9999 9.14078 18.4999 8.93645C20.0532 8.30169 22.1381 6.67512 24.4999 6.61469C26.7462 6.55721 27.0687 6.33763 28.9999 6.61469C30.7914 6.87172 31.6784 6.63591 32.9999 7.64078C34.4651 8.75491 33.9938 8.25839 34.9999 9.69805C36.1781 11.3841 35.8139 10.057 37.0734 12.7933C37.3564 13.4082 37.5082 13.8 37.7055 13.8424C38.9678 14.1136 39.3584 11.4535 40.3432 9.69805C41.4485 7.72771 42.8226 5.39131 43.9462 4.05166C45.0339 2.7549 47.0713 2.19625 48.7886 1.5363C50.7209 0.793734 53.0993 0.95652 54.6961 1.22893C56.6417 1.56084 58.1018 3.15596 59.8156 4.2394C61.445 5.26954 62.4356 7.01239 63.5202 8.45264C64.5048 9.76009 65.5075 11.6557 66.2979 13.0807C66.9506 14.2574 68.069 10.4945 68.9752 8.93645C69.8075 7.5055 71.0204 6.22484 72.2822 5.18495C73.695 4.02067 76.0181 3.15184 77.7354 2.57027C79.3481 2.02413 81.0608 1.9528 83.4628 1.811C85.2377 1.70621 86.8123 2.14114 88.1143 3.00719C89.4277 3.88074 90.6333 5.05237 91.8951 6.31421C93.1377 7.55671 94.218 8.91115 95.224 10.3106C96.4646 12.0363 97.0158 13.7553 97.5498 15.4886C97.7985 16.2958 97.8464 17.1061 98.0809 17.5966C98.6648 18.8179 100.362 15.6604 101.721 14.9586C103.107 14.2424 105.239 15.0916 106.998 15.5234C108.565 15.9082 109.459 17.646 110.328 19.0254C111.36 20.6637 111.983 22.9604 112.535 24.911C113.044 26.7095 113.127 28.7072 113.363 30.5633C113.622 32.5984 113.599 37.0722 113.322 40.1536C113.177 41.7624 112.764 43.3224 112.286 44.9387C111.732 46.8094 110.93 48.3249 110.172 49.7834C109.341 51.3836 107.867 54.0623 106.464 56.3006C105.073 58.5187 103.712 60.8488 102.159 63.4452C101.153 65.127 100.401 66.598 99.6235 68.2143C98.7685 69.9909 98.1277 71.7942 97.3893 74.1383C96.6077 76.62 96.6103 78.491 96.3106 81.1246C95.7396 86.1408 96.6024 88.5314 96.8777 90.2694C97.1306 91.8661 97.7035 93.5741 98.1767 95.4473C98.6109 97.1635 98.9252 98.384 99.22 99.2287C99.3588 99.6446 99.4758 100.035 99.7145 100.791" stroke="white" stroke-width="8" stroke-linecap="round"/></svg>') 0 23, auto;
}

.canvas-menu {
  align-items: center;
  background: rgba(0, 0, 0, 0.7);
  bottom: 10px;
  display: flex;
  gap: 10px;
  left: 50%;
  padding: 10px;
  position: absolute;
  transform: translate(-50%, 0);
}

input[type=color] {
  border: 0;
  cursor: pointer;
  height: 25px;
  outline: none;
  padding: 0;
  width: 50px;
}

input[type=color]::-webkit-color-swatch-wrapper {
  padding: 0;
}

input[type=color]::-webkit-color-swatch {
  border: 0;
  border-radius: 0;
}