:root { --blue:#002d72; --ink:#28313a; --muted:#62707c; --line:#e0e5e9; --serif:"Source Serif 4",Charter,Georgia,serif; --sans:"Work Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; --mono:ui-monospace,SFMono-Regular,Consolas,monospace; --body-size:15px; --title-size:15px; --section-size:20px; --meta-size:12px; --section-gap:40px; --row-space:16px; --entry-gap:18px; --label-width:140px; --anchor-offset:90px; }
* { box-sizing:border-box; }
body { margin:0; background:white; color:var(--ink); font:var(--body-size)/1.6 var(--sans); border-top:3px solid var(--blue); }
.site-wrap { width:min(860px,calc(100% - 48px)); margin:auto; }
a { color:var(--blue); text-decoration:none; text-underline-offset:3px; }
a:hover { text-decoration:underline; }
button { font:inherit; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid #68ace5; outline-offset:3px; }
h1,h2,h3,p { margin:0; }
h1 { font:600 34px/1.2 var(--serif); letter-spacing:-.02em; }
h2 { font:600 var(--section-size)/1.4 var(--sans); color:var(--blue); margin-bottom:12px; }
h3 { font:600 var(--title-size)/1.5 var(--sans); color:#263d54; }
.site-header { position:sticky; top:0; z-index:30; display:flex; justify-content:space-between; gap:20px; align-items:center; padding:22px 0; background:#fff; box-shadow:0 1px 0 var(--line); }
.wordmark { font:600 15px var(--serif); }
.language-switch { display:inline-flex; align-items:center; gap:8px; white-space:nowrap; font-size:12px; }
.language-switch [aria-current="page"] { font-weight:600; text-decoration:underline; text-underline-offset:4px; }
:lang(zh-Hans) { --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif; }
.site-header nav { display:flex; flex-wrap:wrap; gap:10px 24px; font-size:13px; }
.identity { padding:28px; background:#f5f7fa url('assets/identity-background.png') right 18px top 14px / 200px 121px no-repeat; }
.identity-person { display:grid; grid-template-columns:100px minmax(0,1fr); align-content:start; column-gap:24px; }
.portrait { grid-row:1 / 3; display:block; width:100px; height:124px; object-fit:cover; border-radius:5px; }
.identity-copy { min-width:0; padding-right:150px; }
.research-direction { line-height:1.65; }
.research-direction + .research-direction { margin-top:24px; }
.research-direction h3 { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.direction-icon { width:16px; height:16px; flex:none; }
.research-progress { margin:8px 0 0; padding-left:20px; }
.research-progress li + li { margin-top:5px; }
.research-progress strong { color:#263d54; font-weight:600; }
.research-links { display:flex; flex-wrap:wrap; gap:4px 16px; margin-top:9px; color:var(--muted); font-size:13px; }
.position { font-size:14px; line-height:1.55; color:var(--muted); margin-top:9px; }
.position-detail { font-size:12px; }
.contacts { grid-column:2; display:flex; flex-wrap:wrap; gap:8px 17px; font-size:13px; margin-top:13px; }
.contacts a { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.scholar-counts { font-size:12px; color:var(--muted); font-weight:400; }
.link-icon { width:14px; height:14px; flex:none; }
main { scroll-margin-top:var(--anchor-offset); }
main > section { padding-top:var(--section-gap); scroll-margin-top:var(--anchor-offset); }
.publication { scroll-margin-top:var(--anchor-offset); }
.publication,.software-entry,.background-entry { border-bottom:1px solid var(--line); }
.work-summary { display:grid; grid-template-columns:var(--label-width) minmax(0,1fr) 14px; gap:var(--entry-gap); align-items:baseline; padding:var(--row-space) 0; cursor:pointer; list-style:none; }
.work-summary::-webkit-details-marker { display:none; }
.work-summary::after { content:"+"; color:var(--muted); text-align:center; font-size:17px; line-height:1.3; }
.work-details[open] > .work-summary::after { content:"−"; }
.entry-label { display:flex; align-items:baseline; gap:6px; min-width:0; color:var(--blue); font-size:var(--meta-size); line-height:1.6; font-weight:600; }
.entry-label-text { white-space:nowrap; }
.entry-marks { display:grid; gap:4px; width:18px; flex:none; align-self:flex-start; }
.entry-icon { display:block; width:18px; height:18px; object-fit:contain; }
.work-heading { min-width:0; }
.work-title { display:block; text-wrap:pretty; }
.work-actions { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin-top:4px; font-size:12px; font-weight:400; white-space:nowrap; }
.work-actions a { display:inline-flex; align-items:center; gap:4px; padding:2px 0; }
.software-tagline { color:var(--muted); font-weight:400; line-height:1.5; }
.language-tag { display:inline-flex; align-items:center; padding:0 6px; border:1px solid var(--line); border-radius:3px; background:#f5f7fa; color:var(--muted); font-size:var(--meta-size); line-height:1.6; }
.work-summary:hover .work-title { color:var(--blue); }
.work-body { padding:0 32px var(--row-space) calc(var(--label-width) + var(--entry-gap)); }
.pub-meta { display:flex; flex-wrap:wrap; gap:13px; margin-bottom:6px; font-size:12px; line-height:1.5; color:var(--muted); }
.pub-meta span:first-child { color:var(--blue); font-weight:650; }
.pub-description,.project-description { margin-top:10px; color:#45525e; }
.pub-authors { margin-top:10px; color:#6a7680; font-size:13px; line-height:1.6; }
.pub-authors strong { color:#495965; font-weight:600; }
.software-entry .project-description { margin-top:0; }
.software-example { margin:12px 0 0; min-width:0; }
.software-example figcaption { color:var(--blue); font-size:var(--meta-size); font-weight:600; }
.software-example .example-note { margin-top:5px; color:var(--muted); font-size:var(--meta-size); line-height:1.6; }
.software-example pre { max-width:100%; overflow-x:auto; margin:8px 0; padding:12px 14px; border:1px solid var(--line); border-radius:3px; background:#f5f7fa; color:var(--ink); font:12px/1.65 var(--mono); tab-size:4; }
.software-example code { font-family:var(--mono); }
.software-preview { display:block; width:100%; max-width:360px; height:auto; margin-top:14px; border:1px solid var(--line); border-radius:3px; }
.entry-meta { font-size:var(--meta-size); color:var(--muted); margin-top:4px; }
.more-items > summary { cursor:pointer; color:var(--blue); font-size:13px; font-weight:600; padding:10px 0; }
.more-items[open] > summary { border-bottom:1px solid var(--line); }
.summary-note { font-size:12px; color:var(--muted); font-weight:400; margin-left:12px; }
.when-open { display:none; }
.more-items[open] > summary .when-open { display:inline; }
.more-items[open] > summary .when-closed { display:none; }
.more-items[open] > summary .summary-note { display:none; }
.background-entry { display:grid; grid-template-columns:var(--label-width) minmax(0,1fr) 14px; align-items:baseline; gap:var(--entry-gap); padding:var(--row-space) 0; }
.entry-content { grid-column:2; min-width:0; }
.entry-content h3 { margin-bottom:3px; }
.entry-content > p { color:#45525e; }
.entry-date { font-variant-numeric:tabular-nums; }
.entry-date span { display:block; white-space:nowrap; }
.entry-content > .entry-meta { color:var(--muted); }
.entry-content > .entry-meta + p { margin-top:7px; }
footer { display:flex; gap:22px; padding:22px 0 30px; border-top:1px solid var(--line); margin-top:30px; font-size:12px; }
@media(max-width:780px) {
 :root { --section-gap:32px; --row-space:14px; --anchor-offset:148px; }
 .site-wrap { width:calc(100% - 32px); }
 .site-header { gap:14px; flex-wrap:wrap; padding:18px 0; }
 .site-header nav { gap:18px; }
 .identity { padding:23px 18px; background-image:none; }
 .identity-person { grid-template-columns:72px minmax(0,1fr); column-gap:17px; background-image:none; }
 .identity-copy { padding-right:0; }
 .portrait { grid-row:1; width:72px; height:90px; }
 .contacts { grid-column:1 / -1; margin-top:18px; }
 h1 { font-size:29px; }
}
@media(max-width:620px) {
 .work-summary { grid-template-columns:minmax(0,1fr) 14px; gap:5px 12px; }
 .entry-label { grid-column:1; }
 .entry-marks { display:flex; width:auto; }
 .work-heading,.work-summary > .work-title { grid-column:1; }
 .work-summary::after { grid-column:2; grid-row:1 / 3; align-self:center; }
 .work-body { padding-right:0; padding-left:0; }
 .background-entry { grid-template-columns:minmax(0,1fr); gap:5px; }
 .entry-content { grid-column:1; }
 .entry-date span { display:inline; }
 .summary-note { margin-left:8px; }
}