@font-face {font-family:'Site Noto Serif SC';font-style:normal;font-weight:500;font-display:swap;src:url(/assets/v/noto-serif-sc-name-500.9b3e75182b9c.woff2) format('woff2');unicode-range:U+4F55,U+6797,U+665F;}
@font-face {font-family:'Site LXGW WenKai';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/v/lxgw-wenkai-oat-400.4484eecf991a.woff2) format('woff2');unicode-range:U+71D5,U+9EA6;}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/v/cormorant-garamond-italic-400.5830c0177405.woff2) format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/v/dm-sans-normal-400.db5735c60d8e.woff2) format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(/assets/v/dm-sans-normal-500.5a713b564a13.woff2) format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(/assets/v/dm-sans-normal-600.24029e9132a0.woff2) format('woff2');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(/assets/v/dm-sans-normal-700.bd5728679915.woff2) format('woff2');
}
@font-face {
  font-family: 'Libre Caslon Display';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/assets/v/libre-caslon-display-normal-400.d69becfa0c7b.woff2) format('woff2');
}
:root {--ink:#173e30;--muted:#5a6b61;--line:#dce5de;--blue:#357345;--bg:#fbfcfb;}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;scroll-padding-top:95px;}
body {margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans','PingFang SC','Microsoft YaHei',Arial,sans-serif;font-size:16px;line-height:1.65;}
a {color:inherit;text-decoration:none;}
a:hover {color:var(--blue);}
a:focus-visible,button:focus-visible,summary:focus-visible {outline:3px solid #5a985e;outline-offset:5px;}
.skip {position:absolute;left:20px;top:-100px;}
.skip:focus {top:10px;background:white;z-index:5;}
header {max-width:1320px;margin:auto;padding:26px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);}
.brand {display:flex;align-items:center;gap:16px;font-size:27px;font-weight:700;}
.brand span {font-size:14px;font-weight:500;}
nav {display:flex;gap:27px;font-size:14px;}
main,footer {max-width:1224px;margin:auto;}
.hero {display:grid;grid-template-columns:1.3fr 1fr;gap:90px;align-items:center;padding:80px 0 65px;}
.eyebrow {font-size:12px;letter-spacing:.13em;font-weight:700;color:var(--blue);margin:0 0 24px;}
h1 {font-family:'Libre Caslon Display',Georgia,serif;font-size:clamp(64px,7vw,100px);font-weight:400;line-height:1.05;margin:0 0 30px;letter-spacing:-.03em;}
h1 span {display:block;font-family:serif;font-size:32px;letter-spacing:.2em;margin-top:18px;font-weight:400;}
.lead {font-size:25px;line-height:1.4;max-width:570px;margin-bottom:22px;}
.intro>p:not(.eyebrow):not(.lead) {color:var(--muted);max-width:565px;}
.intro p a {text-decoration:underline;text-underline-offset:4px;}
.hero-links {display:flex;align-items:center;margin-top:35px;}
.button {display:inline-block;background:var(--ink);color:white;padding:12px 21px;font:500 14px 'DM Sans',sans-serif;border:1px solid var(--ink);cursor:pointer;}
.button:hover {background:var(--blue);color:white;}
figure {margin:0;align-self:center;}
.portrait {background:#e6eee3;padding:25px 20px 0;position:relative;aspect-ratio:1/1.07;overflow:hidden;border-radius:50% 50% 3px 3px;}
.portrait img {width:100%;height:100%;object-fit:contain;object-position:center bottom;}
figcaption {font-size:12px;letter-spacing:.08em;text-transform:uppercase;text-align:center;color:var(--muted);margin-top:20px;}
section:not(.hero):not(.contact) {display:grid;grid-template-columns:290px 1fr;gap:60px;padding:78px 0;border-bottom:1px solid var(--line);}
:is(h2,h1.page-title) {font:400 48px/1.05 'Libre Caslon Display',Georgia,serif;margin:0 0 24px;letter-spacing:-.02em;}
.section-heading>p:not(.eyebrow) {font-size:14px;color:var(--muted);}
.section-intro {margin:0 0 35px;font-size:19px;}
.research-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:25px;}
.research-item {border-top:3px solid var(--blue);padding-top:20px;}
.research-item h3 {font-size:19px;margin:0 0 15px;}
.research-item p {color:var(--muted);font-size:16px;}
.research-item span {font-size:12px;color:var(--muted);}
.work {display:grid;grid-template-columns:55px 1fr;gap:24px;padding:30px 0;border-top:1px solid var(--line);}
.work:first-child {padding-top:0;border:0;}
.work time {font-size:14px;font-weight:600;color:var(--blue);}
h3 {font-size:22px;line-height:1.4;margin:0 0 14px;}
.work p {font-size:14px;color:var(--muted);margin:12px 0;}
.pub-meta {display:flex;gap:10px;flex-wrap:wrap;font-size:12px;color:var(--muted);}
.pub-meta span:first-child {display:none;}
.pub-summary {line-height:1.7;}
.pub-links {display:flex;align-items:baseline;gap:18px;}
.pub-links a {font-size:14px;color:var(--blue);text-decoration:underline;text-underline-offset:4px;}
.pub-links span {font-size:12px;color:var(--muted);}
.education {display:grid;grid-template-columns:1fr 1fr;gap:35px;}
.education article {border-top:1px solid var(--line);padding-top:20px;}
.education span {font-size:14px;color:var(--blue);}
.education h3 {margin-top:18px;}
.education p {color:var(--muted);}
.text-link {font-size:14px;text-decoration:underline;text-underline-offset:5px;}
.conference {padding:22px 0;border-top:1px solid var(--line);}
.conference:first-child {padding-top:0;border:0;}
.conference .meta {font-size:12px;color:var(--muted);}
.conference h3 {font-size:18px;margin:8px 0;}
.conference p {font-size:14px;color:var(--muted);margin:8px 0;}
.award {color:var(--blue);font-size:14px;}
.secondary {background:transparent;color:var(--ink);margin-top:25px;}
.upcoming {margin-top:35px;font-size:14px;}
.upcoming summary {cursor:pointer;margin-bottom:25px;}
footer {display:flex;gap:30px;padding:30px 0;font-size:12px;color:var(--muted);}
footer a:first-of-type {margin-left:auto;}
[hidden] {display:none!important;}
@media(min-width:1400px) {
  main,footer {max-width:1224px;}
}
@media(max-width:1350px) {
  main,footer {margin-left:48px;margin-right:48px;}
}
@media(max-width:950px) {
  header {padding:22px 30px;}
  .brand span {display:none;}
  nav {gap:16px;}
  main,footer {margin:0 30px;}
  .hero {gap:40px;padding-top:60px;}
  .lead {font-size:22px;}
  section:not(.hero):not(.contact) {grid-template-columns:210px 1fr;gap:30px;}
  .research-grid {grid-template-columns:1fr;}
  .research-item {padding-top:14px;}
  .education {grid-template-columns:1fr;}
  :is(h2,h1.page-title) {font-size:40px;}
}
@media(max-width:650px) {
  header {padding:18px 22px;align-items:flex-start;}
  .brand {font-size:23px;}
  nav {flex-wrap:wrap;font-size:12px;}
  main,footer {margin:0 22px;}
  .hero {grid-template-columns:1fr;gap:35px;padding:45px 0 35px;}
  .hero figure {max-width:280px;justify-self:center;}
  .eyebrow {font-size:11px;}
  section:not(.hero):not(.contact) {grid-template-columns:1fr;gap:20px;padding:45px 0;}
  .section-heading .eyebrow {margin-bottom:14px;}
  .section-heading :is(h2,h1.page-title) br {display:none;}
  :is(h2,h1.page-title) {font-size:40px;}
  .section-intro {font-size:17px;}
  .work {grid-template-columns:1fr;gap:8px;}
  .pub-links {flex-wrap:wrap;gap:8px 18px;}
  .contact {margin-top:35px;}
  footer {flex-wrap:wrap;gap:14px;}
  footer a:first-of-type {margin-left:0;}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
}
h1 .pronunciation {font:400 16px/1.5 'DM Sans',Arial,sans-serif;letter-spacing:.01em;color:var(--muted);margin:15px 0 0;}
nav a[aria-current="page"] {color:var(--blue);text-underline-offset:7px;}
.epigraph blockquote {margin:0;color:var(--ink);}
.contact {margin-top:30px;}
@media(max-width:650px) {
  h1 .pronunciation {font-size:15px;}
}
.epigraph {position:relative;}
.epigraph blockquote {font:400 clamp(25px,3.1vw,36px)/1.5 'Cormorant Garamond',Georgia,serif;font-style:italic;letter-spacing:.005em;}
.epigraph figcaption {color:var(--muted);font-size:12px;letter-spacing:.16em;margin-top:26px;padding-top:16px;border-top:1px solid var(--line);width:110px;}
.contact {display:grid;align-items:center;text-align:left;}
.contact :is(h2,h1.page-title) {margin-bottom:34px;}
.contact-copy>.eyebrow {margin-bottom:28px;}
.contact-email {text-underline-offset:8px;text-decoration-color:#92b787;overflow-wrap:anywhere;}
.contact-signature {letter-spacing:.03em;}
.contact-portrait {margin:0;}
.contact-portrait img {display:block;}
@media(max-width:950px) {
  .contact {min-height:440px;}
}
@media(max-width:650px) {
  .epigraph blockquote {line-height:1.6;}
  .contact {margin:30px 0 40px;}
}
.hero .portrait {isolation:isolate;}
.hero .portrait img {mix-blend-mode:normal;}
.hero {padding-bottom:24px;}
.epigraph {padding-top:32px;padding-bottom:60px;}
@media(max-width:650px) {
  .hero {padding-bottom:12px;}
  .epigraph {padding-top:32px;padding-bottom:42px;}
}
.hero .portrait {background:#fff;border:3px solid var(--blue);padding:0;}
.hero .portrait img {position:absolute;inset:12px 20px 32px;width:calc(100% - 40px);height:calc(100% - 44px);object-fit:contain;object-position:center;}
.hero figure>figcaption {font-size:16px;letter-spacing:.055em;font-weight:500;line-height:1.5;color:var(--ink);}
@media(max-width:650px) {
  .hero .portrait {border-width:2px;}
  .hero figure>figcaption {font-size:14px;letter-spacing:.035em;}
}
h1 .name-details {display:flex;align-items:baseline;gap:22px;margin-top:22px;letter-spacing:normal;}
h1 .name-details .chinese-name {display:inline;margin:0;font-size:42px;line-height:1.3;letter-spacing:.12em;}
h1 .name-details .pronunciation {display:inline;margin:0;font-size:18px;line-height:1.5;white-space:nowrap;}
@media(max-width:650px) {
  h1 .name-details {margin-top:18px;}
  h1 .name-details .chinese-name {font-size:36px;}
  h1 .name-details .pronunciation {font-size:16px;}
}
.hero-links {gap:22px;flex-wrap:nowrap;}
.hero-links>a {white-space:nowrap;font-size:14px;}
.hero-links>a:nth-child(n+3) {color:var(--blue);text-decoration:underline;text-underline-offset:4px;}
@media(max-width:650px) {
  .hero-links {gap:12px;flex-wrap:wrap;}
  .hero-links>a {font-size:13px;}
  .hero-links .button {padding:10px 12px;}
}
footer>a:last-child {margin-left:auto;}
.cv-document {grid-column:2;min-width:0;}
.cv-document-actions {display:flex;gap:25px;margin-bottom:20px;font-size:14px;}
.cv-document-actions a,.cv-mobile-link {color:var(--blue);text-decoration:underline;text-underline-offset:4px;}
.cv-pdf {display:block;width:100%;height:850px;border:1px solid var(--line);background:white;}
.cv-mobile-link {display:none;}
@media(max-width:650px) {
  .cv-document {grid-column:1;}
  .cv-pdf {height:560px;}
  .cv-mobile-link {display:inline-block;margin-top:15px;}
}
.epigraph {align-items:center;}
.epigraph-copy::before {content:"“";font:400 110px/1 "Libre Caslon Display",Georgia,serif;display:block;height:62px;}
@media(max-width:650px) {
  .epigraph-copy::before {font-size:88px;height:50px;}
}
@media(min-width:651px) and (max-width:950px) {
  .hero {grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);}
  .hero-links {flex-wrap:wrap;}
}
.epigraph {grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);margin:0 auto;gap:16px;}
.epigraph blockquote {font-size:clamp(25px,2.6vw,32px);}
nav a {position:relative;}
nav a[aria-current="page"] {text-decoration:none;}
nav a::after {content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .25s ease;}
nav a:hover::after,nav a[aria-current="page"]::after {transform:scaleX(1);}
a,button {transition:color .2s ease,background-color .2s ease,transform .2s ease;}
.button:hover {transform:translateY(-2px);}
[data-page]:not([hidden]) {animation:page-arrive .4s ease both;}
.reveal-on-scroll {opacity:0;transform:translateY(12px);transition:opacity .65s ease,transform .65s ease;}
.reveal-on-scroll.is-visible {opacity:1;transform:translateY(0);}
@keyframes page-arrive {from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:650px) {
  .epigraph {grid-template-columns:1fr;gap:0;}
  .epigraph blockquote {font-size:clamp(22px,6.3vw,29px);}
}
@media(prefers-reduced-motion:reduce) {
  [data-page]:not([hidden]) {animation:none;}
  .reveal-on-scroll {opacity:1;transform:none;transition:none;}
  .button:hover {transform:none;}
  a,button,nav a::after {transition:none;}
}
/* Contact: a quiet personal closing page. */
.contact {background:transparent;color:var(--ink);grid-template-columns:1.1fr 1fr;gap:40px;padding:55px 35px 35px;margin:25px 0 25px;min-height:580px;}
.contact .eyebrow {color:var(--blue);margin-bottom:22px;}
.contact :is(h2,h1.page-title) {font-size:clamp(60px,6.6vw,88px);margin:0 0 28px;line-height:1.08;}
.contact-email {display:inline-flex;gap:18px;align-items:center;position:relative;text-decoration:none;padding-bottom:8px;font-size:19px;}
.contact-email::after {content:"";position:absolute;bottom:0;left:0;right:0;height:1px;background:#aac2aa;transform-origin:left;transition:transform .25s ease,background .25s ease;transform:scaleX(.65);}
.contact-email:hover::after,.contact-email:focus-visible::after {transform:scaleX(1);background:var(--blue);}
.contact-email>span {font-size:22px;transition:transform .25s ease;}
.contact-email:hover>span {transform:translate(3px,-3px);}
.contact-signature {margin-top:64px;color:var(--muted);display:flex;align-items:center;gap:10px;font-size:13px;}
.contact-signature span {margin-left:0;}
.contact-signature .contact-flower {font-size:26px;color:#758d52;margin-right:5px;}
.contact-portrait {transform:none;max-width:none;width:100%;overflow:hidden;height:390px;}
.contact-portrait img {width:100%;height:100%;object-fit:cover;object-position:center bottom;box-shadow:none;border-radius:0;mix-blend-mode:multiply;}
@media(max-width:950px) {
  .contact {padding:40px 0;gap:20px;}
  .contact-portrait {height:320px;}
  .contact-email {font-size:17px;}
}
@media(max-width:650px) {
  .contact {grid-template-columns:1fr;min-height:auto;padding:45px 0 20px;gap:25px;}
  .contact-signature {margin-top:35px;}
  .contact-portrait {max-width:400px;height:310px;justify-self:center;}
}
@media(prefers-reduced-motion:reduce) {
  .contact-email::after,.contact-email>span {transition:none;}
}
/* Homepage poem stands alone; the family illustration closes Contact. */
.epigraph {display:block;max-width:920px;text-align:center;padding:48px 16px 60px;}
.epigraph-copy::before {margin-left:0;text-align:center;}
.epigraph figcaption {text-align:center;margin:26px auto 0;width:auto;max-width:100%;border-top:0;padding-top:0;font-size:15px;line-height:1.6;letter-spacing:.12em;}
.epigraph figcaption::before {content:"";display:block;width:110px;border-top:1px solid var(--line);margin:0 auto 18px;}
.epigraph-author {display:block;}
.epigraph-source {display:block;margin-top:6px;font:italic 400 clamp(17px,2vw,19px)/1.5 "Cormorant Garamond",Georgia,serif;letter-spacing:.015em;text-transform:none;}
@media(max-width:650px) {
  .epigraph {padding:34px 0 42px;}
}
/* Soft botanical accents; existing page and poem animations remain. */
.epigraph-copy {position:relative;}
.epigraph-copy::before {color:#abc49e;}
.epigraph figcaption {border-color:#bdd0b8;}
.contact-flower {transform-origin:center;transition:transform .6s ease;}
.contact-signature:hover .contact-flower {transform:rotate(30deg);}
.contact-portrait {position:relative;}
.contact-portrait img {transition:transform 1.2s ease;}
.contact-portrait:hover img {transform:translateY(-4px);}
@media(prefers-reduced-motion:reduce) {
  .contact-flower,.contact-portrait img {transition:none;}
  .contact-signature:hover .contact-flower,.contact-portrait:hover img {transform:none;}
}
/* Citation tools and narrow-screen access, consistent with the green theme. */
.work>.citation {grid-column:2;margin-top:-8px;font-size:14px;min-width:0;}
.citation summary {display:inline-block;cursor:pointer;color:var(--blue);border-bottom:1px solid #bdd0b8;padding:8px 0;}
.citation[open] summary {margin-bottom:12px;}
.citation-text {overflow-wrap:anywhere;border-left:2px solid #bdd0b8;padding-left:16px;}
.citation-actions {display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;}
.copy-citation {font:inherit;color:var(--ink);background:#edf3ea;border:1px solid #bdd0b8;padding:8px 14px;cursor:pointer;}
.citation-actions a {text-decoration:underline;text-underline-offset:4px;color:var(--blue);padding:8px 0;}
.copy-status {min-height:1.65em;font-size:12px;}
.section-content,.intro,.hero figure {min-width:0;}
.work h3 {overflow-wrap:anywhere;}
#main:focus {outline:none;}
@media(max-width:650px) {
  header {flex-direction:column;}
  nav {max-width:none;justify-content:flex-start;}
  nav a {padding:8px 0;}
  nav a::after {bottom:4px;}
  .work>.citation {grid-column:1;margin-top:0;}
  .hero-links {row-gap:10px;}
  .hero-links>a:not(.button),.pub-links a,.cv-document-actions a {padding:8px 0;}
  .cv-document-actions {flex-wrap:wrap;gap:8px 22px;}
  .contact :is(h2,h1.page-title) {font-size:clamp(44px,14vw,64px);}
  h1 {font-size:clamp(50px,16vw,64px);}
  h1 .name-details {flex-wrap:wrap;gap:8px 14px;}
  .contact-signature {flex-wrap:wrap;}
  .contact-email {font-size:clamp(14px,4.5vw,17px);}
}
@media(max-width:650px) {
  nav {display:grid;width:100%;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 14px;}
  nav a {justify-self:start;}
}
/* Language and appearance controls share the existing quiet visual style. */
header {gap:24px;flex-wrap:wrap;}
.site-controls {display:flex;align-items:center;gap:12px;font-size:13px;}
.site-controls a,.theme-toggle {padding:8px 10px;min-height:40px;border:1px solid var(--line);border-radius:3px;}
.theme-toggle {font:inherit;background:transparent;color:var(--ink);cursor:pointer;}
.site-controls a:hover,.theme-toggle:hover {background:var(--line);}
html[lang="zh-Hans"] body {font-family:'DM Sans','PingFang SC','Microsoft YaHei',sans-serif;line-height:1.8;}
html[lang="zh-Hans"] h1,html[lang="zh-Hans"] :is(h2,h1.page-title) {font-family:'Songti SC','STSong','Noto Serif CJK SC',serif;}
html[lang="zh-Hans"] h1 {font-size:clamp(58px,6vw,84px);}
html[lang="zh-Hans"] h1 .chinese-name {font:400 28px/1.4 'Libre Caslon Display',Georgia,serif;letter-spacing:0;}
html[lang="zh-Hans"] .contact :is(h2,h1.page-title) {line-height:1.35;}
html[lang="zh-Hans"] .epigraph blockquote {font-family:'Cormorant Garamond',Georgia,serif;line-height:1.65;}
.translated-title {color:var(--blue)!important;}
html[data-theme="dark"] {--ink:#e2ebe3;--muted:#b4c4b8;--line:#365447;--blue:#a6c995;--bg:#14261f;}
html[data-theme="dark"] .button {background:#b8d2a8;color:#14261f;border-color:#b8d2a8;}
html[data-theme="dark"] .button:hover {background:#cce0bf;}
html[data-theme="dark"] .secondary {background:transparent;color:var(--ink);border-color:var(--blue);}
html[data-theme="dark"] .copy-citation {background:#243d30;border-color:var(--line);}
html[data-theme="dark"] .skip:focus {background:var(--bg);}
html[data-theme="dark"] .hero .portrait {border-color:#8dad7d;}
html[data-theme="dark"] .contact-portrait {background:#fff;border-radius:4px;}
html[data-theme="dark"] .contact-portrait img {mix-blend-mode:normal;}
html[data-theme="dark"] .cv-pdf {background:#fff;}
html[data-theme="dark"] .contact-signature .contact-flower {color:#a6c995;}
@media(max-width:950px) {
  header {gap:18px;}
  .site-controls {margin-left:auto;}
}
@media(max-width:650px) {
  header {display:grid;grid-template-columns:1fr auto;gap:12px 16px;}
  header .brand {grid-column:1;grid-row:1;}
  .site-controls {grid-column:2;grid-row:1;margin:0;}
  header nav {grid-column:1/-1;grid-row:2;}
  .site-controls a,.theme-toggle {padding:7px 9px;}
  html[lang="zh-Hans"] h1 {font-size:58px;}
  html[lang="zh-Hans"] h1 .chinese-name {font-size:27px;}
  html[lang="zh-Hans"] .contact :is(h2,h1.page-title) {font-size:44px;}
}
/* Keep portrait geometry independent of caption length in either language. */
.hero figure {width:100%;}
/* Chinese display headings wrap at authored phrase boundaries. */
html[lang="zh-Hans"] h1,html[lang="zh-Hans"] :is(h2,h1.page-title) {letter-spacing:0;line-height:1.25;}
html[lang="zh-Hans"] .section-heading :is(h2,h1.page-title) {font-size:44px;}
html[lang="zh-Hans"] .heading-phrase {display:inline-block;white-space:nowrap;}
html[lang="zh-Hans"] .contact .heading-phrase {display:block;}
@media(max-width:950px) and (min-width:651px) {
  html[lang="zh-Hans"] .section-heading :is(h2,h1.page-title) {font-size:38px;}
}
@media(max-width:650px) {
  html[lang="zh-Hans"] .section-heading :is(h2,h1.page-title) {font-size:clamp(34px,10.5vw,42px);}
}

/* Native transitions: shared navigation stays still while page content changes. */
@view-transition {navigation:auto;}
@media(prefers-reduced-motion:no-preference) {
  header {view-transition-name:site-header;}
  main {view-transition-name:page-content;}
  ::view-transition-old(page-content) {animation:page-exit .18s ease both;}
  ::view-transition-new(page-content) {animation:page-enter .42s cubic-bezier(.2,.7,.2,1) both;}
  ::view-transition-group(site-header) {animation:none;}
  ::view-transition-old(site-header) {animation:none;opacity:0;}
  ::view-transition-new(site-header) {animation:none;}
  html.theme-transition header,html.theme-transition main {view-transition-name:none;}
  html.theme-transition::view-transition-old(root),html.theme-transition::view-transition-new(root) {animation:none;mix-blend-mode:normal;}
  html.theme-transition::view-transition-new(root) {z-index:100;}
}
@keyframes page-exit {to {opacity:0;transform:translateY(-5px);}}
@keyframes page-enter {from {opacity:0;transform:translateY(8px);} to {opacity:1;transform:none;}}
/* The original arch is also a static fallback when scripting is unavailable. */
.hero .portrait {perspective:900px;transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .24s ease-out;}
.portrait.arch-ready {border-color:transparent;overflow:visible;}
.portrait.arch-ready img {clip-path:inset(0 round 50% 50% 0 0);}
.portrait-arch {position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.portrait-arch path {fill:none;stroke:var(--blue);stroke-width:3;vector-effect:non-scaling-stroke;}
html[data-theme="dark"] .portrait-arch path {stroke:#8dad7d;}
@media(max-width:650px) {.portrait-arch path {stroke-width:2;}}
/* Larger target areas, including short labels such as CV. */
nav {gap:18px;align-items:center;}
nav a {display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:0 5px;}
nav a::after {bottom:3px;}
.theme-toggle {min-width:66px;min-height:44px;}
.hero-links>a:not(.button),.pub-links>a,.citation-actions>a,.text-link,.cv-document-actions>a,footer a,summary {min-height:44px;display:inline-flex;align-items:center;}
summary {display:list-item;align-content:center;}
.citation-actions button {min-height:44px;}
@media(max-width:950px) {nav {gap:10px;}}
@media(max-width:650px) {header nav {gap:0 8px;} nav a {padding:0 5px;} .theme-toggle {padding:7px 9px;}}
/* Surround the white illustration with a quieter frame in the night theme. */
html[data-theme="dark"] .contact-portrait {background:#1b3328;padding:16px;border:1px solid var(--line);border-radius:12px;}
html[data-theme="dark"] .contact-portrait img {border-radius:5px;}
.not-found {text-align:center;display:block!important;border:0!important;padding:100px 0!important;}
.not-found h1 {font-size:clamp(68px,10vw,110px);}
.not-found p {color:var(--muted);max-width:460px;margin:24px auto;}
@media(prefers-reduced-motion:reduce) {
  @view-transition {navigation:none;}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*) {animation:none!important;}
  .hero .portrait {transform:none;transition:none;}
}

html[data-theme="dark"] .hero .portrait.arch-ready {border-color:transparent;}
.cv-pdf {color:#173e30;}

/* Ink appears line by line, like a soft brush passing across the poem. */
.ink-line {display:block;width:fit-content;max-width:100%;margin-inline:auto;}
@media(prefers-reduced-motion:no-preference) {
  .ink-visible .ink-line {mask-image:linear-gradient(to right,#000 40%,transparent 60%);mask-size:250% 100%;mask-repeat:no-repeat;animation:ink-emerge 1.65s cubic-bezier(.2,.65,.3,1) var(--ink-delay) both;}
}
@keyframes ink-emerge {
  0% {mask-position:100% 0;opacity:.2;filter:blur(.7px);}
  65% {opacity:1;filter:blur(.15px);}
  100% {mask-position:0 0;opacity:1;filter:none;}
}
/* Ten small lights at the margins, visible only in the night theme. */
.fireflies {display:none;position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden;}
html[data-theme="dark"].ambient-active .fireflies {display:block;}
.fireflies i {position:absolute;width:3px;height:3px;border-radius:50%;background:#cfdf9f;box-shadow:0 0 9px 2px #bfda8055;animation:firefly-drift var(--fly-duration) ease-in-out var(--fly-delay) infinite;}
@keyframes firefly-drift {
  0%,100% {transform:translate(0,0);opacity:0;}
  25% {opacity:.55;}
  50% {transform:translate(9px,-26px);opacity:.18;}
  75% {transform:translate(-5px,-12px);opacity:.65;}
}
/* A whole-image sway preserves the original drawing; wind strokes stay decorative. */
.contact-portrait.breeze-active img {animation:garden-sway 6s ease-in-out infinite;transform-origin:50% 90%;}
.garden-breeze {position:absolute;left:12%;top:28%;width:48px;height:13px;border-top:1px solid #839b6880;border-radius:50%;opacity:0;pointer-events:none;}
.garden-breeze::after {content:"";position:absolute;left:16px;top:9px;width:30px;height:8px;border-top:1px solid #839b6855;border-radius:50%;}
.breeze-active .garden-breeze {animation:garden-wind 9s ease-in-out infinite;}
@keyframes garden-sway {0%,100% {transform:translateY(0) rotate(0);}25% {transform:translateY(-3px) rotate(-1.2deg);}75% {transform:translateY(-4px) rotate(1.2deg);}}
@keyframes garden-wind {0%,25%,75%,100% {opacity:0;transform:translateX(-8px);}40% {opacity:.6;}65% {opacity:0;transform:translateX(28px);}}
@media(max-width:650px) {.fireflies i:nth-child(n+7) {display:none;}}
@media(prefers-reduced-motion:reduce) {
  .fireflies,.garden-breeze {display:none!important;}
  .ink-line,.contact-portrait.breeze-active img {animation:none!important;mask-image:none;filter:none;transform:none;}
}

/* Scholar is a static, locally rendered snapshot, independent of third-party scripts. */
.scholar-overview {margin-top:44px;padding:28px;border:1px solid var(--line);background:linear-gradient(135deg,#f0f5ee88,transparent 80%);}
.scholar-heading {display:flex;justify-content:space-between;gap:20px;align-items:center;}
.scholar-heading .eyebrow {font-size:12px;letter-spacing:.15em;margin:0 0 10px;}
.scholar-heading h2 {font-size:31px;line-height:1.12;margin:0;}
.scholar-profile {font-size:14px;white-space:nowrap;display:inline-flex;align-items:center;gap:9px;min-height:44px;text-decoration:underline;text-underline-offset:5px;}
.scholar-body {display:grid;grid-template-columns:1fr 1.2fr;gap:28px;margin:30px 0 24px;}
.scholar-metrics {display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:0;align-content:center;}
.scholar-metrics dt {font-size:14px;color:var(--muted);}
.scholar-metrics dd {font-family:'Libre Caslon Display',Georgia,serif;font-size:48px;line-height:1.25;margin:8px 0 0;font-variant-numeric:tabular-nums;}
.scholar-history {min-width:0;border-left:1px solid var(--line);padding-left:28px;}
.scholar-history h3 {font-size:13px;font-weight:500;color:var(--muted);margin:0 0 12px;}
.scholar-chart-empty {min-height:96px;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;}
.scholar-chart-empty p {font-size:12px;color:var(--muted);margin:0;max-width:195px;}
.scholar-chart-line {height:1px;width:100%;background:var(--line);}
.scholar-bars {display:flex;gap:8px;list-style:none;padding:0;margin:0;min-height:115px;}
.scholar-bars li {flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:5px;font-size:12px;}
.scholar-bar-track {height:75px;width:100%;display:flex;align-items:flex-end;border-bottom:1px solid var(--line);}
.scholar-bar {display:block;width:100%;max-width:25px;margin:auto auto 0;height:75px;fill:var(--ink);background:none;}
.scholar-bar-year,.scholar-bar-count {color:var(--muted);font-variant-numeric:tabular-nums;}
.scholar-footer {display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 18px;border-top:1px solid var(--line);padding-top:14px;color:var(--muted);font-size:12px;}
html[data-theme="dark"] .scholar-overview {background:linear-gradient(135deg,#263f2f66,transparent 80%);}
@media(max-width:650px) {
  .scholar-overview {padding:22px;margin-top:30px;}
  .scholar-heading {align-items:flex-start;gap:12px;flex-direction:column;}
  .scholar-heading h2 {font-size:30px;}
  .scholar-body {grid-template-columns:1fr;gap:24px;margin-top:20px;}
  .scholar-metrics dd {font-size:47px;}
  .scholar-history {border-left:0;border-top:1px solid var(--line);padding:18px 0 0;}
  .scholar-chart-empty {min-height:65px;}
  .scholar-chart-empty p {max-width:none;}
}


.paper-impact {grid-column:2;margin-top:10px;font-size:14px;}
.paper-impact summary {cursor:pointer;min-height:44px;align-content:center;color:var(--blue);}
.impact-badges {display:flex;align-items:flex-start;gap:24px 36px;flex-wrap:wrap;margin:14px 0;}
.impact-provider {display:flex;flex-direction:column;gap:12px;min-width:160px;}
.impact-label,.work .impact-status {font-size:12px;color:var(--muted);}
.impact-badges .altmetric-embed {width:80px;min-height:80px;padding:8px;background:#fff;border-radius:50%;}
@media(max-width:650px) {.paper-impact {grid-column:1;}}

.github-overview {grid-column:2;min-width:0;margin-top:26px;padding:26px;border:1px solid var(--line);}
.github-heading {display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;}
.github-heading .eyebrow {font-size:12px;margin-bottom:10px;}
.github-heading h2 {font-size:31px;margin-bottom:0;}
.github-heading a {font-size:13px;min-height:44px;display:inline-flex;align-items:center;color:var(--blue);}
.github-total {font-size:13px;color:var(--muted);margin:20px 0 16px;}
.github-scroll {overflow-x:auto;padding-bottom:10px;}
.github-grid {display:grid;grid-auto-flow:column;grid-template-rows:repeat(7,10px);grid-auto-columns:10px;gap:3px;list-style:none;padding:0;margin:0;width:max-content;}
.github-grid li,.github-legend i {background:#e6ede3;border:1px solid #173e3010;border-radius:2px;}
.github-grid [data-level="1"],.github-legend [data-level="1"] {background:#c5d9ad;}
.github-grid [data-level="2"],.github-legend [data-level="2"] {background:#92b878;}
.github-grid [data-level="3"],.github-legend [data-level="3"] {background:#5c9154;}
.github-grid [data-level="4"],.github-legend [data-level="4"] {background:#2d633e;}
.github-footer {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:12px;}
.github-legend {display:flex;align-items:center;gap:4px;}
.github-legend i {display:inline-block;width:10px;height:10px;}
.sr-only {position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;}
html[data-theme="dark"] .github-grid [data-level="0"],html[data-theme="dark"] .github-legend [data-level="0"] {background:#263b30;}
@media(max-width:950px) {.github-overview {grid-column:1;}}
@media(max-width:650px) {.github-overview {padding:22px;}}

/* A quiet, expandable introduction to Oat. */
.oat-card {max-width:380px;margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.oat-card summary {display:flex;align-items:center;gap:14px;padding:14px 0;cursor:pointer;list-style:none;}
.oat-card summary::-webkit-details-marker {display:none;}
.oat-card summary>img {width:64px;height:64px;border-radius:50%;object-fit:cover;background:#fff;transition:transform .3s ease;}
.oat-card summary strong {display:block;font:400 26px/1.2 "Cormorant Garamond",Georgia,serif;color:var(--ink);}
.oat-description {display:block;margin-top:4px;font-size:13px;line-height:1.5;color:var(--muted);}
.oat-toggle {margin-left:auto;font-size:23px;color:var(--muted);transition:transform .25s ease;}
.oat-card[open] .oat-toggle {transform:rotate(45deg);}
.oat-card summary:focus-visible {outline:2px solid var(--ink);outline-offset:5px;}
.oat-reveal {margin:0 0 18px;padding:12px;background:#fff;border-radius:4px;}
.oat-reveal img {display:block;width:100%;height:auto;}
.oat-reveal figcaption {text-align:center;color:#526557;font-size:14px;padding:8px 0 4px;}
@media(hover:hover) and (prefers-reduced-motion:no-preference) {.oat-card summary:hover>img {transform:rotate(-7deg);}}
@media(prefers-reduced-motion:reduce) {.oat-card summary>img,.oat-toggle {transition:none;}}

h1 .name-details .chinese-name {font-family:'Site Noto Serif SC','Songti SC',serif;font-weight:500;}
.oat-reveal figcaption [lang="zh-Hans"] {font-family:'Site LXGW WenKai',cursive;font-size:19px;font-weight:400;}
