@font-face{font-family:"Newsreader";src:url(/fonts/newsreader.woff2) format("woff2");font-weight:300 600;font-style:normal;font-display:swap}
@font-face{font-family:"Newsreader";src:url(/fonts/newsreader-italic.woff2) format("woff2");font-weight:300 600;font-style:italic;font-display:swap}

:root{
  color-scheme:light dark;
  --bg:#f7f5f0;
  --fg:#161513;
  --muted:#5f5b53;
  --rule:#d9d5cc;
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#141311;--fg:#ece8df;--muted:#a49f93;--rule:#2d2b27}
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;font-size:clamp(17px,1.1vw + 13px,20px)}
body{
  margin:0;min-height:100svh;
  background:var(--bg);color:var(--fg);
  font-family:var(--serif);font-weight:400;line-height:1.5;
  font-optical-sizing:auto;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;text-decoration:none;border-bottom:1px solid var(--rule);transition:border-color .25s cubic-bezier(.16,1,.3,1)}
a:hover{border-bottom-color:currentColor}
a:focus-visible{outline:2px solid currentColor;outline-offset:3px;border-bottom-color:transparent}
::selection{background:var(--fg);color:var(--bg)}

/* ---------- landing ---------- */
.cover{
  min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;
  padding:clamp(1.5rem,4vw,3rem);
}
.cover-top{display:flex;justify-content:space-between;font-size:.85rem;color:var(--muted);font-style:italic}
.cover-name{
  font-size:clamp(2.6rem,9vw,5.5rem);font-weight:300;line-height:.98;letter-spacing:-.025em;
  margin:0;max-width:12ch;text-wrap:balance;
}
.cover-line{margin:1.4rem 0 0;font-size:clamp(1.05rem,1.6vw,1.35rem);font-style:italic;color:var(--muted);max-width:32ch}
.cover-foot{display:flex;flex-wrap:wrap;gap:.5rem 2rem;font-size:.9rem;color:var(--muted)}

/* ---------- reading ---------- */
.doc{max-width:64ch;margin:0 auto;padding:clamp(3rem,10vh,7rem) clamp(1.5rem,4vw,3rem) 4rem}
.doc header{margin-bottom:3rem}
.doc h1{font-size:clamp(2.2rem,6vw,3.5rem);font-weight:300;line-height:1.05;letter-spacing:-.02em;margin:0 0 .75rem}
.doc .meta{font-style:italic;color:var(--muted);margin:0}
.doc h2{font-size:1.15rem;font-weight:500;font-style:italic;margin:2.5rem 0 .5rem}
.doc p{margin:0 0 1rem}
.doc .sms{padding:1.25rem 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:1rem 0}
.doc .sms p:last-child{margin-bottom:0}
.doc nav{margin-top:4rem;padding-top:1.25rem;border-top:1px solid var(--rule);display:flex;gap:2rem;font-size:.9rem;color:var(--muted)}
.doc nav a{border:0}
.doc nav a:hover{color:var(--fg)}

/* one authored moment: the name settles in */
@media (prefers-reduced-motion:no-preference){
  .cover-name,.cover-line{animation:settle 1.1s cubic-bezier(.16,1,.3,1) both}
  .cover-line{animation-delay:.12s}
  @keyframes settle{from{opacity:0;transform:translateY(.35em);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
}
.nowrap{white-space:nowrap}