:root{
  --paper:#F2F2EF;
  --ink:#15160F;
  --muted:#63655E;
  --rule:#D4D4CC;
  --accent:#2F4F42;
  --accent-lift:#3F6B58;

  --display:"Newsreader",Georgia,serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;

  /* ONE geometry for the whole page. Rail = portrait width. */
  --rail:272px;
  --gutter:2.75rem;
  --indent:calc(var(--rail) + var(--gutter));
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--body);font-size:17.5px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:66rem;margin:0 auto;padding:5.5rem 2rem 7rem}

a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(47,79,66,.3)}
a:hover{color:var(--accent-lift);border-bottom-color:var(--accent-lift)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

/* ---------- masthead ---------- */
.masthead{display:grid;grid-template-columns:var(--rail) 1fr;gap:var(--gutter);align-items:start;padding-bottom:3.25rem;border-bottom:1px solid var(--rule)}
.portrait{
  width:var(--rail);height:var(--rail);border-radius:2px;overflow:hidden;
  background:#E4E4DD;border:1px solid var(--ink);
  display:flex;align-items:center;justify-content:center;
  box-shadow:11px 11px 0 rgba(47,79,66,.13);
}
.portrait img{width:100%;height:100%;object-fit:cover;display:block}
h1{
  font-family:var(--display);font-weight:500;
  font-size:clamp(3rem,7vw,4.1rem);line-height:1;
  letter-spacing:-.022em;margin:-.5rem 0 .85rem;
}
.fields{
  font-family:var(--mono);font-size:.78rem;letter-spacing:.11em;
  text-transform:uppercase;color:var(--accent);margin:0 0 1.3rem;
}
.affil{font-size:1.02rem;color:var(--muted);margin:0 0 1.4rem;max-width:36rem}
.affil a{color:var(--muted);border-bottom-color:rgba(99,101,94,.35)}
.affil a:hover{color:var(--accent);border-bottom-color:var(--accent)}
.contact{
  display:flex;flex-wrap:wrap;gap:.6rem;
  font-family:var(--mono);font-size:.84rem;margin:0;padding:0;list-style:none;
}
.contact a{
  display:inline-block;padding:.42rem .85rem;
  border:1px solid var(--rule);border-radius:2px;
  color:var(--ink);background:transparent;transition:background .15s ease,border-color .15s ease,color .15s ease;
}
.contact a:hover{background:var(--accent);border-color:var(--accent);color:var(--paper)}

/* ---------- bio + ask: same left edge as the name ---------- */
.bio{
  font-family:var(--display);font-size:1.35rem;line-height:1.58;
  max-width:40rem;margin:3.75rem 0 0 var(--indent);
}
.bio p{margin:0 0 1.15rem}
.bio p:last-child{margin-bottom:0}
.bio .prior{color:var(--muted);font-size:1.18rem}

.seeking{
  font-family:var(--mono);font-size:.87rem;line-height:1.72;
  margin:2.75rem 0 0 var(--indent);padding:1.15rem 1.35rem;
  border-left:3px solid var(--accent);
  background:rgba(47,79,66,.05);
  max-width:40rem;
}

/* ---------- sections ---------- */
section{margin-top:5rem}
h2{
  font-family:var(--mono);font-size:.78rem;font-weight:500;
  letter-spacing:.15em;text-transform:uppercase;color:var(--accent);
  margin:0 0 .5rem;padding-bottom:.85rem;border-bottom:1px solid var(--ink);
  display:flex;align-items:center;gap:.7rem;
}
h2::before{content:"";width:.55rem;height:.55rem;background:var(--accent);border-radius:1px;flex:none}
.entry{
  display:grid;grid-template-columns:var(--rail) 1fr;gap:var(--gutter);
  padding:2.1rem 1.1rem 2.1rem 0;margin-right:-1.1rem;
  border-bottom:1px solid var(--rule);
  transition:background .18s ease;
}
.entry:hover{background:rgba(47,79,66,.035)}
.entry:last-child{border-bottom:none}
.meta{font-family:var(--mono);font-size:.95rem;line-height:1.6;color:var(--muted);padding-top:.4rem;border-left:2px solid var(--accent);padding-left:1.1rem}
.venue{display:block;color:var(--ink);font-weight:500;font-size:1.05rem;letter-spacing:-.01em}
.note{display:block;margin-top:.28rem}
.stamp-tag{
  display:inline-block;margin-top:.6rem;
  font-family:var(--mono);font-size:.78rem;font-weight:500;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--paper);background:var(--accent);
  padding:.28rem .58rem;border-radius:2px;
}

.title{font-size:1.26rem;font-weight:600;line-height:1.32;margin:0 0 .5rem;letter-spacing:-.008em}
.title a{border-bottom-color:transparent}
.title a:hover{border-bottom-color:var(--accent-lift)}
.authors{font-size:.97rem;color:var(--muted);margin:0 0 .55rem;line-height:1.55}
.authors .me{color:var(--ink);font-weight:600}
.blurb{font-size:1.01rem;color:var(--muted);margin:0;max-width:38rem}
.links{font-family:var(--mono);font-size:.82rem;margin-top:.7rem;display:flex;flex-wrap:wrap;gap:1.1rem}

.role{font-size:1.26rem;font-weight:600;margin:0 0 .25rem;letter-spacing:-.008em}
.org{font-size:1.01rem;color:var(--muted);margin:0 0 .4rem}
.detail{font-size:1.01rem;color:var(--muted);margin:0;max-width:38rem}

.entry.award{align-items:stretch}
.entry.award>div:last-child{
  border:1px solid var(--rule);border-left:3px solid var(--accent);
  border-radius:2px;background:rgba(47,79,66,.04);
  padding:1.35rem 1.5rem;
}
.entry.award:hover{background:transparent}
.entry.award:hover>div:last-child{border-color:var(--accent)}
.award .title{margin-bottom:.25rem}
.scale{
  display:block;font-family:var(--mono);
  font-size:1.85rem;line-height:1.15;font-weight:500;
  color:var(--accent);margin-top:.5rem;letter-spacing:-.03em;
}
.scale small{display:block;font-size:.78rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--muted);margin-top:.45rem;font-weight:400}

footer{
  margin-top:5.5rem;padding-top:1.75rem;border-top:1px solid var(--ink);
  font-size:1rem;color:var(--muted);
}
footer p{margin:0;max-width:38rem}
footer .stamp{font-family:var(--mono);font-size:.78rem;margin-top:1.1rem}

/* ---------- mobile: rail collapses, one edge at zero ---------- */
@media (max-width:820px){
  :root{--rail:168px;--gutter:1.75rem}
  body{font-size:16.5px}
  .wrap{padding:3rem 1.35rem 4rem}
  .masthead{grid-template-columns:1fr;gap:1.6rem}
  .portrait{width:168px;height:168px}
  h1{margin-top:0}
  .bio,.seeking{margin-left:0;max-width:none}
  .bio{font-size:1.18rem;margin-top:2.5rem}
  section{margin-top:3.25rem}
  .entry{grid-template-columns:1fr;gap:.7rem;padding:1.6rem 0;margin-right:0}
  .entry:hover{background:transparent}
  .meta{padding-top:0;font-size:.9rem;border-left:none;padding-left:0}
  .masthead{padding-bottom:2rem}
  .portrait{box-shadow:7px 7px 0 rgba(47,79,66,.13)}
  .entry.award>div:last-child{padding:1.1rem 1.2rem}
  .venue{font-size:.98rem}
  .venue,.note{display:inline}
  .note{margin-left:.5rem}
  .stamp-tag{margin-top:.45rem}
  .title,.role{font-size:1.14rem}
  .scale{font-size:1.6rem}
}

@media (prefers-reduced-motion:no-preference){
  .wrap>*{animation:rise .5s ease-out backwards}
  .wrap>*:nth-child(2){animation-delay:.06s}
  .wrap>*:nth-child(3){animation-delay:.12s}
  .wrap>*:nth-child(4){animation-delay:.18s}
  @keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
}

/* ---------- reading page ---------- */
.backlink{
  font-family:var(--mono);font-size:.86rem;
  display:inline-block;margin-bottom:2.75rem;
}
.page-head{margin-bottom:3.5rem}
.page-head h1{font-size:clamp(2.4rem,5vw,3.2rem);margin:0 0 1.1rem}
.page-head .standfirst{
  font-family:var(--display);font-size:1.3rem;line-height:1.58;
  color:var(--muted);max-width:40rem;margin:0;
}
.book{
  display:grid;grid-template-columns:var(--rail) 1fr;gap:var(--gutter);
  padding:2.6rem 0;border-bottom:1px solid var(--rule);
}
.book:last-of-type{border-bottom:none}
.book-meta{font-family:var(--mono);font-size:.95rem;line-height:1.6;color:var(--muted)}
.book-cover{
  display:block;width:100%;height:auto;
  border:1px solid var(--rule);border-radius:2px;
  margin-bottom:1.1rem;background:#E4E4DD;
}
.book-meta .who{display:block;color:var(--ink);font-weight:500;font-size:1.05rem;letter-spacing:-.01em}
.book-meta .when{display:block;margin-top:.28rem}
.book h3{
  font-size:1.32rem;font-weight:600;line-height:1.32;
  letter-spacing:-.008em;margin:0 0 .9rem;
}
.book h3 .native{
  font-family:var(--display);font-weight:400;color:var(--muted);
  font-size:1.15rem;margin-left:.5rem;
}
.book-note{
  font-family:var(--display);font-size:1.19rem;line-height:1.62;
  color:var(--muted);max-width:38rem;margin:0;
}
.book-note p{margin:0 0 1rem}
.book-note p:last-child{margin-bottom:0}
.book-note strong{color:var(--ink);font-weight:500}
@media (max-width:820px){
  .backlink{margin-bottom:1.75rem}
  .page-head{margin-bottom:2.25rem}
  .page-head .standfirst{font-size:1.15rem}
  .book{grid-template-columns:1fr;gap:.7rem;padding:2rem 0}
  .book-cover{width:118px;margin-bottom:.75rem}
  .book-meta .who,.book-meta .when{display:inline}
  .book-meta .when{margin-left:.5rem}
  .book h3{font-size:1.16rem}
  .book-note{font-size:1.08rem;max-width:none}
}
