@charset "UTF-8";
:root{--ink:#242622;--blue:#1d58a8;--muted:#898c85;--gutter:4vw}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:#fff;color:var(--ink);font-family:"PingFang SC","Noto Sans CJK SC","Microsoft YaHei",Arial,sans-serif;-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;border:0;background:none;padding:0;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}img{display:block;max-width:100%}[hidden]{display:none!important}::selection{background:#ffe99b;color:#222}button:focus-visible,a:focus-visible{outline:1px solid var(--blue);outline-offset:7px}.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}.skip-link{position:fixed;top:-80px;left:20px;background:white;padding:10px;z-index:100}.skip-link:focus{top:10px}.header-wash{position:fixed;left:0;right:0;top:0;height:186px;pointer-events:none;background:linear-gradient(180deg,#ffe47b 0%,#fff0ad99 36%,#fff0 100%);z-index:1;transition:background .5s,height .5s}.site-header{position:fixed;top:0;left:0;right:0;height:100px;padding:0 var(--gutter);z-index:30;display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{display:inline-flex;align-items:center;gap:13px;white-space:nowrap;color:var(--blue);flex-shrink:0}.wordmark .wordmark-symbol{width:64px;height:64px;object-fit:contain;flex:none}.wordmark-type{display:grid;justify-items:start;gap:1px;color:#000}.wordmark-chinese{font-size:16px;font-weight:600;line-height:17px;letter-spacing:.12em}.wordmark-cultural{font-family:Arial,sans-serif;font-size:18px;font-weight:600;line-height:19px;letter-spacing:-.035em}.wordmark-caption{font-family:Arial,sans-serif;font-size:7.5px;font-weight:500;line-height:10px;letter-spacing:.025em;margin-top:2px}.main-nav{display:flex;gap:65px;font-size:12px;letter-spacing:.04em}.main-nav a{padding:10px 0;opacity:.43;transition:opacity .2s}.main-nav a:hover,.main-nav a[aria-current=page]{opacity:1}.main-nav a[aria-current=page]{font-weight:600}.page{position:relative;z-index:3;min-height:85vh;animation:page-in .45s ease both}@keyframes page-in{from{opacity:.55;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}body[data-page=works] .header-wash,body[data-page=contact] .header-wash{height:118px;background:linear-gradient(#fffffff5 70%,#fff0)}body[data-page=studio] .header-wash{height:235px;background:linear-gradient(180deg,#428ef7 0%,#76aff9ae 30%,#fff0 100%)}
.emblem-hero{height:78svh;min-height:620px;max-height:900px;position:relative}.badge-zone{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:340px;height:340px;perspective:1100px}.badge-float{position:relative;width:100%;height:100%;animation:badge-bob 7s ease-in-out infinite;transform-style:preserve-3d;z-index:2}.badge-button{display:block;width:100%;height:100%;touch-action:pan-y;cursor:grab;perspective:1100px;position:relative;transform-style:preserve-3d}.badge-button.is-dragging{cursor:grabbing}.badge-object{position:absolute;inset:0;transform:rotateX(17deg) rotateY(-20deg) rotateZ(-13deg);transform-style:preserve-3d;transition:transform .35s cubic-bezier(.2,.65,.2,1);will-change:transform}.badge-button.is-dragging .badge-object{transition:none}.badge-object img{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none;-webkit-user-drag:none;backface-visibility:visible}.badge-slice{filter:brightness(.53) saturate(.8);transform:translateZ(calc(var(--slice) * -1.35px));opacity:1}.badge-front{filter:drop-shadow(5px 0 0 #fff) drop-shadow(-5px 0 0 #fff) drop-shadow(0 5px 0 #fff) drop-shadow(0 -5px 0 #fff) drop-shadow(7px 10px 0 #c3c9cb);transform:translateZ(1px)}.badge-floor{position:absolute;left:8%;right:8%;top:112%;height:26px;background:radial-gradient(ellipse,#2c374329 0%,#2c374308 50%,transparent 75%);filter:blur(13px);transform:scaleX(.95);z-index:0}@keyframes badge-bob{0%,100%{translate:0 -8px}50%{translate:0 10px}}.hero-signature{position:absolute;bottom:13%;left:20px;right:20px;text-align:center}.hero-signature p{font-size:17px;line-height:1.6;font-weight:500;letter-spacing:.02em}.hero-signature span{display:block;font-size:10px;color:#a2a49d;margin-top:8px;letter-spacing:.03em}.hero-scroll{position:absolute;left:var(--gutter);right:var(--gutter);bottom:15px;display:flex;justify-content:space-between;align-items:center;font-size:9px;color:#a0a399;letter-spacing:.03em}.hero-scroll>span:last-child{font-size:20px;color:#74786e}
.home-wall{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:48px 26px;padding:12px var(--gutter) 90px;position:relative;overflow:hidden}.free-work{min-width:0;height:150px;position:relative;display:block;transform:translate3d(var(--dx,0px),calc(var(--dy,0px) + var(--parallax,0px)),0) rotate(var(--turn,0deg));will-change:transform}.free-work .work-art{height:100%;width:100%;transform:scale(var(--scale,1));transition:transform .5s cubic-bezier(.2,.65,.2,1)}.free-work:hover .work-art,.free-work:focus-visible .work-art{transform:scale(calc(var(--scale,1) * 1.1)) translateY(-6px)}.work-art{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-width:0}.work-art>.work-img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;mix-blend-mode:multiply;transition:transform .5s cubic-bezier(.2,.65,.2,1);filter:drop-shadow(0 2px 2px #00000008)}.work-label{display:block;position:absolute;left:-10%;right:-10%;bottom:-26px;font-size:10px;line-height:1.5;text-align:center;opacity:0;translate:0 5px;transition:.25s;pointer-events:none;letter-spacing:0}.free-work:hover .work-label,.free-work:focus-visible .work-label,.work-tile:hover .work-label,.work-tile:focus-visible .work-label{opacity:1;translate:0 0}.home-end{text-align:center;padding:45px var(--gutter) 90px}.home-end>p{font-size:13px;letter-spacing:.02em;margin-bottom:65px}.three-links{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:left;max-width:1050px;margin:auto;font-size:13px;font-weight:500}.three-links a{text-align:center;padding:16px 0}.three-links a:hover{color:var(--blue)}.three-links a span{font-size:9px;color:#a0a399;margin-left:6px;vertical-align:top}
.page-works{padding:112px var(--gutter) 0}.works-intro{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px}.works-intro h1{font-size:15px;font-weight:500}.works-intro>span{font-size:10px;color:var(--muted)}.work-controls{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:38px}.filters{display:flex;gap:25px;flex-wrap:wrap;font-size:11px;align-items:center}.filter{padding:6px 0;color:#a1a49b;white-space:nowrap}.filter:hover{color:#41463a}.filter.active{color:var(--ink);font-weight:600}.filter.active:before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--blue);margin-right:7px;vertical-align:middle}#filter-count{font-size:9px;white-space:nowrap;color:#a1a49b}.work-group{margin-bottom:72px}.work-group-header{display:flex;align-items:center;justify-content:space-between;padding:15px 0 18px;color:#91958b;font-size:10px;letter-spacing:.06em}.work-group-header h2{font-size:10px;font-weight:400}.work-group-header>span{font-size:9px;opacity:.65}.works-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:45px 34px}.work-tile{display:block;min-width:0;position:relative;aspect-ratio:1.18;padding:14px 11px 20px;align-self:center}.work-tile .work-art{transition:transform .5s cubic-bezier(.2,.65,.2,1)}.work-tile:hover .work-art,.work-tile:focus-visible .work-art{transform:translateY(-8px) scale(1.045)}.work-tile .work-label{bottom:-13px;left:-3%;right:-3%;font-size:10px}.thumb-devices,.thumb-posters{display:flex;align-items:center;justify-content:center;gap:3%;width:90%;height:100%;perspective:800px}.thumb-panel{position:relative;overflow:hidden;flex:1;height:82%;border:2px solid white;box-shadow:2px 4px 8px #283c2818;background:#fff;transform:rotate(-7deg)}.thumb-panel:nth-child(2){height:96%;transform:translateY(-3px);z-index:2}.thumb-panel:nth-child(3){transform:rotate(7deg)}.thumb-panel img{height:100%;width:100%;object-fit:cover;object-position:top}.thumb-devices .thumb-panel{border-top:5px solid white;border-radius:5px}.thumb-posters .thumb-panel{height:90%;border-width:1px}.works-end{padding:20px 0 65px;text-align:center;font-size:12px;color:#757b70}.works-end a:hover{color:var(--blue)}.load-error{padding:60px;text-align:center;font-size:13px;color:#8f9389}
.studio-intro{text-align:center;padding:138px 20px 90px;position:relative;z-index:4}.studio-intro h1{font-size:30px;letter-spacing:-.045em;line-height:1.25;font-weight:600}.studio-intro p{font-size:11px;color:#a3a69e;line-height:1.6;margin-top:20px}.studio-collage{height:790px;position:relative;max-width:1350px;margin:0 auto 80px}.collage-item{position:absolute;left:var(--x);top:var(--y);width:var(--w);transform:rotate(var(--r));display:block}.collage-item .work-art{height:var(--h,170px);transition:transform .45s}.collage-item:hover .work-art{transform:scale(1.04) translateY(-4px)}.collage-item .work-label{bottom:-24px}.studio-copy{max-width:970px;padding:0 45px;margin:0 auto}.small-label{font-size:10px;letter-spacing:.08em;color:#9b9f94;text-align:center;margin-bottom:20px}.studio-copy h2{text-align:center;font-size:24px;line-height:1.35;letter-spacing:-.03em;font-weight:500}.studio-lead{max-width:520px;margin:30px auto 62px;text-align:center;font-size:12px;line-height:1.9;color:#787f70}.studio-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:60px}.studio-columns h3{font-size:13px;font-weight:500;margin-bottom:16px}.studio-columns p{font-size:11px;line-height:1.9;color:#8a9181}.studio-badge-section{text-align:center;padding:140px 20px 85px}.studio-badge-section>p{font-size:13px;line-height:1.7;font-weight:500;margin-bottom:25px}.studio-badge-link{display:inline-flex;flex-direction:column;align-items:center;gap:25px}.studio-badge-link img{width:160px;transform:rotate(-12deg);filter:drop-shadow(5px 5px 0 #d1d5cf);transition:.5s}.studio-badge-link:hover img{transform:rotate(8deg) translateY(-8px)}.studio-badge-link span{font-size:10px;color:#939a89}
.page-contact{display:grid;grid-template-columns:32% 1fr;gap:10%;padding:130px var(--gutter) 90px;overflow:hidden;max-width:1450px;margin:auto}.contact-watermark{position:absolute;left:9%;top:190px;width:57%;opacity:.065;transform:rotate(-12deg);pointer-events:none;z-index:-1;filter:grayscale(1)}.contact-aside{font-size:10px;line-height:1.8;padding-top:3px}.contact-aside>p{font-size:11px;margin-bottom:25px}.contact-aside ul{padding:0;list-style:none;margin:0;color:#888e80}.contact-main{max-width:490px}.contact-main h1{font-size:23px;font-weight:500;line-height:1.4;letter-spacing:-.035em;margin-bottom:35px}.contact-introduction{font-size:12px;line-height:1.95}.contact-introduction p{margin-bottom:17px}.contact-direct{margin-top:50px}.contact-direct h2{font-size:13px;line-height:1.7;font-weight:500;margin-bottom:24px}.contact-row{display:flex;align-items:baseline;gap:25px;margin-bottom:14px}.contact-row>span{font-size:10px;color:#9b9e92;min-width:25px}.contact-direct a,.contact-direct button{font-size:15px;letter-spacing:0}.contact-connect{display:grid;grid-template-columns:minmax(0,1fr) 168px;gap:28px;align-items:center}.contact-methods{min-width:0}.contact-qr{width:168px;max-width:100%}.contact-qr img{width:100%;height:auto;padding:10px;background:#fff}.contact-qr figcaption{padding:4px 10px 0;font-size:10px;line-height:1.8;color:#777e6c}.contact-qr figcaption a{display:block;width:fit-content;margin-top:5px;font-size:9px;color:#959c8c}.contact-qr figcaption a:hover{color:var(--blue)}.copy-hint{font-size:9px;color:#9ba08f;margin-left:8px}.contact-direct a:hover,.contact-direct button:hover{color:var(--blue)}.contact-invite{margin-top:65px;font-size:10px;line-height:1.9}.contact-invite>span{display:block;color:#9a9f90;margin-top:6px}.site-footer{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:30px;font-size:9px;color:#969d8d;padding:30px var(--gutter);line-height:1.6}.site-footer>span:nth-child(2){font-size:9px;color:#aab0a1}.site-footer a{color:#777e6c}
.project-dialog{margin:0;padding:0;border:0;width:100%;max-width:none;height:100dvh;max-height:none;background:#fff;color:var(--ink);overflow-y:auto;overscroll-behavior:contain}.project-dialog::backdrop{background:#ffffffed}.detail-header{height:65px;position:sticky;top:0;z-index:10;background:#fffffff2;backdrop-filter:blur(8px);display:flex;justify-content:space-between;align-items:center;padding:0 var(--gutter);font-size:11px}.detail-header button{font-size:11px;padding:8px 0}.detail-wordmark{font-size:13px;font-weight:600}.detail-intro{padding:70px 30px 55px;max-width:1050px;margin:auto;position:relative}.detail-intro>p{font-size:10px;color:#a0a598;line-height:1.7;margin-bottom:18px}.detail-intro h2{font-size:32px;font-weight:500;line-height:1.4;letter-spacing:-.03em}.detail-intro>span{display:block;margin-top:22px;font-size:9px;color:#b0b5a7}.detail-gallery{padding:0 30px;max-width:1120px;margin:auto}.detail-gallery figure{margin-bottom:38px}.detail-gallery img{display:block;width:100%;height:auto}.detail-gallery figcaption{display:flex;justify-content:space-between;font-size:9px;color:#aab09e;padding:14px 0}.detail-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;padding:55px var(--gutter) 70px;font-size:11px}.detail-footer button{font-size:11px}.detail-footer>a{color:#7b856f}.toast{position:fixed;bottom:30px;left:50%;transform:translate(-50%,15px);z-index:100;background:#272e23;color:#fff;padding:13px 22px;font-size:11px;opacity:0;transition:.25s;pointer-events:none;white-space:nowrap}.toast.visible{opacity:1;transform:translate(-50%,0)}body.dialog-open{overflow:hidden}
.reveal-item{opacity:0;translate:0 12px;transition:opacity .6s,translate .6s;transition-delay:var(--delay,0s)}.reveal-item.is-visible{opacity:1;translate:0 0}
@media(min-width:1600px){:root{--gutter:max(5vw,calc((100vw - 1500px)/2))}.badge-zone{width:390px;height:390px}.home-wall{gap:65px 38px}.free-work{height:175px}.work-tile{padding:20px}.studio-collage{max-width:1400px}}
@media(max-width:1050px){.main-nav{gap:45px}.home-wall{grid-template-columns:repeat(6,minmax(0,1fr));gap:40px 23px}.free-work{height:125px}.works-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 28px}.studio-collage{height:720px}.studio-copy{max-width:850px}.studio-columns{gap:35px}.page-contact{gap:7%;grid-template-columns:30% 1fr}.contact-main{max-width:460px}}
@media(max-width:700px){.works-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}.home-wall{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 22px}.badge-zone{width:300px;height:300px}.main-nav{gap:30px}.studio-collage{height:640px}.studio-columns{gap:23px}.contact-main h1{font-size:21px}.page-contact{grid-template-columns:24% 1fr;gap:8%}.site-footer>span:nth-child(2){display:none}}
@media(max-width:480px){:root{--gutter:5.5vw}.site-header{height:90px;gap:12px}.wordmark{gap:10px}.wordmark .wordmark-symbol{width:52px;height:52px}.wordmark-type{gap:0}.wordmark-chinese{font-size:14px;line-height:15px}.wordmark-cultural{font-size:16px;line-height:17px}.wordmark-caption{font-size:6.5px;line-height:9px;margin-top:2px}.main-nav{gap:18px;font-size:11px;letter-spacing:0}.header-wash{height:165px}body[data-page=studio] .header-wash{height:190px}.emblem-hero{height:73svh;min-height:510px;max-height:710px}.badge-zone{top:43%;width:265px;height:265px}.badge-floor{top:112%;left:13%;right:13%;height:18px}.hero-signature{bottom:13%}.hero-signature p{font-size:14px}.hero-signature span{font-size:9px;margin-top:8px}.hero-scroll{font-size:8px;bottom:8px}.hero-scroll>span:last-child{font-size:17px}.home-wall{grid-template-columns:repeat(3,minmax(0,1fr));gap:39px 16px;padding-top:8px;padding-bottom:60px}.free-work{height:99px}.work-label{font-size:9px;bottom:-23px;left:-6%;right:-6%}.home-end{padding-top:32px;padding-bottom:45px}.home-end>p{font-size:11px;margin-bottom:30px}.three-links{gap:15px;font-size:10px}.three-links a{text-align:left}.three-links a span{font-size:8px;margin-left:3px}.page-works{padding-top:120px}.works-intro{margin-bottom:17px}.works-intro h1{font-size:13px}.works-intro>span{font-size:9px}.work-controls{display:block;margin-bottom:16px}.filters{gap:2px 17px;font-size:10px}.filter{padding:8px 0}.filter.active:before{margin-right:5px;width:3px;height:3px}#filter-count{display:block;margin-top:13px;font-size:8px}.works-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 15px}.work-tile{padding:5px 2px 14px;aspect-ratio:.95}.work-tile .work-label{font-size:8px;bottom:-12px;line-height:1.45;left:-4%;right:-4%}.work-group{margin-bottom:45px}.work-group-header{font-size:9px;padding:18px 0 15px}.work-group-header h2{font-size:9px}.work-group-header>span{font-size:8px}.works-end{padding:5px 0 30px;font-size:10px}.studio-intro{padding:115px 15px 65px}.studio-intro h1{font-size:24px}.studio-intro p{font-size:9px;margin-top:17px}.studio-collage{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px 16px;padding:0 18px;height:auto;margin-bottom:80px}.collage-item{position:relative;left:auto;top:auto;width:100%;transform:rotate(var(--r)) translateY(var(--my,0px))}.collage-item .work-art{height:110px}.collage-item:nth-child(3n+2){margin-top:35px}.collage-item:nth-child(3n){margin-top:-8px}.collage-item .work-label{font-size:8px;bottom:-21px}.studio-copy{padding:0 25px}.studio-copy h2{font-size:21px}.small-label{font-size:9px}.studio-lead{font-size:11px;margin:24px auto 36px;max-width:330px}.studio-columns{display:block;max-width:310px;margin:auto}.studio-columns>div{margin-bottom:28px}.studio-columns h3{font-size:12px;margin-bottom:8px}.studio-columns p{font-size:10px;line-height:1.9}.studio-badge-section{padding-top:65px;padding-bottom:55px}.studio-badge-section>p{font-size:11px}.studio-badge-link img{width:130px}.studio-badge-link span{font-size:9px}.page-contact{display:block;padding-top:120px;padding-bottom:45px}.contact-aside{font-size:9px;line-height:1.9;margin-bottom:48px}.contact-aside>p{font-size:11px;margin-bottom:16px}.contact-aside ul{display:grid;grid-template-columns:repeat(3,1fr);gap:3px 15px;font-size:9px}.contact-watermark{left:-30%;top:230px;width:145%;max-width:none;opacity:.045}.contact-main{max-width:340px;margin-left:auto}.contact-main h1{font-size:23px;margin-bottom:28px}.contact-introduction{font-size:11px;line-height:1.95}.contact-introduction p{margin-bottom:15px}.contact-direct{margin-top:36px}.contact-direct h2{font-size:12px;margin-bottom:20px}.contact-direct a,.contact-direct button{font-size:14px}.contact-row{gap:22px}.contact-row>span{font-size:9px}.copy-hint{font-size:8px}.contact-invite{margin-top:43px;font-size:9px}.site-footer{font-size:8px;padding-top:22px;padding-bottom:24px;gap:20px}.detail-header{height:55px;font-size:10px}.detail-header button{font-size:10px}.detail-wordmark{font-size:12px}.detail-intro{padding:42px 22px 32px}.detail-intro>p{font-size:9px;margin-bottom:14px}.detail-intro h2{font-size:25px;line-height:1.35}.detail-intro>span{font-size:8px;margin-top:18px}.detail-gallery{padding:0 10px}.detail-gallery figure{margin-bottom:20px}.detail-gallery figcaption{font-size:8px;padding:9px 2px}.detail-footer{font-size:10px;gap:15px;padding:35px 22px 50px;flex-wrap:wrap}.detail-footer button{font-size:10px}.detail-footer>a{order:3;flex-basis:100%;text-align:center;margin-top:15px}.toast{font-size:10px;max-width:92vw;padding:13px 18px}}
@media(hover:none){.work-tile .work-label{opacity:1;translate:0 0;color:#7f8875}.free-work .work-label{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.badge-object{will-change:auto}.free-work{will-change:auto}}
@keyframes badge-turn{0%,100%{transform:rotateX(17deg) rotateY(-20deg) rotateZ(-13deg)}45%{transform:rotateX(6deg) rotateY(17deg) rotateZ(5deg)}75%{transform:rotateX(22deg) rotateY(-9deg) rotateZ(-7deg)}}
.badge-object{animation:badge-turn 13s ease-in-out infinite}.badge-button.has-input .badge-object{animation:none}
.studio-collage{overflow:hidden}
.page-contact{overflow:clip}

@media(max-width:900px){.contact-connect{grid-template-columns:minmax(0,1fr);gap:22px}.contact-qr{margin-left:-10px}}
