:root {
  --accent:#a0522d;
}

@font-face {
  font-family:"Ari-W9500";
  src:url("/fonts/ari-w9500.woff") format("woff");
}

@font-face {
  font-weight:bold;
  font-family:"Ari-W9500";
  src:url("/fonts/ari-w9500-bold.woff") format("woff");
}

html {
  scroll-behavior:smooth;
}

::selection {
  color:#000000;
  background:#a0522d;
}

body {
  margin:0;
  color:#ffffff;
  font-size:1rem;
  background:#000000;
  line-height:1.2rem;
  font-family:"Ari-W9500", sans-serif;
}

h1 {
  font-weight:bold;
}

h4 {
  margin:.5em;
}

a {
  color:#a0522d;
}

a:hover {
  text-decoration:none;
}

#back {
  top:0;
  left:0;
  position:fixed;
}

details > summary, #tag-filters label {
  cursor:pointer;
}

.center {
  text-align:center;
}

.small-text {
  font-size:smaller;
}

.no-border {
  padding:0;
  border:none;
}

.mobile-only {
  display:none;
}

.pc-only {
  display:block;
}

.flex {
  display:flex;
  flex-wrap:wrap;
  flex-direction:row;
}

main {
  width:800px;
  margin:auto;
}

.pinned {
  color:#000000;
  margin:1rem 0;
  min-width:100%;
  font-size:smaller;
  background:#a0522d;
  border:3px solid #a0522d;
}

.pinned-inner {
  padding:.5rem;
}

.pinned summary {
  margin:.5rem;
  color:#000000;
  font-size:1.5rem;
  font-weight:bold;
  padding-bottom:.5rem;
  border-bottom:2px dotted #000000;
}

.pinned details > summary {
  list-style-type:none;
}

.pinned details > summary::-webkit-details-marker {
  display:none;
}

.pinned details > summary::before {
  content:"→";
  margin-right:.18rem;
}

.pinned details[open] > summary::before {
  content:"↓";
  margin:0 .5rem;
}

#status > details[open] {
  padding-bottom:.5rem;
}

#status ul {
  margin:0;
  padding:0;
  background:#a0522d;
}

#status li {
  padding:.2em;
  list-style-type:none;
}

#status li:nth-child(odd) {
  color:#000000;
  font-size:1.2em;
  font-weight:bold;
}

#status li:nth-child(even) {
  color:#a0522d;
  background:#000000;
  padding-inline:.8em;
}

#status li a {
  color:#a0522d;
}

#status li a:hover {
  text-decoration:none;
}

.post {
  color:#ffffff;
  min-width:100%;
  background:#a0522d;
  margin-bottom:1rem;
  border:3px solid #a0522d;
}

.post-header {
  color:#000000;
  font-size:1.3em;
  font-weight:bold;
  background:#a0522d;
  padding:.3rem .5rem .5rem .5rem;
}

.post time {
  float:right;
  font-size:smaller;
  font-weight:normal;
}

.post-inner {
  background:#000000;
  padding:.1rem .8rem .7rem .9rem;
}

.post img {
  max-width:100%;
}

.post div + img {
  margin:.5rem 0 .2rem 0;
}

.post a {
  color:#a0522d;
}

.post p {
  margin:0;
  padding:.5rem 0;
}

more {
  display:block;
  margin:.2em 0 .5em 0;
}

.post a:hover {
  text-decoration:none;
}

.post summary {
  cursor:pointer;
  text-align:left;
}

.post details {
  vertical-align:top;
  display:inline flow-root;
}

.post details > summary {
  list-style:none;
}

.post details > summary::-webkit-details-marker {
  display:none;
}

.post ul {
  width:135px;
  margin-top:0;
  font-size:.8em;
  padding-left:0;
  text-align:left;
  list-style-type:none;
}

.post ul li:before {
  content:"";
  padding-left:0;
  padding-right:0;
}

.post li {
  margin-top:.5em;
}

.post li::marker {
  color:rgba(0, 0, 0, 0);
}

details {
  display:inline;
}

.readmore summary {
  color:#a0522d;
  font-weight:bold;
  padding:0 0 .5rem 0;
  list-style-type:none;
  display:inline;
}

.readmore summary:after {
  font-size:.9em;
  content:"click to show spoilers";
}

.readmore[open] > summary:after {
  font-size:.9em;
  content:"click to hide spoilers";
}

.readmore[open] > summary {
  border-bottom:0;
  padding-bottom:0;
}

.readmore p {
  border-top:0;
}

.tags {
  padding:.4rem 0;
  border-top:2px dotted #a0522d;
}

.tags a, .tags span {
  color:#a0522d;
  font-size:small;
  padding:.2rem .5rem;
  text-decoration:none;
}

.tags a:hover {
  font-weight:bold;
}

.tagged:has(input:checked) article {
  display:none;
}

.tagged:has(#all:checked) article,
.tagged:has(#january:checked) article[class~="january"],
.tagged:has(#february:checked) article[class~="february"],
.tagged:has(#march:checked) article[class~="march"],
.tagged:has(#april:checked) article[class~="april"] {
  display:inline-block;
}

#tag-filters label {
  margin-left:.5rem;
  background:#a0522d;
  margin-block:.3rem;
  display:inline-block;
  padding:0 .5rem .1rem 0;
  border:2px solid #000000;
}

#tag-filters label:hover {
  background:#a0522d;
  text-decoration:underline;
}

#tag-filters label:has(input:checked) {
  color:#a0522d;
  background:#000000;
}

#tag-filters input {
  appearance:none;
}

#credit p {
  margin-top:0;
}

#credit a:after {
  content:"↗";
}

#credit a {
  color:#a0522d;
}

#credit a:hover {
  text-decoration:none;
}

.tv, .movie, .book {
  height:230px;
  width:151px;
}

.video_game {
  width:151px;
  height:151px;
}

.emote {
  margin:1px;
  vertical-align:bottom;
  image-rendering:pixelated;
}

.outlink:after {
  content:"↗";
}

#s-m-t-tooltip{
  z-index:99;
  color:#ffffff;
  max-width:300px;
  padding:6px 8px;
  line-height:16px;
  background:#000000;
  font-family:inherit;
  border:2px solid #a0522d;
  margin:24px 14px 7px 12px;
}

.tooltip {
  z-index:99;
  position:relative;
  display:inline-block;
}

.tooltip .tooltiptext {
  left:-1%;
  z-index:1;
  width:87%;
  bottom:105%;
  color:#ffffff;
  font-size:.9em;
  text-align:left;
  padding:5px 8px;
  position:absolute;
  visibility:hidden;
  border:solid 3px #a0522d;
  background-color:#000000;
}

.tooltip .tooltiptext::after {
  top:100%;
  left:42%;
  content:"";
  border-width:8px;
  position:absolute;
  border-style:solid;
  border-color:#a0522d transparent transparent transparent;
}

.tooltip:hover .tooltiptext {
  opacity:1;
  visibility:visible;
}

::selection {
  color:#000000;
  background-color:#a0522d;
}

::-webkit-scrollbar {
  width:auto;
  color:#a0522d;
}

::-webkit-scrollbar {
  width:16px;
}

::-webkit-scrollbar-track {
  background:#000000;
}

::-webkit-scrollbar-thumb {
  background:#a0522d;
  border:2px solid #a0522d;
}

::-webkit-scrollbar-thumb:hover {
  cursor:pointer;
  background:#000000;
  border:1px solid #a0522d;
}

@media only screen and (max-width:800px) {
  body {
    background:#a0522d;
  }
  
  #back {
    display:none;
  }
  
  .pinned {
    border:0;
    margin:1em 0 0 0;
    padding:0;
    max-width:100%;
    outline:1px solid #a0522d;
  }
  
  .mobile-only {
    display:block;
  }
  
  .pc-only {
    display:none;
  }
  
  main {
    margin:auto;
    height:auto;
    max-width:100%;
  }
  
  .post {
    border:0;
    padding:0;
    margin:.5rem 0;
    max-width:100%;
    outline:1px solid #a0522d;
  }
  
  .post p {
    padding:.5rem;
  }
  
  .post-header {
    padding:.5rem;
  }
  
  .readmore summary {
    padding-left:.5rem;
  }
}