/* Page shell */
body{font-family:system-ui,sans-serif;line-height:1.5;margin:1rem auto;max-width:40rem;padding:0 1rem;color:#222;}
article img{max-width:100%;height:auto}

/* Post page: same tinted panel as .post-card on the index, with a slightly
   larger title and a thin in-card rule under the date to set the masthead off
   from the body. */
article.post-imported{
  background:#f8f6f0;
  border:1px solid #e8e3d4;
  border-radius:6px;
  padding:1.75rem 2rem;
  margin:0;
}
article.post-imported > h1{
  margin:0 0 0.25rem;
  font-size:1.75rem;
  line-height:1.2;
}
article.post-imported > .post-date{
  margin:0 0 1.5rem;
  padding-bottom:0.75rem;
  border-bottom:1px solid #e0d9c4;
  font-size:0.85rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:#666;
}
article.post-imported > :last-child{margin-bottom:0;}

/* Quotations: tuned to read against the tinted post panel. */
article blockquote{
  margin:1.25rem 0;
  padding:0.4rem 1rem;
  border-left:3px solid #b6ad94;
  background:#efe9d8;
  color:#333;
  font-style:italic;
}
article blockquote > p{margin:0.5rem 0;}
article blockquote > p:first-child{margin-top:0;}
article blockquote > p:last-child{margin-bottom:0;}

/* index.html / YYYY/index.html: site masthead + tagline. */
.blog-page-header{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:0.75rem;margin:0 0 0.5rem;}
.blog-page-header h1{margin:0;}
.blog-page-header h1 a{color:inherit;text-decoration:none;}
.blog-page-header h1 a:hover{text-decoration:underline;}
.blog-page-header .rss-head{margin:0;font-size:0.95rem;}
.blog-tagline{
  margin:0 0 1.5rem;
  padding-bottom:0.75rem;
  border-bottom:1px solid #e3e3df;
  font-style:italic;
  color:#555;
}

/* Two-column layout for index.html + YYYY/index.html. Single column on narrow screens. */
body.with-sidebar{max-width:60rem;}
.layout{display:grid;grid-template-columns:minmax(0,1fr) 13rem;gap:2.5rem;}
@media (max-width:48rem){.layout{grid-template-columns:1fr;gap:1.5rem;}}
.content{min-width:0;}

/* Sidebar: stable across rebuilds (year list + RSS). No 'recent posts' widget
   so old YYYY archive pages remain byte-identical when new posts are added. */
.sidebar{font-size:0.92rem;}
.sidebar-section{margin:0 0 1.5rem;}
.sidebar-heading{
  font-size:0.78rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.06em;
  color:#666;
  margin:0 0 0.5rem;
}
.sidebar-list{list-style:none;padding:0;margin:0;}
.sidebar-list li{padding:0.2rem 0;}
.sidebar-list-all{margin-top:0.4rem;padding-top:0.4rem;border-top:1px solid #ececea;}
.sidebar-meta{margin:0.2rem 0;}

/* Full-post cards on index.html / YYYY/index.html. Each post gets a tinted
   panel + padding so post boundaries are visually obvious when stacked. */
.post-card{
  background:#f8f6f0;
  border:1px solid #e8e3d4;
  border-radius:6px;
  padding:1.5rem 1.75rem;
  margin:0 0 1.5rem;
}
.post-card:last-child{margin-bottom:1rem;}
.post-card-title{
  margin:0 0 0.25rem;
  font-size:1.5rem;
  line-height:1.2;
}
.post-card-title a{color:inherit;text-decoration:none;}
.post-card-title a:hover{text-decoration:underline;}
.post-card .post-date{
  margin:0 0 1rem;
  font-size:0.85rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:#666;
}
.post-card-body > :first-child{margin-top:0;}
.post-card-body > :last-child{margin-bottom:0;}
.post-card-body img{max-width:100%;height:auto;}

/* Pre / inline code: white-on-card so they read as separate blocks against
   the tinted post panel on every page. */
article pre,
article code{
  font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  font-size:0.92em;
}
article code{
  background:#fff;
  border:1px solid #e3ddc8;
  border-radius:3px;
  padding:0.05em 0.32em;
}
article pre{
  background:#fff;
  border:1px solid #e3ddc8;
  border-radius:4px;
  padding:0.75rem 1rem;
  overflow-x:auto;
  line-height:1.45;
}
article pre > code{background:transparent;border:0;padding:0;font-size:inherit;}

/* Headings inside a post body. Sized to step down from the post title (h1). */
article h2{
  margin:1.75rem 0 0.5rem;
  font-size:1.25rem;
  line-height:1.25;
  font-weight:600;
}
article h3{
  margin:1.5rem 0 0.4rem;
  font-size:1.05rem;
  line-height:1.3;
  font-weight:600;
}

/* Tables: collapse borders + thin warm rules so they sit naturally on the panel. */
article table{
  border-collapse:collapse;
  margin:1rem 0;
  font-size:0.95rem;
}
article th,article td{
  text-align:left;
  vertical-align:top;
  padding:0.4rem 0.7rem;
  border-bottom:1px solid #e0d9c4;
}
article th{
  font-weight:600;
  border-bottom-width:2px;
}

/* Figures: pandoc wraps standalone images in <figure>; the caption is small + italic. */
article figure{margin:1.25rem 0;}
article figcaption{
  margin-top:0.4rem;
  font-size:0.88rem;
  font-style:italic;
  color:#666;
  text-align:center;
}

/* Horizontal rule: one warm line, no default 3D bevel. */
article hr{
  border:0;
  border-top:1px solid #e0d9c4;
  margin:1.75rem 0;
}

/* "See all posts" link below the front-page stream. */
.all-posts-link{
  margin:0.5rem 0 0;
  font-size:0.95rem;
}

/* "All posts" archive section under the full-post stream on index.html. */
.post-archive{margin-top:2.5rem;padding-top:1rem;border-top:1px solid #e3e3df;}
.post-archive-heading{
  font-size:1.1rem;
  font-weight:600;
  margin:0 0 1rem;
  color:#444;
}
.post-archive .year-heading{
  margin:1.25rem 0 0.5rem;
  font-size:0.95rem;
  font-weight:600;
  color:#666;
  letter-spacing:0.06em;
}
.post-archive .year-heading:first-of-type{margin-top:0;}
.post-archive-list{list-style:none;padding-left:0;margin:0;}
.post-archive-list > li{padding:0.45rem 0;}
.post-archive-list > li + li{border-top:1px solid #f0f0ed;}
.post-archive-list time{
  display:inline-block;
  min-width:3.75rem;
  color:#666;
  font-size:0.85rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
}

/* Footer iframe (only on individual post pages — index/year/all pages have
   the inline sidebar instead). A thin warm rule sets the nav off from the post. */
.site-footer-slot{
  margin-top:1.5rem;
  padding-top:0.5rem;
  border-top:1px solid #e0d9c4;
}
.site-footer-frame{width:100%;border:0;display:block;min-height:3rem;}

/* Inside assets/footer.html when loaded in the iframe. */
body.embedded-footer-body{
  margin:0;
  padding:0.5rem 1rem;
  max-width:none;
  font-size:0.9rem;
  color:#555;
}
.footer-nav{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:0.4rem 1.2rem;
  margin:0;
}
.footer-nav a{color:#444;}