:root{--background:#f4f2ec;--foreground:#20201e;--muted:#777269;--gutter:clamp(24px, 3.3vw, 64px);--title-size:clamp(100px, min(26.5vw, 36svh), 440px);--ease:cubic-bezier(.22, .68, .18, 1)}*{box-sizing:border-box}html{background:var(--background)}body{color:var(--foreground);-webkit-font-smoothing:antialiased;margin:0;font-family:Helvetica Neue,Helvetica,Arial,sans-serif}a{color:inherit;text-decoration:none}a:focus-visible{outline-offset:7px;outline:1px solid}p,h1{margin:0}::selection{color:#f4f2ec;background:#20201e}.hero{min-height:100svh;padding:0 var(--gutter);flex-direction:column;display:flex}.masthead{justify-content:space-between;align-items:baseline;gap:24px;padding:30px 0;display:flex}.wordmark{letter-spacing:-.025em;font-size:13px;font-weight:500}nav{letter-spacing:.075em;gap:clamp(24px,3.3vw,64px);font-size:12px;font-weight:400;display:flex}.hero-body{flex:1;grid-template-rows:auto auto 1fr;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:20px;padding-top:clamp(48px,8svh,100px);display:grid}.name{font-size:var(--title-size);letter-spacing:-.08em;font-weight:500;line-height:.86;display:contents}.name-line{clip-path:inset(-10% -8%);width:max-content;display:block}.name-line>span{animation:title-reveal 1.12s var(--ease) both;display:block}.name-gong{grid-area:1/1/auto/-1;margin-left:-.065em}.name-xue{letter-spacing:-.085em;grid-area:2/5/auto/-1;justify-self:end;margin-top:-.015em;margin-right:-.015em;font-size:1.13em}.name-xue>span{animation-delay:.13s}.discipline{letter-spacing:-.045em;animation:quiet-reveal .7s var(--ease) .62s both;grid-area:2/2/auto/5;align-self:center;font-size:clamp(22px,2.8vw,48px);line-height:.98}.hero-bottom{grid-area:3/1/auto/-1;grid-template-columns:subgrid;color:var(--muted);animation:quiet-reveal .6s var(--ease) .88s both;align-items:end;padding-top:52px;padding-bottom:27px;font-size:12px;display:grid}.specialties{letter-spacing:.005em;grid-column:2/6;line-height:1.5}.years{letter-spacing:.035em;grid-column:8/11}.scroll-cue{white-space:nowrap;letter-spacing:.1em;grid-column:11/13;justify-self:end}.scroll-cue span{margin-left:9px}@keyframes title-reveal{0%{clip-path:inset(100% -8% -10%);transform:translateY(16%)}to{clip-path:inset(-10% -8%);transform:translateY(0)}}@keyframes quiet-reveal{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}@media (max-width:700px){:root{--gutter:22px;--title-size:30vw}.masthead{gap:16px;padding:25px 0}.wordmark{font-size:12px}nav{letter-spacing:.025em;gap:17px}.hero-body{column-gap:8px;padding-top:clamp(80px,17svh,150px)}.name-xue{margin-top:.09em;font-size:1.15em}.discipline{grid-column:1/5;align-self:end;padding-bottom:5px;font-size:clamp(18px,4.7vw,30px)}.hero-bottom{row-gap:26px;padding-top:72px;padding-bottom:25px}.specialties{grid-column:1/8}.years{grid-column:8/13;justify-self:end}.scroll-cue{grid-column:1/-1}}@media (max-width:360px){nav{gap:12px}}@media (prefers-reduced-motion:reduce){.name-line>span,.discipline,.hero-bottom{animation:none}}.selected-works{padding:clamp(120px, 15vw, 240px) var(--gutter) clamp(100px, 12vw, 200px)}.works-heading{grid-template-columns:repeat(12,minmax(0,1fr));align-items:end;gap:20px;margin-bottom:clamp(68px,9vw,150px);display:grid}.works-heading h2{letter-spacing:-.065em;grid-column:1/10;margin:0;font-size:clamp(54px,9.2vw,152px);font-weight:400;line-height:.89}.works-heading h2 span{margin-left:.72em;display:inline-block}.works-heading>p{color:var(--muted);letter-spacing:.035em;grid-column:10/13;padding-bottom:5px;font-size:12px}.works-layout{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;column-gap:20px;display:grid}.work-entry{min-width:0}.work-1{grid-column:1/12;margin-bottom:clamp(100px,14vw,220px)}.work-4{grid-column:1/-1;margin-top:clamp(110px,16vw,250px)}.work-5{grid-column:2/8;margin-top:clamp(110px,16vw,250px)}.work-6{grid-column:7/13;margin-top:clamp(110px,14vw,220px)}.work-image{aspect-ratio:1.64;clip-path:inset(0);opacity:1;transition:clip-path 1.15s var(--ease), opacity 1s var(--ease);position:relative;overflow:hidden}.work-image-surface{transition:transform 1s var(--ease);background:#d8d6d1;position:absolute;inset:0}.work-2 .work-image-surface{background:#d1cfca}.work-3 .work-image-surface{background:#dedbd6}.work-4 .work-image-surface{background:#ceccc7}.work-5 .work-image-surface{background:#dad7d2}.work-view{letter-spacing:.065em;opacity:0;transition:opacity .5s var(--ease), transform .6s var(--ease);font-size:12px;position:absolute;bottom:24px;right:24px;transform:translateY(5px)}.work-entry:hover .work-image-surface{transform:scale(1.02)}.work-entry:hover .work-view{opacity:1;transform:translateY(0)}.work-caption{transition:opacity .85s var(--ease), transform .85s var(--ease);grid-template-columns:40px 1fr;gap:12px;padding-top:20px;display:grid}.work-number{color:var(--muted);font-size:12px;line-height:1.5}.work-caption h3{letter-spacing:-.015em;margin:0;font-size:clamp(14px,1.25vw,20px);font-weight:400;line-height:1.3}.work-caption p{color:var(--muted);margin-top:6px;font-size:12px;line-height:1.5}.work-entry.is-pending .work-image{clip-path:inset(0 0 8%);opacity:0}.work-entry.is-pending .work-caption{opacity:0;transform:translateY(8px)}@media (max-width:700px){.selected-works{padding-top:110px}.works-heading{column-gap:8px;margin-bottom:64px}.works-heading h2{grid-column:1/-1;font-size:clamp(48px,12vw,84px)}.works-heading>p{grid-column:8/-1;justify-self:end;margin-top:12px}.works-layout{column-gap:8px}.work-1{grid-column:1/-1;margin-bottom:80px}.work-2{grid-column:1/10}.work-3{grid-column:3/-1;margin-top:80px}.work-4{margin-top:88px}.work-4 .work-image{aspect-ratio:1.5}.work-5{grid-column:1/11;margin-top:88px}.work-6{grid-column:2/-1;margin-top:88px}.work-caption{grid-template-columns:24px 1fr;gap:8px;padding-top:15px}.work-view{bottom:15px;right:15px}}@media (hover:none){.work-view{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.work-image,.work-image-surface,.work-view,.work-caption{transition:none}.work-entry.is-pending .work-image{opacity:1;clip-path:none}.work-entry.is-pending .work-caption{opacity:1;transform:none}.work-entry:hover .work-image-surface{transform:none}}.work-1{grid-column:2/9}.work-1 .work-image{aspect-ratio:790/593}.work-1 .textile-cover{object-fit:cover;object-position:50% 48%;background:var(--background);width:100%;height:100%;display:block}.work-1:hover .textile-cover{transform:none}.work-1 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-1 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-1 .work-caption p{margin-top:10px}.textile-project-label{letter-spacing:.045em;white-space:nowrap;font-size:12px}@media (max-width:700px){.work-1{grid-column:1/-1}.work-1 .work-caption{gap:20px 12px}}@media (max-width:380px){.work-1 .work-caption{grid-template-columns:1fr}}.work-2{grid-column:4/-1}.work-2 .work-image{aspect-ratio:4/3}.work-2 .pet-cover{object-fit:cover;object-position:50% 50%;width:100%;height:100%;display:block}.work-2 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-2 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-2 .work-caption p{margin-top:10px}.pet-project-label{letter-spacing:.045em;white-space:nowrap;transition:transform .6s var(--ease);font-size:12px}.work-2:hover .pet-project-label{transform:translate(3px)}@media (max-width:700px){.work-2{grid-column:1/-1}.work-2 .work-caption{gap:20px 12px}}@media (max-width:380px){.work-2 .work-caption{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.pet-project-label{transition:none}.work-2:hover .pet-project-label{transform:none}}.work-3{grid-column:1/11;margin-top:clamp(110px,14vw,220px)}.work-3 .work-image{aspect-ratio:1125/720}.work-3 .beauty-cover{object-fit:contain;width:100%;height:100%;display:block}.work-3:hover .beauty-cover{transform:none}.work-3 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-3 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-3 .work-caption p{margin-top:10px}.beauty-project-label{letter-spacing:.045em;white-space:nowrap;transition:transform .6s var(--ease);font-size:12px}.work-3:hover .beauty-project-label{transform:translate(3px)}@media (max-width:700px){.work-3{grid-column:1/-1;margin-top:88px}.work-3 .work-caption{gap:20px 12px}}@media (max-width:380px){.work-3 .work-caption{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.beauty-project-label{transition:none}.work-3:hover .beauty-project-label{transform:none}}.work-4 .work-image{aspect-ratio:1464/600}.work-4 .amazon-cover{object-fit:contain;object-position:center;width:100%;height:100%;display:block}.work-4:hover .amazon-cover{transform:none}.work-4 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-4 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-4 .work-caption p{margin-top:10px}.amazon-project-label{letter-spacing:.045em;white-space:nowrap;transition:transform .6s var(--ease);font-size:12px}.work-4:hover .amazon-project-label{transform:translate(3px)}@media (max-width:700px){.work-4 .work-caption{grid-template-columns:1fr;gap:20px}}@media (prefers-reduced-motion:reduce){.amazon-project-label{transition:none}.work-4:hover .amazon-project-label{transform:none}}.work-5{grid-column:2/10}.work-5 .work-image{aspect-ratio:1222/1287}.work-5 .packaging-cover{object-fit:contain;width:100%;height:100%;display:block}.work-5:hover .packaging-cover{transform:none}.work-5 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-5 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-5 .work-caption p{margin-top:10px}.packaging-project-label{letter-spacing:.045em;white-space:nowrap;transition:transform .6s var(--ease);font-size:12px}.work-5:hover .packaging-project-label{transform:translate(3px)}@media (max-width:700px){.work-5{grid-column:1/-1}.work-5 .work-caption{grid-template-columns:1fr;gap:20px}}@media (prefers-reduced-motion:reduce){.packaging-project-label{transition:none}.work-5:hover .packaging-project-label{transform:none}}.work-6{grid-column:3/-1}.work-6 .work-image{aspect-ratio:3/2}.work-6 .campaign-cover{object-fit:contain;width:100%;height:100%;display:block}.work-6:hover .campaign-cover{transform:none}.work-6 .work-caption{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:24px;padding-top:clamp(28px,3vw,48px)}.work-6 .work-caption h3{letter-spacing:.015em;font-size:14px}.work-6 .work-caption p{margin-top:10px}.work-6 .work-caption .campaign-type{margin-top:18px}.campaign-project-label{letter-spacing:.045em;white-space:nowrap;transition:transform .6s var(--ease);font-size:12px}.work-6:hover .campaign-project-label{transform:translate(3px)}@media (max-width:700px){.work-6{grid-column:1/-1}.work-6 .work-caption{gap:20px 12px}}@media (max-width:380px){.work-6 .work-caption{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){.campaign-project-label{transition:none}.work-6:hover .campaign-project-label{transform:none}}.textile-previews{align-items:flex-start;gap:14px;margin-top:24px;display:flex}.textile-previews a{width:clamp(55px,7vw,88px);display:block}.textile-previews img{width:100%;height:auto;display:block}.work-1 a:hover{text-underline-offset:5px;text-decoration:underline}.pet-home-previews{align-items:flex-start;gap:14px;margin-top:24px;display:flex}.pet-home-previews a{width:clamp(55px,7vw,88px);display:block}.pet-home-previews img{width:100%;height:auto;display:block}.work-2 a:hover{text-underline-offset:5px;text-decoration:underline}.selected-works{width:92%;max-width:1720px;margin-inline:auto;padding-inline:0}.work-1,.work-2{grid-column:1/-1;grid-template-columns:repeat(12,minmax(0,1fr));align-items:start;column-gap:24px;display:grid}.work-1>.work-image{grid-column:1/8}.work-1 .textile-previews{grid-column:9/-1;grid-template-columns:1fr 1fr;gap:24px;margin:80px 0 0;display:grid}.work-1 .textile-previews a{width:100%}.work-1 .textile-previews a:nth-child(2){margin-top:90px}.work-1 .textile-previews a:nth-child(3){grid-column:1/-1;width:72%;margin-left:auto}.work-1>.work-caption{grid-column:1/8}.work-2>.work-image{grid-area:1/1/auto/4;margin-top:90px}.work-2 .pet-home-previews{grid-area:1/5/auto/-1;grid-template-columns:1fr 1fr;gap:45px 28px;margin:0;display:grid}.work-2 .pet-home-previews a{width:100%}.work-2 .pet-home-previews a:nth-child(2){margin-top:110px}.work-2 .pet-home-previews a:nth-child(3){grid-column:1/-1;width:65%;margin-left:auto}.work-2>.work-caption{grid-column:5/-1}@media (max-width:700px){.selected-works{width:auto;margin-inline:var(--gutter)}.work-1,.work-2{flex-direction:column;gap:28px;display:flex}.work-1>.work-image{width:100%}.work-2>.work-image{width:60%;margin:0 0 0 auto}.work-1 .textile-previews,.work-2 .pet-home-previews{flex-direction:column;gap:32px;width:100%;margin:0;display:flex}.work-1 .textile-previews a:nth-child(n),.work-2 .pet-home-previews a:nth-child(n){width:100%;margin:0}.work-1>.work-caption,.work-2>.work-caption{width:100%;padding-top:0}}