/* Typography and colors follow the user's original Haoran Geng stylesheet. */
@font-face{font-family:Lato;font-style:normal;font-weight:400;font-display:swap;src:url('assets/fonts/lato-regular.woff2') format('woff2')}
@font-face{font-family:Lato;font-style:normal;font-weight:700;font-display:swap;src:url('assets/fonts/lato-bold.woff2') format('woff2')}
@font-face{font-family:Lato;font-style:italic;font-weight:400;font-display:swap;src:url('assets/fonts/lato-italic.woff2') format('woff2')}
@font-face{font-family:Lato;font-style:italic;font-weight:700;font-display:swap;src:url('assets/fonts/lato-bold-italic.woff2') format('woff2')}
@font-face{font-family:NameLatin;font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/name-latin.ttf') format('truetype')}
@font-face{font-family:NameChinese;font-style:normal;font-weight:500;font-display:swap;src:url('assets/fonts/name-chinese.ttf') format('truetype')}
*{box-sizing:border-box}
body{margin:8px;background:#fff;color:#000;font:14px/1.32 Lato,Verdana,Helvetica,'Microsoft YaHei',sans-serif}
[hidden]{display:none!important}
a{color:#fe6a00e9;text-decoration:none;text-shadow:0 0 1px rgb(235,255,58)}
a:hover,a:focus{color:#f09228;text-decoration:none}
a:focus-visible,button:focus-visible,summary:focus-visible,.paper-media:focus-visible{outline:2px solid #d86a13;outline-offset:3px}
button{font:inherit;cursor:pointer}
img{max-width:100%;display:block}
p{margin:12px 0}
strong,h3{font-weight:700}
.homepage{width:100%;max-width:800px;margin:0 auto;position:relative;padding-top:4px}
.language-switch{display:flex;width:max-content;gap:2px;align-items:center;margin:4px 5px 0 auto;padding:3px;border:1px solid #e9d8be;border-radius:6px;background:#fff;font-size:12px}
.language-switch button{background:transparent;border:0;border-radius:3px;color:#555;padding:5px 12px;min-height:32px;font-size:12px;line-height:1.4}
.language-switch button:hover{background:#fff8ec;color:#ad4c00}
.language-switch button[aria-pressed=true]{background:#fff0d7;color:#a64600;font-weight:700}
.about{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:0;align-items:center;padding-top:10px;margin-bottom:14px}
.bio{padding:16px}
h1{font-family:NameLatin,Georgia,serif;font-size:38px;font-weight:500;text-align:center;margin:10px 0 16px;line-height:1.25;letter-spacing:.2px}
h1 [lang="zh-CN"]{font-family:NameChinese,'SimSun',serif;font-size:28px;font-weight:500;letter-spacing:1px}
.bio>p{text-align:justify;margin:13px 0}
.bio .contact-links{text-align:center;margin-top:17px;line-height:1.9}
.contact-links>span[aria-hidden]{padding:0 5px}
.portrait{margin:17px 0 0;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0 10px}
.portrait-frame {
 position:relative;
 width:230px;
 max-width:100%;
}
.portrait a{display:block;width:100%;max-width:230px}
.portrait img{width:100%;max-width:230px;height:auto;object-fit:contain}
.portrait-decoration {
 position:absolute;
 inset:0;
 pointer-events:none;
}
.portrait-charm,.portrait-sparkle,.portrait-planet {
 position:absolute;
 pointer-events:none;
 overflow:visible;
}
.portrait-charm {
 width:34px;
 height:auto;
 transform-origin:50% 4%;
 animation:portrait-sway 5.6s ease-in-out infinite alternate;
}
.portrait-charm-star {
 left:-17px;
 top:-19px;
 --sway-start:-7deg;
 --sway-end:5deg;
}
.portrait-charm-moon {
 right:-7px;
 top:-19px;
 --sway-start:5deg;
 --sway-end:-6deg;
 animation-duration:6.8s;
 animation-delay:-2.4s;
}
.charm-string {
 fill:none;
 stroke:#d2a366;
 stroke-width:1.15;
 stroke-linecap:round;
}
.charm-shape {
 fill:#ffedb3;
 stroke:#c38d3c;
 stroke-width:1.2;
 stroke-linejoin:round;
}
.charm-bead{fill:#dcac5b}
.portrait-sparkle {
 right:15px;
 bottom:-12px;
 width:24px;
 animation:portrait-twinkle 4.6s ease-in-out infinite alternate;
}
.portrait-planet {
 top:-16px;
 right:-9px;
 width:56px;
 height:auto;
 animation:portrait-float 6s ease-in-out infinite alternate;
}
.planet-ring {
 fill:none;
 stroke:#c38d3c;
 stroke-width:1.6;
 stroke-linecap:round;
}
.planet-band {
 fill:none;
 stroke:#e4bd73;
 stroke-width:2;
 stroke-linecap:round;
}
.portrait-orbit-sparkle {
 top:17px;
 left:-11px;
 right:auto;
 bottom:auto;
 width:19px;
 animation-delay:-2.3s;
}
.portrait-style-switch {
 display:flex;
 gap:2px;
 margin-top:17px;
 padding:2px;
 border:1px solid #eadcc8;
 border-radius:18px;
 background:#fff;
}
.portrait-style-switch button {
 min-height:28px;
 padding:4px 9px;
 border:0;
 border-radius:14px;
 background:transparent;
 color:#775c40;
 font-size:11px;
 line-height:1.4;
 white-space:nowrap;
}
.portrait-style-switch button:hover {
 background:#fff8ec;
 color:#ad4c00;
}
.portrait-style-switch button[aria-pressed=true] {
 background:#fff0d7;
 color:#a64600;
 font-weight:700;
}
@keyframes portrait-sway {
 from{transform:rotate(var(--sway-start))}
 to{transform:rotate(var(--sway-end))}
}
@keyframes portrait-twinkle {
 from{opacity:.5;transform:scale(.82) rotate(-8deg)}
 to{opacity:1;transform:scale(1) rotate(8deg)}
}
@keyframes portrait-float {
 from{transform:translateY(-3px) rotate(-4deg)}
 to{transform:translateY(3px) rotate(4deg)}
}
h2{font-size:25px;font-weight:400;line-height:1.3;text-decoration:underline;text-decoration-color:#fba524;text-decoration-thickness:1px;text-underline-offset:3px;margin:0 0 15px}
h3{font-size:14px;line-height:1.32;margin:0}
main>section:not(.about){margin-top:29px}
.news,.inset-section{width:100%;margin-left:0;margin-right:0}
.news-list,.honors-list,.misc-list{padding-left:40px;margin:14px 0}
.news-list li{padding-left:0;margin:4px 0;line-height:1.35}
.news-date{white-space:nowrap}
.milestone{color:red}
.celebrate-button{border:0;background:none;padding:0 2px;color:#e86700;text-shadow:0 0 1px #ebff3a;font-size:12px}
.celebrate-button:hover{text-decoration:underline}
.research-intro{margin:8px 0 12px}
.current-work{margin:10px 0}
.representative-note{margin:6px 0 10px}
.highlight{background:#ffffd0}
.paper-list{margin-top:8px}
.paper{display:grid;grid-template-columns:240px minmax(0,1fr);align-items:center}
.paper-featured{background:#ffffdc}
.figure-column{padding:20px 0 20px 20px;min-width:0}
.paper-media{width:220px;max-width:100%;position:relative}
.paper-figure{display:flex;position:relative;align-items:center;justify-content:center;width:100%;height:155px}
.paper-figure img{width:220px;max-height:155px;object-fit:contain}
.hover-video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:white;opacity:0;pointer-events:none;transition:opacity .2s ease-in-out}
.demo-active .hover-video{opacity:1}
.demo-toggle{display:block;background:none;border:0;padding:5px 0 0;margin:0 auto;color:#bc5700;font-size:11px;min-height:24px}
.demo-toggle:hover{text-decoration:underline}
.paper-text{padding:20px;min-width:0}
.paper-text h3{margin:0 0 7px}
.authors{margin:0 0 7px;line-height:1.35}
.self-author{color:#000;text-decoration:underline;text-underline-offset:2px}
.paper-resources{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:4px;row-gap:4px;margin:0 0 8px;line-height:1.3}
.resource-separator{color:#000;white-space:pre}
.paper-venue{margin:0 0 7px}
.paper-description{margin:0;line-height:1.35}
.citation{display:contents}
.citation summary{display:inline;list-style:none;cursor:pointer;color:#ed6700;text-shadow:0 0 1px #ebff3a}
.citation summary::-webkit-details-marker{display:none}
.citation summary:hover{color:#f09228}
.citation-body{flex:0 0 100%;min-width:0;margin-top:5px;padding:10px;border:1px solid #edcf99;background:#fff}
.citation-body pre{font:11px/1.5 Consolas,monospace;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.copy-citation{background:#fff;border:1px solid #edcf99;padding:4px 7px;font-size:11px;margin-top:8px;color:#a44b00}
.contribution-details{font-size:12px;margin-top:9px;line-height:1.45}
.contribution-details summary{color:#b35400;cursor:pointer}
.contribution-details ul{padding-left:18px;margin:7px 0 0}
.contribution-details li{margin:4px 0}
.author-note{font-size:11px;margin:14px 20px 0;color:#666}
.engineering-row{margin:0 0 20px}
.engineering-row>p{margin:7px 0}
.engineering-row h3{color:#d65b00}
.experience-row{display:grid;grid-template-columns:155px minmax(0,1fr);gap:10px;align-items:center;padding:14px 10px}
.institution-logo{padding:0 20px;display:flex;align-items:center;justify-content:center}
.institution-logo img{width:108px;max-height:110px;object-fit:contain}
.experience-row h3{color:#e66500}
.experience-row p{margin:4px 0}
.coursework{font-size:12px;line-height:1.45}
.honors-list li{margin:7px 0;line-height:1.4}
.honor-year{white-space:nowrap}
.misc-list li{margin:9px 0;line-height:1.45}
.site-footer{padding:16px 20px 14px;border-top:1px solid #ddd;text-align:center;font-size:11px;color:#555;margin-top:28px}
.site-footer p{margin:0;line-height:1.5}
.site-footer a{font-size:11px}
.visitor-statistics{margin:0 auto 22px;max-width:420px}
.stat-totals{font-size:12px;display:flex;justify-content:center;gap:7px;align-items:baseline}
.stat-totals strong{font-size:15px;font-variant-numeric:tabular-nums;color:#654523}
.visitor-map{display:block;width:100%;height:auto;margin:10px auto;border-radius:6px}
.visitor-map:not([src]){display:none}
.stat-status .stat-unavailable,.stat-status .stat-preview{display:none}
.stat-status[data-state=unavailable] .stat-unavailable,.stat-status[data-state=preview] .stat-preview{display:inline}
.visitor-actions{display:grid;grid-template-columns:28px 1fr 1fr 28px;align-items:center;gap:9px;margin:20px 0 13px}
.visitor-actions .visitor-action{display:flex;align-items:center;justify-content:center;min-height:44px;padding:9px 10px;border:1px solid #e5b37a;border-radius:24px;background:#fff5e6;color:#91420b;font-size:13px;font-weight:700;text-shadow:none;line-height:1.4;transition:background .2s,transform .2s}
.visitor-actions .visitor-action:hover{background:#ffe7c5;transform:translateY(-2px)}
.visitor-actions .visitor-action-secondary{background:#fff;border-color:#cfbeb0;color:#655041}
.action-hand{font-family:Georgia,serif;font-size:27px;color:#a46a39;line-height:1}
.visitor-privacy{margin:0!important}
.visitor-privacy a{color:#8b7562;font-size:11px;text-shadow:none}
.skip-link{position:fixed;left:16px;top:-100px;padding:8px 12px;border:1px solid #e46000;background:#fff;z-index:100}
.skip-link:focus{top:12px}
.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}
#effect-layer{position:fixed;inset:0;pointer-events:none;z-index:90;overflow:hidden}
.click-emoji,.confetti-piece{position:absolute;pointer-events:none;user-select:none;will-change:transform,opacity}
.click-emoji{font-size:17px;line-height:1}
.confetti-piece{width:7px;height:10px;border-radius:1px}
@media(max-width:650px){
 body{font-size:13px;line-height:1.45}
 .homepage{padding:12px 10px 0}
 .about{grid-template-columns:minmax(0,1fr) 170px;padding-top:8px}
 .bio{padding:10px}
 h1{font-size:34px}
 h1 [lang="zh-CN"]{font-size:26px}
 .portrait{padding:0 5px}
 .portrait-frame{width:160px}
 .portrait img{width:100%;max-width:160px;height:auto}
 .contact-links>span[aria-hidden]{padding:0 2px}
 .paper{grid-template-columns:215px minmax(0,1fr)}
 .figure-column{padding:15px}
 .paper-media{width:185px}
 .paper-text{padding:15px 12px}
 h3{font-size:13px}
 .experience-row{grid-template-columns:125px minmax(0,1fr)}
 .institution-logo{padding:0 10px}
 .news,.inset-section{width:94%}
}
@media(max-width:480px){
 body{margin:8px}
 .homepage{padding:10px 6px 0}
 .about{display:flex;flex-direction:column-reverse;gap:0;padding-top:18px;margin-bottom:8px}
 .portrait{margin:0 auto 6px;padding:0}
 .portrait-frame{width:230px}
 .portrait img{width:100%;max-width:230px;height:auto}
 .bio{padding:6px 8px}
 h1{font-size:35px;margin:10px 0 16px}
 .bio>p{text-align:left}
 .bio .contact-links{margin-top:12px}
 .language-switch{margin-right:2px}
 h2{font-size:24px;margin-bottom:13px}
 main>section:not(.about){margin-top:25px}
 .news,.inset-section{width:96%}
 .news-list,.honors-list,.misc-list{padding-left:20px}
 .paper{display:block;padding:17px 0 4px}
 .figure-column{padding:0 16px}
 .paper-media{width:100%}
 .paper-figure{height:160px}
 .paper-figure img{width:100%;max-height:160px}
 .paper-text{padding:15px 16px 19px}
 .paper-text h3{font-size:14px}
 .authors{font-size:12px}
 .paper-resources{font-size:12px}
 .paper-venue,.paper-description{font-size:13px}
 .author-note{margin:13px 10px 0;font-size:10.5px}
 .experience-row{grid-template-columns:85px minmax(0,1fr);gap:10px;padding:14px 4px}
 .institution-logo{padding:0 4px}
 .institution-logo img{width:77px;max-height:82px}
 .experience-row p{font-size:12px}
 .experience-row .coursework{font-size:11px}
 .site-footer{text-align:center;padding:12px 6px 20px;font-size:10px}
 .site-footer a{font-size:10px}
}
@media(pointer:coarse){
 .language-switch button{min-height:44px}
 .portrait-style-switch button{min-height:44px}
}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
 #effect-layer{display:none}
 .portrait-charm,.portrait-sparkle,.portrait-planet{animation:none}
}
@media print{
 .portrait-decoration,.portrait-style-switch{display:none!important}
 .visitor-statistics{display:none!important}
 .language-switch,.demo-toggle,.celebrate-button,.copy-citation,#effect-layer,.skip-link{display:none!important}
 .homepage{max-width:none}
 .paper,.experience-row,.engineering-row{break-inside:avoid}
 a{color:#000;text-shadow:none}
}