@charset "UTF-8";
/* At the end of play, what you’ve got here is a rather old-school style sheet, puffing along with no grandiose aspirations whatsoever.
You could call it ‘minimalist’ or, if the milk’s gone off in your morning tea, ‘indolent.’ 
Heads-up: everything—properties, classes, selectors, and all other elements—are listed in strict alphabetical order.
That might make it trickier for you to read, but I’m pretty sure your browser won’t mind. 
Of course, the palette flirts with Tokyo nights—neon sighs and all—and if you squint, it seems to be keeping a second, more mysterious rendezvous. 

---
Tokyo Night Theme | (c) 2018 Enkia

*/

*, *::after, *::before {
  box-sizing: inherit;
}

a:active,
a:link,
a:visited {
  color: var(--red);
  text-decoration: none;
}

a:hover {
  color: var(--orange);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.2em;

}

address {
  font-style: normal;
  margin: 1lh 0;
}

address a:active,
address a:link,
address a:visited {
  color: var(--bluegreen);
  text-decoration: none;
}

address a:hover {
  color: var(--blue);
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 0.2em;
}

body {
  background-color: var(--black);
  color: var(--violet);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size:2rem;
  max-width: 84ch;
  padding: 3rem 1rem;
}

cite {
  color: var(--green);
}

.date {
  color: var(--lightblue);
  margin: 1lh 0;
}

.error {
  text-decoration: overline;
}

footer {
  margin: 1lh 0;
}

h1, h2 {
  color: var(--purple);
  font-size: inherit;
  font-weight: inherit;
  margin: 0.5lh 0;
}

.hide {
  display: none;
}

html {
  box-sizing: border-box;
  font-size: 62.5%;
}


@media (min-width: 768px) {
  body {
    padding: 4rem;
    font-size: 2rem;
  }
}

@media (min-width: 1200px) {
  body {
    font-size: 2.2rem;
    padding: 6rem;
  }
}

@media (orientation: landscape) and (min-width: 800px) {

  body {
    width: 40vw;     
    font-size: 1.6rem;
    margin: 10vh auto 0;
    padding: 2rem;
    max-height: calc(100dvh - 10vh - 4rem);
    overflow: auto;
  }
}

@media (orientation: landscape) and (min-width: 1280px) {

  body {
    width: 30vw;       
    font-size: 1.8rem;
    margin: 11vh auto 0;
  }
}

@media (orientation: landscape) and (min-width: 1440px) {

  body {
    width: 28vw;       
    font-size: 2rem;
    margin: 12vh auto 0;
  }
}

@media (orientation: landscape) and (min-width: 1920px) {

  body {
    width: 26vw;       
    font-size: 2.4rem;
  }
}

.minimalspace {
  margin-bottom: 0.4lh;
}

nav {
  margin: 1lh 0;
}

p {
  margin: 0 0 1lh 0;
}

:root {

  --black: #1a1b26;
  --blue: #2ac3de;
  --bluegreen: #73daca;
  --green: #9ece6a;
  --lightblue: #b4f9f8;  
  --orange: #ff9e64;
  --purple: #bb9af7;
  --red: #f7768e;
  --violet: #9aa5ce;
  --white: #cfc9c2;

}

.space {
  margin-bottom: 1lh;
}

.tomodachi p {
  margin: 0; 
}

ul.isekai {
  color: var(--orange);
  list-style: none;
  padding: 0;
  margin: 0;
}

ul.sanpo {
  list-style: none;
  padding: 0;
  margin: 0;
}

.zettairyouiki {
  margin: 1lh 0;  
}