:root {
  color-scheme: light;
  --text: #222;
  --muted: #666;
  --link: #1264a3;
  --rule: #e4e7eb;
}
* { box-sizing: border-box; }
html { scroll-padding-top: 24px; }
body { margin: 0; background: #fff; color: var(--text); font: 15px/1.55 Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
a:focus-visible { outline: 2px solid var(--link); outline-offset: 4px; }
p, h1, h2, h3 { margin: 0; }
img { display: block; max-width: 100%; }
.page { width: min(900px, calc(100% - 48px)); margin: 42px auto 0; }
.skip-link { position: fixed; top: -60px; left: 16px; z-index: 10; background: #fff; padding: 10px 16px; }
.skip-link:focus { top: 10px; }
.intro { display: grid; grid-template-columns: minmax(0, 1fr) 210px; align-items: center; gap: 38px; }
.intro h1 { text-align: center; font-size: 32px; line-height: 1.25; font-weight: 400; margin-bottom: 22px; }
.chinese-name { font-size: 25px; white-space: nowrap; }
.bio { line-height: 1.65; }
.contact-links { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; column-gap: 11px; margin-top: 19px; }
.contact-links span { color: #888; }
.profile-photo { width: 210px; height: 272px; object-fit: cover; object-position: center 65%; border-radius: 4px; }
.affiliations { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: center; gap: 24px; list-style: none; padding: 0; margin: 30px 0 0; }
.affiliations li { display: flex; justify-content: center; align-items: center; min-width: 0; }
.affiliations a { display: flex; justify-content: center; align-items: center; min-height: 76px; max-width: 100%; }
.affiliations img { height: auto; max-height: 84px; object-fit: contain; }
.academic-section { margin-top: 38px; }
.academic-section h2 { font-size: 23px; font-weight: 400; line-height: 1.35; padding-bottom: 9px; border-bottom: 1px solid var(--rule); margin-bottom: 14px; }
.section-note { font-size: 14px; margin-bottom: 6px; }
.contribution-note { color: var(--muted); }
.publications { display: grid; gap: 27px; margin-top: 22px; }
.publication { display: grid; grid-template-columns: 190px minmax(0, 1fr); gap: 24px; align-items: center; }
.publication-image { display: block; }
.publication-image img { width: 190px; height: 125px; object-fit: contain; }
.publication h3 { font: 600 15px/1.4 Arial, Helvetica, sans-serif; margin-bottom: 4px; }
.publication p { font-size: 14px; line-height: 1.5; }
.authors { margin-bottom: 3px; }
.authors strong { font-weight: 600; }
.publication-links { margin-top: 3px; }
.publication-links span { padding-inline: 3px; color: var(--muted); }
.academic-list { margin: 0; padding-left: 23px; }
.academic-list li { margin-bottom: 9px; padding-left: 2px; }
.academic-list li:last-child { margin-bottom: 0; }
.academic-list strong { font-weight: 600; }
.academic-list .secondary { color: var(--muted); }
.page-footer { width: min(900px, calc(100% - 48px)); margin: 40px auto 24px; border-top: 1px solid var(--rule); padding-top: 15px; text-align: right; color: #777; font-size: 12px; }
.error-page { min-height: 60vh; padding-top: 36px; }
.error-page h1 { font-size: 30px; font-weight: 400; margin-bottom: 20px; }
.error-page p { margin-bottom: 16px; }
@media (max-width: 760px) {
  .page { margin-top: 30px; }
  .intro { grid-template-columns: minmax(0, 1fr) 170px; gap: 25px; }
  .intro h1 { font-size: 29px; }
  .chinese-name { font-size: 22px; }
  .profile-photo { width: 170px; height: 228px; }
  .affiliations { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: 28px; row-gap: 12px; }
  .publication { grid-template-columns: 160px minmax(0, 1fr); gap: 20px; }
  .publication-image img { width: 160px; height: 115px; }
}
@media (max-width: 580px) {
  .page { width: calc(100% - 36px); margin-top: 26px; }
  .intro { grid-template-columns: 1fr; gap: 23px; }
  .intro h1 { font-size: 30px; margin-bottom: 18px; }
  .chinese-name { font-size: 22px; }
  .profile-photo { justify-self: center; width: 160px; height: 207px; }
  .contact-links { column-gap: 10px; }
  .academic-section { margin-top: 30px; }
  .academic-section h2 { font-size: 22px; }
  .publication { grid-template-columns: 1fr; gap: 11px; }
  .publication-image img { width: 190px; height: 115px; }
  .publications { gap: 26px; }
  .publication h3 { font-size: 15px; }
  .academic-list { padding-left: 20px; }
  .page-footer { width: calc(100% - 36px); margin-top: 30px; }
}
@media print {
  body { font-size: 11pt; }
  .page { width: 100%; margin-top: 0; }
  .skip-link, .page-footer { display: none; }
  .publication, .academic-list li { break-inside: avoid; }
  .academic-section h2 { break-after: avoid; }
}
