:root{
  --bg:#ffffff; --fg:#2b2b2b; --muted:#6f7682;
  --link:#2a7ae2; --border:#e6e6e6; --code-bg:#f6f8fa;
  --maxw:900px;  /* set to 900 to match list; change to 820 if you prefer narrower */
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#0b0c0e; --fg:#e6e6e6; --muted:#9aa1a9; --link:#8ab4ff; --border:#1f2328; --code-bg:#111318; }
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--fg);
  font:17px/1.7 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif}

h1,h2,h3{font-family:"Libre Baskerville",Georgia,"Times New Roman",serif;letter-spacing:-.01em;color:var(--fg)}
h1{font-size:2.2rem;line-height:1.2;font-weight:700}
h2{font-size:2rem;line-height:1.2;font-weight:700}
h3{font-size:1.25rem;line-height:1.25;font-weight:600}

a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
h1 a,h2 a,.post-item a{color:inherit;text-decoration:none}

/* containers */
.container{max-width:var(--maxw);margin:0 auto;padding:2rem 1rem}
.container--wide{max-width:900px}

/* header/footer */
header{border-bottom:1px solid var(--border)}
.headerbar{display:flex;align-items:center;gap:1rem}
.headerbar .site-title{margin-right:auto;font-weight:700}
.nav-links{display:flex;gap:1.25rem}
.nav-links a{color:inherit}
.nav-links a:hover{color:var(--link)}
html,body{height:100%}
body{display:flex;flex-direction:column}
.page-body{flex:1 0 auto}
footer{border-top:1px solid var(--border);margin-top:auto;padding:1.25rem 0;color:var(--muted)}

/* list */
.posts-feed{margin-top:1.5rem}
.post-item{padding:1.25rem 0 1.75rem;border-bottom:1px solid var(--border)}
.post-item time{display:block;margin-bottom:.35rem;color:var(--muted);font-variant-numeric:tabular-nums}
.post-item h2{margin:.15rem 0 .5rem}
.rule{display:block;width:44px;height:3px;background:var(--border);margin:.5rem 0 .8rem;border-radius:2px}
.post-item .summary{color:var(--muted);max-width:70ch}

/* single */
article{max-width:100%;margin:0}
article h1{
  font-size:2.2rem;line-height:1.2;margin:2rem 0 .5rem;
  overflow-wrap:anywhere; word-break:normal; hyphens:auto;  /* wrap long tokens/underscores */
}
article .rule{width:44px;height:3px;background:var(--border);border-radius:2px;margin:.6rem 0 1.1rem}
article .meta{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;min-height:1.4rem;color:var(--muted)}
article .meta a{color:var(--link);text-decoration:none}
article .meta a:hover{ text-decoration:underline }
article .content{max-width:70ch;margin:0}
pre,code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace}
pre{background:var(--code-bg);padding:1rem;overflow:auto;border-radius:8px;max-width:100%}
code{background:var(--code-bg);padding:.12rem .3rem;border-radius:4px}

/* ensure headings/site title don’t turn blue */
.site-title,.site-title:visited{color:var(--fg)!important}
.post-item h2,.post-item h2 a,.post-item h2 a:visited,h1 a,h2 a{color:var(--fg)!important;text-decoration:none}

/* optional: hide list H1s if any remain for a11y (screen-reader only) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
.search-wrap{ margin: 1rem 0 1.25rem; }
#search-input{
  width:100%; max-width: 36rem;
  padding:.7rem .9rem; border:1px solid var(--border); border-radius:8px;
  font:inherit; outline:none;
}
#search-input:focus{ border-color: var(--link); box-shadow: 0 0 0 3px rgba(42,122,226,.12); }
#search-meta{ margin-top:.5rem; color:var(--muted); }