* { font-size: 1em; font-weight: normal; margin:0; padding:0 }
body { font: 1em sans-serif; max-width: 100%; margin: auto; padding: 1.5em }
a:hover { opacity: .7 }
.issue { max-width: 48% }

p { margin: .5em 0 }
a { color: black }
ul { margin: .5em 0 .5em 1.5em; list-style-type: square }
li { margin-bottom: .3em }
hr { margin: 1em 0 }
nav { margin-bottom: 1em; max-width: 1080px; margin: auto }
main * { font-size: .9rem }
h2 { font-size: .8rem; margin-top:1rem  }
img { max-width: 100%; background: white }
.tip { max-width: 200px; opacity: .1; }
.rope { text-align: center }
.rope a { padding: .2em }
.rope b { font-weight: bold }

article { margin: auto; max-width: 1080px; margin-top: 4em; margin-bottom: 8em }
article hr { display: none; }

.big { text-align: center }

main { max-width: 100%;margin-top:2em }
nav * { font-size: .85rem }
nav ul { list-style-type: none }
nav b { margin-left: -.5rem }
nav li { margin-bottom: 0em; padding: .1em .4em; }
nav .ba { padding:.3em; margin-left: 1em; }

ul code, ul span a { font-size: .7rem; font-family: monospace }
.thumb,.issue { max-width: 24% }

.ark { margin-top: 2em; margin-left: 0 }
.ark li { margin: 2em 0 }
.ark span a { font-size: .6rem; display: block }
.ark a + br { display: none }

.ba2 img {
  image-rendering: crisp-edges;
}
.rec img { 
  width: 400px;
  max-width: 100%;
  height:150px;
  object-fit: cover;
  image-rendering: crisp-edges;
  outline: 1px solid black;
  margin: .3em 0;
}

.rec li { 
  margin-bottom: 1.5em;
  padding: .5em;
}

@media only screen and (max-width: 860px) {
.p { margin-left: -1.5em; margin-right: -1.5em; }
}


@media (prefers-color-scheme: dark) {
  body {
    background: black;
    color: darkgray;
  }

  a { color: lightgray }
  
}
