:root { --ink:#303030; --soft:#6f6f6f; --line:#e7e7e7; --blue:#1d5fa7; --blue-soft:#eef5fc; --bg:#fafafa; --serif:"Noto Serif", Georgia, serif; --sans:"Inter", Arial, sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--bg); font:15px/1.72 var(--sans); }
a { color:var(--blue); text-decoration:none; } a:hover { text-decoration:underline; }
.layout { display:grid; grid-template-columns:300px minmax(0, 920px); gap:clamp(3rem, 8vw, 7rem); max-width:1400px; margin:auto; padding:3.5rem clamp(1.5rem, 5vw, 5rem); }
.sidebar { position:sticky; top:2rem; align-self:start; }
.avatar { display:block; width:190px; height:220px; object-fit:cover; object-position:center; border-radius:5px; }
.sidebar h1 { margin:1.35rem 0 .05rem; font:600 1.55rem/1.2 var(--serif); }.chinese { margin:0; color:var(--soft); }.role { margin:1.3rem 0; font-size:.9rem; line-height:1.6; }
.profile-meta,.side-nav,.news-list,.compact-list { padding:0; list-style:none; }.profile-meta { margin:0; color:var(--soft); font-size:.84rem; }.profile-meta li { margin:.32rem 0; }
.side-nav { margin:2.1rem 0 0; padding-top:1.3rem; border-top:1px solid var(--line); }.side-nav a { display:block; width:max-content; margin:.5rem 0; color:var(--ink); font-size:.86rem; }.side-nav a:hover { color:var(--blue); }
main { min-width:0; }.section { padding:0 0 3.3rem; margin:0 0 3.2rem; border-bottom:1px solid var(--line); }.section h2 { margin:0 0 1.25rem; font:600 1.45rem/1.25 var(--serif); color:#202020; }.intro { padding-top:.3rem; }.intro h2 { font-size:2.2rem; }.intro p { max-width:820px; margin:1.05rem 0; }.eyebrow,.badge { margin:0 0:.8rem!important; color:var(--blue); font-size:.72rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; }
.news-list li,.compact-list li { position:relative; padding-left:6.5rem; margin:.9rem 0; }.news-list time { position:absolute; left:0; color:var(--soft); font-size:.8rem; }.compact-list li { padding-left:1.1rem; }.compact-list li::before { position:absolute; left:0; content:"•"; color:var(--blue); }
.publication-list { display:grid; gap:1rem; }.publication-list article { padding:1.3rem 1.45rem; border:1px solid var(--line); border-radius:6px; background:#fff; }.publication-list article:hover { border-color:#bcd2e9; background:var(--blue-soft); }.publication-list h3,.timeline h3,.project-card h3 { margin:0; font:600 1.08rem/1.45 var(--serif); }.publication-list article > p:not(.badge) { margin:.55rem 0 .8rem; color:var(--soft); font-size:.87rem; }.actions { display:flex; gap:1.2rem; font-size:.82rem; font-weight:600; }
.timeline { display:grid; gap:1.4rem; }.timeline article { display:grid; grid-template-columns:125px 1fr; gap:1.5rem; }.timeline time { color:var(--soft); font-size:.82rem; }.timeline p { margin:.5rem 0 0; color:var(--soft); font-size:.9rem; }
.project-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:1.1rem; }.project-card { display:flex; flex-direction:column; min-height:225px; padding:1.45rem; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); transition:transform .18s ease, box-shadow .18s ease; }.project-card:hover { color:var(--ink); transform:translateY(-3px); box-shadow:0 12px 26px rgba(37,70,104,.1); text-decoration:none; }.project-card span { color:var(--blue); font-size:.72rem; font-weight:600; text-transform:uppercase; }.project-card h3 { margin:1.8rem 0 .5rem; font-size:1.28rem; }.project-card p { margin:0; color:var(--soft); font-size:.87rem; }.project-card b { margin-top:auto; padding-top:1.6rem; color:var(--blue); font-size:.8rem; }
footer { padding-bottom:1rem; color:var(--soft); font-size:.78rem; }.mobile-header { display:none; }
.zh { display:none; font-family:"Noto Serif SC", var(--serif); }
html[data-lang="zh"] .en { display:none; } html[data-lang="zh"] .zh { display:inline; } html[data-lang="zh"] div.zh, html[data-lang="zh"] p.zh { display:block; }
.language-switch { display:flex; gap:.35rem; margin-top:1.6rem; }.language-switch button { padding:.3rem .5rem; border:1px solid var(--line); border-radius:3px; background:#fff; color:var(--soft); font:600 .7rem var(--sans); cursor:pointer; }.language-switch button:hover, .language-switch button.active { border-color:var(--blue); background:var(--blue-soft); color:var(--blue); }
@media (max-width:850px) { .layout { grid-template-columns:1fr; gap:2.5rem; padding-top:2rem; }.sidebar { position:static; display:grid; grid-template-columns:120px 1fr; column-gap:1.4rem; }.avatar { grid-row:span 4; width:120px; height:150px; }.sidebar h1 { margin:0; }.role { margin:.6rem 0; }.profile-meta { align-self:start; }.side-nav { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:.5rem 1.2rem; margin-top:1.4rem; }.side-nav a { margin:0; }.desktop-switch { display:none; }.mobile-header { display:flex; align-items:center; justify-content:space-between; padding:1rem 1.4rem; border-bottom:1px solid var(--line); background:#fff; font:600 .9rem var(--serif); }.mobile-header .language-switch { margin:0; } }
@media (max-width:560px) { body { font-size:14px; }.layout { padding:1.4rem; }.sidebar { grid-template-columns:90px 1fr; }.avatar { width:90px; height:115px; }.project-grid { grid-template-columns:1fr; }.timeline article { grid-template-columns:1fr; gap:.35rem; }.news-list li { padding-left:0; }.news-list time { position:static; display:block; margin-bottom:.18rem; }.section { padding-bottom:2.5rem; margin-bottom:2.5rem; } }