@font-face{font-family:Jost;src:url(jost-200.woff2) format('woff2');font-weight:200;font-display:swap}
@font-face{font-family:Jost;src:url(jost-300.woff2) format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:Jost;src:url(jost-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Jost;src:url(jost-700.woff2) format('woff2');font-weight:700;font-display:swap}
:root{--bg:#090a0b;--ink:#e9e9e5;--muted:#a0a1a3;--rule:#ffffff25;--accent:#83bfff;--blue:#9ebec8;--gutter:clamp(22px,4.2vw,80px);--max:1560px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:82px;background:var(--bg);color-scheme:dark}body{margin:0;background:var(--bg);color:var(--ink);font-family:Jost,"Microsoft YaHei","PingFang SC",sans-serif;font-weight:300;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--blue);outline-offset:5px}p,h1,h2,h3,figure{margin:0}button{border:0}img{display:block;max-width:100%}.skip{position:fixed;top:-80px;left:16px;z-index:100;padding:14px;background:white;color:black}.skip:focus{top:14px}
.site-nav{height:78px;position:fixed;z-index:50;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 var(--gutter);border-bottom:1px solid #ffffff15;background:#090a0b70;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.085em}.brand-symbol{font-size:25px;letter-spacing:-.12em;font-weight:300}.site-nav nav{display:flex;gap:34px;font-size:14px}.site-nav nav a{padding:13px 0;color:#a6a7a8;position:relative}.site-nav nav i{font:300 11px Jost,sans-serif;color:#7e8083;margin-right:8px}.site-nav nav a[aria-current]{color:var(--ink)}.site-nav nav a[aria-current]:after{content:"";height:1px;background:var(--accent);position:absolute;bottom:4px;left:0;right:0}.cv-link{justify-self:end;font-size:13px}.cv-link span{margin-left:15px}.site-nav a:hover{color:white}
.visual-page{min-height:780px;height:100svh;max-height:1350px;position:relative;padding:120px var(--gutter) 30px;display:flex;flex-direction:column;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 68% 42%,#26313960,transparent 62%)}#spatial-field{position:absolute;width:100%;height:100%;inset:0;z-index:-1;pointer-events:none}.visual-meta{display:flex;justify-content:space-between;font-size:12px;letter-spacing:.1em;color:#b6b7b9;line-height:1.7}.visual-meta b{font-family:"Microsoft YaHei",sans-serif;font-size:12px;font-weight:300;letter-spacing:.22em;color:#7f8185;display:inline-block;margin-top:8px}.edition{text-align:right}.visual-page h1{margin:auto 0 0;position:relative;font-weight:700;line-height:.85;display:flex;flex-direction:column;align-items:flex-start;padding-top:55px;padding-bottom:22px}.glass-word{position:relative;color:transparent;display:block;width:70%;aspect-ratio:var(--word-ratio);font-size:0;isolation:isolate}.glass-word:before,.glass-word:after{content:"";position:absolute;inset:0;mask-image:var(--word-mask);-webkit-mask-image:var(--word-mask);mask-size:100% 100%;-webkit-mask-size:100% 100%;mask-repeat:no-repeat;-webkit-mask-repeat:no-repeat}.glass-word:before{background:linear-gradient(115deg,#ffffff94 0%,#ffffff26 35%,#ffffff53 68%,#ffffff16);backdrop-filter:blur(9px) saturate(.6);-webkit-backdrop-filter:blur(9px) saturate(.6);filter:drop-shadow(0 0 1px #ffffff50)}.glass-word:after{background:linear-gradient(178deg,#fff8,transparent 8%,transparent 86%,#ffffff40);opacity:.5;pointer-events:none}.word-narrative{width:93%;align-self:flex-end;margin-top:20px}.hero-caption{display:flex;justify-content:space-between;align-items:end;margin:36px 0 54px}.hero-caption>span{font-size:clamp(22px,2.35vw,36px);font-weight:200;line-height:1.18;letter-spacing:.035em;color:#ddd}.hero-caption p{font-family:"Microsoft YaHei",sans-serif;font-size:14px;font-weight:300;line-height:1.85;color:#979ba0}.visual-bottom{margin-top:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-top:1px solid var(--rule);padding-top:20px;font-size:12px;gap:22px}.discover{display:flex;gap:25px;align-items:center;font-size:11px;letter-spacing:.08em}.discover b{font-size:21px;font-weight:200;color:var(--accent)}.sequence{display:flex;align-items:center;gap:20px;color:#9d9fa3;font-size:12px}.sequence-label{font-size:10px;letter-spacing:.08em;color:#707479}.sequence-dots{display:flex;gap:6px}.sequence-dots i{display:block;width:15px;height:2px;background:#ffffff24;transition:background .7s}.sequence-dots i.active{background:var(--accent)}#motion-toggle{justify-self:end;display:flex;gap:10px;align-items:center;background:transparent;font-size:12px;font-weight:300;padding:8px;color:#a9acaf}.pause-mark{font-size:14px;color:#eee}
.about-page,.projects-page{padding:80px var(--gutter) 0;max-width:calc(var(--max) + 2*var(--gutter));margin:auto;scroll-margin-top:0}.section-strip{display:flex;align-items:center;justify-content:space-between;padding-bottom:22px;font-size:12px;color:#95989a;letter-spacing:.055em}.section-strip p>span{color:var(--accent);margin-right:17px}.section-strip>span{font-size:10px;color:#707477}.about-frame{border:1px solid var(--rule);background:linear-gradient(130deg,#ffffff03,#ffffff00)}.about-top{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(250px,1fr);border-bottom:1px solid var(--rule);align-items:stretch}.about-copy{padding:clamp(26px,3.5vw,58px);display:flex;flex-direction:column;min-width:0}.eyebrow{font-size:12px;letter-spacing:.065em;font-weight:300;color:var(--accent);line-height:1.6}.about-copy h2{font-weight:200;margin:36px 0 34px;line-height:.86;letter-spacing:-.045em;font-size:clamp(60px,6.8vw,109px)}.cn-name{font-family:"Microsoft YaHei",sans-serif;font-size:.37em;letter-spacing:.13em;line-height:1.5;display:block;margin-bottom:13px;font-weight:300}.en-name{display:block}.bio-bottom{margin-top:auto}.education h3{font-family:"Microsoft YaHei",sans-serif;font-size:18px;font-weight:400;line-height:1.6}.education p{font-size:15px;color:#92979b;line-height:1.65;margin-top:8px}.statement{font-family:"Microsoft YaHei",sans-serif;font-size:16px;line-height:1.9;color:#b5b8bc;margin:24px 0 26px}.text-link{display:flex;justify-content:space-between;align-items:center;max-width:225px;border-bottom:1px solid #ffffff50;padding:12px 0;font-size:14px}.text-link span{color:var(--accent);font-size:21px}.portrait{border-left:1px solid var(--rule);display:flex;flex-direction:column;position:relative;min-width:0}.portrait img{position:absolute;inset:0 0 65px;width:100%;height:calc(100% - 65px);object-fit:cover;object-position:50% 30%;filter:none}.portrait figcaption{margin-top:auto;min-height:65px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 20px;background:#111315;font-size:12px;line-height:1.5}.portrait figcaption small{color:#999;font-size:9px;letter-spacing:.01em}.about-bottom{display:grid;grid-template-columns:1.05fr 1.25fr 1fr;padding:40px 0}.about-bottom>section{padding:0 clamp(20px,2.5vw,40px);min-width:0}.about-bottom>section+section{border-left:1px solid var(--rule)}.about-bottom .eyebrow{margin-bottom:25px;font-size:11px}.stats{display:flex;gap:clamp(15px,2vw,28px);flex-wrap:wrap}.stats strong{font-size:clamp(31px,3vw,46px);font-weight:200;white-space:nowrap;line-height:1.1}.stats small{font-size:16px;color:#92989c}.stats p>span{display:block;margin-top:15px;font-family:"Microsoft YaHei",sans-serif;font-size:12px;color:#979da2}.about-bottom ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:23px 18px}.about-bottom li{font-family:"Microsoft YaHei",sans-serif;font-size:14px;line-height:1.5}.about-bottom li span{font-family:Jost,sans-serif;display:block;font-size:13px;font-weight:300;color:#8d959a;line-height:1.5;margin-top:8px}.honors ul{grid-template-columns:1fr;gap:20px}
.projects-page{padding-top:110px;padding-bottom:95px}.projects-heading{margin:24px 0 46px;display:flex;align-items:end;justify-content:space-between;gap:25px}.projects-heading h2{font-family:"Microsoft YaHei",sans-serif;font-size:clamp(27px,3.2vw,48px);font-weight:300;line-height:1.5;letter-spacing:.01em}.projects-heading>p{font-size:13px;line-height:1.8;color:#959ca1;flex-shrink:0}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.5vw,40px)}.project-card{min-width:0;position:relative;display:block;--hover-shift:0px;--photo-scale:1.001;--accent:var(--accent)}.card-research{--accent:#a8c6d3}.card-caihe{--accent:#b4c8bf}.project-label{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.06em;border-top:1px solid #ffffff38;padding:14px 0;color:#a4abb1}.project-label>span:last-child{font-size:23px;font-weight:200;line-height:1;color:var(--accent)}.project-window{height:clamp(300px,33vw,495px);position:relative;overflow:hidden;background:#181c1f;transition:clip-path 900ms cubic-bezier(.22,1,.36,1);clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}.project-window>figure{position:absolute;inset:0}.project-window figure img{width:100%;height:100%;object-fit:cover;filter:none;transform:scale(var(--photo-scale)) translateY(var(--hover-shift));transition:transform 1100ms cubic-bezier(.22,1,.36,1)}.project-window:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 0 1px #ffffff15}.window-corner{position:absolute;inset:12px;pointer-events:none;border-top:1px solid #ffffff30;border-bottom:1px solid #ffffff30}.window-corner:before,.window-corner:after{content:"";position:absolute;width:13px;height:13px;border-color:#fff8;border-style:solid}.window-corner:before{left:0;top:-1px;border-width:1px 0 0 1px}.window-corner:after{bottom:-1px;right:0;border-width:0 1px 1px 0}.image-index{position:absolute;left:18px;bottom:18px;color:#fff;font-size:9px;letter-spacing:.04em;padding:7px 10px;background:#090a0bc9;backdrop-filter:blur(10px);pointer-events:none}.portal-tag{position:absolute;right:18px;top:18px;background:#0d1113a6;border:1px solid #ffffff50;backdrop-filter:blur(15px);padding:9px 13px;font-size:12px;opacity:0;transform:translateY(-6px);transition:opacity .6s,transform .6s}.project-info{display:grid;grid-template-columns:auto 1fr;gap:19px;padding:25px 0 24px;align-items:start}.project-number{font-weight:200;font-size:43px;line-height:1;color:#ffffff30;transition:color .5s}.project-info h3{font-family:"Microsoft YaHei",sans-serif;font-weight:400;font-size:clamp(18px,1.6vw,25px);line-height:1.5;margin:0}.project-info p{font-size:12px;line-height:1.65;color:#89939a;margin-top:8px}.project-foot{display:flex;justify-content:space-between;gap:10px;border-top:1px solid #ffffff20;padding-top:14px;font-size:10px;color:#9aa3aa}.project-foot span:first-child{letter-spacing:.06em}.project-card:hover,.project-card:focus-visible{--hover-shift:-3px;--photo-scale:1.035}.project-card:hover .portal-tag,.project-card:focus-visible .portal-tag{opacity:1;transform:none}.project-card:hover .project-number,.project-card:focus-visible .project-number{color:var(--accent)}.project-card:hover .project-window,.project-card:focus-visible .project-window{clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.research-cover{position:absolute;inset:0;display:flex;flex-direction:column;padding:35px 25px;background:linear-gradient(145deg,#1a2429,#101416);overflow:hidden}.research-micro{font-size:10px;letter-spacing:.07em;line-height:1.8;z-index:1;color:#a2b0b8}.research-cover strong{font-weight:200;font-size:clamp(56px,6.3vw,104px);line-height:.94;letter-spacing:-.035em;margin:auto 0;z-index:1}.research-cover strong>span{color:#a8c6d3}.research-guides{position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,#a8c6d31c 50%,transparent 50.2%),linear-gradient(transparent 49.8%,#a8c6d31c 50%,transparent 50.2%);background-size:56px 56px}.orbit-lines{position:absolute;width:72%;aspect-ratio:1;right:-10%;bottom:8%;transition:transform 1.2s}.orbit-lines i{position:absolute;inset:0;border:1px solid #a8c6d357;border-radius:50%;transform:rotate(-25deg) scaleX(.45)}.orbit-lines i:nth-child(2){transform:rotate(35deg) scaleX(.45)}.orbit-lines i:nth-child(3){transform:rotate(95deg) scaleX(.45)}.project-card:hover .orbit-lines{transform:rotate(18deg)}.live-cover{position:absolute;inset:0;overflow:hidden;background:linear-gradient(140deg,#dce5e3,#acbeba)}.live-label{position:absolute;top:28px;left:24px;font-size:19px;color:#294039;line-height:1.2;z-index:1}.live-label small{font-size:8px;letter-spacing:.08em}.live-cover iframe{position:absolute;width:430px;height:870px;border:0;left:52%;top:55px;transform:translateX(-50%) rotate(-5deg) scale(.41);transform-origin:50% 0;pointer-events:none;transition:transform 1s;border-radius:30px;box-shadow:0 26px 80px #1e392f30}.card-caihe:hover iframe{transform:translateX(-50%) rotate(-2deg) scale(.42)}
footer{max-width:calc(var(--max) + 2*var(--gutter));margin:auto;border-top:1px solid var(--rule);padding:42px var(--gutter) 50px;display:flex;justify-content:space-between;align-items:end}footer .eyebrow{font-size:10px;margin-bottom:20px}footer a{display:block;font-size:clamp(17px,2vw,29px);font-weight:200}footer a>span{color:var(--accent);margin-left:12px}footer .phone{font-size:14px;color:#939ca2;margin-top:10px}.footer-sign{text-align:right;font-family:"Microsoft YaHei",sans-serif;font-size:20px;font-weight:300}.footer-sign>span{display:block;font:300 11px Jost,sans-serif;color:#8b959c;margin-top:14px;letter-spacing:.04em}
@supports not (mask-image:linear-gradient(black,black)){.glass-word{font-size:12vw;line-height:1;color:#c2c5c87a;aspect-ratio:auto;letter-spacing:-.06em}.glass-word:before,.glass-word:after{display:none}}
@media(min-width:1600px){.about-copy{padding:65px}.about-copy h2{font-size:120px}.live-cover iframe{transform:translateX(-50%) rotate(-5deg) scale(.5)}.card-caihe:hover iframe{transform:translateX(-50%) rotate(-2deg) scale(.51)}}
@media(max-width:1050px){.about-top{grid-template-columns:1.5fr 1fr}.about-copy h2{font-size:7.1vw}.about-bottom{grid-template-columns:1fr 1fr}.honors{grid-column:1/-1;border-left:0!important;border-top:1px solid var(--rule);margin-top:30px;padding-top:25px!important}.honors ul{grid-template-columns:1fr 1fr}.projects-heading{display:block}.projects-heading>p{margin-top:15px}.project-grid{gap:18px}.project-info{gap:12px}.project-number{font-size:31px}.project-info h3{font-size:17px}.project-window{height:325px}.project-label{font-size:9px}.live-cover iframe{top:58px;transform:translateX(-50%) rotate(-5deg) scale(.31)}.card-caihe:hover iframe{transform:translateX(-50%) rotate(-2deg) scale(.32)}.project-foot{font-size:9px}.portal-tag{display:none}}
@media(max-width:700px){html{scroll-padding-top:65px}.site-nav{height:65px;grid-template-columns:1fr auto}.site-nav nav{gap:17px;font-size:13px}.site-nav nav i{display:none}.brand{font-size:10px;gap:8px;letter-spacing:.02em}.brand-symbol{font-size:21px}.cv-link{display:none}.visual-page{min-height:670px;padding-top:98px}.visual-meta{font-size:10px}.visual-meta b{font-size:11px}.visual-page h1{padding-top:65px}.glass-word{width:84%}.word-narrative{width:100%;margin-top:30px}.hero-caption{margin:40px 0 58px;gap:22px}.hero-caption>span{font-size:21px}.hero-caption p{font-size:12px}.visual-bottom{grid-template-columns:1fr auto;gap:14px;padding-top:17px}.sequence{grid-column:1/-1;grid-row:2;justify-content:space-between;margin-top:6px;font-size:10px}.sequence-label{font-size:9px}.discover{font-size:9px;gap:12px}#motion-toggle{font-size:11px}.about-page{padding-top:55px}.section-strip{font-size:11px}.section-strip>span{font-size:9px}.about-top{grid-template-columns:minmax(0,1.45fr) minmax(140px,1fr)}.about-copy{padding:24px 18px}.about-copy>.eyebrow{font-size:9px;max-width:200px}.about-copy h2{font-size:7.6vw;letter-spacing:-.055em;margin:25px 0 28px}.cn-name{font-size:.65em}.education h3{font-size:14px}.education p{font-size:12px}.statement{font-size:13px;line-height:1.8;margin:18px 0}.statement br{display:none}.text-link{font-size:12px}.portrait img{object-position:50% 23%;height:calc(100% - 85px);bottom:85px}.portrait figcaption{min-height:85px;align-items:start;flex-direction:column;padding:12px;font-size:10px;gap:6px}.portrait figcaption small{font-size:8px}.about-bottom{grid-template-columns:1fr;padding:28px 0}.about-bottom>section{padding:0 22px}.about-bottom>section+section{border-left:0;border-top:1px solid var(--rule);padding-top:25px;margin-top:25px}.about-bottom .eyebrow{margin-bottom:20px}.honors{grid-column:auto}.stats{gap:40px}.stats strong{font-size:37px}.stats small{font-size:15px}.about-bottom li{font-size:14px}.about-bottom li span{font-size:13px}.projects-page{padding-top:70px;padding-bottom:60px}.projects-heading{margin:20px 0 30px}.projects-heading h2{font-size:26px}.project-grid{grid-template-columns:repeat(3, minmax(270px,1fr));overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:22px;gap:20px;scrollbar-color:#73808a #181c21;scrollbar-width:thin}.project-card{scroll-snap-align:center}.project-window{height:350px}.project-info h3{font-size:19px}.project-label{font-size:10px}.live-cover iframe{transform:translateX(-50%) rotate(-5deg) scale(.34)}.card-caihe:hover iframe{transform:translateX(-50%) rotate(-2deg) scale(.35)}.research-cover strong{font-size:72px}.project-foot{font-size:10px}.footer-sign{font-size:18px}footer a{font-size:18px}footer .phone{font-size:13px}}
@media(max-width:380px){.brand>span:last-child{display:none}.about-top{grid-template-columns:minmax(0,1.4fr) minmax(115px,1fr)}.about-copy{padding:22px 14px}.hero-caption>span{font-size:19px}.hero-caption p{font-size:11px}.stats{gap:23px}.honors ul{grid-template-columns:1fr}footer{display:block}.footer-sign{text-align:left;margin-top:30px}}
/* Keep the full composition visible on short, wide displays. */
.visual-page{min-height:clamp(780px,calc(420px + 25vw),1100px);max-height:none}
.visual-page h1{padding-top:32px;padding-bottom:16px}
.hero-caption{margin-top:26px;margin-bottom:35px}
@media(max-width:700px){.visual-page{min-height:670px}.visual-page h1{padding-top:55px}.hero-caption{margin:34px 0 40px}.portrait{background:#101214}.portrait img{position:static;height:auto;aspect-ratio:638/850;object-fit:cover}.portrait figcaption{margin-top:0;border-top:1px solid var(--rule)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.project-card{transform:none!important}.project-card:hover{--photo-scale:1;--hover-shift:0px}}
