*{box-sizing:border-box}body{background:#FFFFFF;padding:0;margin:0;color:#343a38;font:18px/1.55 'Crimson Pro',Georgia,serif}.wrapper{width:960px;margin:0 auto;display:grid;grid-template-columns:232px 1fr;gap:68px;padding:60px 0 40px}header{float:none;position:sticky;top:60px;width:auto;padding:0;text-align:center;align-self:start}.image.avatar{display:block;margin:0 auto 20px;width:150px;height:150px}.image.avatar img{width:150px;height:150px;padding:0;border-radius:50%;object-fit:cover}.profile-name{font-size:18px;line-height:1.2;color:#343a38;font-weight:500;display:block}.chinese-name{font-family:inherit;font-size:18px;color:#343a38;margin:9px 0 17px}.position{font-size:18px;margin:0 0 8px}.affiliation{font-size:18px;line-height:1.5;margin:0 0 12px}.email{font-family:inherit;font-size:18px;color:#343a38}.cv-link{font-size:18px;margin:17px 0 0}.content-column{min-width:0}nav{display:flex;gap:28px;border-bottom:1px solid #E4E8EA;padding:0 0 17px;margin-bottom:34px;font-size:18px}nav a{color:#343a38}nav a[aria-current]{color:#343a38;text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:1px}main{min-height:460px}h1{font-size:18px;font-weight:600;margin:0 0 22px;color:#343a38}h2{font-size:18px;font-weight:600;line-height:1.25;margin:30px 0 17px;color:#343a38}h3{font-size:18px;line-height:1.35;font-weight:600;margin:0 0 6px;color:#343a38}p{margin:0 0 20px}a{color:#343a38}a:hover{color:#343a38;text-decoration:underline}a:focus-visible{outline:2px solid #6862B5;outline-offset:4px}article{margin:0 0 28px}.meta{font-size:18px;margin:2px 0;color:#343a38}.status{font-style:italic}.award{color:#343a38;font-size:18px}.summary{font-size:18px;line-height:1.5;margin:9px 0 0}.subtitle{font-size:18px;margin-top:-13px;color:#343a38}.muted{color:#343a38;font-size:18px}.courses{padding-left:18px}.courses li{padding-left:3px;margin-bottom:20px}.site-credit{margin-top:54px;padding-top:16px;border-top:1px solid #E4E8EA;color:#343a38;font-size:18px}.site-credit a{color:#343a38}.skip{position:absolute;top:-100px}.skip:focus{top:0;padding:10px;background:#FFFFFF;z-index:10}@media(max-width:1000px){.wrapper{width:calc(100% - 60px);grid-template-columns:210px 1fr;gap:40px;padding-top:40px}header{position:sticky;top:40px}.image.avatar img{width:150px}nav{gap:23px}}@media(max-width:700px){.wrapper{display:block;width:calc(100% - 40px);padding-top:30px}header{position:static;width:auto;padding:0 0 28px}.image.avatar{width:110px;height:110px;margin-bottom:14px}.image.avatar img{width:110px;height:110px}.profile-name{font-size:18px}.chinese-name{margin:6px 0 12px}.affiliation{font-size:18px;margin-bottom:8px}.position{font-size:18px}.cv-link{margin-top:10px}nav{justify-content:center;gap:24px;font-size:18px;padding-top:20px;border-top:1px solid #E4E8EA;margin-bottom:28px}h1{font-size:18px}main{min-height:0}.site-credit{margin-top:35px}.wrapper header{float:none}}@media(max-width:360px){nav{gap:17px}}

/* Consistent type throughout; emphasis uses weight and spacing. */
body{font-family:"Crimson Pro",Georgia,serif;font-size:18px;color:#343a38}h1,h2,h3,h4,h5,h6,p,li,a,strong,em,small,.meta,.muted,.award,.subtitle,.profile-name,.chinese-name,.position,.affiliation,.email,.site-credit{font-family:inherit;color:inherit;font-size:18px}h1,h2,h3,.profile-name{font-weight:600}main a,.cv-link a,.email,.site-credit a{text-decoration:underline;text-underline-offset:3px}a:hover{color:inherit;text-decoration:underline}.status{font-style:normal}.subtitle{margin-top:0}.profile-name{line-height:1.4}

/* A quiet iris-purple accent and consistent heading hierarchy. */
:root{--accent:#6862B5;--accent-hover:#4D478D}
h1{font-size:28px;line-height:1.25;color:var(--accent);margin-bottom:24px}
h2{font-size:23px;line-height:1.3;color:var(--accent);margin-top:34px;margin-bottom:18px}
h3{font-size:19px;line-height:1.4;color:#343a38}
.profile-name{font-size:26px;color:var(--accent)}
a,nav a[aria-current],.site-credit a{color:var(--accent)}
nav a{color:#343a38}
a:hover{color:var(--accent-hover)}
a:focus-visible{outline-color:var(--accent)}
h1 a,h2 a,h3 a,h1 em,h2 em,h3 em{font-size:inherit}
article{margin-bottom:27px}.meta{margin-top:3px}
@media(max-width:700px){h1{font-size:26px}h2{font-size:22px}.profile-name{font-size:26px}}

/* Muted palette: iris purple, white, and soft white. */
:root{--paper:#FFFFFF;--ink:#343a38;--accent:#6862B5;--accent-hover:#4D478D;--active-line:#6862B5;--selection:#F0EEF8;--line:#E4E8EA}
body{background:var(--paper);color:var(--ink)}
nav{border-color:var(--line)}
nav a[aria-current]{text-decoration-color:var(--active-line);text-decoration-thickness:2px;text-underline-offset:8px}
main a,.cv-link a,.email{ text-decoration-color:#C3BFE3 }
main a:hover,.cv-link a:hover,.email:hover{text-decoration-color:var(--active-line)}
.site-credit{border-color:var(--line)}
::selection{background:var(--selection);color:var(--ink)}
a:focus-visible{outline:2px solid var(--accent);background:var(--selection)}

/* Give the professional title room to read as complete phrases. */
.wrapper{width:min(1080px,calc(100% - 64px));grid-template-columns:320px minmax(0,1fr);gap:64px}
header{width:320px;max-width:100%}
.image.avatar{margin-bottom:23px}
.profile-name{line-height:1.2}
.chinese-name{margin:9px 0 22px}
.appointment{margin:0 0 17px}
.position,.department{margin:0;line-height:1.55;font-size:18px;white-space:nowrap}
.affiliation{margin:0 0 18px;line-height:1.55;white-space:nowrap}
.cv-link{margin-top:12px}
@media(min-width:821px) and (max-width:1000px){.wrapper{grid-template-columns:320px minmax(0,1fr);gap:40px}}
@media(max-width:820px){
 .wrapper{display:block;width:calc(100% - 40px);padding-top:32px}
 header{position:static;width:320px;margin:0 auto;padding:0 0 32px;float:none}
 .image.avatar{width:120px;height:120px;margin-bottom:18px}
 .image.avatar img{width:120px;height:120px}
 .chinese-name{margin-bottom:18px}
 .appointment{margin-bottom:14px}
 .affiliation{margin-bottom:14px}
 nav{justify-content:center;padding-top:20px;border-top:1px solid var(--line);margin-bottom:30px}
 main{min-height:0}
}
@media(max-width:320px){.position,.department,.affiliation{white-space:normal;text-wrap:balance}nav{gap:14px;flex-wrap:wrap}}

/* Keep publication titles consistent, with no repeated page labels. */
h1.book-title{font-size:19px;line-height:1.4;font-weight:600;margin-bottom:14px}
main>h2:first-child{margin-top:0}

/* One shared section level for research categories and universities. */
h2.section-title{font-size:23px;line-height:1.3;font-weight:600;color:var(--accent)}
@media(max-width:700px){h2.section-title{font-size:22px}}

/* One blue accent, with white-mixed tints for quiet supporting details. */
:root{--paper:#ffffff;--ink:#34383e;--accent:#3778b8;--heading:var(--accent);--accent-hover:#b66a50;--active-line:var(--accent);--selection:color-mix(in srgb,var(--accent) 18%,white);--line:color-mix(in srgb,var(--accent) 28%,white);--portrait-ring:color-mix(in srgb,var(--accent) 45%,white);--focus:var(--accent);--publication-blue:var(--accent)}
body{background:var(--paper);color:var(--ink);border-top:3px solid var(--accent)}
h1,h2,h2.section-title,.profile-name{color:var(--heading)}
h3{color:var(--ink)}
a,main a,.cv-link a,.email,.site-credit a{color:var(--accent);text-decoration-color:currentColor}
nav a:not([aria-current]){color:var(--ink)}
nav a[aria-current]{color:var(--accent);text-decoration-color:currentColor;text-decoration-thickness:3px}
a:hover,main a:hover,.cv-link a:hover,.email:hover,.site-credit a:hover{color:var(--accent-hover);text-decoration-color:currentColor;text-decoration-thickness:2px}
nav{border-color:var(--line)}
.site-credit{border-top-color:var(--line)}
.image.avatar{padding:3px;background-color:#c9cdd0;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.16) 0px,rgba(255,255,255,.16) 1px,rgba(86,94,101,.06) 1px,rgba(86,94,101,.06) 2px),linear-gradient(120deg,#c5c9cc,#d6d9db);border-radius:50%;box-shadow:0 0 0 1px #bfc4c8}
.image.avatar img{width:100%;height:100%;border:2px solid var(--paper);border-radius:50%}
a:focus-visible{background:var(--paper);outline-color:var(--focus);color:var(--accent-hover);text-decoration-color:currentColor}
::selection{background:var(--selection);color:var(--ink)}
main a.publication-link,main a.publication-link:hover,main a.publication-link:focus-visible{color:var(--publication-blue);text-decoration-color:currentColor}
main article h3 a{text-decoration:none}
main article h3 a:hover,main article h3 a:focus-visible{text-decoration:underline;text-decoration-color:currentColor;text-underline-offset:3px}
main article h3 a:hover,main article h3 a:focus-visible,main a.publication-link:hover,main a.publication-link:focus-visible{color:var(--accent-hover);text-decoration-color:currentColor}

/* A more prominent portrait within the existing sidebar. */
.image.avatar{width:320px;height:auto;max-width:100%;aspect-ratio:1}
.image.avatar img{display:block;height:auto;aspect-ratio:1}
@media(max-width:820px){.image.avatar{width:280px}}

/* University headings match publication title size. */
h2.section-title.school-title{font-size:19px}

.contact-address{font:inherit;font-style:normal;line-height:1.65}
.coauthors a,.coauthors a:hover,.coauthors a:focus-visible{text-decoration:none}
.paper-abstract{margin-top:10px}
.paper-abstract summary{cursor:pointer;color:var(--accent);font:inherit;width:fit-content;list-style:none}
.paper-abstract summary::-webkit-details-marker{display:none}
.paper-abstract summary::marker{content:""}
.paper-abstract summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.paper-abstract p{margin:10px 0 0;font:inherit;line-height:1.55;color:var(--ink)}
nav{flex-wrap:wrap}
@media(max-width:700px){nav{column-gap:18px;row-gap:16px}}

/* Match navigation hover and keyboard focus to all other links. */
nav a:hover,nav a:focus-visible{color:var(--accent-hover);text-decoration-color:currentColor}
