:root {
      --ink: #1a1a18;
      --ink-soft: #6b6b66;
      --paper: #fbfaf7;
      --rule: #e4e2db;
      --accent: #0f70b7;
    }
    * { margin: 0; padding: 0; box-sizing: border-box; }
    html { font-size: 17px; }
    body {
      font-family: "Newsreader", Georgia, "Times New Roman", serif;
      background: var(--paper);
      color: var(--ink);
      line-height: 1.65;
      max-width: 640px;
      margin: 0 auto;
      padding: 4rem 1.5rem 6rem;
      font-feature-settings: "liga", "kern";
    }
    header {
      border-bottom: 1px solid var(--rule);
      padding-bottom: 1.8rem;
      margin-bottom: 2rem;
    }
    .portrait {
      display: block;
      width: 280px;
      max-width: 100%;
      height: auto;
      border-radius: 20px;
      margin: 0 0 2.2rem;
    }
    #about h2 {
      border-top: none;
      padding-top: 0;
      margin-top: 0;
    }
    .sublabel {
      font-size: 0.85rem;
      color: var(--ink-soft);
      margin: 0.55rem 0 0.3rem;
    }
    .sublist {
      margin: 0 0 0.4rem 1.1rem;
      list-style: none;
    }
    .sublist li {
      font-size: 0.92rem;
      margin-bottom: 0.3rem;
    }
    .sublist li::before {
      content: "\2023\00a0";
      color: var(--ink-soft);
    }
    h1 {
      font-size: 1.6rem;
      font-weight: 500;
      letter-spacing: -0.01em;
      margin-bottom: 0.15rem;
    }
    .role { color: var(--ink-soft); font-size: 0.98rem; }
    nav { margin-top: 0.8rem; }
    nav a {
      color: var(--accent);
      text-decoration: none;
      margin-right: 1.15rem;
      font-size: 0.93rem;
    }
    nav a:hover { text-decoration: underline; }
    h2 {
      font-size: 0.78rem;
      font-weight: 600;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--ink-soft);
      border-top: 1px solid var(--rule);
      padding-top: 1.6rem;
      margin: 2.7rem 0 1rem;
    }
    p { margin-bottom: 1rem; }
    a { color: var(--accent); }
    ul { list-style: none; }
    li { margin-bottom: 0.7rem; }
    .meta {
      color: var(--ink-soft);
      font-size: 0.85rem;
      display: block;
    }
    .year {
      font-size: 0.85rem;
      color: var(--ink-soft);
      margin: 1.4rem 0 0.6rem;
      font-variant-numeric: tabular-nums;
    }
    footer {
      margin-top: 4rem;
      padding-top: 1.4rem;
      border-top: 1px solid var(--rule);
      color: var(--ink-soft);
      font-size: 0.85rem;
    }
    @media (max-width: 480px) {
      .portrait { width: 100%; }
    }
#email-copy svg {
  margin-left: 0.3rem;
  vertical-align: -2px;
  opacity: 0.65;
}
#email-copy:hover svg { opacity: 1; }