/* =========
   Self-hosted body font: XCharter (WOFF2)
   Put these files in: /assets/fonts/
     xcharter-regular.woff2
     xcharter-italic.woff2
     xcharter-bold.woff2
     xcharter-bolditalic.woff2
   ========= */

@font-face{
  font-family:"XCharter";
  src:url("/assets/fonts/xcharter-regular.woff2") format("woff2");
  font-weight:400;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"XCharter";
  src:url("/assets/fonts/xcharter-italic.woff2") format("woff2");
  font-weight:400;
  font-style:italic;
  font-display:swap;
}
@font-face{
  font-family:"XCharter";
  src:url("/assets/fonts/xcharter-bold.woff2") format("woff2");
  font-weight:700;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:"XCharter";
  src:url("/assets/fonts/xcharter-bolditalic.woff2") format("woff2");
  font-weight:700;
  font-style:italic;
  font-display:swap;
}

:root{
  --max: 70ch;
  --bg:#fbfbf8;
  --text:#111;
  --muted:#5a5a5a;
  --rule:#e6e3dc;

  /* Typography */
  --body: "XCharter", "Times New Roman", Times, Georgia, serif;
  --ui: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

*{ box-sizing:border-box; }

html{ font-size:19px; }

body{
  margin:0;
  padding:72px 20px;
  font-family: var(--body);
  line-height:1.75;
  color:var(--text);
  background:var(--bg);
}

main{
  max-width:var(--max);
  margin:0 auto;
}

/* UI voice */
header, nav, footer, small, .meta{
  font-family: var(--ui);
}

/* Headings = UI voice (clean labels, not “book serif”) */
h1, h2, h3{
  font-family: var(--ui);
  letter-spacing:-0.015em;
}

a{
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid var(--rule);
}
a:hover{ border-bottom-color:var(--text); }

h1{
  font-size:2.25rem;
  line-height:1.2;
  margin:0 0 0.85rem 0;
}

h2{
  font-size:1.25rem;
  margin:2.25rem 0 0.6rem 0;
}

small{ color:var(--muted); }

/* Poems look like poems (keep pre but inherit body font) */
pre{
  white-space:pre-wrap;
  font-family:inherit;
  font-size:1rem;
  line-height:1.8;
  margin:2rem 0;
}

hr{
  margin:2.5rem 0;
  border:0;
  border-top:1px solid var(--rule);
}