/* Selected About me layout. All rules stay inside the biography article. */
.manuscript{margin:0 auto;padding:48px 0 64px;max-width:816px;width:calc(100% - var(--gutter)*2);font:400 var(--manuscript-size)/1.5 var(--serif);font-optical-sizing:auto;font-synthesis:none;--manuscript-size:18.9px;--manuscript-line:calc(var(--manuscript-size) * 1.5)}
.manuscript h1{font:400 clamp(40px,4.8vw,64px)/1.05 var(--serif);letter-spacing:-.025em;text-wrap:balance;text-align:center;margin-bottom:48px}
.manuscript em{font-weight:400}
.manuscript p{font:inherit;letter-spacing:-.02em;text-wrap:pretty;max-width:65ch;text-align:start;hyphens:manual}
.manuscript .manuscript-body{max-width:640px;margin:auto}
.manuscript .manuscript-body>p+p:not(.personal-note){margin-top:24px}
.manuscript .illuminated-opening{position:relative;display:flow-root;margin-bottom:24px;padding-right:0}
/* One pixel of clearance keeps fractional line rounding from indenting a fourth line. */
.manuscript .initial{float:left;display:grid;place-items:center;height:calc(var(--manuscript-line) * 3 - 1px);font:96px/.78 var(--serif);margin:0 12px 0 0;padding:0 16px;border:1px solid currentColor}
.manuscript .personal-note{font:15px/1.5 var(--serif);letter-spacing:0;max-width:58ch;border-top:1px solid var(--line);padding-top:24px;margin-top:40px}
@media(max-width:650px){
  .manuscript p{text-align:start;hyphens:manual}
  .manuscript h1{font-size:44px;margin-bottom:40px}
  .manuscript .illuminated-opening{padding-right:0;margin-bottom:24px;min-height:0}
  .manuscript .initial{font-size:76px;padding:0 12px;margin-right:8px}
  .manuscript .personal-note{font-size:14px}
}
@media(max-width:359px){.manuscript h1{font-size:40px}}

/* Biography links inherit the selected orange ink and manuscript type. */
.manuscript .manuscript-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.16em}
.manuscript .manuscript-profiles{display:flex;flex-wrap:wrap;gap:8px 32px;margin-top:28px;font:inherit}
.manuscript .manuscript-profiles a{display:inline-flex;align-items:center;gap:6px;min-height:44px}

/* Match the existing menu type size at its responsive breakpoint. */
@media(max-width:800px){.manuscript{--manuscript-size:16.2px}}
