:root{
  --paper:#f5f6f4; --ink:#1e2226; --muted:#66707a; --rule:#d8dcd9;
  --accent:#2f6b55; --strip:#1b1b1a; --edge:#e8a33d;
  color-scheme: light;
}
@media (prefers-color-scheme: dark){
  :root{ --paper:#16191b; --ink:#e4e6e3; --muted:#9aa3aa; --rule:#2c3134;
         --accent:#7db89e; --strip:#0d0e0e; color-scheme: dark; }
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  font-size:1.125rem;line-height:1.72}
.strip{background:var(--strip);height:44px;position:relative;overflow:hidden}
.strip::before,.strip::after{content:"";position:absolute;left:0;right:0;height:7px;
  background:repeating-linear-gradient(90deg,transparent 0 14px,var(--paper) 14px 24px)}
.strip::before{top:5px}.strip::after{bottom:5px}
.strip a{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  color:var(--edge);text-decoration:none;font-family:"Helvetica Neue",Arial,sans-serif;
  font-size:.72rem;letter-spacing:.18em;white-space:nowrap}
.strip a:focus-visible{outline:2px solid var(--edge);outline-offset:3px}
.wrap{max-width:38rem;margin:0 auto;padding:2.5rem 1.25rem 4rem}
header.site h1{font-size:2.6rem;line-height:1.1;margin:0 0 .4rem;font-weight:normal;letter-spacing:-.01em}
header.site p{margin:0;color:var(--muted)}
nav.top{margin-top:1rem;font-size:1rem}
nav.top a{margin-right:1.2rem}
a{color:var(--accent);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{text-decoration-thickness:2px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
ol.posts{list-style:none;padding:0;margin:3rem 0 0}
ol.posts li{padding:1.4rem 0;border-top:1px solid var(--rule)}
ol.posts h2{font-size:1.4rem;font-weight:normal;margin:0 0 .3rem;line-height:1.3}
ol.posts h2 a{color:var(--ink);text-decoration:none}
ol.posts h2 a:hover{color:var(--accent)}
ol.posts p{margin:.3rem 0 0}
.meta{color:var(--muted);font-size:.95rem;margin:.2rem 0 0}
article h1{font-size:2.1rem;line-height:1.2;font-weight:normal;margin:2rem 0 .5rem}
article .meta{margin-bottom:2rem}
article h2{font-size:1.3rem;font-weight:normal;margin:2.2rem 0 .4rem}
article p{margin:0 0 1.1rem}
article ul{padding-left:1.2rem}
article li{margin:.3rem 0}
blockquote{margin:1.5rem 0;padding-left:1rem;border-left:3px solid var(--rule);color:var(--muted)}
footer.site{margin-top:4rem;padding-top:1.2rem;border-top:1px solid var(--rule);color:var(--muted);font-size:.9rem}
@media (max-width:480px){header.site h1{font-size:2.1rem} article h1{font-size:1.7rem}}