:root{--ink:#212121;--paper:#f1edeb;--ease:cubic-bezier(.22,1,.36,1);font-size:clamp(14px,1vw,38px);color:var(--ink);font-family:Arial,"PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button{border:0;background:none}button:focus-visible,a:focus-visible{outline:2px solid #6d546b;outline-offset:5px}h1,h2,h3,p{margin:0;font-weight:400}.serif{font-family:"Times New Roman","Songti SC",serif}.scene{position:fixed;inset:0;z-index:-3;overflow:hidden;background:#d5c9ca}.scene img,.scene canvas{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}.scene canvas{opacity:0;transition:opacity 1s}.scene canvas.ready{opacity:1}.scene-wash{position:fixed;inset:0;pointer-events:none;z-index:-2;transition:background 800ms var(--ease);background:transparent}body[data-route="first-row"] .scene-wash,body[data-route="two-minutes"] .scene-wash{background:rgba(247,244,241,.97)}body[data-route="about"] .scene-wash{background:rgba(245,240,237,.64)}.header{position:fixed;left:0;right:0;top:0;padding:1rem 2rem;min-height:5.7rem;display:flex;align-items:center;gap:1.5rem;z-index:40;transition:background .4s}.wordmark{font-size:2rem;line-height:1;letter-spacing:-.085em;white-space:nowrap}.wordmark span{font-family:"Times New Roman",serif;font-size:1.08em;letter-spacing:-.07em}.wordmark sup{font:9px Arial;letter-spacing:0;margin-left:3px;vertical-align:top}.header nav{margin-left:auto;display:flex;gap:1.45rem;font-size:1.2rem;letter-spacing:-.04em}.header nav a{position:relative}.header nav a:after{content:"";position:absolute;bottom:-4px;left:0;right:0;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .35s}.header nav a:hover:after{transform:scaleX(1);transform-origin:left}.tools{display:flex;gap:.7rem;align-items:center}.language{font-size:.85rem;width:2.5rem;height:2.7rem;letter-spacing:.05em}.circle{display:inline-flex;align-items:center;justify-content:center;background:#fff;border-radius:50%;width:2.7rem;height:2.7rem;flex-shrink:0;transition:transform .35s var(--ease),background .3s,color .3s}.circle:hover{transform:scale(1.1);background:var(--ink);color:white}.dots{letter-spacing:2px;font-weight:bold}.cross{display:none;font-size:2rem}.dark{background:#212121;color:white}.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:99px;background:#fff;font-size:1.05rem;padding:.8rem 1.5rem;line-height:1;transition:background .4s,color .4s,transform .4s var(--ease);gap:1rem}.pill:hover{background:#212121;color:#fff;transform:translateY(-2px)}.outline{border:1px solid currentColor;background:transparent;color:white}.home{height:100svh;min-height:500px;position:relative}.hero-copy{position:absolute;left:50%;top:48.5%;transform:translate(-50%,-50%);text-align:center;width:min(90%,1050px)}.eyebrow{font-size:1rem;letter-spacing:-.03em;margin-bottom:.7rem;text-transform:uppercase}.hero-copy h1{display:flex;flex-direction:column;align-items:center;line-height:.92;font-size:clamp(60px,7.35vw,142px);letter-spacing:-.065em}.hero-copy h1 em{font-family:"Times New Roman",serif;font-weight:400;letter-spacing:-.065em;line-height:.98}.hero-copy .pill{margin-top:2.5rem}.hero-copy .arrow{display:inline-block;transition:transform .35s}.hero-copy .pill:hover .arrow{transform:translate(3px,3px)}html[lang="zh-CN"] .hero-copy h1{font-size:clamp(52px,6.9vw,124px);letter-spacing:-.065em;line-height:1.14}html[lang="zh-CN"] .hero-copy h1 em{font-family:"Songti SC","STSong","Noto Serif CJK SC",serif;font-style:normal;font-weight:300;letter-spacing:-.055em}.home-footer{position:fixed;bottom:1.5rem;left:2rem;right:2rem;display:flex;align-items:center;justify-content:space-between;z-index:20;transition:opacity .3s}.home-footer>div{display:flex;gap:1.2rem;align-items:center}.home-footer .outline{padding:.6rem 1.2rem;font-size:.95rem}.world-link{display:flex;align-items:center;gap:.35rem;font-size:.7rem;position:absolute;left:50%;transform:translateX(-50%);text-transform:uppercase}.globe{font-family:serif;font-size:2.1rem;background:#212121;color:white;border-radius:50%;width:2.8rem;height:2.8rem;display:grid;place-items:center;transition:transform .7s}.world-link:hover .globe{transform:rotate(180deg)}.copyright{font-size:.8rem;color:#fff}.menu{position:fixed;inset:0;background:#f1edeb;z-index:35;padding:8rem 8vw 3rem;visibility:hidden;opacity:0;transform:translateY(-15px);transition:opacity .5s,transform .6s var(--ease),visibility .5s}.menu.open{visibility:visible;opacity:1;transform:none}.menu-links{width:max-content;margin:auto;display:flex;flex-direction:column;gap:.3rem}.menu-links a{font-family:"Times New Roman","Songti SC",serif;font-size:clamp(44px,6.5vw,100px);line-height:1.16;letter-spacing:-.06em;display:flex;align-items:flex-start;gap:1.3rem}.menu-links small{font:1.1rem Arial;letter-spacing:-.04em;margin-top:1rem}.menu-links a:hover span{font-style:italic}.menu-note{position:absolute;left:7vw;bottom:3rem;font-size:1rem}.menu-open .header nav,.menu-open .language{visibility:hidden}.menu-open .cross{display:inline}.menu-open .dots{display:none}.menu-open #menu-toggle{background:#212121;color:white}.menu-open{overflow:hidden}.menu-open .home-footer{opacity:0;pointer-events:none}.projects{padding:5.5rem 0 8rem;min-height:100svh}.page-title{text-align:center;font-size:4rem;line-height:1.2;letter-spacing:-.065em}.filters{display:flex;justify-content:center;gap:3px;background:white;border-radius:99px;padding:5px;width:max-content;margin:1.4rem auto 6rem}.filters button,.asset-tabs button{font-size:.85rem;padding:.4rem .9rem;border:1px solid #dedbd9;border-radius:99px;transition:.3s}.filters button.active,.asset-tabs button.active{background:#212121;color:#fff;border-color:#212121}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:3.6rem 3rem;width:min(76vw,1350px);margin:auto;perspective:1600px}.project-card{display:block;transition:transform .8s var(--ease);transform-origin:center;animation:arrive .8s var(--ease) both}.project-card:nth-child(odd){transform:rotateY(4deg)}.project-card:nth-child(even){transform:rotateY(-4deg)}.project-card:hover{transform:rotateY(0) translateY(-8px)}.project-cover{width:100%;aspect-ratio:1.9;object-fit:cover;display:block;transition:filter .4s;filter:saturate(.86)}.project-card:hover .project-cover{filter:saturate(1)}.project-meta{display:flex;align-items:flex-end;justify-content:space-between;padding:.8rem 0 .5rem;border-bottom:1px solid #444;font-size:1rem;letter-spacing:-.03em}.project-meta span{line-height:1.3}.project-meta b{font-weight:400}.project-meta .arrow{font-size:1.3rem}.projects-extra{width:min(76vw,1350px);margin:4rem auto 0;border-top:1px solid #bcb6b4;padding-top:1.5rem;display:flex;justify-content:space-between;gap:2rem}.projects-extra h2{font-family:"Times New Roman","Songti SC",serif;font-size:2.7rem;letter-spacing:-.05em}.projects-extra p{max-width:410px;line-height:1.8;font-size:.95rem}.case{padding:8rem 5vw 8rem;max-width:1700px;margin:auto}.case-top{display:flex;justify-content:space-between;align-items:flex-start;margin:0 0 3rem;gap:3rem}.case-top h1{font-size:clamp(56px,8vw,140px);letter-spacing:-.06em;line-height:1.05}.case-top .case-description{max-width:410px;line-height:1.8;font-size:1rem;padding-top:1rem}.case-label{font-size:.85rem;letter-spacing:.09em;margin-bottom:1rem}.case-nav{display:flex;flex-wrap:wrap;gap:.6rem 1.4rem;padding:1.1rem 0;border-top:1px solid #cfc9c4;border-bottom:1px solid #cfc9c4;margin:2rem 0 4rem;font-size:.9rem}.case-nav a:hover{text-decoration:underline}.case-section{margin:0 0 6rem;scroll-margin-top:7rem}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:start;margin-bottom:2rem}.section-head h2{font-size:clamp(25px,2.8vw,46px);letter-spacing:-.05em}.section-head p{font-size:1rem;line-height:1.8;max-width:550px}.meta-small{font-size:.8rem;color:#716963;line-height:1.6;margin:1rem 0}.media-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.media-card{padding:0;text-align:left;min-width:0;transition:transform .4s var(--ease)}.media-card:hover{transform:translateY(-6px)}.media-card img{width:100%;aspect-ratio:1.4;object-fit:contain;display:block;background:#ebe7e3}.media-card .caption{display:block;font-size:.8rem;line-height:1.6;margin-top:.5rem;color:#514b46}.portraits .media-card img{aspect-ratio:.76}.assets-grid{grid-template-columns:repeat(5,1fr)}.asset-tabs{display:flex;gap:.5rem;margin:0 0 1.7rem;flex-wrap:wrap}.comment-grid{grid-template-columns:repeat(3,1fr);max-width:860px}.comment-grid .media-card img{aspect-ratio:.6;object-fit:cover;object-position:top}.wide-grid{grid-template-columns:1fr 1fr}.wide-grid .media-card img{aspect-ratio:1.7}.single-grid{grid-template-columns:minmax(0,1fr);max-width:980px}.single-grid .media-card img{aspect-ratio:auto;max-height:620px}.story-stack{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin:2rem 0 0}.story-stack .media-card{position:relative;transform:rotate(-3deg);margin-left:-15px}.story-stack .media-card:nth-child(even){transform:rotate(3deg);margin-top:18px}.story-stack .media-card:hover,.story-stack .media-card:focus-visible{transform:translateY(-18px) scale(1.13);z-index:5}.story-stack .media-card img{aspect-ratio:1.54;object-fit:cover;object-position:top;box-shadow:0 8px 25px #24201c1c}.film{width:100%;max-height:78vh;background:#111;display:block}.results-grid{max-width:1000px;grid-template-columns:1fr}.about{min-height:100svh;display:grid;place-items:center;padding:8rem 8vw}.about-inner{max-width:1000px}.about h1{font-family:"Times New Roman","Songti SC",serif;font-size:clamp(54px,7.5vw,130px);letter-spacing:-.05em;line-height:1.1;margin-bottom:2rem}.about p{max-width:680px;font-size:1.4rem;line-height:1.85}.about .about-skills{font-size:1rem;margin:2rem 0;border-top:1px solid #afa29b;padding-top:1.5rem}.about .pill{margin-right:1rem}.loading{position:fixed;inset:0;background:#f1edeb;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .8s,visibility .8s}.loading>span:first-child{font-size:3rem;letter-spacing:-.08em}.loading p{font-size:.85rem;margin-top:2rem}.loading-line{height:1px;width:120px;background:#c8bfb9;position:relative;margin-top:1rem;overflow:hidden}.loading-line:after{content:"";position:absolute;inset:0;background:#252121;animation:load 1.4s infinite}.loading.done{opacity:0;visibility:hidden}body:not([data-route="home"]) .home-footer{display:none}body[data-route="first-row"] .header,body[data-route="two-minutes"] .header{background:rgba(247,244,241,.93);backdrop-filter:blur(10px)}dialog{width:min(96vw,1500px);max-width:none;max-height:96vh;border:0;padding:1.2rem;background:#f4efea;border-radius:4px;color:#212121}dialog::backdrop{background:#191715eb;backdrop-filter:blur(9px)}.lightbox-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:.8rem;font-size:1rem}#media-body img{display:block;width:100%;max-height:76vh;object-fit:contain}#media-body video{width:100%;max-height:76vh;display:block;background:black}#media-note{font-size:.8rem;line-height:1.8;margin-top:.7rem;color:#62584f}.back-link{display:inline-block;font-size:1rem;margin-bottom:2rem}.back-link:hover{text-decoration:underline}@keyframes arrive{from{opacity:0;translate:0 25px}to{opacity:1;translate:0 0}}@keyframes load{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
@media(min-width:1366px){.menu{left:auto;width:min(41rem,100vw);padding-top:8rem}.menu-links{margin:0 2rem}.menu-links a{font-size:5rem}}
@media(max-width:767px){.header{padding:1rem;min-height:5.5rem;gap:.4rem}.wordmark{font-size:1.8rem;margin-right:auto}.header nav{display:none}.tools{gap:3px}.hero-copy{width:94%;top:46.5%}.hero-copy h1{font-size:clamp(40px,10vw,65px)}html[lang="zh-CN"] .hero-copy h1{font-size:clamp(38px,11vw,72px)}.eyebrow{font-size:.7rem;letter-spacing:.015em}.hero-copy .pill{margin-top:2rem}.home-footer{left:1rem;right:1rem;bottom:1.2rem}.home-footer>div{gap:.5rem}.home-footer .outline{font-size:.75rem;padding:.7rem .85rem}.world-link{display:none}.menu{padding:8rem 2rem 3rem}.menu-links{margin:0}.menu-links a{font-size:3.6rem}.menu-note{left:2rem}.projects{padding-top:7rem}.page-title{font-size:2.8rem}.filters{margin-bottom:3rem}.project-grid{width:88vw;grid-template-columns:1fr;gap:2.2rem}.project-card:nth-child(n){transform:none}.project-card:nth-child(n):hover{transform:translateY(-4px)}.projects-extra{width:88vw;display:block}.projects-extra p{margin-top:1rem}.case{padding:7rem 5vw 5rem}.case-top{display:block}.case-top h1{font-size:4.5rem}.case-top .case-description{margin-top:1rem}.case-nav{gap:.8rem 1rem;margin-bottom:3rem}.section-head{grid-template-columns:1fr;gap:1rem}.section-head p{font-size:.95rem}.case-section{margin-bottom:4rem}.media-grid,.assets-grid{grid-template-columns:repeat(2,1fr)}.comment-grid{grid-template-columns:repeat(3,1fr);gap:.5rem}.comment-grid .caption{font-size:.7rem}.story-stack{grid-template-columns:repeat(2,1fr);gap:1rem}.story-stack .media-card{margin-left:0}.single-grid,.results-grid{grid-template-columns:1fr}.wide-grid{grid-template-columns:1fr}.about{padding:8rem 6vw 4rem}.about h1{font-size:3.8rem}.about p{font-size:1.1rem}.about .pill{margin-bottom:1rem}dialog{padding:.7rem;width:96vw}.lightbox-bar{font-size:.8rem}#media-body img{max-height:72vh}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.scene canvas{display:none}.project-card,.story-stack .media-card{transform:none!important}}
/* Reference-aligned navigation and gallery spacing, three-dimensional scene revision. */
.menu{transform:translateX(100%);transition:transform 850ms cubic-bezier(.76,0,.24,1),visibility 850ms,opacity 500ms}.menu.open{transform:translateX(0)}
.menu-links a span{transition:transform .55s cubic-bezier(.22,1,.36,1)}.menu-links a:hover span{transform:translateX(.18em)}
.project-grid{width:min(81vw,1450px);gap:2rem 2.6rem}.projects .filters{margin-bottom:5rem}.project-card{will-change:transform}.project-cover{aspect-ratio:1.94}.project-meta{font-size:1.15rem}
.hero-copy{top:47.5%}.hero-copy .pill{margin-top:2.15rem}.hero-copy h1{font-weight:400}.scene canvas{transition:opacity 600ms ease}
#app.route-enter{animation:route-content 850ms cubic-bezier(.22,1,.36,1) both}
@keyframes route-content{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:767px){.project-grid{width:88vw}.projects .filters{margin-bottom:3rem}.hero-copy{top:46.5%}.menu{transform:translateX(100%)}.project-meta{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.scene canvas.ready{display:block}.scene canvas{filter:none!important}.menu{transition:none}}
body[data-route="about"] .scene-wash{background:transparent}.about{display:block;position:relative;padding:0;height:100svh;min-height:720px}.about-inner{position:absolute;left:27%;top:31%;width:54%;max-width:1000px;display:grid;grid-template-columns:.85fr 1.2fr;gap:1.25rem 2rem;align-items:start}.about .eyebrow{grid-column:1/-1;font-size:.8rem}.about h1{grid-column:1;font-size:clamp(40px,4.2vw,75px);line-height:1.05}.about p:not(.eyebrow){grid-column:2;font-size:1rem;line-height:1.65}.about .about-skills{margin:0;border-top:0;padding:0;font-size:.75rem}.about .pill{font-size:.85rem;width:max-content;margin:0;grid-column:2}.about .pill:last-child{background:transparent;border:1px solid #6f5961}.about .pill:last-child:hover{background:#212121}
@media(max-width:767px){.about{min-height:900px}.about-inner{left:7%;top:19%;width:86%;grid-template-columns:1fr}.about h1{font-size:3.4rem;margin-bottom:.5rem}.about p:not(.eyebrow),.about .pill{grid-column:1}.about .about-skills{max-width:80%}.about p:not(.eyebrow){font-size:.95rem}}
.about-inner{top:27%;row-gap:.8rem}.about h1{grid-row:2/span 4;margin:0}.about .about-skills{grid-row:3}.about .pill{grid-row:4}.about .pill:last-child{justify-self:end}
@media(max-width:767px){.about-inner{top:16%;row-gap:1rem}.about h1,.about .about-skills,.about .pill{grid-row:auto}.about .pill:last-child{justify-self:start}}
.world-page{height:100svh;min-height:500px;cursor:grab;touch-action:none}.world-page:active{cursor:grabbing}.world-controls{position:fixed;bottom:1.5rem;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:1rem;color:#fff;font-size:.8rem;white-space:nowrap}.world-controls .circle{background:#242426;color:#fff}.world-controls a{margin-left:1rem;border-bottom:1px solid #ffffff70;padding-bottom:.3rem}body[data-route="world"] .header{color:white}body[data-route="world"] #menu-toggle{color:#212121}body[data-route="world"].menu-open .header{color:#212121}.world-controls p{pointer-events:none}
@media(max-width:767px){.world-controls{width:92%;justify-content:center;flex-wrap:wrap;gap:.65rem;bottom:1rem}.world-controls a{margin-left:0}.world-controls p{font-size:.75rem}}

/* Entry proportions and motion checked against the reference loader. */
.intro{position:fixed;inset:0;z-index:12000;background:#efded9;color:#424242;display:flex;align-items:center;justify-content:center;text-align:center;font-family:Arial,"PingFang SC",sans-serif;overflow:hidden}
.intro-inner{position:relative;width:22rem;transform-origin:center center}
.intro-eyes-wrap{position:absolute;width:14.4rem;left:50%;top:-10.5rem;transform:translateX(-50%)}
.intro-eyes{display:block;width:100%;height:auto;animation:eyes-arrive .8s cubic-bezier(.16,1,.3,1) both}
.intro h2{font-size:1.125rem;font-weight:400;letter-spacing:-.025rem;margin:0 0 .35rem}
.intro-description{font-size:1rem;line-height:1.3;margin:0 0 1.75rem;letter-spacing:-.025rem}
#intro-enter{position:absolute;top:100%;left:50%;transform:translateX(-50%);font-size:1rem;padding:.65rem 1.5rem;white-space:nowrap}
#intro-skip{position:absolute;bottom:4rem;background:none;border:0;border-bottom:1px solid currentColor;font-size:.7rem;padding:0 0 .2rem;color:inherit;cursor:pointer}
.intro .js-eyes-heart{display:none}.intro .js-eyes-eyelid-left-top,.intro .js-eyes-eyelid-right-top{transform:translateY(-46.3px);transition:transform .5s cubic-bezier(.16,1,.3,1)}
.intro .js-eyes-eyelid-left-bottom{transform:translateY(33.755px);transition:transform .5s}
.intro .js-eyes-eyelid-right-bottom{transform:translateY(52.6px);transition:transform .5s}
.intro.blink [class*="js-eyes-eyelid"]{transform:translateY(0)}
.intro.exiting{opacity:0;transition:opacity 1s cubic-bezier(.87,0,.13,1);pointer-events:none}
.intro.exiting .intro-inner{transform:scale(1.8);opacity:0;transition:transform 1.1s cubic-bezier(.87,0,.13,1),opacity .8s}
.intro.exiting .intro-eyes{opacity:0;transition:opacity .5s}.intro[hidden]{display:none}
body.intro-active{overflow:hidden}
@keyframes eyes-arrive{from{transform:scale(.08);opacity:0}to{transform:scale(1);opacity:1}}
@media(max-width:767px){.intro-eyes-wrap{width:12.8rem;top:-9.5rem}.intro-inner{width:82vw}}
@media(prefers-reduced-motion:reduce){.intro-eyes{animation:none}.intro.exiting,.intro.exiting .intro-inner{transition:none}}

/* Projects: measured title/filter geometry; card motion is a reconstruction. */
.projects{padding-top:5rem}.projects .filters{height:2.386rem;padding:.4rem;margin:1rem auto 4.4rem;gap:.2rem}.projects .filters button{padding:.15rem .8rem;font-size:.72rem;line-height:1.1}.project-grid{perspective:1800px;gap:1.6rem 2.6rem}.project-card:nth-child(n){transform:rotateX(var(--pitch,0deg));transition:transform .65s cubic-bezier(.22,1,.36,1);animation:none}.project-cover{aspect-ratio:820/430;filter:none;transition:transform .8s cubic-bezier(.22,1,.36,1);transform-origin:center}.project-card:hover{transform:rotateX(0deg)}.project-card:hover .project-cover{transform:scale(1.025)}.project-meta{font-size:1.15rem;padding:.65rem 0 .55rem;line-height:1.15}.project-meta b{font-size:1em}.project-meta .arrow{transition:transform .4s}.project-card:hover .arrow{transform:translate(3px,3px)}.projects-extra{width:min(81vw,1450px)}
@media(max-width:767px){.projects{padding-top:7rem}.projects .filters{margin-bottom:3rem}.project-card:hover .project-cover{transform:none}}

.project-card[href*="/assets"] .project-cover{object-position:center 18%}.project-card[href*="/storyboard"] .project-cover,.project-card[href*="/generation"] .project-cover{object-position:top}

/* Subdivided image and text planes; DOM remains accessible and is the fallback. */
#project-paper{position:fixed;inset:0;z-index:3;pointer-events:none;width:100%;height:100%}#project-paper[hidden]{display:none}.project-card.paper-rendered .project-cover,.project-card.paper-rendered .project-meta{opacity:0}.project-card:nth-child(n),.project-card:nth-child(n):hover{transform:none!important;transition:none}.project-grid{perspective:none}.projects .page-title,.projects .filters{position:relative;z-index:4}.project-card:focus-visible{outline:2px solid #222}.project-cover{transform:none!important}.project-meta{height:calc((81vw - 2.6rem) / 2 * 74 / 820);min-height:52px;padding:0;margin-top:6px;border-bottom:1px solid #111}.projects .filters{background:transparent}.projects .filters button{border:0}.projects{padding-bottom:8rem}.projects-extra{position:relative;z-index:4;background:rgba(245,245,245,.92)}
@media(max-width:767px){.project-meta{height:calc(88vw * 74 / 820);min-height:44px}}

/* Recorded desktop reference: fixed listing controls and asymmetric project title. */
body[data-route="projects"] .projects>.page-title{position:fixed;top:72px;left:0;right:0;line-height:1.2;font-size:56px;pointer-events:none}body[data-route="projects"] .projects>.filters{position:fixed;top:155px;left:50%;transform:translateX(-50%);margin:0;width:max-content;height:34px}.projects{padding-top:270px}.project-grid{width:clamp(76vw,calc(121vw - 576px),81vw);margin-left:calc((100% - clamp(76vw,calc(121vw - 576px),81vw))/2 + 22px)}
.case{padding:0 8.4375vw 5rem}.case-hero{height:570px;position:relative;isolation:isolate}.case-kicker{position:absolute;top:42px;left:50%;transform:translateX(-50%);font-size:12px;white-space:nowrap}.case-title-left{position:absolute;top:140px;left:0;z-index:2}.case-title-left em,.case-title-left h1,.case-title-right{font-size:clamp(64px,6.5625vw,126px);line-height:1;letter-spacing:-.055em;font-weight:400}.case-title-left em,.case-title-right em{font-family:"Times New Roman","Songti SC",serif;font-weight:400}.case-title-right{position:absolute;top:330px;left:58.33%;z-index:2;white-space:nowrap}.case-title-right>*{display:block}.case-model{position:absolute;inset:75px 18% 0;z-index:0;pointer-events:none}.case-model canvas{width:100%;height:100%}.case-overview{display:grid;grid-template-columns:7fr 2.5fr 2.5fr;gap:4vw;margin-bottom:6rem}.case-overview h2{font-size:11px;margin-bottom:12px}.case-overview p{font-size:16px;line-height:1.5}.case-overview>div:first-child{padding-right:8vw}.case-overview>div:first-child p{font-size:30px;line-height:1.15;letter-spacing:-.035em}.case-overview .pill{font-size:12px;margin-top:20px}.case-nav{border-top:1px solid #2224;padding-top:20px;margin-bottom:8rem}.case-section{margin-bottom:9rem;scroll-margin-top:95px}.section-head{grid-template-columns:5fr 7fr;margin-bottom:3rem}.section-head h2{font-size:clamp(28px,3.2vw,54px);line-height:1.05;letter-spacing:-.04em}.section-head p{font-size:16px;line-height:1.7}.case .single-grid{max-width:none}.case .single-grid img{max-height:none}.case .wide-grid{gap:5vw 2vw}.case-next{position:relative;display:flex;min-height:65vh;flex-direction:column;justify-content:center;gap:30px}.case-next small,.case-next span{font-size:12px}.case-next strong{font-size:clamp(64px,7vw,130px);font-weight:400;letter-spacing:-.06em}.case-next em{position:absolute;right:5%;top:35%;font-size:7vw}.case-next:hover em{transform:translate(10px,10px)}body[data-route="first-row"] .header,body[data-route="two-minutes"] .header{background:transparent;backdrop-filter:none}body[data-route="first-row"] .scene-wash,body[data-route="two-minutes"] .scene-wash{background:#faf8fc}.case .caption{text-align:left}.case .media-card img{border-radius:0}.route-enter{animation:none!important}
@media(max-width:767px){body[data-route="projects"] .projects>.page-title{top:88px;font-size:38px}body[data-route="projects"] .projects>.filters{top:148px}.projects{padding-top:225px}.project-grid{width:88vw;margin:0 auto}.case{padding:0 6vw 3rem}.case-kicker{top:100px;font-size:10px}.case-hero{height:560px}.case-title-left{top:175px}.case-title-left em,.case-title-left h1,.case-title-right{font-size:56px}.case-title-right{top:345px;left:28%}.case-model{inset:180px 0 30px}.case-overview{grid-template-columns:1fr 1fr;gap:25px}.case-overview>div:first-child{grid-column:1/-1;padding:0}.case-overview>div:first-child p{font-size:24px}.section-head{grid-template-columns:1fr;gap:20px}.case-section{margin-bottom:5rem}.case-nav{margin-bottom:5rem}.case-next{min-height:50vh}.case-next em{font-size:50px}}
#detail-paper{position:fixed;inset:0;pointer-events:none;z-index:1;width:100%;height:100%}#detail-paper[hidden]{display:none}.case{position:relative;z-index:2}.case img.detail-rendered{opacity:0}.drag-gallery{display:flex!important;gap:2.5vw!important;overflow-x:auto;overflow-y:hidden;padding:5rem 0 7rem;cursor:grab;scrollbar-width:thin;touch-action:pan-y;user-select:none}.drag-gallery .media-card{flex:0 0 43vw;align-self:flex-start}.drag-gallery .media-card:nth-child(even){margin-top:5rem}.drag-gallery img{pointer-events:none}.drag-gallery.dragging,.drag-gallery.dragging *{cursor:grabbing}.drag-gallery .caption{white-space:normal}.projects:before{content:"";position:fixed;top:0;left:0;right:0;height:225px;z-index:3;pointer-events:none;background:linear-gradient(#f0f0f0b0,#f0f0f066 75%,transparent)}
@media(max-width:767px){.drag-gallery .media-card{flex-basis:78vw}.drag-gallery{padding:2rem 0 4rem}.drag-gallery .media-card:nth-child(even){margin-top:2rem}}
@media(min-width:768px){.drag-gallery{width:100vw;margin-left:-8.4375vw;padding-left:8.4375vw;padding-right:8.4375vw}}
html{overflow-anchor:none}.project-transition{position:fixed;inset:0;background:#faf8fc;z-index:30;pointer-events:auto}.project-transition span{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);font-size:22px;line-height:1;white-space:nowrap;letter-spacing:-.035em}.project-transition-active .case h1{visibility:hidden}

.media-card img{height:auto}

/* v23: keep Chinese labels proportionate to the reference’s compact typesetting. */
body[data-route="projects"] .projects h1{letter-spacing:-.055em}
html[lang="zh-CN"] body[data-route="projects"] .projects h1{letter-spacing:-.045em}

/* Chinese typography: independent from the English display type. */
html[lang="zh-CN"]{--zh-font:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;font-family:var(--zh-font)}
html[lang="zh-CN"] :is(.serif,.hero-copy h1 em,.menu-links a,.projects-extra h2,.about h1,.case-title-left em,.case-title-right em){font-family:var(--zh-font);font-style:normal;letter-spacing:0;font-weight:400}
html[lang="zh-CN"] .hero-copy h1{font-family:var(--zh-font);font-size:clamp(42px,6.3vw,112px);font-weight:500;letter-spacing:.015em;line-height:1.24}
html[lang="zh-CN"] .hero-copy h1 em{font-weight:300;letter-spacing:.035em;line-height:1.24}
html[lang="zh-CN"] :is(.page-title,.about h1,.projects-extra h2,.case h1){letter-spacing:0;line-height:1.18}
html[lang="zh-CN"] .menu-links a{line-height:1.35}
html[lang="zh-CN"] .header nav{letter-spacing:0}
html[lang="zh-CN"] .wordmark{font-family:Arial,sans-serif}
@media(max-width:767px){html[lang="zh-CN"] .hero-copy h1{font-size:clamp(36px,9.2vw,66px);line-height:1.3}html[lang="zh-CN"] .hero-copy h1 em{line-height:1.3;letter-spacing:.02em}}

/* v26: Chinese editorial Song type; retain English typography. */
html[lang="zh-CN"]{--zh-font:"Songti SC","STSong","Noto Serif CJK SC","Source Han Serif SC",serif;font-family:var(--zh-font)}
html[lang="zh-CN"] .intro{font-family:var(--zh-font)}
html[lang="zh-CN"] .hero-copy h1{font-family:var(--zh-font);font-size:clamp(42px,6.6vw,118px);font-weight:400;letter-spacing:.055em;line-height:1.25}
html[lang="zh-CN"] .hero-copy h1 em{font-family:var(--zh-font);font-weight:300;font-style:normal;letter-spacing:.065em;line-height:1.25;transform:translateX(-.22em)}
html[lang="zh-CN"] .hero-copy h1 > span{font-family:var(--zh-font);font-weight:400;letter-spacing:.045em;transform:translateX(.22em)}
@media(max-width:767px){html[lang="zh-CN"] .hero-copy h1{font-size:clamp(36px,9.8vw,68px);line-height:1.3}html[lang="zh-CN"] .hero-copy h1 em{letter-spacing:.035em;transform:translateX(-.12em)}html[lang="zh-CN"] .hero-copy h1 > span{letter-spacing:.025em;transform:translateX(.12em)}}
