:root{                       /* light — the default */
  --bg:#f0eee6; --ink:#1f1e1d; --hover:#5e5d59;
  --line:#dcd8cc; --maxw:760px;
}
[data-theme="dark"]{
  --bg:#1f1e1d; --ink:#f0eee6; --hover:#b0aea5; --line:#3a3833;
}
@font-face{
  font-family:"Newsreader"; src:url("/assets/fonts/newsreader.woff2") format("woff2");
  font-weight:400 600; font-display:swap;
}
*{box-sizing:border-box;}
body{margin:0; background:var(--bg); color:var(--ink);
  font-family:"Newsreader","Times New Roman",serif;
  font-size:20px; line-height:1.6; font-optical-sizing:auto;}
.nav,main{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.nav{display:flex; justify-content:space-between; align-items:baseline;
  padding:46px 24px 18px; border-bottom:1px solid var(--line); margin-bottom:40px;}
.nav-right{display:flex; align-items:center; gap:18px;}
.wordmark{font-weight:600; font-size:1.3em; text-decoration:none; color:var(--ink);}
.nav nav a{color:var(--ink); opacity:.6; text-decoration:none; margin-left:18px;
  display:inline-block; padding:8px 0;}                 /* padding = tap target */
.nav nav a[aria-current="page"]{opacity:1; font-weight:600;}
theme-toggle{display:contents;}
.toggle{width:34px; height:18px; border:0; background:none; padding:0;
  display:grid; place-items:center; position:relative; cursor:pointer;}
.toggle-track{display:block; width:34px; height:18px; border:1px solid var(--ink);
  border-radius:999px; background:var(--bg); position:relative;}
.toggle-knob{display:block; position:absolute; left:2px; bottom:2px; width:12px; height:12px;
  border-radius:50%; background:var(--ink); transform:translateX(0);}
.toggle:focus{outline:0;}
[data-theme="dark"] .toggle-track{background:var(--ink);}
[data-theme="dark"] .toggle-knob{background:var(--bg); transform:translateX(16px);}
a{color:var(--ink); text-decoration:underline; text-underline-offset:2px;}
a:hover{color:var(--hover);}
img.portrait{width:320px; aspect-ratio:4/5; object-fit:cover;
  border-radius:2px; flex:none;}
.about{display:flex; gap:32px; align-items:flex-start;}  /* image left, text right */
.about-text{flex:1; word-spacing:.035em;}
.about-text>:first-child{margin-top:0;}                  /* align text top with image */
@media (max-width:700px){                                /* mobile */
  .about{flex-direction:column; gap:16px;}               /* stack image + text, center image */
  img.portrait{width:100%; max-width:280px; align-self:center;}
  main{padding:0 20px;}
  .nav{display:block; position:sticky; top:0; z-index:10;
    background:var(--bg); padding:18px 20px 10px; margin-bottom:32px;}
  .wordmark{display:flex; align-items:center; min-height:44px; padding-right:60px;
    white-space:nowrap; font-size:clamp(30px, 8.2vw, 32px); line-height:1.1;}
  .nav-right{display:block;}
  .nav nav{display:flex; align-items:center; gap:28px; min-height:44px; margin-top:4px;}
  .nav nav a{margin-left:0; padding:10px 0; font-size:19px; line-height:24px;}
  .toggle{position:absolute; top:18px; right:18px; width:44px; height:44px;
    border:0; background:none;}
  .toggle-track{width:40px; height:20px;}
  .toggle-knob{width:14px; height:14px;}
  [data-theme="dark"] .toggle-knob{transform:translateX(20px);}
}
@media (prefers-reduced-motion:no-preference){
  body{transition:background-color .2s linear, color .2s linear;}
  .nav{transition:background-color .2s ease, border-color .2s ease;}
  .wordmark,.nav nav a,main a{transition:color .2s linear;}
  .toggle-track{transition:background-color .2s ease, border-color .2s ease;}
  .toggle-knob{transition:background-color .2s ease, transform .2s ease;}
}