:root {
  --ink: #302b35;
  --muted: #716879;
  --purple: #76509a;
  --light-purple: #f4eef9;
  --lavender: #dfd1ec;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--ink); font: 17px/1.8 var(--sans); }
::selection { background: #e9dcf4; }
a { color: var(--purple); text-decoration: none; text-underline-offset: 4px; text-decoration-thickness: 1px; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid var(--purple); outline-offset: 4px; border-radius: 2px; }
p { margin: 0 0 20px; }
h1, h2, h3 { margin: 0; font-family: var(--serif); font-weight: 400; line-height: 1.4; letter-spacing: -.015em; }
.site-shell { display: grid; grid-template-columns: 215px minmax(0, 1fr); gap: 76px; width: min(1060px, 100%); padding: 80px 25px; margin-inline: auto; }
.profile { position: sticky; top: 45px; align-self: start; }
.profile-photo { display: block; width: 198px; max-width: 100%; height: auto; border-radius: 2px; margin-bottom: 22px; }
.profile-name { font-size: 29px; white-space: nowrap; line-height: 1.3; }
.profile-chinese { font-size: 18px; font-family: var(--serif); letter-spacing: .12em; color: var(--muted); margin: 7px 0 18px; }
.profile-links { display: flex; flex-direction: column; gap: 2px; align-items: flex-start; font-size: 13px; }
.profile-email { color: #000; }
.email-label { color: var(--purple); }
.main-content { min-width: 0; padding-top: 0; }
.main-content:focus { outline: none; }
.biography { max-width: 670px; }
.biography h2 { font-size: 27px; color: #554261; margin-bottom: 16px; }
.biography p:last-child { margin-bottom: 0; }
.section-nav { display: flex; flex-wrap: wrap; gap: 8px 25px; align-items: center; padding: 12px 17px; margin: 30px 0 34px; background: var(--light-purple); border-radius: 3px; font-size: 14px; }
.section-nav a { padding-block: 3px; }
.academic-section { margin-top: 34px; scroll-margin-top: 25px; }
.academic-section h2 { font-size: 27px; border-bottom: 1px solid var(--lavender); padding-bottom: 10px; color: #554261; scroll-margin-top: 25px; }
.publication-list { list-style: none; margin: 0; padding: 0; }
.publication-entry { padding-top: 22px; }
.publication-entry + .publication-entry { margin-top: 4px; }
.publication-entry h3 { font-size: 22px; line-height: 1.5; margin-bottom: 8px; }
.publication-entry h3 a { color: #222; }
.paper-coauthors, .paper-venue { font-size: 14px; line-height: 1.85; margin: 0; }
.paper-coauthors { color: var(--muted); }
.paper-venue { margin-top: 4px; color: var(--ink); }
.teaching-list { margin: 19px 0 0; padding-left: 20px; font-size: 16px; }
.teaching-list li { padding-left: 3px; margin-bottom: 9px; }
.course-name { font-weight: 500; }
.teaching-details { margin: 3px 0 0; color: var(--muted); font-size: 14px; }
.skip-link { position: absolute; top: -100px; left: 20px; padding: 8px 15px; background: #554261; color: white; z-index: 5; }
.skip-link:focus { top: 12px; }
.main-content > h2 { font-size: 28px; margin-bottom: 20px; }
@media (max-width: 1050px) {
  .site-shell { grid-template-columns: 190px minmax(0, 1fr); gap: 46px; padding-inline: 30px; }
  .profile-photo { width: 185px; }
  .profile-name { font-size: 27px; }
}
@media (max-width: 760px) {
  body { font-size: 16px; line-height: 1.85; }
  .site-shell { display: block; max-width: 650px; padding: 32px 24px 50px; }
  .profile { position: static; display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 23px; align-items: center; padding-bottom: 27px; margin-bottom: 27px; border-bottom: 1px solid var(--lavender); }
  .profile-photo { width: 112px; margin: 0; }
  .profile-name { font-size: 27px; white-space: normal; }
  .profile-chinese { margin: 3px 0 10px; font-size: 16px; }
  .profile-links { font-size: 12px; }
  .section-nav { font-size: 13px; gap: 4px 20px; padding: 10px 13px; margin-block: 25px 28px; }
  .academic-section { margin-top: 28px; scroll-margin-top: 18px; }
  .academic-section h2, .biography h2 { font-size: 25px; }
  .publication-entry h3 { font-size: 21px; }
  .publication-entry { padding-top: 18px; }
}
@media (max-width: 390px) {
  .site-shell { padding-inline: 20px; }
  .profile { grid-template-columns: 90px minmax(0, 1fr); gap: 16px; }
  .profile-photo { width: 90px; }
  .profile-name { font-size: 24px; }
  .section-nav { column-gap: 16px; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media print {
  :root { --ink: #000; --muted: #444; --purple: #000; --lavender: #ccc; }
  body { font-size: 10.5pt; line-height: 1.65; }
  .site-shell { display: block; width: 100%; padding: 0; }
  .profile { position: static; border: 0; padding: 0 0 20px; margin: 0; }
  .profile-photo, .section-nav, .skip-link { display: none; }
  .profile-name { font-size: 24pt; }
  .profile-chinese { margin-bottom: 5px; }
  .profile-links a { display: none; }
  .academic-section { margin-top: 24px; }
  .academic-section h2, .biography h2 { font-size: 18pt; break-after: avoid; }
  .publication-entry { break-inside: avoid; }
  .publication-entry h3 { font-size: 13pt; }
  .paper-coauthors, .paper-venue { font-size: 10pt; }
  @page { margin: 18mm; }
}