*{box-sizing:border-box;}
body {
  font-family: sans-serif;
  line-height: 1.33;
  margin: 0 auto;
  padding: 2% 4%;
}
img{height:auto;max-width:100%;}
img.puffy-logo{max-width:120px;}
ul li{margin:5px 0;}
h1 {margin: 0;}
h2.sub {border:0;font-weight:normal;margin-top:0;}
h2 {border-bottom:1px solid;margin: 2rem 0 0;}
h3{border-bottom:1px dashed;margin:2rem 0 0;}
pre {
  background: lightgoldenrodyellow;
  overflow: auto;
  padding: 6px;
}
blockquote {
  border-left: 4px solid;
  color: brown;
  font-style: italic;
  margin: 1rem 0;
  padding: 0 0 0 8px;
}
figure{text-align:center;}
pre:has(code.language-diagram) {
  background: none;
}
dt{font-style:italic;}
dd{margin-bottom:20px}
@media(min-width:800px){
  body {
    max-width: 85%;
  }
}
@media(prefers-color-scheme: dark) {
  body {
    background-color: #2e2e2e;
  }
  pre {
    background: black;
  }
  blockquote {
    color: lightgoldenrodyellow;
  }
}