.screen{visibility:visible;pointer-events:none;background-color:#fff}.screen.is-active{pointer-events:auto;z-index:1}.home{background-color:#ffd078}.screen.is-leaving{z-index:2}.screen.is-entering{z-index:3}.screen-mask-edge{position:fixed;z-index:19;left:0;right:0;top:0;height:72px;pointer-events:none;opacity:0;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.2),transparent);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);will-change:transform,opacity}
.letter-reactor{cursor:default}.letter-reactor>.hero-letter{display:inline-block;font-style:normal;transform:translate3d(var(--letter-shift,0),0,0);transition:transform .5s var(--ease)}.hero-title>span:nth-child(2) .hero-letter:nth-child(4){margin-right:-.085em}.letter-reactor.is-reacting>.hero-letter{will-change:transform;transition-duration:160ms;transition-timing-function:cubic-bezier(.22,.72,.18,1)}
.site-header nav a{transition:transform .3s var(--ease),letter-spacing .3s ease}.site-header nav a::before{transition:opacity .3s,transform .3s var(--ease)}.site-header nav a:focus-visible{transform:translateY(-2px)}
@media(hover:hover){.site-header nav a:hover{transform:translateY(-2px);letter-spacing:.075em}}
.hero-portrait{left:auto;right:5.37%;width:auto;object-fit:contain}
.piece>.rotator{position:absolute;left:50%;top:50%;translate:-50% -50%}
.about{--au:calc(100vw / 1920)}.about .texture{width:143.75%;height:203.04%;left:-21.875%;top:-13.92%;opacity:.4}
.about-scroll{position:absolute;inset:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:none;scrollbar-width:none;clip-path:inset(max(calc(92 * var(--au)),9.02%) 1.46% 0 3.44%)}.about-scroll::-webkit-scrollbar{display:none}.about-page{position:relative;width:100%;min-height:max(100%,calc(1456 * var(--au)))}
.about-art{position:absolute;inset:0;pointer-events:none;overflow:hidden;overflow:clip;contain:paint;transform:translate3d(0,22px,0);transition:transform .72s var(--ease) .08s;will-change:transform}.about.is-active .about-art{transform:translate3d(0,0,0)}.portrait-background{position:absolute;left:calc(138 * var(--au));top:calc(292 * var(--au));width:calc(495.385 * var(--au));height:calc(657 * var(--au));object-fit:fill;opacity:1;transform:translate3d(0,var(--background-follow,0px),0);will-change:transform}.about-portrait{position:absolute;left:9.427%;top:calc(216 * var(--au));width:calc(350 * var(--au));height:calc(832 * var(--au));object-fit:cover;object-position:center top;opacity:1;transform:translate3d(0,var(--portrait-follow,0px),0) scaleX(-1);will-change:transform}.about-content{position:absolute;left:38.85%;top:calc(165 * var(--au));width:56.1%;padding:0 0 calc(58 * var(--au))}.about-title{font-family:Hero,sans-serif;font-size:calc(96.7 * var(--au));font-weight:400;letter-spacing:-.03em;line-height:.88;white-space:nowrap}.about-subtitle{font-size:calc(20 * var(--au));font-weight:600;letter-spacing:.05em;margin-top:calc(14 * var(--au));line-height:1.7}.timeline-heading{font-family:'Arial Rounded MT Bold','Arial Rounded MT',Arial,sans-serif;font-size:calc(33.42 * var(--au));font-weight:900;letter-spacing:.08em;line-height:1.1;width:max-content;margin-top:calc(42 * var(--au));margin-bottom:calc(20 * var(--au));position:relative}.timeline-heading::after{content:'';position:absolute;left:0;right:0;height:.46em;bottom:-.08em;background:#ff9f00;opacity:.12;border-radius:40px;z-index:-1}.timeline{display:grid;gap:calc(18 * var(--au));position:relative}.timeline::before{content:'';position:absolute;left:calc(20 * var(--au));top:calc(12 * var(--au));bottom:calc(17 * var(--au));width:1px;background:rgba(0,0,0,.2)}.timeline-item{display:grid;grid-template-columns:calc(40 * var(--au)) calc(161 * var(--au)) minmax(0,1fr);column-gap:calc(20 * var(--au));align-items:start;position:relative;min-height:calc(44 * var(--au))}.timeline-star{width:calc(28.78 * var(--au));height:calc(28.78 * var(--au));margin:calc(5.61 * var(--au));position:relative}.timeline-date{font-family:Abadi,'Arial Narrow',Impact,sans-serif;font-size:calc(30 * var(--au));font-weight:800;line-height:1.25;letter-spacing:-.03em;white-space:nowrap}.timeline-copy{font-size:calc(16 * var(--au));line-height:1.46;padding-top:calc(2 * var(--au));padding-right:calc(120 * var(--au));color:rgba(0,0,0,.78)}.timeline-copy h4{font-size:calc(20 * var(--au));font-weight:600;line-height:1.5;margin:0 0 calc(4 * var(--au));color:rgba(0,0,0,.8)}.timeline-copy h4 small{font-size:calc(16 * var(--au));font-weight:400;opacity:.5}.timeline-copy p+p{margin-top:calc(10 * var(--au))}.timeline-copy strong{color:#f1613c;font-weight:600}.timeline-copy .role-summary{font-weight:600;color:#000}.muted{color:rgba(0,0,0,.6)}.company-logo{position:absolute;right:0;object-fit:contain;border-radius:calc(10 * var(--au))}.curve-logo{top:calc(4 * var(--au));width:calc(101 * var(--au));height:calc(44 * var(--au))}.iqiyi-logo{top:calc(5 * var(--au));width:calc(101 * var(--au));height:calc(37 * var(--au));object-fit:cover}.netease-logo{top:calc(3 * var(--au));width:calc(101 * var(--au));height:calc(38 * var(--au));object-fit:cover}.timeline-item:nth-child(2){min-height:calc(234 * var(--au))}.education-heading{margin-top:calc(31 * var(--au));margin-bottom:calc(18 * var(--au))}.education{gap:calc(7 * var(--au))}.education .timeline-copy h4{font-weight:400}.education .timeline-item{min-height:calc(40 * var(--au))}.ai-heading{margin-top:calc(35 * var(--au));margin-bottom:calc(24 * var(--au))}.ai-projects{gap:calc(20 * var(--au))}.ai-projects .timeline-item{grid-template-columns:calc(40 * var(--au)) minmax(0,1fr);min-height:calc(78 * var(--au))}.ai-projects .timeline-copy{padding-right:0}.ai-projects .timeline-copy h4{font-weight:600;margin-bottom:calc(3 * var(--au))}.ai-projects .timeline-copy p{font-size:calc(16 * var(--au));opacity:.7}
.work .texture{opacity:.6;left:-.208%;width:100.625%;top:-14.31%;height:142.06%}.work-title{position:absolute;top:15.49%;left:0;width:100%;display:flex;align-items:center;justify-content:center;gap:.2em;font-family:Abadi,'Arial Narrow',Impact,sans-serif;font-size:4.1667vw;font-weight:800;letter-spacing:-.03em;line-height:1.05;white-space:nowrap}.work-title img{width:calc(38 * var(--u));height:calc(38 * var(--u));margin-right:calc(8 * var(--u));opacity:0;transform:scale(.8) rotate(-35deg);transition:opacity .7s ease .32s,transform .9s var(--ease) .32s}.work-title span{opacity:0;transform:translateY(22px);transition:opacity .85s ease,transform .95s var(--ease)}.work.is-active .work-title img{opacity:1;transform:scale(1) rotate(0)}.work.is-active .work-title span{opacity:1;transform:translateY(0)}.work.is-active .work-title span:nth-of-type(1){transition-delay:.38s}.work.is-active .work-title span:nth-of-type(2){transition-delay:.57s}.work.is-active .work-title span:nth-of-type(3){transition-delay:.76s}.work-grid{position:absolute;left:6.25%;right:6.667%;top:38.627%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5.052vw}.work-item{text-align:center;opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .85s var(--ease)}.work.is-active .work-item{opacity:1;transform:translateY(0);transition-delay:.65s}.work.is-active .work-item:nth-child(2){transition-delay:.77s}.work.is-active .work-item:nth-child(3){transition-delay:.89s}.project-button{width:100%;display:block;padding:0;outline-offset:12px}.folder{display:block;width:100%;aspect-ratio:487/310;border:1px solid rgba(255,255,255,.9);border-radius:calc(27 * var(--u));background:#fcd667;position:relative;isolation:isolate;transition:transform .5s var(--ease)}.project-button:hover .folder{transform:translateY(-8px) rotate(-1deg)}.project-label{display:block;font-family:Arial,sans-serif;font-size:clamp(16px,1.5625vw,32px);letter-spacing:-.03em;font-weight:400;line-height:1.3;margin-top:calc(13 * var(--u))}.pdf-button{background:#fff;margin-top:calc(8 * var(--u));padding:calc(10 * var(--u)) calc(22 * var(--u));gap:6px}.pdf-button img{width:calc(22 * var(--u));min-width:14px;height:auto}.pdf-note{display:block;font-size:12px;color:#555;margin-top:10px}.pdf-note[hidden]{display:none}
.piece{display:grid;place-items:center;position:absolute;pointer-events:none}.rotator{position:relative;display:block;transform:rotate(9.36deg)}.crop{overflow:hidden}.crop img{position:absolute;max-width:none}.back-base{left:5.749%;top:-4.194%;width:73.075%;aspect-ratio:355.876/279.422}.back-base .rotator{width:90.7%;height:82.313%;border-radius:calc(20 * var(--u))}.back-base img{width:111.29%;height:106.81%;left:-11.19%;top:-6.63%}.back-top{left:8.536%;top:-4.194%;width:70.094%;aspect-ratio:341.356/196.944}.back-top .rotator{width:94.273%;height:74.422%;border-radius:calc(10 * var(--u))}.back-top img{width:111.08%;height:157.59%;left:-10.59%;top:-32.07%}.back-strip{left:7.805%;top:57.039%;width:61.129%;aspect-ratio:297.7/86.779}.back-strip .rotator{width:99.173%;height:45.283%;background:#1f2128}.back-left{left:8.92%;top:36.281%;width:32.488%;aspect-ratio:158.216/125.547}.back-left .rotator{width:90.555%;height:82.543%;border-radius:calc(5 * var(--u))}.back-left img{width:100.19%;height:100.07%;left:-.19%;top:-.04%}.back-right{left:38.571%;top:43.848%;width:32.582%;aspect-ratio:158.672/126.29}.back-right .rotator{width:90.514%;height:82.608%;border-radius:calc(5 * var(--u))}.back-right img{width:100%;height:100%;object-fit:cover}.project-person{left:10.267%;top:-12.258%;width:64.76%;aspect-ratio:315.38/289.655}.project-person .rotator{width:90.05%;height:87.69%;transform:rotate(7.68deg)}.front-screen{left:18.602%;top:12.477%;width:76.964%;aspect-ratio:374.817/196.739}.front-screen .rotator{width:96.618%;height:84.942%;object-fit:cover;transform:rotate(-4.78deg);border-radius:calc(8.3 * var(--u))}.front-phone{left:12.936%;top:3.226%;width:88.029%;aspect-ratio:428.699/254.218}.front-phone .rotator{width:51.468%;height:161.958%;max-width:none;object-fit:cover;transform:rotate(-94.78deg)}.folder-glass{position:absolute;left:3.491%;top:29.355%;width:93.224%;height:64.194%;border-radius:calc(27 * var(--u));border:.2px solid rgba(255,255,255,.7);background:rgba(0,0,0,.31);backdrop-filter:blur(calc(11.8 * var(--u)));-webkit-backdrop-filter:blur(calc(11.8 * var(--u)));transition:background .4s}.project-button:hover .folder-glass{background:rgba(0,0,0,.25)}
.contact-title{font-family:Hero,sans-serif;font-size:8.3333vw;font-weight:400;line-height:.88;letter-spacing:-.03em;position:absolute;top:26.2%;left:0;right:0}.contact-title span{display:block;width:max-content}.contact-title span:nth-child(1){margin-left:20.156%}.contact-title span:nth-child(2){margin-left:28.021%}.contact-title span:nth-child(3){margin-left:9.323%}.contact-details{position:absolute;top:74.8%;left:21.04%;right:21%;display:grid;grid-template-columns:1fr auto 1fr;gap:5.9vw;align-items:center}.contact-details a{font-size:clamp(14px,1.5625vw,32px);white-space:nowrap;opacity:.8;transition:opacity .2s}.contact-details a:hover{opacity:1}.contact-details>img{width:5.938vw;min-width:76px;height:auto}.contact-details a:last-child{justify-self:end}body[data-page="contact"] .scroll-cue{opacity:0;pointer-events:none}.scroll-cue[hidden]{display:none}
.project-dialog{border:1px solid rgba(0,0,0,.18);border-radius:20px;width:min(1120px,84vw);height:78vh;max-width:none;max-height:90dvh;padding:0;color:var(--ink);background:#fff;box-shadow:0 32px 120px #0002;overflow:hidden}.project-dialog::backdrop{background:rgba(20,18,13,.3);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.project-dialog[open]{animation:dialog-enter .4s var(--ease)}.dialog-close{position:absolute;right:20px;top:18px;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;font-size:32px;font-weight:300;background:#f5f3ee;line-height:1;transition:background .2s,transform .2s;z-index:1}.dialog-close:hover{background:#ffda80;transform:rotate(90deg)}.dialog-content{height:100%;overflow:auto;overscroll-behavior:contain}@keyframes dialog-enter{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}
@media(min-width:801px){.about-content{top:calc(186 * var(--au))}}
@media(min-aspect-ratio:21/10) and (min-width:801px){.hero-title{font-size:min(9.2252vw,18.3vh)}.contact-title{font-size:min(8.333vw,16.7vh)}.work-grid{top:36%;left:12%;right:12%;gap:6vw}.work-title{font-size:7.5vh}}
@media(max-width:800px){:root{--u:calc(100vw / 1000);--duration:800ms}.site-frame{inset:12px;border-radius:12px}.site-frame::before{display:none}.site-header{top:12px;left:12px;right:12px;height:60px;min-height:0;padding:0 16px}.signature{width:86px;min-width:0}.site-header nav{position:static;transform:none;gap:24px;margin-left:auto;margin-right:28px}.site-header nav a{font-size:11px;letter-spacing:.02em}.site-header nav a::before{width:5px;height:5px;left:-10px}.contact-button{font-size:11px;padding:8px 13px;min-height:30px;margin-left:0}.intro{top:16%;left:7%;right:7%;font-size:13px;max-width:480px}.hero-title{top:43%;font-size:10.3vw;line-height:1.08}.hero-title span:nth-child(1){margin-left:7%}.hero-title span:nth-child(2){margin-left:17%}.hero-title span:nth-child(3){margin-left:7%}.hero-portrait{left:58%;top:27%;height:78%;width:40%;object-fit:cover;object-position:45% top}.texture{background-size:cover}.scroll-cue{bottom:24px;right:28px;font-size:12px}.about-scroll{top:16%;left:40%;right:6%;bottom:9%;mask-image:linear-gradient(#000 calc(100% - 30px),transparent)}.portrait-background{left:5%;top:36%;width:30%;height:66%;object-fit:cover}.about-portrait{left:7%;top:29%;width:30%;height:73%;object-fit:cover;object-position:45% top}.about-title{font-size:4.8vw;white-space:normal;line-height:1.2}.about-subtitle{font-size:12px;margin-top:16px;line-height:1.7}.about-summary{font-size:12px;margin-top:10px}.timeline-heading{font-size:19px;margin-top:28px;margin-bottom:24px;letter-spacing:.06em}.timeline{gap:24px}.timeline::before{left:8px;bottom:24px}.timeline-item{grid-template-columns:18px minmax(0,1fr);column-gap:14px;row-gap:6px}.timeline-star{width:17px;height:17px;top:3px}.timeline-date{font-size:20px}.timeline-copy{grid-column:2;font-size:12px}.timeline-copy h4{font-size:13px}.timeline-copy p+p{margin-top:10px}.work-title{top:18%;font-size:5.6vw;gap:.15em}.work-title img{width:22px;height:22px;margin-right:6px}.work-grid{left:7%;right:7%;top:39%;gap:4vw}.project-label{font-size:14px;margin-top:14px}.folder{border-radius:14px}.folder-glass{border-radius:12px;backdrop-filter:blur(7px)}.pdf-button{font-size:10px;padding:8px 9px;min-height:30px;margin-top:10px;letter-spacing:0}.pdf-button img{width:13px;min-width:0}.contact-title{top:31%;font-size:8.6vw;line-height:1}.contact-title span:nth-child(1){margin-left:15%}.contact-title span:nth-child(2){margin-left:24%}.contact-title span:nth-child(3){margin-left:7%}.contact-details{top:67%;left:10%;right:10%;gap:24px;grid-template-columns:1fr auto}.contact-details>img{grid-column:2;grid-row:1 / 3;width:80px}.contact-details a:last-child{grid-column:1;justify-self:start}.project-dialog{width:90vw;height:80dvh;border-radius:16px}.dialog-close{top:14px;right:14px}}
@media(max-width:480px){.site-header{padding:0 12px}.signature{width:70px}.site-header nav{gap:18px;margin-right:16px}.site-header nav a{font-size:10px}.contact-button{font-size:10px;padding:7px 9px}.intro{font-size:12px;line-height:1.9;top:15%;right:10%}.hero-title{top:43%;font-size:10.5vw;line-height:1.2}.hero-portrait{top:34%;left:49%;width:51%;height:68%}.about-scroll{left:36%;right:6%;top:16%}.about-title{font-size:5.2vw}.about-portrait{left:4%;top:32%;width:29%;height:70%}.portrait-background{left:4%;width:29%;top:39%}.work-title{top:16%;font-size:6.6vw;flex-wrap:wrap;padding:0 20px;column-gap:.18em}.work-title img{width:18px;height:18px}.work-grid{top:28%;left:9%;right:9%;display:flex;flex-direction:column;gap:24px;bottom:11%;justify-content:space-between}.work-item{display:flex;align-items:center;position:relative;min-height:0;flex:1}.project-button{display:flex;align-items:center;gap:24px;height:100%}.folder{width:44%;max-height:100%;flex-shrink:0;aspect-ratio:487/310}.project-label{margin-top:0;font-size:17px;white-space:nowrap}.pdf-button{position:absolute;left:calc(44% + 24px);top:calc(50% + 16px);font-size:9px;min-height:26px;padding:5px 8px;margin:0}.pdf-note{position:absolute;top:100%;right:0;font-size:10px}.contact-title{top:30%;line-height:1.25}.contact-details{top:64%;left:9%;right:9%;gap:18px}.contact-details a{font-size:13px}.contact-details>img{width:72px;min-width:0}}
@media(max-width:800px){.about-scroll{inset:0;mask-image:none}.about-page{--au:1px;min-height:0;padding:102px 7% 80px}.about-content{position:relative;left:auto;top:auto;width:100%;padding:630px 0 0}.about-art{top:195px;left:7%;right:7%;bottom:auto;height:500px}.portrait-background{left:4%;top:75px;width:62%;height:410px;object-fit:cover}.about-portrait{left:12%;top:0;width:44%;height:485px;object-fit:contain}.about-title{position:absolute;left:0;right:0;top:0;font-size:clamp(46px,11vw,72px);white-space:normal}.about-subtitle{position:absolute;left:0;right:0;top:58px;font-size:13px;margin-top:13px}.timeline-heading{font-size:24px;margin-top:34px;margin-bottom:24px}.timeline{gap:24px}.timeline::before{left:10px;top:8px;bottom:18px}.timeline-item,.ai-projects .timeline-item{grid-template-columns:20px minmax(0,1fr);column-gap:14px;row-gap:5px;min-height:0}.timeline-star{width:20px;height:20px;margin:0}.timeline-date{font-size:23px;grid-column:2}.timeline-copy{grid-column:2;font-size:12px;padding:0}.timeline-copy h4{font-size:14px}.timeline-copy h4 small{font-size:11px}.timeline-copy p+p{margin-top:9px}.company-logo{right:0;top:0!important;width:72px;height:32px}.timeline-item:has(.company-logo) .timeline-copy{padding-right:78px}.timeline-item:nth-child(2){min-height:0}.education-heading,.ai-heading{margin-top:36px;margin-bottom:24px}.education{gap:16px}.education .timeline-item{min-height:0}.ai-projects{gap:24px}.ai-projects .timeline-copy h4{font-size:13px}.ai-projects .timeline-copy p{font-size:12px}.about-scrollbar{right:18px;top:86px;bottom:28px}}
@media(max-width:800px){.about-art{position:absolute;top:285px}.about-content{padding-top:720px}}
@media(prefers-reduced-motion:reduce){:root{--duration:1ms}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;transition-delay:0ms!important;scroll-behavior:auto!important}.work-title span,.work-title img,.work-item{transform:none!important}}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.folder{overflow:visible}.project-button:hover .folder{transform:none}.folder .piece{transition:transform .68s cubic-bezier(.2,.75,.2,1);will-change:transform}.folder .back-base{z-index:1}.folder .back-top{z-index:2}.folder .back-strip{z-index:3}.folder .back-left,.folder .back-right{z-index:4}.folder .project-person{z-index:5}.folder .front-screen{z-index:6}.folder .front-phone{z-index:7}.folder-glass{z-index:10}.folder-caption{position:absolute;z-index:11;left:8%;right:8%;top:55%;display:flex;flex-direction:column;align-items:center;color:#fff;line-height:1.12;text-shadow:0 2px 12px rgba(0,0,0,.28);pointer-events:none}.folder-caption b{font-family:Abadi,'Arial Narrow',Impact,sans-serif;font-size:clamp(30px,3.1vw,62px);letter-spacing:-.04em}.folder-caption span{font-size:clamp(12px,1.18vw,23px);margin-top:calc(8 * var(--u));white-space:nowrap}.project-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.project-button:hover .back-base{transform:translateY(-17%)}.project-button:hover .back-top{transform:translateY(-24%)}.project-button:hover .back-left{transform:translate(-3%,-20%)}.project-button:hover .back-right{transform:translate(3%,-23%)}.project-button:hover .project-person{transform:translateY(-22%)}.project-button:hover .front-screen{transform:translateY(-25%)}.project-button:hover .front-phone{transform:translateY(-26%)}
.project-dialog{border:1px solid rgba(255,255,255,.16);border-radius:16px;width:min(76vw,1500px);height:min(82vh,900px);max-width:none;max-height:none;padding:0;color:#f4f4f4;background:#16171b;box-shadow:0 32px 100px rgba(0,0,0,.28);overflow:hidden}.project-dialog::backdrop{background:rgba(20,18,13,.14);backdrop-filter:none;-webkit-backdrop-filter:none}.portfolio-nav{position:absolute;z-index:3;left:0;right:64px;top:0;height:70px;display:flex;align-items:center;gap:clamp(22px,2.25vw,48px);padding:0 28px;overflow-x:auto;scrollbar-width:none}.portfolio-nav::-webkit-scrollbar{display:none}.portfolio-nav button{flex:0 0 auto;padding:12px 0;color:rgba(255,255,255,.38);font-size:clamp(12px,.84vw,16px);letter-spacing:.02em;transition:color .25s ease,transform .3s var(--ease)}.portfolio-nav button:hover,.portfolio-nav button:focus-visible{color:rgba(255,255,255,.78);transform:translateY(-2px)}.portfolio-nav button[aria-current="true"]{color:#fff;font-weight:700}.dialog-close{right:18px;top:17px;width:36px;height:36px;border:1px solid rgba(255,255,255,.24);border-radius:50%;font-size:27px;font-weight:300;color:rgba(255,255,255,.72);background:#191a1e;transition:color .25s,background .25s,transform .35s var(--ease)}.dialog-close:hover{color:#fff;background:#2a2c31;transform:rotate(90deg)}.dialog-content{position:absolute;left:18px;right:14px;top:70px;bottom:18px;height:auto;overflow-y:scroll;overflow-x:hidden;overscroll-behavior:contain;background:#242529;border-radius:12px;scrollbar-width:none}.dialog-content::-webkit-scrollbar{display:none}.portfolio-scrollbar{position:absolute;z-index:4;right:4px;top:78px;bottom:26px;width:6px;border-radius:99px;background:rgba(255,255,255,.08);cursor:pointer;touch-action:none;transition:width .22s ease,background .22s ease,opacity .22s ease}.portfolio-scrollbar>span{display:block;width:100%;min-height:42px;border-radius:99px;background:#777980;cursor:grab;will-change:transform;transition:background .22s ease,box-shadow .22s ease}.portfolio-scrollbar:hover,.portfolio-scrollbar.is-dragging{width:8px;background:rgba(255,255,255,.14)}.portfolio-scrollbar:hover>span,.portfolio-scrollbar.is-dragging>span{background:#b5b7bd;box-shadow:0 0 10px rgba(255,255,255,.24)}.portfolio-scrollbar.is-dragging>span{cursor:grabbing}.pdf-project{display:grid;gap:12px;padding:14px 14px 0;scroll-margin-top:0}.pdf-project:last-child{padding-bottom:14px}.pdf-page{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#121315;border-radius:4px}.project-dialog[open]{animation:portfolio-dialog-enter .42s var(--ease)}@keyframes portfolio-dialog-enter{from{opacity:0;transform:translateY(18px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:800px){.folder-caption{top:53%}.folder-caption b{font-size:clamp(24px,7vw,42px)}.folder-caption span{font-size:clamp(10px,2.5vw,14px)}.project-dialog{width:94vw;height:86dvh;border-radius:14px}.portfolio-nav{height:62px;right:54px;padding:0 16px;gap:22px}.portfolio-nav button{font-size:12px}.dialog-close{top:13px;right:12px;width:34px;height:34px}.dialog-content{top:62px;left:10px;right:8px;bottom:10px;border-radius:9px}.portfolio-scrollbar{right:2px;top:68px;bottom:17px;width:3px}.pdf-project{gap:7px;padding:8px 8px 0}.pdf-project:last-child{padding-bottom:8px}}
.experience-main .timeline-copy p,.ai-projects .timeline-copy p{font-size:calc(20 * var(--au));line-height:1.5}
@media(max-width:800px){.experience-main .timeline-copy p{font-size:14px}.ai-projects .timeline-copy p{font-size:13px}}
.experience-curve .timeline-copy p{font-size:calc(20 * var(--au));line-height:1.5}.timeline-copy .role-summary{font-weight:400;color:inherit}.ai-projects .timeline-copy p{opacity:1}
@media(max-width:800px){.experience-curve .timeline-copy p{font-size:14px}}

.folder-glass{backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px)}

.folder-glass{left:0;top:30%;width:100%;height:70%;border-radius:calc(27 * var(--u))}
.folder-caption{left:0;right:0;top:30%;height:70%;justify-content:center}
.pdf-video-slide{position:relative;min-width:0}.pdf-demo-video{position:absolute;left:10%;top:19%;width:80%;height:76%;object-fit:contain;background:#121315;border-radius:8px}
@media(max-width:800px){.folder-glass{left:0;top:30%;width:100%;height:70%;border-radius:12px}.folder-caption{left:0;right:0;top:30%;height:70%}}

@media(min-width:801px){.contact-details{left:21.04%;right:21.04%;grid-template-columns:1fr auto 1fr;justify-content:normal;column-gap:5.9vw}.contact-details a:first-child{justify-self:end}.contact-details a:last-child{justify-self:start}}

/* Portfolio bottom sheet */
.project-dialog{position:fixed;inset:auto 0 0;margin:0;width:100vw;height:94dvh;max-width:none;max-height:none;border:1px solid rgba(255,255,255,.16);border-bottom:0;border-radius:24px 24px 0 0;background:#000;box-shadow:0 -24px 80px rgba(0,0,0,.28);overflow:hidden}
.project-dialog::backdrop{background:rgba(0,0,0,.6);backdrop-filter:none;-webkit-backdrop-filter:none;animation:portfolio-backdrop-enter .36s ease-out both}
.project-dialog[open]{animation:portfolio-sheet-enter .68s cubic-bezier(.2,.8,.2,1) both}
@keyframes portfolio-sheet-enter{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes portfolio-backdrop-enter{from{background:rgba(0,0,0,0)}to{background:rgba(0,0,0,.6)}}
.portfolio-nav{position:absolute;z-index:3;left:0;top:0;bottom:0;width:21.5%;height:auto;right:auto;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:clamp(18px,2.1vh,30px);padding:0 clamp(28px,4.6vw,92px);overflow:visible}
.portfolio-nav-group{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(18px,2.1vh,30px)}
.portfolio-nav-group[hidden],.dialog-view[hidden]{display:none!important}
.portfolio-nav button{flex:0 0 auto;width:max-content;padding:3px 0;color:rgba(255,255,255,.42);font-size:clamp(14px,1.05vw,20px);text-align:left;transition:color .25s ease,transform .3s var(--ease)}
.portfolio-nav button:hover,.portfolio-nav button:focus-visible{color:rgba(255,255,255,.82);transform:translateX(5px)}
.portfolio-nav button[aria-current="true"]{color:#fff;font-weight:700}
.dialog-close{right:22px;top:24px;width:48px;height:48px;font-size:34px;background:#000;z-index:6}
.dialog-close:hover{background:#484850}
.dialog-content{position:absolute;left:21.5%;right:9%;top:28px;bottom:0;height:auto;padding:0;overflow-y:scroll;overflow-x:hidden;background:transparent;border-radius:0;scrollbar-width:none}
.dialog-content.is-switching{animation:portfolio-content-switch .18s ease-out both}
@keyframes portfolio-content-switch{from{opacity:.42}to{opacity:1}}
.pdf-project{display:grid;gap:20px;padding:0 0 20px;scroll-margin-top:0}
.pdf-project:last-child{padding-bottom:28px}
.pdf-page{border-radius:24px;background:#242529;clip-path:inset(0 2px 0 0 round 24px)}
.portfolio-scrollbar{right:0;top:86px;bottom:24px;width:8px;background:transparent}
.portfolio-scrollbar:hover,.portfolio-scrollbar.is-dragging{width:10px;background:transparent}

/* Project 02 · AIGC account document */
.aigc-document{padding:0 0 28px;color:#f4f4f4}
.aigc-section{position:relative;margin:0 0 20px;padding:clamp(34px,4.4vw,84px);border:1px solid rgba(255,255,255,.08);border-radius:24px;background:#151619;overflow:hidden}
.aigc-section h3{max-width:15em;margin:0 0 .55em;font-size:clamp(34px,4.15vw,78px);font-weight:600;line-height:1.02;letter-spacing:-.045em}
.aigc-section h4{margin:clamp(32px,4vw,68px) 0 12px;font-size:clamp(22px,2vw,38px);font-weight:600;letter-spacing:-.025em}
.aigc-section>p:not(.aigc-kicker):not(.aigc-lead){max-width:50em;margin-top:14px;color:rgba(255,255,255,.7);font-size:clamp(15px,1.13vw,21px);line-height:1.8}
.aigc-section>img{display:block;width:100%;height:auto;margin-top:clamp(32px,4vw,70px);border-radius:16px;background:#0d0f0f}
.aigc-hero{padding-top:clamp(52px,7vw,124px)}
.aigc-hero h3{max-width:10em;font-size:clamp(52px,6.25vw,118px)}
.aigc-kicker{margin-bottom:clamp(22px,3vw,48px);color:#21e2c9;font-size:clamp(12px,.92vw,18px);font-weight:700;letter-spacing:.16em}
.aigc-lead{max-width:37em;margin-top:26px;color:rgba(255,255,255,.62);font-size:clamp(16px,1.25vw,24px);line-height:1.7}
.aigc-index{display:block;margin-bottom:clamp(40px,6vw,104px);color:#21e2c9;font-family:Abadi,'Arial Narrow',Impact,sans-serif;font-size:clamp(18px,1.45vw,28px);font-weight:800;letter-spacing:.08em}
.aigc-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:clamp(30px,4vw,64px)}
.aigc-list p{min-height:190px;padding:26px;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:#0f1012;color:rgba(255,255,255,.65);font-size:clamp(14px,1vw,19px);line-height:1.65}
.aigc-list strong{display:block;margin-bottom:12px;color:#fff;font-size:1.08em}
.project-dialog[data-mode="aigc"] .dialog-content{right:6.5%}

/* Project 03 · interactive demo video + document */
.mini-demo-pane[hidden]{display:none!important}
.project-dialog[data-mode="miniprogram"] .portfolio-nav{display:none}
.mini-demo-pane{position:absolute;left:3.2%;top:5.5%;bottom:5%;width:35.5%;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:clamp(16px,1.8vw,34px);border:1px solid rgba(255,255,255,.1);border-radius:24px;background:#111214;overflow:hidden}
.mini-demo-heading{position:absolute;z-index:2;left:clamp(16px,1.8vw,34px);right:clamp(16px,1.8vw,34px);top:clamp(16px,1.8vw,34px);display:flex;align-items:center;justify-content:space-between;pointer-events:none}
.mini-demo-heading span{color:#72eb85;font-size:clamp(10px,.72vw,14px);font-weight:700;letter-spacing:.14em}
.mini-demo-heading p{color:rgba(255,255,255,.58);font-size:clamp(11px,.78vw,15px)}
.mini-demo-video{display:block;width:100%;height:100%;max-height:calc(100% - 52px);margin-top:52px;object-fit:contain;border-radius:14px;background:#090a0b}
.project-dialog[data-mode="miniprogram"] .dialog-content{left:41.5%;right:5%;top:5.5%;bottom:0}
.miniprogram-document{padding:0 0 28px;color:#f4f4f4}
.mini-doc-section{position:relative;margin:0 0 20px;padding:clamp(34px,4.2vw,80px);border:1px solid rgba(255,255,255,.08);border-radius:24px;background:#151619;overflow:hidden}
.mini-doc-section h3{margin:0 0 .55em;font-size:clamp(34px,4vw,76px);font-weight:600;line-height:1.02;letter-spacing:-.045em}
.mini-doc-section>p:not(.mini-doc-kicker):not(.mini-doc-lead):not(.mini-doc-quote){max-width:48em;margin-top:14px;color:rgba(255,255,255,.69);font-size:clamp(15px,1.08vw,20px);line-height:1.8}
.mini-doc-section>img{display:block;width:100%;height:auto;margin-top:clamp(30px,4vw,68px);border-radius:15px;background:#0d0f0f}
.mini-doc-hero{min-height:min(78vh,760px);display:flex;flex-direction:column;justify-content:center}
.mini-doc-hero h3{max-width:10em;font-size:clamp(50px,5.7vw,108px)}
.mini-doc-kicker{margin-bottom:clamp(22px,3vw,48px);color:#72eb85;font-size:clamp(12px,.9vw,17px);font-weight:700;letter-spacing:.16em}
.mini-doc-lead{max-width:34em;margin-top:22px;color:rgba(255,255,255,.62);font-size:clamp(16px,1.2vw,23px);line-height:1.7}
.mini-doc-index{display:block;margin-bottom:clamp(38px,5vw,88px);color:#72eb85;font-family:Abadi,'Arial Narrow',Impact,sans-serif;font-size:clamp(18px,1.4vw,27px);font-weight:800;letter-spacing:.08em}
.mini-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:clamp(34px,4.5vw,74px)}
.mini-metrics p{padding:clamp(20px,2.2vw,38px);border:1px solid rgba(255,255,255,.09);border-radius:16px;background:#0f1012}
.mini-metrics strong,.mini-metrics span{display:block}.mini-metrics strong{color:#72eb85;font-size:clamp(30px,3vw,58px);line-height:1}.mini-metrics span{margin-top:12px;color:rgba(255,255,255,.56);font-size:clamp(12px,.9vw,17px)}
.mini-doc-section ul{display:grid;gap:10px;margin-top:28px;padding:0;list-style:none}
.mini-doc-section li{position:relative;padding:18px 20px 18px 48px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:#0f1012;color:rgba(255,255,255,.7);font-size:clamp(14px,1vw,19px);line-height:1.6}
.mini-doc-section li::before{content:'';position:absolute;left:22px;top:50%;width:7px;height:7px;border-radius:50%;background:#72eb85;transform:translateY(-50%)}
.mini-doc-quote{margin:12px 0 30px;color:#fff;font-size:clamp(21px,2vw,38px);font-weight:600;line-height:1.35}
.mini-qr{display:flex;align-items:center;gap:24px;margin-top:clamp(34px,4vw,68px);padding:24px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:transparent;color:#fff}
.mini-qr img{width:clamp(110px,10vw,190px);height:auto}.mini-qr p{display:grid;gap:7px}.mini-qr strong{font-size:clamp(20px,1.8vw,34px)}.mini-qr span{font-size:clamp(12px,.92vw,17px);opacity:.58}

@media(max-width:800px){.project-dialog{inset:auto 0 0;width:100vw;height:95dvh;border-radius:18px 18px 0 0}.portfolio-nav{left:0;top:0;bottom:0;width:29%;height:auto;right:auto;flex-direction:column;align-items:flex-start;justify-content:center;gap:18px;padding:0 12px}.portfolio-nav-group{gap:18px}.portfolio-nav button{font-size:11px;white-space:normal}.dialog-close{top:12px;right:10px;width:40px;height:40px}.dialog-content,.project-dialog[data-mode="aigc"] .dialog-content{left:29%;right:3%;top:60px;bottom:0;border-radius:0}.pdf-project{gap:9px;padding:0 0 9px}.pdf-project:last-child{padding-bottom:14px}.pdf-page{border-radius:10px;clip-path:inset(0 1px 0 0 round 10px)}.portfolio-scrollbar{right:0;top:64px;bottom:14px;width:6px;background:transparent}.portfolio-scrollbar:hover,.portfolio-scrollbar.is-dragging{width:8px;background:transparent}.aigc-document{padding-bottom:14px}.aigc-section{margin-bottom:9px;padding:26px 18px;border-radius:10px}.aigc-section h3{font-size:clamp(28px,7vw,48px)}.aigc-hero h3{font-size:clamp(36px,9vw,64px)}.aigc-section h4{font-size:20px;margin-top:34px}.aigc-section>p:not(.aigc-kicker):not(.aigc-lead),.aigc-lead{font-size:13px;line-height:1.7}.aigc-section>img{margin-top:26px;border-radius:7px}.aigc-index{margin-bottom:38px;font-size:14px}.aigc-kicker{font-size:10px;line-height:1.5}.aigc-list{grid-template-columns:1fr;gap:8px;margin-top:28px}.aigc-list p{min-height:0;padding:16px;font-size:12px}.mini-demo-pane{left:2%;top:8%;bottom:3%;width:35%;padding:10px;border-radius:12px}.mini-demo-heading{left:12px;right:12px;top:12px;display:block}.mini-demo-heading p{margin-top:3px}.mini-demo-video{margin-top:44px;max-height:calc(100% - 44px);border-radius:8px}.project-dialog[data-mode="miniprogram"] .dialog-content{left:39%;right:3%;top:60px;bottom:0}.miniprogram-document{padding-bottom:14px}.mini-doc-section{margin-bottom:9px;padding:26px 18px;border-radius:10px}.mini-doc-section h3{font-size:clamp(28px,7vw,48px)}.mini-doc-hero{min-height:72vh}.mini-doc-hero h3{font-size:clamp(36px,8.7vw,62px)}.mini-doc-kicker{font-size:10px;line-height:1.5}.mini-doc-lead,.mini-doc-section>p:not(.mini-doc-kicker):not(.mini-doc-lead):not(.mini-doc-quote){font-size:13px;line-height:1.7}.mini-doc-index{margin-bottom:38px;font-size:14px}.mini-metrics{grid-template-columns:1fr;gap:8px;margin-top:28px}.mini-metrics p{padding:16px}.mini-doc-section>img{margin-top:24px;border-radius:7px}.mini-doc-section li{padding:14px 12px 14px 34px;font-size:12px}.mini-doc-section li::before{left:15px}.mini-doc-quote{font-size:20px}.mini-qr{display:grid;gap:14px;padding:14px}.mini-qr img{width:100%;max-width:150px}}

/* Work card previews */
.project-folder{--preview-x:0px;--preview-y:0px;overflow:visible;background:#fcd667;transition:background-color .45s ease,box-shadow .55s var(--ease)}
.project-preview{position:absolute;z-index:1;inset:0;display:block}
.preview-card{position:absolute;display:block;height:auto;will-change:transform;filter:drop-shadow(0 10px 16px rgba(22,16,6,.13));transition:filter .55s ease}
.project-button:hover .project-folder,.project-button:focus-visible .project-folder{background:#ffda71;box-shadow:0 22px 48px rgba(101,73,12,.15)}
.project-button:hover .preview-card,.project-button:focus-visible .preview-card{filter:drop-shadow(0 16px 22px rgba(22,16,6,.2))}
.project-button.suppress-project-hover:hover .project-folder{background:#fcd667;box-shadow:none}
.project-button.suppress-project-hover:hover .preview-card{filter:drop-shadow(0 10px 16px rgba(22,16,6,.13))}

.project-folder-stack .preview-card{left:11%;top:20%;width:78%;border-radius:3.5%}
.project-folder-stack .preview-1-4{z-index:1;transform:translate(4%,-15%) rotate(1.1deg)}
.project-folder-stack .preview-1-3{z-index:2;transform:translate(1.5%,-10%) rotate(.65deg)}
.project-folder-stack .preview-1-2{z-index:3;transform:translate(-.8%,-5%) rotate(.25deg)}
.project-folder-stack .preview-1-1{z-index:4;transform:translate(-3%,0) rotate(0)}

.project-folder-single .preview-2{left:7%;top:10.3%;width:86%;border-radius:3%;transform:translate3d(var(--preview-x),var(--preview-y),0) scale(1)}

.project-folder-fan .preview-card{top:7%;height:86%;width:auto;border-radius:5%}
.project-folder-fan .preview-3-2{z-index:1;left:20%;transform:translateX(0) rotate(-.8deg)}
.project-folder-fan .preview-3-3{z-index:1;right:20%;transform:translateX(0) rotate(.8deg)}
.project-folder-fan .preview-3-1{z-index:2;left:50%;transform:translate(-50%,5%) scale(.98)}
@media(prefers-reduced-motion:reduce){.preview-card{transition:none}}
