@charset "UTF-8";
:root{--ink:#1c1d19;--paper:#f8f9f6;--blue:#84b0c9;--ease:cubic-bezier(.22,1,.36,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:78px}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,"Microsoft YaHei","PingFang SC",sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button{border:0}button:focus-visible,a:focus-visible{outline:3px solid #3c88ac;outline-offset:7px}button:disabled{opacity:.3;cursor:default}::selection{background:#c9e4eb}img{display:block;max-width:100%}.skip-link{position:fixed;top:-80px;left:20px;z-index:100;background:white;padding:15px}.skip-link:focus{top:15px}.site-nav{height:68px;padding:0 3.2%;display:flex;align-items:center;justify-content:space-between;position:fixed;inset:0 0 auto;z-index:20;background:rgba(248,249,246,.86);backdrop-filter:blur(18px);border-bottom:1px solid #20221b12}.signature{display:flex;gap:10px;align-items:center;font-size:11px;font-weight:700;letter-spacing:1.1px}.signature i{font-style:normal;margin-left:8px;font-size:10px;color:#73766f;font-weight:400}.smile{font-family:Arial,sans-serif;font-size:31px;font-weight:400;line-height:1}.site-nav nav{display:flex;gap:32px;align-items:center;font-size:12px}.site-nav nav a{position:relative;padding:9px 0}.site-nav nav a:after{content:"";height:4px;width:4px;background:currentColor;border-radius:50%;position:absolute;bottom:0;left:50%;opacity:0;transition:.25s}.site-nav nav a:hover:after,.site-nav nav a[aria-current]:after{opacity:1}.site-nav nav span{margin-left:6px}main{min-height:100svh}.page-enter{animation:page-in .85s var(--ease) both}@keyframes page-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.home-screen{min-height:100svh;padding:88px 2.4% 20px;display:flex;flex-direction:column;justify-content:center;position:relative;background:#fff}.cover{position:relative;width:100%;max-width:1740px;aspect-ratio:1700/906;margin:auto;isolation:isolate}.cover h1{margin:0}.cover-title{position:absolute;left:32.2%;top:4.6%;width:66.5%;mix-blend-mode:multiply;pointer-events:none}.cover-design{position:absolute;left:60.7%;top:26.1%;width:38.3%;mix-blend-mode:multiply;pointer-events:none}.cover-chinese{position:absolute;left:57.3%;top:47.8%;width:41.7%;mix-blend-mode:multiply;pointer-events:none}.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}.stickers{display:flex;gap:.65em;align-items:center;white-space:nowrap;font-family:Georgia,"Times New Roman",serif}.sticker{border:1.4px solid currentColor;border-radius:99px;padding:.07em .42em;line-height:1.15}.stickers .smile{font-size:1.55em}.cover-top{position:absolute;top:6.2%;left:4.3%;font-size:clamp(11px,2.15vw,36px)}.cover-bottom{position:absolute;bottom:2%;left:4.6%;right:5%;justify-content:space-between;gap:.4em;font-size:clamp(12px,2.25vw,39px)}.cover-bottom .sticker{padding:.08em .45em}.hero-folder{--mx:0;--my:0;--opening:0;position:absolute;top:23%;left:4.4%;width:47.5%;height:68%;background:transparent;padding:0;perspective:1200px;z-index:3;border-radius:30%}.hero-folder svg{width:100%;height:100%;overflow:visible;filter:drop-shadow(0 16px 12px #4773841a);transform:rotateY(calc(var(--mx)*4deg)) rotateX(calc(var(--my)*-3deg));transition:transform .7s var(--ease),filter .7s}.hero-folder .folder-front{transform-origin:150px 610px;transform:translateX(calc(var(--opening)*10px)) skewX(calc(var(--opening)*-3deg)) scaleX(calc(1 + var(--opening)*.035));transition:transform .65s var(--ease)}.hero-folder .sheet-one{transform:translate(calc(var(--opening)*-5px),calc(var(--opening)*-17px));transition:transform .8s var(--ease)}.hero-folder .sheet-two{transform:translate(calc(var(--opening)*8px),calc(var(--opening)*-26px));transition:transform .8s var(--ease)}.hero-folder .sheet-three{transform:translate(calc(var(--opening)*17px),calc(var(--opening)*-18px));transition:transform .8s var(--ease)}.hero-folder:hover,.hero-folder:focus-visible{--opening:1.7!important}.hero-folder:hover svg{filter:drop-shadow(0 24px 17px #47738428)}.folder-hint{position:absolute;left:48%;top:68%;font-size:11px;padding:12px 17px;white-space:nowrap;border-radius:30px;border:1px solid #adc8d3;background:#ffffffed;transform:rotate(-8deg);opacity:0;transition:opacity .3s,translate .5s;translate:0 10px;box-shadow:0 4px 16px #3154640d}.hero-folder:focus-visible .folder-hint,.hero-folder:hover .folder-hint{opacity:1;translate:0 0}.home-foot{display:flex;align-items:center;justify-content:space-between;margin:9px 1% 0;font-size:10px;letter-spacing:1.6px;color:#727970}.scroll-cue{background:transparent;padding:9px;display:flex;align-items:center;gap:16px;color:var(--ink);font-size:11px;letter-spacing:1px}.scroll-cue span{animation:down 2s ease-in-out infinite}@keyframes down{50%{transform:translateY(5px)}}
.about{padding:70px 3.2% 32px;background:var(--blue);min-height:100svh;position:relative;overflow:hidden}.about-heading{font-size:clamp(36px,5.5vw,96px);line-height:1;margin:0 0 30px;color:#fff;font-weight:400;position:relative;z-index:2;width:46%}.about-heading em{font-family:Georgia,serif;font-style:normal}.about-body{position:relative;border-radius:45px;background:#fff;padding:50px 35px 40px;display:grid;grid-template-columns:58% 42%;min-height:620px}.about-body:before{content:"";position:absolute;right:0;bottom:calc(100% - 45px);width:52%;height:150px;background:white;border-radius:60px 60px 0 0}.about-stickers{position:absolute;right:4%;top:-88px;font-size:clamp(12px,1.4vw,24px);z-index:2}.about-copy{z-index:1;padding:5px 5px 10px 20px}.about-block{margin-bottom:31px}.about-block:last-child{margin-bottom:0}.about-block h3{font-size:clamp(20px,2vw,33px);margin:0 0 14px;font-weight:500;letter-spacing:1px}.about-block h3 span{margin-left:-27px;font-size:.9em;margin-right:7px}.about-block p{font-family:"Microsoft YaHei",sans-serif;font-size:clamp(13px,1.22vw,20px);line-height:1.9;margin:8px 0}.edu-line{display:flex;gap:22px;flex-wrap:wrap}.about-block ol{padding-left:20px;font-size:clamp(12px,1vw,17px);line-height:1.9;margin:10px 0 20px}.profile-art{width:100%;align-self:center;transition:transform .7s var(--ease);mix-blend-mode:multiply}.profile-art:hover{transform:rotate(3deg) translateY(-7px)}.about-bottom{display:flex;align-items:center;justify-content:space-between;padding:27px 5px 0;color:#fff;font-size:12px}.pill-link{padding:13px 24px;border:1px solid currentColor;border-radius:40px;display:inline-flex;gap:30px;align-items:center;transition:background .3s,color .3s}.pill-link:hover{background:white;color:#2d637e}.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s var(--ease),transform .8s var(--ease)}.reveal.visible{opacity:1;transform:none}
.works-page{min-height:100svh;padding:112px 5% 27px;background:#f8f9f6}.works-heading{display:flex;align-items:baseline;gap:3%;margin-bottom:17px}.works-heading h1{font-size:clamp(68px,12.2vw,205px);line-height:.93;letter-spacing:-.055em;font-weight:700;margin:0;transform:rotate(-1deg)}.works-heading span{font-size:clamp(38px,7.5vw,125px);font-weight:700;white-space:nowrap;letter-spacing:-.065em}.works-intro{display:flex;justify-content:space-between;font-size:11px;letter-spacing:1px;color:#757972;padding:23px 0 0;margin:0}.folder-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:35px 10px;padding:80px 1% 45px}.work-folder{--accent:#c9e58e;display:block;position:relative;aspect-ratio:1.4;text-align:left;perspective:1000px;isolation:isolate;transition:transform .6s var(--ease);border-radius:24px;outline-offset:12px}.work-folder:nth-child(even){transform:translateY(-20px)}.work-folder:nth-child(n+5){left:4%}.work-folder:hover{z-index:3;transform:translateY(-10px) rotate(-2deg)}.work-folder:nth-child(even):hover{transform:translateY(-30px) rotate(2deg)}.folder-back{position:absolute;inset:0;background:color-mix(in srgb,var(--accent) 55%,#e7f1f2);border:2px solid #9ec8d5;border-radius:21px;box-shadow:0 21px 22px #344e4c24}.folder-back:before{content:"";position:absolute;top:-26px;left:8%;width:45%;height:35px;background:var(--accent);border:2px solid #95c8d9;border-radius:17px 17px 0 0;z-index:-1}.folder-sheet{position:absolute;inset:7px 13px 10px;border-radius:13px;background:#fff;overflow:hidden;transform-origin:center bottom;transition:transform .7s var(--ease);box-shadow:0 -1px 4px #344e4c10}.folder-sheet img{width:100%;height:100%;object-fit:cover;opacity:.92}.folder-sheet:after{content:"";position:absolute;inset:0;border:5px solid white;border-radius:inherit}.work-folder:hover .folder-sheet,.work-folder:focus-visible .folder-sheet{transform:translateY(-32%) rotate(3deg)}.folder-face{position:absolute;inset:6px -3px -3px;background:var(--accent);border:3px solid #8ec5d7;border-radius:23px;box-shadow:inset 0 0 0 5px #ffffff96,0 2px 1px #6579721c;transform-origin:center bottom;transition:transform .65s var(--ease),box-shadow .65s;overflow:hidden}.folder-face:before{content:"";position:absolute;inset:9px 11px auto;height:16px;border-radius:20px;background:#f3f8f7e8}.folder-face:after{content:"";position:absolute;inset:0;background:linear-gradient(130deg,#fff4,transparent 45%,#ffffff18);pointer-events:none}.work-folder:hover .folder-face,.work-folder:focus-visible .folder-face{transform:rotateX(-19deg);box-shadow:inset 0 0 0 5px #ffffff96,0 12px 16px #344e4c17}.folder-label{position:absolute;left:7%;right:6%;bottom:12%;z-index:2;font-size:clamp(17px,2.15vw,36px);font-weight:700;letter-spacing:-.8px;white-space:nowrap}.folder-label small{display:block;font-size:10px;font-weight:400;letter-spacing:.9px;margin-top:7px;opacity:.6}.folder-arrow{position:absolute;right:7%;top:28%;font-size:20px;opacity:0;transform:translate(-5px,5px);transition:.4s}.work-folder:hover .folder-arrow{opacity:.65;transform:none}.works-footer{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:#68726d;border-top:1px solid #20221b18;padding-top:22px}.works-footer a{color:#1c1d19}.works-footer .smile{font-size:25px}
.project-page{--accent:#c9e58e;padding-top:68px;background:#f8f9f6}.project-toolbar{position:sticky;top:68px;z-index:12;display:flex;justify-content:space-between;align-items:center;padding:17px 4%;border-bottom:1px solid #20221b16;background:#f8f9f6ef;backdrop-filter:blur(14px);font-size:12px}.project-toolbar a{display:flex;gap:14px;align-items:center}.project-progress{height:2px;position:absolute;left:0;bottom:-1px;width:100%;transform:scaleX(var(--progress,0));transform-origin:left;background:#477c90}.project-intro{padding:55px 5% 38px;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:end}.project-eyebrow{font-size:11px;letter-spacing:1.5px;margin:0 0 17px;display:flex;align-items:center;gap:11px}.project-eyebrow:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--accent);border:1px solid #0001}.project-intro h1{font-size:clamp(42px,5vw,88px);margin:0;letter-spacing:-2px;line-height:1.2}.project-desc{font-size:13px;line-height:1.9;color:#636b62;max-width:540px;justify-self:end;margin:0}.project-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:23px}.project-tags span{font-size:10px;padding:7px 12px;border:1px solid #1c1d1929;border-radius:30px}.gallery{padding:0 3%}.artwork{margin:0 0 26px;position:relative}.artwork-button{display:block;width:100%;padding:0;background:transparent;cursor:zoom-in;position:relative;border-radius:5px;overflow:hidden}.artwork-button img{width:100%;height:auto;transition:transform .8s var(--ease)}.artwork-button:hover img{transform:scale(1.008)}.zoom-hint{position:absolute;right:20px;bottom:20px;padding:10px 15px;background:#ffffffd9;border-radius:40px;font-size:11px;opacity:0;transform:translateY(8px);transition:.3s}.artwork-button:hover .zoom-hint,.artwork-button:focus-visible .zoom-hint{opacity:1;transform:none}.artwork figcaption{padding:13px 3px;display:flex;justify-content:space-between;color:#6c726a;font-size:10px;letter-spacing:.7px}.project-end{padding:65px 5%;display:flex;justify-content:space-between;align-items:center;background:color-mix(in srgb,var(--accent) 25%,#f8f9f6);gap:25px}.next-project{display:block;text-align:right}.next-project small{display:block;font-size:10px;letter-spacing:1.2px;margin-bottom:12px}.next-project strong{font-size:clamp(27px,4vw,66px);font-weight:500}.next-project strong span{display:inline-block;transition:transform .4s}.next-project:hover strong span{transform:translate(8px,-8px)}.back-top{position:fixed;right:20px;bottom:20px;width:43px;height:43px;border:1px solid #9bada755;background:#ffffffdb;backdrop-filter:blur(10px);border-radius:50%;z-index:10;transition:transform .3s}.back-top:hover{transform:translateY(-4px)}
.portal{position:fixed;inset:0;pointer-events:none;z-index:60;visibility:hidden;overflow:hidden}.portal span{display:block;position:absolute;left:var(--x,25%);top:var(--y,55%);width:130px;height:100px;background:#bedee7;border-radius:24px;transform:translate(-50%,-50%) scale(0);opacity:0;border:3px solid #f9ffff;box-shadow:0 0 0 7px #a1cad8,0 0 0 10px #ffffffb3}.portal.is-active{visibility:visible}.portal.is-active span{animation:portal-in .95s var(--ease) both}@keyframes portal-in{0%{transform:translate(-50%,-50%) scale(0);opacity:0}15%{opacity:1}70%{transform:translate(-50%,-50%) scale(35);opacity:1}100%{transform:translate(-50%,-50%) scale(40);opacity:0}}body.is-entering .hero-folder{animation:folder-dive .6s var(--ease) both;z-index:30}@keyframes folder-dive{to{transform:scale(3);filter:blur(5px);opacity:0}}.cursor-note{display:none;position:fixed;top:0;left:0;padding:10px 16px;background:#20251e;color:#fff;border-radius:30px;font-size:11px;z-index:40;pointer-events:none;transition:opacity .2s;opacity:0}.lightbox{padding:0;border:0;max-width:100vw;max-height:100svh;width:100vw;height:100svh;background:#f5f6f1;color:var(--ink);overflow:auto}.lightbox::backdrop{background:#171e1ce6}.lightbox-close{position:fixed;right:25px;top:20px;padding:12px 21px;border:1px solid #a9b7ad;background:#fff;border-radius:40px;z-index:3}.lightbox-image-wrap{width:100%;min-height:100%;display:flex;align-items:center;justify-content:center;padding:85px 25px 75px}.lightbox img{width:100%;max-width:2200px;object-fit:contain}.lightbox-controls{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);border-radius:40px;display:flex;align-items:center;gap:25px;padding:7px;background:#fff;border:1px solid #d5dcd4;z-index:3;font-size:12px}.lightbox-controls button{width:39px;height:35px;border-radius:50%;background:#f0f3ed}.lightbox-controls span{white-space:nowrap}
.cover-design{clip-path:none}.cover-chinese{clip-path:polygon(0 0,64% 0,64% 9%,82% 9%,82% 0,100% 0,100% 100%,0 100%)}.profile-art{height:auto}.about-stickers{width:48%;right:2.5%;font-size:clamp(10px,1.12vw,20px);justify-content:space-between;gap:.3em}
@media(min-width:1750px){.home-screen{padding-top:90px}.folder-grid{max-width:1550px;margin:auto}.about{padding-top:90px}.about-body{padding:65px}}
@media(max-width:1000px){.home-screen{padding:95px 2.4% 25px}.about-body{min-height:0;padding:33px 25px;grid-template-columns:59% 41%}.about-heading{margin-bottom:24px}.about-body:before{height:100px}.about-stickers{top:-65px}.about-copy{padding-left:13px}.about-block h3 span{margin-left:-20px}.about-block{margin-bottom:20px}.about-block p{font-size:12px}.about-block ol{font-size:11px}.folder-grid{padding-top:65px;gap:45px 12px}.folder-label{font-size:19px}.folder-label small{font-size:8px}.folder-face:before{height:12px}.project-intro{padding-top:40px}.about{min-height:auto;padding-top:50px;padding-bottom:25px}}
@media(max-width:680px){html{scroll-padding-top:65px}.site-nav{height:60px;padding:0 5%}.signature{font-size:9px;gap:6px}.signature i{display:none}.site-nav nav{gap:22px;font-size:11px}.home-screen{padding:85px 4% 20px;min-height:100svh;justify-content:space-between}.cover{aspect-ratio:auto;height:calc(100svh - 165px);min-height:530px;margin:0}.cover-top{top:0;left:2%;font-size:15px}.cover-title{left:1%;top:8%;width:98%}.cover-design{left:42%;top:22%;width:57%}.cover-chinese{left:48%;top:45%;width:52%}.hero-folder{top:37%;left:-3%;width:60%;height:47%}.cover-bottom{bottom:1%;left:1%;right:1%;font-size:12px;flex-wrap:wrap;justify-content:center;gap:6px}.cover-bottom .smile{font-size:22px}.home-foot{font-size:8px;letter-spacing:.6px;gap:8px}.home-foot>span:last-child{display:none}.scroll-cue{font-size:10px;gap:9px}.folder-hint{font-size:9px;left:25%;top:90%;padding:8px 12px;opacity:1;translate:none}.about{padding:40px 5% 24px}.about-heading{width:100%;font-size:40px;margin-bottom:24px}.about-body{display:flex;flex-direction:column-reverse;border-radius:27px;padding:25px 24px 15px}.about-body:before,.about-stickers{display:none}.profile-art{width:73%;max-width:290px;margin:0 auto 25px}.about-copy{padding-left:10px}.about-block h3{font-size:21px}.about-block p{font-size:13px;line-height:1.85}.about-block ol{font-size:12px;line-height:1.9}.edu-line{display:block}.edu-line span{display:block}.about-bottom{font-size:10px;gap:20px}.pill-link{padding:12px 17px;gap:20px}.works-page{padding:99px 5% 28px}.works-heading{gap:4%;align-items:center}.works-heading h1{font-size:13vw}.works-heading span{font-size:9vw}.works-intro{font-size:9px;letter-spacing:0;gap:10px;padding-top:16px}.folder-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:54px 15px;padding:68px 1% 42px}.work-folder{aspect-ratio:1.22}.work-folder:nth-child(n+5){left:0}.work-folder:nth-child(even){transform:translateY(-14px)}.folder-label{font-size:18px;letter-spacing:-.7px;bottom:14%}.folder-label small{font-size:8px;margin-top:7px;letter-spacing:.1px}.folder-back:before{top:-20px;height:28px;border-radius:12px 12px 0 0}.folder-face{border-radius:18px;box-shadow:inset 0 0 0 4px #ffffff96}.folder-face:before{inset:8px 10px auto;height:12px}.folder-arrow{font-size:17px}.works-footer{font-size:9px;gap:15px}.works-footer .smile{display:none}.project-page{padding-top:60px}.project-toolbar{top:60px;padding:16px 5%;font-size:10px}.project-intro{padding:33px 5% 27px;grid-template-columns:1fr;gap:22px}.project-intro h1{font-size:43px;letter-spacing:-1.5px}.project-desc{font-size:12px;justify-self:start}.project-tags{margin-top:19px}.gallery{padding:0 3%}.artwork{margin-bottom:16px}.artwork figcaption{padding:10px 2px;font-size:9px}.zoom-hint{display:none}.project-end{padding:35px 5%;align-items:flex-end}.project-end .pill-link{font-size:10px;gap:10px;padding:10px 14px}.next-project strong{font-size:26px}.next-project small{font-size:8px}.back-top{width:37px;height:37px;bottom:16px;right:13px}.lightbox-image-wrap{padding:80px 0}.lightbox-close{top:16px;right:16px;padding:10px 17px}.lightbox img{max-width:none}.lightbox-image-wrap.is-zoomed{display:block;overflow:auto}.lightbox-image-wrap.is-zoomed img{width:1800px;max-width:none}.lightbox-image-wrap{cursor:zoom-in}.lightbox-image-wrap.is-zoomed{cursor:zoom-out}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.reveal{opacity:1;transform:none}.hero-folder svg,.hero-folder .folder-front,.hero-folder .sheet-one,.hero-folder .sheet-two,.hero-folder .sheet-three{transform:none!important}.cursor-note{display:none!important}}



.project-video video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#121511;border-radius:5px;object-fit:contain}