:root{
  --canvas:#efeee9; --surface:#ffffff; --ink:#262523; --meta:#5d5a54;
  --link:#17558c; --rule:#d6d2c8; --sage:#b9c4ad; --sage-soft:#e7ebe2;
  --body:Verdana,Geneva,"DejaVu Sans",sans-serif;
  --serif:Georgia,"Times New Roman",serif;
  --mono:"Courier New","DejaVu Sans Mono",monospace;
}
*{box-sizing:border-box}
html{background:var(--canvas)}
body{margin:0;background:var(--canvas);color:var(--ink);font:15px/1.62 var(--body);
  -webkit-text-size-adjust:100%}
a{color:var(--link)}
.ebody a,.entry p a{text-decoration:underline}
a:focus-visible,*:focus-visible{outline:2px solid var(--link);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--surface);padding:8px 12px;z-index:9}
.skip:focus{left:8px;top:8px}

.shell{max-width:920px;margin:24px auto 40px;background:var(--surface);
  border:1px solid var(--rule);padding:0 24px 24px;
  display:grid;column-gap:28px;
  grid-template-columns:minmax(0,1fr) 232px;
  grid-template-areas:"mast mast" "lead rail" "stream rail" "arch rail" "foot foot";
  align-content:start}
.shell.inner{grid-template-areas:"mast mast" "lead rail" "foot foot"}
.shell > .mast{grid-area:mast}
.shell > .lead{grid-area:lead}
.shell > .stream{grid-area:stream}
.shell > .rail{grid-area:rail}
.shell > .arch{grid-area:arch}
.shell > .foot{grid-area:foot}
.shell > *:not(.mod){grid-column:1 / -1}
.mod{min-width:0;align-self:start}

/* masthead */
.mast{border-bottom:3px double var(--rule);padding:16px 0 8px;margin-bottom:16px}
.mastmain{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.mastmain .mark{display:inline-block;width:14px;height:26px;
  border-left:6px solid var(--sage);border-bottom:2px solid var(--ink)}
.mastid{margin-right:auto}
.brand{font:27px/1.15 var(--serif);letter-spacing:.01em;margin:0}
.brand a{color:var(--ink);text-decoration:none}
.tag{font:12px/1.4 var(--body);color:var(--meta);margin:3px 0 0}
.stand{font:12px/1.45 var(--body);color:var(--meta);margin:0 0 3px;max-width:300px;text-align:right}
.util{list-style:none;display:flex;flex-wrap:wrap;gap:14px;margin:10px 0 0;padding:0;
  font:12px/1.4 var(--body)}
.util a{text-decoration:none}
.util a:hover{text-decoration:underline}

/* entries */
.modhead{font:12px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--meta);margin:0 0 12px;padding-bottom:6px;border-bottom:1px solid var(--rule)}
.entry{padding:0 0 16px;margin:0 0 16px;border-bottom:1px solid var(--rule)}
.entry:last-child{border-bottom:0}
.datetab{font:11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink);background:var(--sage-soft);border-left:6px solid var(--sage);
  display:inline-block;padding:3px 8px;margin:0 0 8px -14px}
.etitle{font:21px/1.25 var(--serif);margin:0 0 6px;font-weight:normal}
.entrypage .ptitle,.lead > .ptitle{font:25px/1.22 var(--serif);font-weight:normal;margin:0 0 8px}
.ptitle{font:25px/1.22 var(--serif);font-weight:normal;margin:0 0 10px}
.etitle a,.ptitle a{text-decoration:none}
.permaline{font:11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--meta);margin:0 0 10px}
.permaline .mark{display:inline-block;width:4px;height:10px;background:var(--sage);
  margin-right:7px;vertical-align:-1px}
.ebody{max-width:34em}
.ebody p,.entry > p{margin:0 0 12px}
.taglist{font:11px/1.5 var(--mono);letter-spacing:.05em;color:var(--meta);margin:8px 0 0}
.rubric{font:12px/1.5 var(--body);color:var(--meta);margin:0 0 16px;padding-bottom:8px;
  border-bottom:1px solid var(--rule)}
.more{font:12px/1.5 var(--body);margin:12px 0 0}
.nextprev{border-top:1px solid var(--rule);padding-top:12px;margin-top:16px}
.nextprev h2{font:12px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--meta);margin:0 0 8px}
.np{margin:0 0 6px;font:13px/1.5 var(--body)}
.npdir{font:11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--meta);margin-right:8px}

/* rail + archive */
.railbox{margin:0 0 20px}
.railbox h2{font:12px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--meta);margin:0 0 8px;padding-bottom:5px;border-bottom:2px solid var(--rule)}
.rlist{list-style:none;margin:0;padding:0;font:12px/1.45 var(--body)}
.rlist li{padding:5px 0;border-bottom:1px dotted var(--rule)}
.rlist.plain li{padding:4px 0}
.rlist li:last-child{border-bottom:0}
.rdate{font:10px/1.4 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--meta);
  display:inline-block;margin-right:4px}
.rlist.months li{font:11px/1.6 var(--mono);letter-spacing:.05em;text-transform:uppercase}
.shell > .arch{margin-top:8px}
.shell > .arch .rlist.months{columns:3;column-gap:24px}
.shell > .arch .rlist.months li{break-inside:avoid}
.shell > .arch .railbox:last-child .rlist{columns:3;column-gap:24px}
.monthgroup{margin:0 0 12px}
.monthgroup h3{font:11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink);margin:0 0 4px}
.monthgroup.wide{border-bottom:1px solid var(--rule);padding-bottom:10px;margin-bottom:14px}
.monthgroup.wide h2{font:13px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;
  color:var(--meta);margin:0 0 6px}
.monthgroup.wide .rlist{font:13px/1.6 var(--body)}

/* footer */
.foot{border-top:1px solid var(--rule);margin-top:24px;padding-top:10px}
.utilstrip{font:11px/1.8 var(--mono);letter-spacing:.05em;color:var(--meta)}
.utilstrip span,.utilstrip a{margin-right:14px}

@media (max-width:1040px){.shell{margin:0 auto 24px;max-width:100%}}
@media (max-width:880px){.shell{grid-template-columns:minmax(0,1fr) 208px}}
@media (max-width:760px){
  .shell,.shell.inner{grid-template-columns:1fr;
    grid-template-areas:"mast" "lead" "stream" "rail" "arch" "foot";padding:0 16px 16px}
  body{font-size:16px;line-height:1.65}
  .stand{text-align:left;max-width:100%}
  .util{gap:0 18px}
  .util li{padding:10px 0}
  .util a{display:inline-block;min-height:20px}
  .datetab{display:block;margin-left:0;border-left:0;border-top:3px solid var(--sage)}
  .ebody{max-width:100%}
  .monthgroup.wide .rlist{font-size:15px}
  .shell > .arch .rlist.months,
  .shell > .arch .railbox:last-child .rlist{columns:1}
  .utilstrip span,.utilstrip a{display:block;margin-right:0}
}
@media (max-width:420px){.brand{font-size:23px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
