/* Wen academic site — shared styles */
*{box-sizing:border-box}
html{scroll-behavior:smooth}
:root{
  --radius:12px;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC",Roboto,Helvetica,Arial,sans-serif;
  --font-serif:Georgia,"Times New Roman","Songti SC","SimSun",serif;
}
html[data-theme="a"]{
  --bg:#f5f7fa;--card:#ffffff;--line:#e2e8f0;
  --hero-bg:#0b2545;--hero-fg:#ffffff;--hero-sub:#a3bedb;
  --accent:#0d7d92;--accent-soft:#e2f3f6;--accent-ink:#0a6274;
  --text:#16202b;--muted:#5c6b7a;--num:#c2ccd8;
  --footer-bg:#08192e;--footer-fg:#8fb0cf;--footer-name:#ffffff;
  --heading-font:var(--font-sans);
}
html[data-theme="b"]{
  --bg:#ffffff;--card:#ffffff;--line:#e6e6e6;
  --hero-bg:#ffffff;--hero-fg:#141414;--hero-sub:#6b6b6b;
  --accent:#1a4d8f;--accent-soft:#eef3fa;--accent-ink:#1a4d8f;
  --text:#1a1a1a;--muted:#6b6b6b;--num:#d6d6d6;
  --footer-bg:#fafafa;--footer-fg:#6b6b6b;--footer-name:#1a1a1a;
  --heading-font:var(--font-serif);
}
html[data-theme="c"]{
  --bg:#f4f5f7;--card:#ffffff;--line:#e8eaee;
  --hero-bg:#ffffff;--hero-fg:#14181f;--hero-sub:#5b6472;
  --accent:#4b5ee4;--accent-soft:#eceefc;--accent-ink:#3a49c4;
  --text:#14181f;--muted:#606a78;--num:#ccd3de;
  --footer-bg:#14181f;--footer-fg:#9aa4b2;--footer-name:#ffffff;
  --heading-font:var(--font-sans);
}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:15px;line-height:1.65;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
.wrap{max-width:980px;margin:0 auto;padding:0 28px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

html[data-lang="en"] .zh{display:none!important}
html[data-lang="zh"] .en{display:none!important}

.langbar{position:fixed;top:14px;right:14px;z-index:60;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:5px 6px;display:flex;gap:2px;box-shadow:0 2px 12px rgba(15,30,50,.10)}
.langbar button{border:0;background:transparent;padding:5px 11px;border-radius:6px;font-size:12.5px;cursor:pointer;color:var(--muted);font-family:inherit;line-height:1.2}
.langbar button[aria-pressed="true"]{background:#16202b;color:#fff}

.hero{background:var(--hero-bg);color:var(--hero-fg);padding:56px 0 48px}
html[data-theme="b"] .hero{border-bottom:1px solid var(--line);padding:64px 0 56px}
.hero-inner{display:flex;gap:36px;align-items:center;flex-wrap:wrap}
.portrait{width:158px;height:198px;object-fit:cover;object-position:center 22%;border-radius:var(--radius);border:1px solid rgba(255,255,255,.2);display:block;flex:0 0 auto}
html[data-theme="b"] .portrait{border-color:var(--line);border-radius:4px}
html[data-theme="c"] .portrait{border-color:var(--line);border-radius:16px}
.eyebrow{font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--hero-sub);margin:0 0 10px;font-weight:500}
h1{font-family:var(--heading-font);font-size:38px;line-height:1.15;margin:0 0 8px;font-weight:600;letter-spacing:-.01em}
.zhname{margin-left:10px}
html[data-theme="b"] h1{font-weight:400;font-size:40px}
html[data-theme="b"] h1 .zhname{font-size:26px;color:var(--muted)}
.role{font-size:15.5px;color:var(--hero-sub);margin:0 0 3px}
.affil{font-size:14px;color:var(--hero-sub);margin:0 0 20px}
.actions{display:flex;gap:9px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:7px;font-size:13px;padding:8px 14px;border-radius:8px;border:1px solid transparent;transition:.15s}
.btn svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
html[data-theme="a"] .btn{border-color:rgba(255,255,255,.3);color:#eaf2fa;background:rgba(255,255,255,.07)}
html[data-theme="a"] .btn:hover{background:rgba(255,255,255,.16);text-decoration:none}
html[data-theme="b"] .btn{border-color:var(--line);color:var(--accent);background:#fff;border-radius:6px}
html[data-theme="b"] .btn:hover{background:var(--accent-soft);text-decoration:none}
html[data-theme="c"] .btn{border-color:var(--line);color:#fff;background:#14181f}
html[data-theme="c"] .btn:hover{background:#2b3341;text-decoration:none}

.nav{position:sticky;top:0;z-index:40;background:var(--card);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;gap:24px;padding-top:12px;padding-bottom:12px;font-size:13.5px;overflow-x:auto;scrollbar-width:none}
.nav .wrap::-webkit-scrollbar{display:none}
.nav a{color:var(--muted);white-space:nowrap}
.nav a:hover{color:var(--accent);text-decoration:none}

main{padding:6px 0}
section{padding:40px 0;border-bottom:1px solid var(--line);scroll-margin-top:64px}
section:last-child{border-bottom:0}
html[data-theme="c"] main{padding:26px 0 6px}
html[data-theme="c"] section{padding:28px 32px;border:1px solid var(--line);background:var(--card);border-radius:18px;margin-bottom:20px}
html[data-theme="c"] section:last-child{margin-bottom:0}
h2{font-family:var(--heading-font);font-size:21px;font-weight:600;margin:0 0 20px;display:flex;align-items:center;gap:11px}
h2::before{content:"";width:4px;height:19px;background:var(--accent);border-radius:2px;display:block;flex:0 0 auto}
html[data-theme="b"] h2{font-weight:400;font-size:22px}
html[data-theme="b"] h2::before{width:26px;height:2px;border-radius:0}
h3{font-size:14.5px;font-weight:600;margin:0 0 12px;color:var(--muted);letter-spacing:.02em}
p{margin:0 0 14px}
p:last-child{margin-bottom:0}

ul.clean{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:11px 28px}
ul.clean li{position:relative;padding-left:20px;font-size:14.5px}
ul.clean li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:.8}
html[data-theme="c"] ul.clean{gap:10px}
html[data-theme="c"] ul.clean li{padding:9px 14px;background:var(--accent-soft);border-radius:9px;font-size:13.5px;color:var(--accent-ink)}
html[data-theme="c"] ul.clean li::before{display:none}
ul.plain{list-style:none;padding:0;margin:0;display:grid;gap:9px}
ul.plain li{position:relative;padding-left:20px;font-size:14.5px}
ul.plain li::before{content:"";position:absolute;left:2px;top:9px;width:6px;height:6px;border-radius:50%;background:var(--accent);opacity:.8}
html[data-theme="c"] ul.plain li{padding:9px 14px;background:var(--accent-soft);border-radius:9px;font-size:13.5px;color:var(--accent-ink)}
html[data-theme="c"] ul.plain li::before{display:none}

.cols{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.tl{list-style:none;margin:0;padding:0}
.tl li{padding:0 0 18px 22px;border-left:1.5px solid var(--line);position:relative;margin-left:5px}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:"";position:absolute;left:-6px;top:6px;width:10px;height:10px;border-radius:50%;background:var(--accent);border:2px solid var(--card)}
.tl b{display:block;font-size:14.5px;font-weight:600}
.tl span{font-size:13px;color:var(--muted)}

.pubwrap{margin-top:6px}
.pyear{position:relative;padding-left:56px;margin-top:24px}
.pyear:first-child{margin-top:0}
.pyear .yr{position:absolute;left:0;top:0;font-family:var(--heading-font);font-size:15px;font-weight:700;line-height:1.55;letter-spacing:.01em;font-variant-numeric:tabular-nums;color:var(--muted)}
.pubs{list-style:none;margin:0;padding:0}
.pubs li{padding:17px 0;border-top:1px solid var(--line)}
.pubs li:first-child{border-top:0;padding-top:0}
#publications .sub{font-size:13px;color:var(--muted);margin:-8px 0 20px}
.pubs .pt{font-size:15.5px;font-weight:600;line-height:1.5;margin:0 0 7px;color:var(--text)}
.pubs .pa{font-size:13px;line-height:1.6;color:var(--muted);margin:0 0 6px}
.pubs .pa b{color:var(--text);font-weight:600}
.pubs .pj{font-size:13px;line-height:1.6;color:var(--muted);margin:0}
.pubs .jn{color:var(--accent);font-weight:600}
.pubs .badge{font-weight:600;color:var(--text)}
.pubs .note{font-size:12.5px;line-height:1.65;color:var(--muted);margin:10px 0 0;padding:9px 13px;background:var(--accent-soft);border-radius:7px}
.pubs .note a{color:var(--accent-ink)}
.pubs .pt a{color:inherit;border-bottom:1px solid transparent;transition:color .15s ease,border-color .15s ease}
.pubs .pt a:hover{color:var(--accent);border-bottom-color:var(--accent);text-decoration:none}
.pubs .pl{display:inline-block;margin-left:9px;padding:0 9px;font-size:10.5px;font-weight:700;letter-spacing:.06em;line-height:1.75;color:var(--accent);border:1px solid var(--accent);border-radius:999px;vertical-align:1px;transition:background .15s ease,color .15s ease}
.pubs .pl:hover{background:var(--accent);color:#fff;text-decoration:none}
.pubs .oa{font-weight:600;color:var(--accent-ink)}
.legend{font-size:12.5px;color:var(--muted);margin:22px 0 0;padding-top:14px;border-top:1px solid var(--line)}

.hl{display:grid;gap:16px}
.hl-item{padding-left:16px;border-left:2px solid var(--accent-soft)}
html[data-theme="c"] .hl-item{padding:16px 18px;border-left:3px solid var(--accent);background:#fafbff;border-radius:0 10px 10px 0}
.hl-item b{display:block;font-size:14.5px;margin-bottom:3px}
.hl-item span{font-size:13.5px;color:var(--muted)}

.opp{background:var(--accent-soft);border-radius:var(--radius);padding:22px 26px;color:var(--accent-ink);font-size:14.5px}
html[data-theme="b"] .opp{background:#f7f9fc;border-radius:4px}
html[data-theme="c"] .opp{background:var(--accent-soft);border-radius:12px}

footer{background:var(--footer-bg);color:var(--footer-fg);padding:34px 0;font-size:13px;line-height:1.8}
footer a{color:inherit;text-decoration:underline}
footer .fname{color:var(--footer-name);font-weight:600;font-size:14px}
footer .frow{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}

@media(max-width:820px){
  ul.clean{grid-template-columns:1fr}
  .cols{grid-template-columns:1fr;gap:30px}
  h1{font-size:30px}
  html[data-theme="b"] h1{font-size:31px}
  html[data-theme="c"] section{padding:22px 20px}
  .hero{padding:48px 0 40px}
  .portrait{width:120px;height:150px}
  .langbar{top:auto;bottom:12px;right:12px}
  .wrap{padding:0 20px}
  .pyear{padding-left:44px}
  .pyear .yr{font-size:13.5px}
}
@media print{
  .langbar,.nav{display:none}
  body{background:#fff}
  section{break-inside:avoid}
}

/* ============================================================
   Icons + visual enrichment
   ============================================================ */
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.ic{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto;vertical-align:-.15em}

/* section heading: icon tile replaces the plain bar */
h2::before{display:none}
.h2ic{width:30px;height:30px;border-radius:9px;background:var(--accent-soft);display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.h2ic .ic{width:17px;height:17px;color:var(--accent);stroke:var(--accent)}
html[data-theme="b"] .h2ic{background:transparent;border:1px solid var(--line);border-radius:50%}
html[data-theme="c"] h2{font-size:20px}

/* richer hero */
html[data-theme="a"] .hero{background:radial-gradient(1100px 420px at 12% -20%,#17406c 0%,#0b2545 52%,#08192e 100%);position:relative;overflow:hidden}
html[data-theme="a"] .hero::after{content:"";position:absolute;right:-120px;top:-120px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(13,125,146,.35),rgba(13,125,146,0) 70%);pointer-events:none}

/* research interest rows */
ul.clean li{display:flex;gap:9px;align-items:flex-start;padding-left:0}
ul.clean li::before{display:none}
ul.clean li>.ic{margin-top:4px;color:var(--accent);opacity:.9}
html[data-theme="c"] ul.clean li{padding:9px 14px;gap:8px}
html[data-theme="c"] ul.clean li>.ic{color:var(--accent-ink);margin-top:2px}

/* plain lists (appointments / contact) */
ul.plain li{display:flex;gap:9px;align-items:flex-start;padding-left:0}
ul.plain li::before{display:none}
ul.plain li>.ic{margin-top:3px;color:var(--accent);opacity:.9}
html[data-theme="c"] ul.plain li{padding:9px 14px;gap:8px}
html[data-theme="c"] ul.plain li>.ic{color:var(--accent-ink);margin-top:2px}

/* highlights: icon column */
.hl-item{display:grid;grid-template-columns:24px 1fr;column-gap:12px;row-gap:2px;align-items:start;transition:transform .16s ease}
.hl-item>.ic{grid-row:1/span 2;width:18px;height:18px;margin-top:3px;color:var(--accent)}
.hl-item>*:not(.ic){grid-column:2}
.hl-item:hover{transform:translateX(2px)}
html[data-theme="c"] .hl-item>.ic{margin-top:2px}

/* publication title: arrow affordance */
.pubs .pt a .arw{width:13px;height:13px;margin-left:5px;opacity:.32;transition:opacity .15s ease,transform .15s ease}
.pubs .pt a:hover .arw{opacity:1;transform:translateX(2px)}
/* PDF chip icon */
.pubs .pl .ic{width:11px;height:11px;margin-right:3px;vertical-align:-1px}

/* footer contact icons */
footer .ic{width:14px;height:14px;margin-right:7px;vertical-align:-2px;opacity:.75}
footer .frow>div>div{display:flex;align-items:flex-start}
footer .frow>div>div>a,footer .frow>div>div>span{flex:0 1 auto}

/* ---- paper detail page ---- */
.paper-top{border-bottom:1px solid var(--line);background:var(--card)}
.paper-top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}
.backlink{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;color:var(--muted)}
.backlink:hover{color:var(--accent);text-decoration:none}
.paper{max-width:760px;margin:0 auto;padding:44px 0 60px}
.paper .kicker{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.paper .kicker .yr{color:var(--accent);font-weight:700}
.paper h1{font-size:29px;line-height:1.32;margin:0 0 16px;font-weight:600;letter-spacing:-.005em;color:var(--text)}
.paper .authors{font-size:13.5px;line-height:1.75;color:var(--muted);margin:0 0 6px}
.paper .authors b{color:var(--text)}
.paper .cite{font-size:13px;color:var(--muted);margin:0 0 24px}
.paper .cite .jn{color:var(--accent);font-weight:600}
.paper .acts{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 32px}
.paper .acts a{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;padding:9px 16px;border-radius:9px;border:1px solid var(--line);color:var(--text);background:var(--card);transition:.15s}
.paper .acts a:hover{text-decoration:none;border-color:var(--accent);color:var(--accent)}
.paper .acts a.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.paper .acts a.primary:hover{filter:brightness(1.08);color:#fff}
.paper .acts a.primary .ic{stroke:#fff}
.paper .acts a .ic{width:15px;height:15px}
.paper .block{margin:0 0 30px}
.paper .block h2{font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 12px;gap:8px}
.paper .block h2 .h2ic{width:24px;height:24px;border-radius:7px}
.paper .block h2 .h2ic .ic{width:13px;height:13px}
.paper .abs{font-size:15px;line-height:1.8;color:var(--text);margin:0}
.paper .abs.missing{color:var(--muted);font-style:italic}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.tags li{font-size:12.5px;padding:5px 11px;border-radius:999px;background:var(--accent-soft);color:var(--accent-ink);line-height:1.5}
.paper .note{font-size:12.5px;color:var(--muted);margin:26px 0 0;padding-top:16px;border-top:1px solid var(--line)}
.paper .hlbox{font-size:13px;line-height:1.7;color:var(--muted);padding:13px 16px;background:var(--accent-soft);border-radius:9px;margin:0 0 26px}
.paper .hlbox b{color:var(--text)}
.paper-missing{max-width:760px;margin:0 auto;padding:70px 0;text-align:center;color:var(--muted)}
@media(max-width:820px){
  .paper{padding:30px 0 44px}
  .paper h1{font-size:23px}
  footer .frow>div>div{display:block}
  footer .ic{vertical-align:-2px}
}

/* detail page fixes */
.fname .zh{margin-left:7px}
.paper-top .wrap{padding-right:112px}
.paper .acts a[href^="paper.html"]{font-weight:500}
@media(max-width:820px){
  .paper-top .wrap{padding-right:20px}
}
