:root{--ink:#17202a;--muted:#5f6b76;--paper:#f7f8f5;--line:#dfe4df;--blue:#2457a7;--blue-dark:#153b75;--soft-blue:#eaf1fb}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--paper);font-family:"Inter",Arial,sans-serif;line-height:1.6}a{color:var(--blue);text-decoration:none}a:hover{text-decoration:underline}a:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.site-header{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:24px;min-height:64px;padding:10px max(4vw,calc((100vw - 1120px)/2));border-bottom:1px solid var(--line);background:rgba(247,248,245,.97)}.brand{color:var(--ink);font-family:"Newsreader",Georgia,serif;font-size:1.1rem;font-weight:700;white-space:nowrap}nav{display:flex;gap:24px}nav a{font-size:.83rem;color:var(--muted)}nav a[aria-current]{color:var(--blue-dark);font-weight:900;text-decoration:underline;text-underline-offset:7px}
.skip-link{position:fixed;top:-100px;left:16px;z-index:30;background:white;padding:12px}.skip-link:focus{top:8px}.site-main{width:min(1120px,92vw);margin:32px auto 0}h1,h2,h3{font-family:"Newsreader",Georgia,serif;line-height:1.25}h1{font-size:2rem;margin:0 0 10px}h2{font-size:1.5rem;margin:0 0 14px}h3{font-size:1.15rem;margin:0}p{margin:0 0 12px}
.profile-header{display:flex;align-items:center;gap:24px;margin-bottom:30px}.portrait-placeholder{flex:0 0 112px;width:112px;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:15px;color:#fff;background:radial-gradient(circle at 72% 24%,#6aa0ca 0 12%,transparent 13%),linear-gradient(145deg,#153b75,#2a6c62)}.portrait-placeholder span{font-family:"Newsreader",Georgia,serif;font-size:2.6rem;font-weight:700;line-height:1}.portrait-placeholder small{font-size:.46rem;letter-spacing:.08em;text-transform:uppercase}.profile-subtitle{color:var(--muted);font-size:.9rem;margin-bottom:9px}.profile-links{display:flex;flex-wrap:wrap;gap:20px;font-size:.85rem}
.about-news{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:40px;align-items:start}#about p{font-size:.94rem;color:#34404a}#about .personal-note{color:var(--muted)}.news-panel{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 18px 6px;min-width:0}.news-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px}.news-heading h2{font-size:1.25rem;margin-bottom:12px}.news-heading span{font-size:.68rem;color:var(--muted)}.news-scroll{height:260px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding-right:8px;scrollbar-width:thin;scrollbar-color:#a4b4c8 transparent}.news-scroll ul{list-style:none;margin:0;padding:0}.news-scroll li{display:grid;grid-template-columns:65px minmax(0,1fr);gap:12px;padding:12px 0;border-top:1px solid var(--line)}.news-scroll li:first-child{padding-top:0;border-top:0}.news-scroll time{font-size:.72rem;font-weight:900;color:var(--blue-dark);padding-top:2px}.news-scroll p{font-size:.8rem;line-height:1.5;color:var(--muted);margin:0}
.education-awards{display:grid;grid-template-columns:1.1fr 1fr;gap:28px;padding:24px 0;margin-top:28px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.education-awards h2{font-size:1.25rem;margin-bottom:15px}.education-item+.education-item{margin-top:15px}.education-item h3{font-family:"Inter",Arial,sans-serif;font-size:.9rem;font-weight:900}.education-item p{margin:3px 0 0;font-size:.84rem}.school-detail,.dates{color:var(--muted)}.education-item .school-detail{font-size:.78rem}.education-item .dates{font-size:.75rem}.awards{border-left:1px solid var(--line);padding-left:28px}.awards ul{list-style:none;margin:0;padding:0}.awards li{margin-bottom:13px;font-size:.83rem}.awards li:last-child{margin-bottom:0}.awards span{display:block;color:var(--muted);margin-top:2px;font-size:.76rem}
.section-block{padding-top:32px;scroll-margin-top:90px}.section-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.section-heading h2{margin:0}.section-caption{color:var(--muted);font-size:.78rem;margin:4px 0 0}.all-link{font-size:.82rem;white-space:nowrap}.page-intro{margin:8px 0 28px}.page-intro>p{color:var(--muted)}.note{font-size:.75rem;color:var(--muted)}
.publication-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:26px;align-items:center;padding:20px;margin-bottom:18px;border:1px solid var(--line);border-radius:14px;background:#fff;scroll-margin-top:90px}.media-frame{overflow:hidden;border:1px solid #e2e6e2;border-radius:9px;background:#fff;min-width:0}.media-frame img{display:block;width:100%;height:auto;max-height:300px;object-fit:contain}.figure-link{display:block;padding:9px 9px 0}.figure-action{display:block;padding:7px 0;text-align:right;color:var(--muted);font-size:.67rem}.video-frame{width:100%;min-width:0;height:310px;align-self:start;background:#111}.video-frame iframe{width:100%;height:100%;border:0;display:block}.publication-copy{min-width:0}.publication-copy h3{font-size:1.15rem}.publication-copy p{margin:8px 0 0;color:var(--muted);font-size:.86rem}.publication-copy .authors{font-size:.78rem}.venue{display:inline-block;margin-bottom:9px;padding:4px 7px;border-radius:5px;color:var(--blue-dark);background:var(--soft-blue);font-size:.69rem;font-weight:700;line-height:1.5}.pub-links{display:flex;gap:14px;margin-top:9px}.pub-links a{font-size:.8rem;font-weight:700}.pub-links a::after{content:" ↗"}.text-card{display:block;border-left:3px solid #a7bbd8}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.project-card{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;scroll-margin-top:90px}.project-card h3{margin:8px 0 12px}.project-card>p{font-size:.87rem;color:var(--muted)}.project-card .project-topics{font-size:.72rem;color:var(--blue-dark);margin-bottom:0}.project-card .project-related{font-size:.8rem;margin:14px 0 0}.project-related:empty{display:none}.project-list{display:grid;gap:18px}
footer{width:min(1120px,92vw);margin:32px auto 0;padding:22px 0 30px;border-top:1px solid var(--line);color:var(--muted);font-size:.7rem}footer p{margin:0}
@media(max-width:850px){.site-header{flex-direction:column;gap:6px;align-items:flex-start}nav{gap:20px;flex-wrap:wrap}.about-news{grid-template-columns:1fr;gap:20px}.news-scroll{height:230px}.publication-card{gap:20px}.video-frame{height:280px}}
@media(max-width:560px){.site-main{margin-top:24px}h1{font-size:1.5rem}h2{font-size:1.3rem}.profile-header{gap:16px;align-items:flex-start}.portrait-placeholder{width:80px;flex-basis:80px}.portrait-placeholder span{font-size:2rem}.portrait-placeholder small{font-size:.34rem}.profile-subtitle{font-size:.8rem}.profile-links{gap:12px;font-size:.78rem}nav{gap:16px}nav a{font-size:.72rem}.education-awards{grid-template-columns:1fr;gap:20px}.awards{padding:18px 0 0;border-left:0;border-top:1px solid var(--line)}.publication-card{grid-template-columns:1fr;padding:16px}.video-frame{height:280px}.publication-copy h3{font-size:1.05rem}.section-heading{align-items:flex-start;flex-direction:column;gap:8px}.project-grid{grid-template-columns:1fr}.news-scroll li{gap:9px;grid-template-columns:60px minmax(0,1fr)}.project-card{padding:20px}}
.project-visual{margin:0;min-width:0}.project-visual figcaption{font-size:.68rem;color:var(--muted);line-height:1.45;margin-top:8px}.project-visual img{max-height:360px;object-fit:contain}.project-placeholder{min-height:210px;border:1px dashed #b8c4cf;border-radius:9px;background:#f3f6f8;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:.8rem}.project-list .project-card{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:26px;align-items:center}.project-copy{min-width:0}.project-copy>p{font-size:.87rem;color:var(--muted)}.project-grid .project-visual,.project-grid .project-placeholder{margin-bottom:18px}.project-grid .project-visual img{height:240px;max-height:240px;object-fit:contain}.project-grid .project-placeholder{height:282px}.course-projects{margin-top:12px}.project-copy .project-related{font-size:.8rem;margin-top:14px}
@media(max-width:700px){.project-list .project-card{grid-template-columns:1fr;gap:18px}.project-grid .project-placeholder{height:240px}.project-visual img{max-height:400px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.hobby-icons{display:inline-flex;gap:1px;vertical-align:middle;white-space:nowrap}.hobby-icon{display:inline-block;width:25px;height:26px;object-fit:contain;vertical-align:middle;margin:0 2px}.hobby-icons .hobby-icon{margin:0}

.paper-soon{font-size:.8rem;font-weight:700;color:var(--muted,#5f6b76)}

.profile-photo{flex:0 0 112px;width:112px;height:112px;object-fit:cover;border-radius:15px}
@media(max-width:560px){.profile-photo{flex-basis:80px;width:80px;height:80px}}

/* Home: profile and biography above a compact, full-width news panel. */
.home-intro{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:44px;align-items:center;margin-bottom:22px}
.home-intro .profile-header{flex-direction:column;align-items:center;text-align:center;gap:14px;margin:0}
.home-intro .profile-photo{width:240px;height:240px;flex:0 0 240px}
.home-intro h1{font-size:2.1rem;line-height:1.15;margin-bottom:6px;letter-spacing:-.035em}
.home-intro .profile-subtitle{font-size:.83rem;margin-bottom:6px}
.home-main>.profile-links{justify-content:center;align-items:center;text-align:center;gap:10px 26px;margin:0 0 24px;font-size:.86rem}.home-main>.profile-links a{overflow-wrap:anywhere}
.home-intro #about p:last-child{margin-bottom:0}
.home-main>.news-panel{padding:12px 18px 8px}
.home-main .news-heading h2{margin-bottom:8px}
.home-main .news-scroll{height:280px}
.home-main .news-scroll li{padding:8px 0;grid-template-columns:72px minmax(0,1fr)}
.home-main .news-scroll li:first-child{padding-top:0}
.home-main>.section-block{padding-top:24px}
.home-main #simretract{align-items:center}
@media(max-width:850px){.home-intro{grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:26px}.home-intro h1{font-size:1.9rem}.home-intro .profile-photo{width:200px;height:200px;flex-basis:200px}}
@media(max-width:620px){.home-intro{grid-template-columns:1fr;gap:24px}.home-intro .profile-header{flex-direction:column;align-items:center;gap:14px}.home-intro .profile-photo{width:220px;height:220px;flex-basis:220px}.home-intro h1{font-size:1.7rem}.home-intro .profile-links{gap:10px}.home-main .news-scroll{height:280px}}


/* Papers page: one paper per row, with responsive media and text. */
.papers-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.papers-grid>.publication-card{margin-bottom:0;min-width:0}




/* Unified Projects page, responsive like Papers. */
.projects-grid{gap:24px}
@media(min-width:960px){
 .projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .projects-grid .project-card{display:flex;flex-direction:column;align-items:stretch;gap:20px;min-width:0}
 .projects-grid .media-frame,.projects-grid .project-placeholder{height:280px;min-height:280px;width:100%}
 .projects-grid .figure-link{height:100%;display:flex;flex-direction:column}
 .projects-grid .media-frame img{height:100%;min-height:0;flex:1;object-fit:contain}
 .projects-grid .figure-action{flex:none}
 .projects-grid .project-copy{flex:1}
}

.project-video{aspect-ratio:16/9;background:#111}.project-video video{display:block;width:100%;height:100%;object-fit:contain}

.home-intro #about h1{margin-bottom:18px}

.hobby-icon.offroad-icon{width:42px;height:32px;margin:0 3px}

.home-intro .profile-photo{object-position:center;filter:none}

.profile-photo-frame{width:300px;height:300px;flex:none;overflow:hidden;border-radius:8px}
.home-intro .profile-photo-frame .profile-photo{display:block;width:100%;height:100%;border-radius:0;transform:none}
@media(min-width:621px) and (max-width:850px){.profile-photo-frame{width:240px;height:240px}}
@media(max-width:620px){.profile-photo-frame{width:280px;height:280px;max-width:100%}}

.home-intro #about p{font-size:1.04rem;line-height:1.65}
.home-main .news-heading h2{font-size:1.45rem}
.home-main .news-scroll p{font-size:.92rem;line-height:1.55}
.home-main .news-scroll time{font-size:.82rem}
.home-main .news-heading span{font-size:.76rem}

.hobby-icon.skiing-icon{width:46px;height:36px;margin:0 3px}

/* Keep responsive picture sources within the existing figure layout. */
.figure-link picture{display:block;min-width:0;min-height:0}
@media(min-width:960px){.projects-grid .figure-link picture{flex:1;overflow:hidden}}

.advisor-link,.advisor-link:visited{color:var(--blue-dark);font-weight:700}.advisor-link:hover,.advisor-link:focus-visible{color:var(--blue);text-decoration:underline;text-underline-offset:3px}

/* Soft sage emphasis for conference acceptance announcements. */
.home-main .news-acceptance p{background:#eaf2ec;color:#315846;border-radius:8px;padding:7px 10px}.home-main .news-acceptance p a{color:#24573f;font-weight:600}.home-main .news-acceptance time{padding-top:9px}

.hobby-icon.guitar-icon{width:36px;height:30px}

.media-frame .looping-cover{display:block;width:100%;height:auto;max-height:360px;object-fit:contain}
@media(min-width:960px){.projects-grid .media-frame .looping-cover{height:100%;min-height:0;flex:1}}

.home-main .project-grid .looping-cover{height:240px;max-height:240px}

/* Shared color system; light is the default, dark is explicitly selected. */
:root{color-scheme:light;--surface:#fff;--header:rgba(247,248,245,.97);--card-hover:#f0f6f0;--card-hover-line:#bccfbe;--shadow:rgba(30,70,45,.06);--intro:#34404a;--placeholder:#f3f6f8;--acceptance:#eaf2ec;--acceptance-text:#315846;--acceptance-link:#24573f}
:root[data-theme="dark"]{color-scheme:dark;--ink:#e7edf6;--muted:#afbdd1;--paper:#101827;--line:#30415c;--blue:#9fc5ef;--blue-dark:#b3d2f4;--soft-blue:#243b5b;--surface:#19263b;--header:rgba(16,24,39,.97);--card-hover:#20353e;--card-hover-line:#476777;--shadow:rgba(0,0,0,.2);--intro:#d4deec;--placeholder:#1c2c44;--acceptance:#293e30;--acceptance-text:#d0e5d3;--acceptance-link:#bfdfc5}
.site-header{background:var(--header)}
.news-panel,.publication-card,.project-card,.skip-link{background:var(--surface)}
.home-intro #about p{color:var(--intro)}
.home-intro #about .personal-note{color:var(--muted)}
.project-placeholder{background:var(--placeholder);border-color:var(--line);text-align:center;padding:20px}
.home-main .news-acceptance p{background:var(--acceptance);color:var(--acceptance-text)}
.home-main .news-acceptance p a{color:var(--acceptance-link)}
.media-frame{border-color:var(--line)}
/* Scientific figures retain their original colors and white canvas. */
.figure-action{color:#5f6b76}
nav{align-items:center}
.theme-toggle{font:inherit;font-size:.82rem;line-height:1.2;color:var(--blue-dark);background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:9px 13px;cursor:pointer;white-space:nowrap}
.theme-toggle:hover{background:var(--card-hover);border-color:var(--card-hover-line)}
.theme-toggle:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.publication-card,.project-card{transition:background-color .2s ease,border-color .2s ease,box-shadow .2s ease}
@media(hover:hover){.publication-card:hover,.project-card:hover{background:var(--card-hover);border-color:var(--card-hover-line);box-shadow:0 5px 18px var(--shadow)}}
.publication-card:focus-within,.project-card:focus-within{background:var(--card-hover);border-color:var(--card-hover-line)}
.publication-card{align-items:center}
.publication-copy{align-self:center}
.publication-copy h3,.project-copy h3{font-size:1.22rem;line-height:1.3}
.publication-copy p,.project-copy>p{font-size:.94rem;line-height:1.65}
.publication-copy .authors{font-size:.9rem;line-height:1.55;white-space:normal;overflow-wrap:anywhere}
.venue{font-size:.77rem}
.pub-links{flex-wrap:wrap;gap:8px 16px}
.pub-links a,.paper-soon{font-size:.88rem}
.figure-action{font-size:.76rem}
.home-main .news-scroll time{font-size:.91rem;font-weight:700;white-space:nowrap}
.home-main .news-scroll li{grid-template-columns:82px minmax(0,1fr)}
.project-copy h3{margin:0 0 5px}
.project-card .project-copy .project-topics{font-size:.82rem;line-height:1.5;color:var(--muted);margin:0 0 14px;font-weight:400}
.project-copy .project-related{font-size:.87rem}
nav a,.all-link{font-size:.9rem}
.note{font-size:.82rem}
.paper-visual{display:block;padding:9px}
@media(max-width:560px){nav{gap:16px}.publication-copy h3,.project-copy h3{font-size:1.15rem}.home-main .news-scroll li{grid-template-columns:76px minmax(0,1fr);gap:8px}.home-main .news-scroll time{font-size:.88rem}}
@media(prefers-reduced-motion:reduce){.publication-card,.project-card{transition:none}}

/* Compact sun/moon switch with a visible selected state. */
.theme-toggle{position:relative;display:inline-grid;grid-template-columns:28px 28px;align-items:center;justify-items:center;gap:0;width:64px;height:34px;padding:3px;border-radius:20px;isolation:isolate}
.theme-toggle::before{content:"";position:absolute;z-index:0;left:3px;top:3px;width:26px;height:26px;border-radius:50%;background:var(--soft-blue);box-shadow:0 1px 3px var(--shadow);transition:transform .2s ease}
.theme-icon{position:relative;z-index:1;display:block;pointer-events:none}
.theme-sun{color:var(--blue-dark)}
.theme-moon{color:var(--muted);opacity:.65}
:root[data-theme="dark"] .theme-toggle::before{transform:translateX(28px)}
:root[data-theme="dark"] .theme-sun{color:var(--muted);opacity:.65}
:root[data-theme="dark"] .theme-moon{color:var(--blue-dark);opacity:1}
@media(prefers-reduced-motion:reduce){.theme-toggle::before{transition:none}}

/* Secondary name below the English heading. */
.home-intro .profile-names .chinese-name{font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:1.15rem;font-weight:400;line-height:1.5;letter-spacing:.12em;color:#757b83;margin:6px 0 0}
:root[data-theme="dark"] .home-intro .profile-names .chinese-name{color:#a6aebb}

/* Center the bilingual identity below the photo; keep About with the biography. */
.home-intro{align-items:start}
.home-intro .profile-names{width:100%;text-align:center}
.home-intro .profile-names h1{font-size:1.65rem;line-height:1.2;margin:0;letter-spacing:-.025em}
.home-intro #about h2{font-size:2rem;line-height:1.15;margin:0 0 18px}
@media(min-width:621px) and (max-width:850px){.home-intro .profile-names h1{font-size:1.35rem}}
