/*
 * AIDDPM academic presentation layer.
 * Loaded after page styles; content, links, JSON and research assets stay intact.
 * A single locally available type family avoids third-party font dependencies.
 */
:root {
  --F-body:Arial,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;
  --F-display:var(--F-body);
  --F-mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  --navy:#303A43; --navy-2:#454D52;
  --indigo:#7E6148; --indigo-2:#6B513C; --violet:#5E4735;
  --text:#303A43; --text-2:#44494C; --text-3:#5C6266; --text-4:#646A6D;
  --border:#DDD9D3; --border-2:#C9C1B7; --divider-color:#DDD9D3;
  --bg:#fff; --bg-card:#fff; --bg-alt:#F7F6F3;
  --grad:linear-gradient(#7E6148,#7E6148);
  --grad-soft:linear-gradient(#F3F0EB,#F3F0EB);
  --sh-xs:none; --sh-sm:none; --sh:none; --sh-lg:none;
  --radius:3px; --radius-lg:4px; --radius-xl:6px; --nav-h:110px;
}
html { font-size:16px; scroll-padding-top:24px }
body { font-family:var(--F-body); font-size:17px; line-height:1.8; letter-spacing:0; color:var(--text); background:#fff }
h1,h2,h3,h4,h5,h6,button,input,select,textarea { font-family:var(--F-body) }
:where(a,button,input,select,textarea):focus-visible { outline:2px solid #7E6148; outline-offset:4px }
:where(p,li,h1,h2,h3,h4) { overflow-wrap:break-word }
.nav {
  position:relative; inset:auto; height:auto; min-height:var(--nav-h);
  width:100%; padding:19px max(28px,calc((100vw - 1240px)/2)); gap:28px;
  border-top:0; border-bottom:1px solid #D2C9BF;
  background:#EEEAE4; box-shadow:none;
}
.nav-logo-img { width:244px; max-width:100%; height:auto }
.nav-brand { flex:0 0 244px; min-width:0 }
.nav-links { display:flex; gap:4px; margin-left:auto }
.nav-links a {
  display:block; font-family:var(--F-body); font-size:17px; font-weight:500;
  color:#303A43; padding:12px 11px; border-radius:2px;
  border-bottom:2px solid transparent; text-decoration:none;
}
.nav-links a:hover,.nav-links a:focus-visible { background:#E5DFD6; color:#303A43; text-decoration:none }
.nav-links a.active { color:#5E4735; background:#E2DBD1; border-bottom-color:transparent; font-weight:600; text-decoration:none }
.nav-disclosure { display:none }
.nav-toggle { width:48px; height:48px; color:#303A43; border:1px solid #C9C1B7; border-radius:3px; background:#EEEAE4 }
.nav-drawer { background:#F9F8F6; padding:30px }
.nav-drawer-logo { width:230px }
.nav-menu a { font-family:var(--F-body); font-size:20px; color:#303A43; border-radius:2px; padding:15px 12px }
.nav-menu a.active { color:#5E4735; background:#E2DBD1; text-decoration:none }
.nav-menu a:hover,.nav-menu a:focus-visible { background:#EEEAE4; text-decoration:none }
.page { min-height:65vh }
.page-content { padding-top:0 }
.section,.publications-section,.members-page .page>.section,.join-page .page>.section {
  max-width:1240px; margin-inline:auto; padding:44px 28px 60px;
}
.page-content>.section:first-child,.page-content>.page-title+.section { padding-top:42px }
.page>.pg-header,.page>.bp-header { padding-top:44px }
.page-title { max-width:1240px; margin:auto; padding:42px 28px 0 }
.page-title h1,.pg-title,.s-title { font-family:var(--F-body); font-size:30px; font-weight:600; line-height:1.35; letter-spacing:0; color:#303A43 }
.eyebrow { font-family:var(--F-body); letter-spacing:1px; color:#7E6148 }
.section-header { margin-bottom:26px }
/* Present the existing title and introduction media side by side. */
.home-page .home-video {
  max-width:1240px; margin:0 auto; padding:46px 28px 42px;
  display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.06fr); gap:56px; align-items:center;
  border-bottom:1px solid #DDD9D3;
}
.home-video-heading {
  position:static; width:auto; height:auto; padding:0; margin:0; overflow:visible;
  clip-path:none; white-space:normal; font:600 clamp(30px,3.1vw,43px)/1.26 var(--F-body);
  letter-spacing:-.6px; color:#303A43;
}
.home-video-player { max-width:none; width:100%; border-radius:3px; aspect-ratio:16/9; background:#EEEAE4; box-shadow:none }
.home-video-surface { border-radius:3px }
.home-page .home-overview { padding-top:40px }
.home-overview-grid { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:64px }
.home-research-intro::before,.home-news-art { display:none }
.home-overview-grid .s-title,.home-publications-header h2,
#calendar-title,#talks-title,#postdoctoral-title,#environment-title,#opportunities-title,#gallery-title {
  font-family:var(--F-body); font-weight:600; font-size:28px; line-height:1.35;
  letter-spacing:0; color:#303A43; transform:none; translate:none; scale:none; transition:none;
}
.home-overview-grid .s-title::before,.home-publications-header h2::before,
#calendar-title::before,#talks-title::before,#postdoctoral-title::before,#environment-title::before,#opportunities-title::before,#gallery-title::before { display:none }
:is(.home-page #news-heading,.home-page #research-heading,.home-page #home-publications-title,#calendar-title,#talks-title,#postdoctoral-title,#environment-title,#opportunities-title,#gallery-title):hover { color:#303A43; translate:none; scale:none; transform:none }
.home-overview-grid .research-summary p { font-size:17px; line-height:1.85; color:#44494C }
.home-news .section-header { padding-bottom:14px; border-bottom:1px solid #DDD9D3; margin-bottom:0 }
.home-page .home-news .news-item { grid-template-columns:84px minmax(0,1fr); gap:16px; padding:17px 0; align-items:start }
.home-news .news-date,.selected-talks .news-date,.news-page .b-date { font-family:var(--F-body); font-size:13px; line-height:1.8; letter-spacing:0; color:#646A6D }
.home-news .news-text { font-size:15px; line-height:1.8; color:#44494C }
.home-news .home-news-more { font-size:14px; color:#7E6148 }
.home-more-icon { display:none }
.home-publications { border-top:1px solid #DDD9D3; margin-top:38px; padding-top:28px }
.home-publications-header { margin-bottom:20px }
.home-publications-stage { padding-inline:48px; background:#F8F7F4; border:1px solid #DDD9D3 }
.home-publication>a { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:32px; padding:28px 0; min-height:350px }
.home-publication-figure { height:260px; background:#fff; padding:10px }
.home-publication h3 { font:600 23px/1.45 var(--F-body); letter-spacing:0; color:#303A43 }
.home-publication-meta { font-size:15px; color:#7E6148 }
.home-publication-authors { font-size:15px; color:#646A6D }
.home-publications-controls button { color:#7E6148 }
.home-publications-controls button svg,.home-publications-controls button:hover svg { transform:none!important }
.home-affiliations { border-top:1px solid #DDD9D3; padding-top:25px; margin-top:25px }
/* Retain every portrait, role, group, biography and link. */
.members-page .pi-block { gap:40px; padding:0 0 34px; margin-bottom:38px; border-bottom:1px solid #DDD9D3 }
.members-page .pi-profile { flex-basis:250px; align-self:flex-start }
.members-page .pi-photo { position:relative; inset:auto; transform:none; width:100%; max-width:250px; height:auto; border-radius:3px; box-shadow:none }
.members-page .pi-photo img { width:100%; height:auto; margin:0; object-fit:contain }
.pi-info h2 { font-family:var(--F-body); font-size:30px; font-weight:600; letter-spacing:0; margin-bottom:16px }
.members-page .pi-bio { font-size:17px; line-height:1.85; color:#44494C }
.members-page .members-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px }
.members-page .m-card { padding:24px 18px; border:1px solid #DDD9D3; border-radius:3px; background:#fff }
.members-page .m-avatar { width:142px; height:142px; border-radius:3px; box-shadow:none; margin-bottom:18px }
.members-page .m-name { font-size:18px; font-weight:600 }
.members-page .m-role { font-family:var(--F-body); font-size:14px; font-weight:500; text-transform:none; letter-spacing:0; color:#7E6148 }
.members-page .m-info { font-family:var(--F-body); font-size:15px; line-height:1.75; color:#646A6D }
.msec-head { font-family:var(--F-body); font-size:27px; font-weight:600; color:#303A43; border-bottom:1px solid #DDD9D3; margin:0 0 22px; padding-bottom:14px }
.members-page .msec { margin-bottom:45px }
/* More compact citations; full original figures remain available via preview. */
.publications-page .pub-item { grid-template-columns:minmax(0,1fr) 270px; gap:36px; padding:29px 0; align-items:center }
.publications-page .pub-title-link { font-size:22px; line-height:1.5; font-weight:600; margin-bottom:12px; color:#303A43 }
.publications-page .pub-authors,.publications-page .pub-venue-line { font-size:16px; line-height:1.8 }
.publications-page .pub-num,.publications-page .pub-num .publication-venue { font-size:14px }
.publications-page .pub-thumb { width:100%; margin:0; padding:10px; border:1px solid #DDD9D3; background:#fff }
.publications-page .pub-thumb img { max-height:230px; object-fit:contain }
.publications-page .pub-search { max-width:500px; min-height:46px; border-color:#C9C1B7; border-radius:3px; background-color:#F9F8F6; font-family:var(--F-body); font-size:16px }
.t-card,.r-card,.postdoc-card,.pos-card { box-shadow:none; border-radius:3px }
.t-card:hover,.r-card:hover,.postdoc-card:hover { transform:none; box-shadow:none }
.t-name { font-family:var(--F-body); font-weight:600; font-size:28px; color:#303A43 }
.t-desc { font-size:17px; line-height:1.85; color:#44494C }
.b-title,.bp-title,.gallery-title { font-family:var(--F-body); font-weight:600; letter-spacing:0 }
.b-title { font-size:24px }
.bp-body { font-family:var(--F-body); font-size:17px; line-height:1.9 }
.bp-body code,.bp-body pre,.code-panel { font-family:var(--F-mono) }
.gallery-photo figcaption .gallery-title { font-size:18px; line-height:1.5 }
.gallery-section .section-header { padding-bottom:14px; border-bottom:1px solid #DDD9D3 }
.join-page .s-title,.join-page .join-intro h2,.join-offer h3,.join-page .postdoc-title,
.join-page .join-connect #opportunities-title { font-family:var(--F-body); font-weight:600; letter-spacing:0; color:#303A43 }
.join-lead h1 { font:600 clamp(32px,4vw,46px)/1.25 var(--F-body); letter-spacing:-.5px; color:#303A43 }
.join-page .postdoc-desc,.join-page .section-header p,.join-page .req-list li { font-size:16px; line-height:1.85 }
.join-welcome,.join-apply>p,.join-details-body p { font-family:var(--F-body); font-size:17px; line-height:1.85 }
.join-page .join-email { font-family:var(--F-body); font-size:24px }
.join-details-molecule { animation:none }
/* A full-width footer band, with the original navigation and contact content. */
.footer { background:#303A43; border-top:5px solid #7E6148; color:#F8F7F4; padding:42px 28px 24px }
.footer-wrap { max-width:1184px; margin:auto }
.footer-shared .footer-inner { grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) 235px; gap:44px; text-align:left; max-width:none; margin-bottom:28px }
.footer-nav { order:2 }
.footer-contact { order:1; min-width:0 }
.footer-visitors { order:3; text-align:center; min-width:0 }
.footer-shared .footer-nav { gap:24px }
.footer-shared .footer-nav .f-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px 16px }
.footer .f-brand { font-family:var(--F-body); color:#fff; font-size:23px; font-weight:600; margin-bottom:12px }
.footer .f-desc { font-size:15px; line-height:1.85; color:#E8E5DF }
.footer .f-col-head,.footer-shared .footer-nav .f-col-head { font-family:var(--F-body); font-size:13px; letter-spacing:1px; color:#fff; font-weight:600; margin-bottom:14px }
.footer .f-links a,.footer-shared .footer-nav .f-links a { color:#E8E5DF; font-size:14px; white-space:normal }
.footer a:hover { color:#fff; text-decoration:underline; text-underline-offset:4px }
.footer-shared .footer-socials { justify-content:flex-start; gap:8px }
.footer-social-link { color:#E8E5DF; border-radius:3px; background:#ffffff09 }
.footer-social-link:hover { color:#fff; background:#ffffff1a }
.footer a:focus-visible,.footer button:focus-visible { outline-color:#EEE5DA }
.footer-bottom { max-width:none; border-color:#727879; color:#E8E5DF; font-size:12px; padding-top:20px }
.footer .home-affiliations { background:#fff; border:0; border-radius:3px; padding:16px 24px; max-width:none; margin-bottom:28px }
.footer .home-affiliations a { height:70px }
.visitor-widget { position:relative; width:220px; max-width:100%; min-height:200px; margin:0 auto; display:grid; place-items:center }
.visitor-widget :is(canvas,iframe,object,embed) { max-width:100% }
.visitor-widget img { max-width:100%; height:auto }
.visitor-widget-status { color:#E8E5DF; font-size:12px; line-height:1.65; min-height:3.3em; margin-top:8px }
.visitor-widget-credit { font-size:12px; color:#E8E5DF!important; display:inline-block; margin-top:5px }
/* Reveal content immediately; retain functional dialogs and carousels. */
.fade-up,.fade-up.visible { opacity:1; transform:none; transition:none }
@media(max-width:1100px) {
  .nav { padding-inline:28px }
  .nav-links { display:none }
  .nav-disclosure { display:block }
  .nav-brand { margin-right:auto }
  .home-page .home-video { gap:32px }
  .home-video-heading { font-size:34px }
  .home-overview-grid { gap:36px }
  .footer-shared .footer-inner { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) 210px; gap:28px }
  .footer .f-desc { font-size:14px }
}
@media(max-width:800px) {
  :root { --nav-h:92px }
  .nav { padding:15px 22px; min-height:92px }
  .nav-brand { flex-basis:220px; max-width:calc(100% - 70px) }
  .nav-logo-img { width:220px }
  .home-page .home-video { grid-template-columns:1fr; gap:25px; padding:34px 24px }
  .home-video-heading { font-size:34px; max-width:700px }
  .home-overview-grid { grid-template-columns:1fr; gap:34px }
  .members-page .members-grid { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .members-page .pi-profile { flex-basis:auto; width:220px; max-width:100% }
  .members-page .pi-block { gap:26px }
  .publications-page .pub-item { grid-template-columns:minmax(0,1fr) 210px; gap:24px }
  .footer-shared .footer-inner { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:30px }
  .footer-visitors { grid-column:1/-1; border-top:1px solid #727879; padding-top:25px }
  .footer-shared .footer-nav { display:grid }
}
@media(max-width:600px) {
  body { font-size:16px }
  .section,.publications-section,.members-page .page>.section,.join-page .page>.section { padding:30px 22px 42px }
  .page-content>.section:first-child { padding-top:30px }
  .home-page .home-video { padding:28px 22px; gap:23px }
  .home-video-heading { font-size:29px; letter-spacing:0; line-height:1.3 }
  .home-video-player,.home-video-surface { border-radius:2px }
  .home-overview-grid .s-title,.home-publications-header h2,.s-title,.msec-head,
  #calendar-title,#talks-title,#postdoctoral-title,#environment-title,#opportunities-title,#gallery-title { font-size:25px }
  .home-overview-grid .research-summary p { font-size:16px }
  .home-news .news-item { grid-template-columns:78px minmax(0,1fr); gap:12px }
  .home-news .news-text { font-size:15px }
  .home-publications-stage { padding-inline:22px }
  .home-publication>a { display:flex; flex-direction:column; gap:20px; padding:22px 0 }
  .home-publication h3 { font-size:21px }
  .home-publication-figure { height:220px; width:100% }
  .home-publication-meta,.home-publication-authors { font-size:14px }
  .home-publications-controls button[data-direction="-1"] { left:-21px }
  .home-publications-controls button[data-direction="1"] { right:-21px }
  .members-page .members-grid { gap:15px }
  .members-page .m-card { padding:20px 10px }
  .members-page .m-avatar { width:112px; height:112px }
  .members-page .m-name { font-size:17px }
  .members-page .m-info { font-size:14px }
  .publications-page .pub-item { grid-template-columns:1fr; gap:20px; padding:25px 0 }
  .publications-page .pub-thumb { max-width:460px; margin:auto }
  .publications-page .pub-thumb img { max-height:230px }
  .publications-page .pub-title-link { font-size:21px }
  .publications-page .pub-authors,.publications-page .pub-venue-line { font-size:15px }
  .footer { padding:32px 22px 22px }
  .footer-shared .footer-inner { grid-template-columns:1fr; gap:30px }
  .footer-contact,.footer-nav { grid-column:auto }
  .footer-visitors { grid-column:auto }
  .footer-shared .footer-nav { grid-template-columns:1fr 1fr; gap:24px; padding-top:24px; border-top:1px solid #727879 }
  .footer-shared .footer-nav .f-links { grid-template-columns:1fr }
  .footer .home-affiliations { padding:12px; gap:16px }
  .footer .home-affiliations a { height:48px }
  .footer .home-affiliations .home-affiliations-lab { height:48px }
  .join-page .postdoc-desc,.join-page .req-list li { font-size:16px }
}
@media(max-width:380px) {
  .members-page .members-grid { grid-template-columns:1fr }
  .nav-logo-img { width:205px }
  .nav-brand { flex-basis:205px }
  .home-news .news-item { grid-template-columns:1fr; gap:3px }
  .home-video-heading { font-size:27px }
}
@media(prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto }
}
.pi-info h2>span { display:inline-block; white-space:nowrap }
/* Locale navigation and explicit media controls. */
.nav { gap:18px }
.nav-language { display:flex; align-items:center; gap:8px; flex-shrink:0; padding-left:16px; border-left:1px solid #C9C1B7; color:#646A6D; font-size:13px }
.language-link { color:#5C6266; padding:7px 2px; white-space:nowrap }
.language-link.is-active { color:#5E4735; font-weight:700; border-bottom:0 }
.home-media-controls { position:absolute; z-index:2; bottom:0; left:0; right:0; display:flex; align-items:center; gap:12px; min-height:42px; padding:8px 12px; color:white; background:rgba(48,58,67,.92) }
.home-media-controls button { font:400 12px/1.4 var(--F-body); color:#fff; border:1px solid #C9C1B7; border-radius:2px; padding:5px 9px; background:transparent; cursor:pointer; min-height:30px }
.home-media-controls button:hover { background:#ffffff1a }
.home-media-controls button:focus-visible { outline-color:#fff }
.video-audio-note,.video-playback-status { font:400 11px/1.5 var(--F-body); color:#E5DFD6 }
.video-playback-status:empty { display:none }
html[lang="zh"] body { line-height:1.85 }
html[lang="zh"] .home-video-heading { letter-spacing:.03em; line-height:1.5; font-size:clamp(30px,3vw,42px) }
html[lang="zh"] .news-text,html[lang="zh"] .research-summary { line-height:1.9 }
@media(min-width:1101px) and (max-width:1250px) { .nav-links a { font-size:16px; padding-inline:8px }.nav-brand { flex-basis:225px }.nav-logo-img { width:225px } }
@media(max-width:800px) { .nav { gap:12px }.nav-language { padding-left:0; border:0; gap:5px;font-size:12px }.nav-brand { flex-basis:195px; max-width:calc(100% - 135px) }.nav-logo-img { width:195px }.nav-toggle { width:42px;height:42px } }
@media(max-width:380px) { .nav { padding-inline:16px; gap:8px }.nav-brand { flex-basis:170px;max-width:calc(100% - 124px) }.nav-logo-img { width:170px }.nav-language { font-size:11px }.home-media-controls { gap:8px;padding:6px 9px }.video-audio-note { font-size:10px } }
html[lang="zh"] .home-video-heading { text-wrap:balance }

/* Restrained institutional palette: NPG ochre #7E6148 and charcoal #303A43. */
a { color:var(--indigo) }
.nav-links a.active { border:0; box-shadow:none; background:#E2DBD1 }
.nav-links a { border-bottom:0 }
.language-link.is-active { border:0; text-decoration:none }
.home-news .news-date-main,.selected-talks .news-date-main { color:#7E6148; font-size:20px }
.home-news .news-date-year,.selected-talks .news-date-year { color:#646A6D }
/* Static editorial rows: no timeline node can overlap its date. */
.news-page .news-heading { margin-bottom:32px; border-bottom:1px solid #DDD9D3; padding-bottom:22px }
.news-page .news-heading h1 { font-size:30px; font-weight:600; line-height:1.4; color:#303A43 }
.news-page .news-heading p { font-size:16px; color:#646A6D; margin-top:8px }
.news-page .news-item { display:grid; grid-template-columns:112px minmax(0,1fr); gap:32px; padding:25px 0; border-bottom:1px solid #DDD9D3 }
.news-page .news-item::before,.news-page .news-item::after { content:none; display:none }
.news-page .news-date { display:inline-flex; align-items:baseline; gap:5px; white-space:nowrap; opacity:1; transform:none }
.news-page .news-updates .news-text { font-size:17px; line-height:1.85; color:#44494C }
.news-page .news-text a { color:#7E6148; text-decoration-color:#C9C1B7 }
@media(max-width:600px) {
  .news-page .news-item { grid-template-columns:1fr; gap:9px; padding:22px 0 }
  .news-page .news-updates .news-text { font-size:16px }
}

.btn-primary { background:#7E6148; box-shadow:none }
.btn-primary:hover,.btn-primary:focus-visible { background:#5E4735; box-shadow:none; transform:none }
.btn-outline:hover { background:#F3F0EB; transform:none }
.members-page { --indigo:#7E6148; --indigo-2:#6B513C; --grad:linear-gradient(#7E6148,#7E6148) }
:is(.nb-pub,.postdoc-tag,.b-tag,.c-code,.pl-doi),.postdoc-card::before { background:#F3F0EB }
.b-cat { background:#7E6148 }
.bp-content code,.bp-content blockquote { background:#F7F6F3 }
.join-intro { border-color:#DDD9D3 }
:is(.pilink,.m-social-link):hover { background:#F3F0EB }

/* Video controls: one quiet icon, without a caption bar. */
.home-media-controls { bottom:12px; left:12px; right:auto; gap:8px; min-height:0; padding:0; background:transparent }
.home-media-controls #video-play-toggle { display:grid; place-items:center; width:44px; height:44px; min-height:44px; padding:10px; color:#fff; background:rgba(0,0,0,.55); border:1px solid rgba(255,255,255,.65); border-radius:3px; cursor:pointer }
.home-media-controls #video-play-toggle:hover { background:rgba(0,0,0,.75) }
#video-play-toggle svg { width:22px; height:22px; display:block }
#video-play-toggle .video-icon-pause,#video-play-toggle[aria-pressed="true"] .video-icon-play { display:none }
#video-play-toggle[aria-pressed="true"] .video-icon-pause { display:block }
.video-playback-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
