/* Little Wood Buildings - single-column note stream */
:root{
  --canvas:#FFFFFF; --surface:#FAF9F7; --ink:#1A1A1A; --accent:#8A6A3B; --rule:#E2DFD9;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--canvas); color:var(--ink);
  font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
  font-size:16px; line-height:1.62;
}
img,svg{max-width:100%;height:auto}
a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;background:var(--canvas);padding:8px 12px;z-index:5}
.skip:focus{left:8px;top:8px}

.stream{max-width:700px;margin:0 auto;padding:0 20px}

/* 1 minimal identity */
.identity{padding-top:46px;padding-bottom:22px;border-bottom:1px solid var(--rule);margin-bottom:14px}
.identity h1,.identity .wordmark{
  font-size:30px;font-weight:600;letter-spacing:.02em;margin:0 0 8px;line-height:1.2;
}
.identity p{margin:0;font-size:15px;color:#333}
.identity .mark{display:block;margin-top:14px;width:220px}

/* 2 plain utility links */
.utility{padding-bottom:26px;font-size:13px}
.utility a{margin-right:4px}
.utility span{color:#8c8c8c;margin-right:4px}

/* 3 note stream */
.note{padding:0 0 54px}
.note h2{font-size:22px;font-weight:600;line-height:1.25;margin:0 0 6px;letter-spacing:.01em}
.note h2 a{color:var(--ink);text-decoration:none}
.note h2 a:hover{text-decoration:underline}
.note p{margin:0 0 14px}
figure.media{margin:0 0 18px}
figure.media svg{display:block;width:100%}
.measure{
  display:block;font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--accent);padding-top:6px;
  border-top:1px solid var(--accent);
  background-image:repeating-linear-gradient(to right,var(--accent) 0 1px,transparent 1px 24px);
  background-size:100% 5px;background-repeat:no-repeat;background-position:0 0;
}
.metaline{
  font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#6d6d6d;margin:0 0 16px;
}
.metaline a{color:#6d6d6d}
.maxim{
  background:var(--surface);padding:30px 26px;margin:0 0 54px;border:0;
}
.maxim blockquote{
  margin:0 0 12px;font-family:Georgia,"Times New Roman",serif;font-style:italic;
  font-size:32px;line-height:1.32;
}
.maxim .from{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;text-transform:uppercase}

/* wide media escaping the measure */
.wide{margin-left:calc((700px - 900px) / 2);margin-right:calc((700px - 900px) / 2)}

/* 4 date/tag lines */
.filing{border-top:1px solid var(--rule);padding-top:22px;padding-bottom:8px;margin-top:8px}
.filing h2{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#6d6d6d;font-weight:400;margin:0 0 12px}
.filing-row{display:flex;justify-content:space-between;gap:16px;
  border-bottom:1px solid var(--rule);padding:7px 0;font-size:14px}
.filing-row span{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;color:#6d6d6d}
.filing .span-line{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#6d6d6d;padding-top:14px}

/* 5 archive pager */
.pager{padding-top:26px;padding-bottom:10px;font-size:14px;display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.pager .count{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#6d6d6d}

/* 6 tiny footer */
.tinyfoot{text-align:center;font-family:Arial,Helvetica,sans-serif;font-size:12px;
  letter-spacing:.08em;color:#6d6d6d;padding-top:34px;padding-bottom:48px}
.tinyfoot a{color:#6d6d6d}

/* detail */
article h1{font-size:26px;font-weight:600;line-height:1.25;margin:0 0 6px;letter-spacing:.01em}
article p{margin:0 0 16px}
.notefoot{border-top:1px solid var(--rule);margin-top:34px;padding:18px 0 0;font-size:14px}
.notefoot p{margin:0 0 8px}
.archive-month{font-family:Arial,Helvetica,sans-serif;font-size:12px;letter-spacing:.08em;
  text-transform:uppercase;color:#6d6d6d;margin:28px 0 10px}
.archive-list{list-style:none;margin:0;padding:0}
.archive-list li{border-bottom:1px solid var(--rule);padding:9px 0;display:flex;
  justify-content:space-between;gap:16px}
.archive-list li span{font-family:Arial,Helvetica,sans-serif;font-size:12px;
  letter-spacing:.08em;color:#6d6d6d;white-space:nowrap}

@media (max-width:980px){
  .wide{margin-left:0;margin-right:0}
}
@media (max-width:760px){
  .stream{padding:0 20px;max-width:100%}
  .identity{padding-top:30px;padding-bottom:18px}
  .identity h1,.identity .wordmark{font-size:22px}
  .utility a,.utility span{display:inline-block;line-height:44px}
  .maxim blockquote{font-size:22px}
  .maxim{padding:22px 18px}
  .filing-row{flex-direction:column;gap:2px}
  .filing-row span{text-align:left}
  .pager{flex-direction:column;gap:6px}
  .pager a{display:inline-block;line-height:44px}
  .archive-list li{flex-direction:column;gap:2px}
}
@media (max-width:430px){
  body{font-size:15px}
  article h1{font-size:22px}
  .note h2{font-size:20px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important;animation:none !important}
}
