@import url('./portfolio-fonts.css');
:root{--font-ui:'Portfolio Numerals','Cabin','Noto Sans SC',sans-serif;--surface:#f7f7f5;--ink:#1f1f1f;--muted:#666660;--line:#c7c7c2;--gutter:clamp(20px,2.5vw,72px);--type-title:clamp(30px,3.2vw,64px);--type-section:clamp(23px,2vw,40px);--type-body:clamp(14px,1.05vw,18px);--type-label:clamp(11px,.84vw,14px);--space-section:clamp(64px,7vw,144px)}
html[data-theme=dark]{--surface:#121313;--ink:#efefea;--muted:#aaa9a2;--line:#454540;color-scheme:dark}
/* A Unicode-restricted first face assigns digits to Inter even inside mixed text. */
body,body :is(p,span,a,button,small,h1,h2,h3,h4,li,dt,dd,div,figcaption,label){font-family:var(--font-ui)!important}
body.portfolio-home{margin:0;background:var(--surface);color:var(--ink);overflow-x:clip;font-size:var(--type-body);line-height:1.65}
.portfolio-home *{box-sizing:border-box}.portfolio-home :is(h1,h2,h3,p,figure,ul){margin:0}.portfolio-home button,.portfolio-home a{color:inherit}.portfolio-home a{text-decoration:none}.portfolio-home button{font:inherit}.portfolio-home button,.portfolio-home a{touch-action:manipulation}
.portfolio-home :focus-visible{outline:2px solid #425bff;outline-offset:5px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.portfolio-home .site-header{position:absolute;top:0;left:0;z-index:8;width:100%;height:49px;background:#1f1f1f;color:#fff;display:grid;grid-template-columns:repeat(4,1fr);align-items:center;gap:30px;padding:0 var(--gutter);font-size:var(--type-label);line-height:1.4}
.site-header .identity{font-size:clamp(12px,1.04vw,16px)}.site-header>:nth-child(n+3){text-align:right}.site-header a:hover{text-decoration:underline;text-underline-offset:4px}
.portfolio-home .portfolio-hero{height:100svh;min-height:530px;position:relative;overflow:hidden}
.hero-marquee{position:absolute;inset:49px 0 0;display:flex;align-items:center;overflow:hidden}
.hero-track{display:flex;align-items:center;will-change:transform;font-size:10.72vw;line-height:1.2;font-weight:700;letter-spacing:-.044em;white-space:nowrap;transform:translateX(-1.39vw)}
.hero-unit{display:flex;align-items:center;flex-shrink:0;padding-right:.9em;gap:.025em}
.hero-picture{flex:none;position:relative;display:block;width:.70em;height:.667em;border:0;padding:0;background:#425bff;overflow:hidden;cursor:pointer;transform:translateY(.045em)}
.hero-picture canvas{position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .22s,transform .8s;transform:scale(1.08)}.hero-picture canvas.current{opacity:1;transform:scale(1)}
.section-index{position:absolute;bottom:32px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:var(--type-label);line-height:1.5}
.hero-meta{display:flex;align-items:center;gap:18px}
.portfolio-home #themeToggle{position:fixed;right:var(--gutter);top:64px;z-index:30;width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--ink);cursor:pointer}
#themeToggle svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.about-transition{position:relative;height:235svh;scroll-margin-top:0}.about-sticky{position:sticky;top:0;height:100svh;overflow:hidden}.about-artboard{position:absolute;inset:0}
.about-word{position:absolute;left:0;top:0;font-weight:400;line-height:1;letter-spacing:-.05em;will-change:transform;white-space:nowrap;z-index:1}
.fox-stage{position:absolute;left:50%;top:50%;width:min(70vw,106svh);height:min(70vw,106svh);transform:translate(-50%,-50%) scale(.4);opacity:0;will-change:transform,opacity;z-index:2;pointer-events:none}
.fox-stage #app{position:absolute;inset:0;width:100%;height:100%;outline-offset:-12px;touch-action:pan-y}.fox-stage canvas{display:block;width:100%;height:100%;touch-action:pan-y}
.fox-fallback{position:absolute;left:25%;top:10%;width:50%;height:75%;overflow:hidden}.fox-fallback img{position:absolute;width:194.46%;height:153.8%;max-width:none;left:-46.42%;top:-27.8%}
.portfolio-home[data-ready=true] .fox-fallback{display:none}.portfolio-home #status{position:absolute;bottom:8%;width:100%;text-align:center;font-size:var(--type-label);color:var(--muted)}
.about-details{position:relative;min-height:100svh;padding:clamp(100px,13vw,210px) var(--gutter) 130px}
.about-table{width:100%;font-size:var(--type-label);line-height:1.55}.about-table h3{font-size:inherit;font-weight:700;padding:7px 0;border-top:1px solid var(--line)}.about-table ul{list-style:none;padding:0}.about-table li{border-top:1px solid var(--line);padding:5px 0;min-height:31px}.about-table li.award-row{display:flex;gap:20px;justify-content:space-between}.about-table .award-count{font-variant-numeric:tabular-nums;min-width:30px;text-align:right;color:var(--muted)}
.about-table .table-gap{height:28px;border-top:1px solid var(--line)}.about-table .table-end{height:14px;margin-top:8px;background:var(--ink)}
.about-contact{font-size:var(--type-label);line-height:1.8;margin-top:18px}.about-contact h3{font-size:inherit;font-weight:700;margin-bottom:6px}.about-contact a{display:block;width:max-content;max-width:100%}.about-contact a:hover{text-decoration:underline;text-underline-offset:4px}
.project-dock{position:fixed;right:calc(var(--gutter) + 90px);bottom:24px;z-index:12;display:flex;gap:3px;opacity:.85;transition:opacity .2s}.project-dock a{position:relative;display:block;width:30px;height:36px;overflow:hidden;background:var(--ink)}.project-dock img{width:100%;height:100%;object-fit:cover;filter:saturate(.4) blur(1px);transition:filter .25s}.project-dock a:hover img,.project-dock a:focus-visible img{filter:none}.project-dock span{position:absolute;inset:0;padding:2px;color:#fff;font-size:9px;text-shadow:0 1px 4px #000}.project-dock:hover{opacity:1}
/* Shared editorial scale for project previews and detail pages. */
body #works{font-family:var(--font-ui);padding-bottom:var(--space-section)}
body .works-intro{height:auto;padding:48px var(--gutter) 64px;align-items:baseline;border-top:1px solid var(--line);margin-top:48px}body .works-intro:before{display:none}body .works-intro h2{font-size:clamp(36px,5vw,88px);font-weight:400;line-height:1.1;letter-spacing:-.05em}body .works-intro span{font-size:var(--type-label);margin:0}
body .work-preview .service-label{margin:0 var(--gutter);font-size:var(--type-label);height:auto;min-height:38px;line-height:1.5}
body .work-preview .service-overview{margin:0 var(--gutter);height:auto;min-height:0;padding-top:48px}body .work-preview .service-info h3{font-size:var(--type-section);font-weight:400;line-height:1.3;letter-spacing:-.025em;margin:22px 0 24px}
body .work-preview .feature-row{font-size:var(--type-label);line-height:1.6;padding:9px 0;min-height:36px;grid-template-columns:12% 26% minmax(0,1fr)}body .work-preview .feature-row span{line-height:1.6}
body .work-preview .service-description{margin:32px var(--gutter) 56px;max-width:780px;min-height:0;height:auto}body .service-description small{font-size:var(--type-label);line-height:1.5}body .work-preview .service-description p{font-size:var(--type-body);line-height:1.85;letter-spacing:0;margin-top:16px}
body .work-preview .service-jump{font-size:var(--type-label);font-weight:500;line-height:1.4;margin-top:24px;padding:12px 22px;min-height:40px}body .work-preview .works-rail{padding-left:var(--gutter);padding-right:var(--gutter)}body .work-marquee{font-size:var(--type-label);line-height:1.4;padding:6px 0;margin:56px 0 72px}
body main :is([data-name='项目标题'],.project-title h1){font-size:var(--type-title)!important;font-weight:400;line-height:1.25!important;letter-spacing:-.025em}
body main :is([data-name='中文标题'],[data-name='概念陈述'],[data-name='概念标题'],.cover-title h2,.section-intro h2,.ashes-footer h2){font-size:var(--type-section)!important;line-height:1.5!important;font-weight:500;letter-spacing:-.02em}
body main :is([data-name='正文'],[data-name='说明'],.narrative p,.visual-notes p,.section-intro p){font-size:var(--type-body)!important;line-height:1.85!important;letter-spacing:0}
body main :is([data-name='信息标签'],[data-name='栏目标签'],[data-name='图注'],small,.chapter-bar,.cover-caption,figcaption){font-size:var(--type-label)!important;line-height:1.6!important;letter-spacing:0}
body main [data-name='项目背景'],body main [data-name='设计思路']{height:auto;gap:10px}body main [data-name='项目说明']{gap:24px}body .narrative>div+div{margin-top:24px}body .narrative p{margin-top:10px}
body .model-tools,body .project-nav{font-size:var(--type-label);line-height:1.5}body .project-nav{padding:12px 18px}
@media(max-width:700px){
 .portfolio-home .site-header{grid-template-columns:1fr 1fr;padding:0 20px;gap:8px;height:48px}.site-header .header-discipline,.site-header .header-edition{display:none}.site-header>:last-child{text-align:right}
 .hero-track{font-size:18vw}.hero-unit{padding-right:.65em}.hero-marquee{inset:48px 0 0}.portfolio-home .portfolio-hero{min-height:520px}
 .section-index{bottom:26px;font-size:11px}.hero-meta{gap:8px;flex-wrap:wrap;max-width:65%}.project-dock{bottom:72px;right:20px}.project-dock a{width:25px;height:30px}
 .about-transition{height:210svh}.fox-stage{width:125vw;height:125vw}.about-details{padding-top:100px;padding-bottom:130px}.about-table li{padding:9px 0;min-height:38px}.about-table{font-size:12px}.about-contact{font-size:13px}
 body .works-intro{padding:36px 20px 42px;margin-top:24px}body .work-preview .service-overview{padding-top:32px}body .work-preview .feature-row{grid-template-columns:28px 1fr 1.3fr;gap:12px;font-size:11px;padding:11px 0}body .work-preview .service-description{margin-top:28px;margin-bottom:36px}body .work-preview .work-marquee{margin:36px 0 48px}body .work-preview .works-rail{clip-path:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero-picture canvas{transition:none}.about-word,.fox-stage{will-change:auto}}

/* Image cuts align to the cap height; no colored placeholder or dissolve. */
.hero-picture{height:.72em;background:transparent;transform:translateY(.014em);cursor:default}
.hero-picture canvas{transition:none;transform:none}
.fox-stage{width:min(56vw,85svh);height:min(56vw,85svh)}
.fox-stage.hero-fox{left:81%;top:50%;width:min(34vw,56svh);height:min(34vw,56svh)}
.hero-fox #status{font-size:10px}
.hero-fox-echo{position:absolute;z-index:2;transform:translate(-50%,-50%);cursor:pointer;touch-action:pan-y}.hero-fox-echo[hidden]{display:none}
.about-transition{height:300svh}
.fox-stage.travelling-fox{position:fixed;z-index:3}
.about-table .wave-row{position:relative;border-top-color:transparent}
.bio-wave{position:absolute;left:0;top:-49px;width:100%;height:96px;overflow:visible;pointer-events:none}
.bio-wave path{fill:none;stroke:var(--line);stroke-width:1;vector-effect:non-scaling-stroke}
.about-table .table-end.wave-row{background:transparent}
.table-end .bio-wave{top:-41px}.table-end .bio-wave path{stroke:var(--ink);stroke-width:14}
@media(max-width:700px){.about-transition{height:280svh}}
@media(max-width:700px){.fox-stage{width:100vw;height:100vw}.fox-stage.hero-fox{width:54vw;height:54vw;left:79%;top:50%}}
