@font-face{font-family:PreviewSpace;src:url('assets/fonts/space-grotesk.woff2') format('woff2');font-weight:300 700;font-display:swap}
@font-face{font-family:PreviewNews;src:url('assets/fonts/newsreader.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:PreviewNews;src:url('assets/fonts/newsreader-italic.woff2') format('woff2');font-weight:200 800;font-style:italic;font-display:swap}
@font-face{font-family:PreviewHanSC;src:url('assets/fonts/portfolio-han-sc-v2.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:PreviewHanTC;src:url('assets/fonts/portfolio-han-tc-v2.woff2') format('woff2');font-weight:400;font-display:swap}
:root,html:lang(zh){--sans:PreviewSpace,PreviewHanSC,sans-serif;--serif:PreviewNews,PreviewHanSC,serif;--paper:#f4f1e9;--white:#fffdf7;--ink:#222622;--muted:#696c63;--rule:#cccfc2;--accent:#bd452b;--dark:#252d29}
html:lang(zh-Hant){--sans:PreviewSpace,PreviewHanTC,sans-serif;--serif:PreviewNews,PreviewHanTC,serif}
body{font-family:var(--sans);font-size:16px;line-height:1.8;-webkit-font-smoothing:antialiased}
.header{padding-top:20px;padding-bottom:20px;min-height:90px;border-bottom:1px solid var(--ink)}
.wordmark{font-size:20px;font-weight:600;letter-spacing:-.06em}.wordmark span{letter-spacing:.2em;font-size:11px}
.header nav{font-size:13px;gap:32px}.language-picker select{font-family:var(--sans);border:0;border-bottom:1px solid var(--rule);background:transparent}
.project-title-section{position:relative;padding-top:38px;padding-bottom:38px}.backlink{font-size:12px;margin-bottom:40px}
.project-kicker{margin-bottom:32px}.eyebrow{font:500 11px/1.5 var(--sans);letter-spacing:.12em}.status{font:400 12px/1.5 var(--sans)}
html .project-title-section h1,html:lang(zh) .project-title-section h1{font-family:var(--sans);font-size:clamp(68px,10.5vw,150px);font-weight:500;letter-spacing:-.075em;line-height:1.02;overflow-wrap:normal}
.project-heading{gap:32px;align-items:baseline}.project-zh-title{font-family:var(--sans);font-weight:350;font-size:clamp(24px,3vw,42px);letter-spacing:.02em;color:var(--muted)}
.project-main[data-project=wutopia] .project-subtitle{font:400 italic clamp(26px,3vw,40px)/1.3 PreviewNews,serif;letter-spacing:0;margin:10px 0 20px}
.project-wide-image{height:560px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:#313930}.project-wide-image.wutopia img{object-fit:contain}
.image-caption,.gallery figcaption{font-size:11px;line-height:1.7;color:var(--muted)}.project-overview{gap:9%;padding-top:60px;padding-bottom:30px}
.project-facts dt{font:500 10px var(--sans);letter-spacing:.13em}.project-facts dd{font-size:13px;line-height:1.85}.method-tags span{border:0;border-bottom:1px solid var(--rule);padding:4px 0;margin-right:12px}
.large-serif,.project-summary .large-serif{font:400 clamp(26px,3vw,40px)/1.45 var(--sans);letter-spacing:-.035em}.project-summary>p:not(.large-serif){line-height:1.95;font-size:15px}
.project-dimensions strong{font:400 30px var(--sans);font-variant-numeric:tabular-nums;letter-spacing:-.04em}.project-dimensions small{font-size:11px}
.project-body{padding-top:35px}.project-section{border-top:1px solid var(--rule);padding-top:28px;margin-bottom:52px;gap:9%}.project-section h2,html:lang(zh) .project-section h2{font:450 24px/1.5 var(--sans);letter-spacing:-.035em}.project-section h2 .eyebrow{color:var(--accent);margin-bottom:16px}.project-section p,html:lang(zh) .project-section p{font-size:15px;line-height:1.95;max-width:680px}
.gallery{gap:24px;margin:0 0 56px}.gallery img{background:var(--white)}
.room-study{background:#e8e9df;border:1px solid var(--rule);padding:32px}.room-study-head h3{font:450 clamp(24px,3vw,36px)/1.4 var(--sans);letter-spacing:-.04em}.room-study-head p{font-size:12px;line-height:1.8}
.exhibition-switch button,.viewer-toolbar button,.screen-media-controls button,.kindle-controls button{background:transparent;border:1px solid var(--rule);border-radius:0;padding:10px 16px;font:450 12px var(--sans);min-height:42px;transition:background .18s,color .18s}
.viewer-toolbar button:hover,.screen-media-controls button:hover,.kindle-controls button:hover{background:var(--ink);color:var(--white)}.exhibition-switch button[aria-pressed=true]{background:var(--ink);color:var(--white)}
.room-selector{gap:8px}.room-selector button{background:transparent;border:1px solid var(--rule);min-height:86px;padding:14px;font:450 13px/1.6 var(--sans);text-align:left}.room-selector button span{font-size:10px;color:var(--muted);letter-spacing:.06em}.room-selector button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--white)}.room-selector button[aria-pressed=true] span{color:#d4d7cb}.room-info h4{font:450 28px var(--sans);letter-spacing:-.035em}.room-info p{font-size:13px;line-height:1.85}
.artist-note{padding:44px 0 24px}.artist-note h2{font:400 36px/1.45 var(--sans);letter-spacing:-.04em}.artist-note p{font-size:15px;line-height:2}.project-next{padding:42px 0}.project-next strong{font:450 clamp(32px,4.5vw,60px) var(--sans);letter-spacing:-.055em}.next-project-zh{font-family:var(--sans);font-weight:350;letter-spacing:0}
.hero-title h1,.section-head h2,.project-card-head h3,.about-hero h1{font-family:var(--sans);letter-spacing:-.055em}.project-card-head h3{font-size:28px}.project-visual{border-radius:0}.project-grid{gap:60px 32px}

:root,html:lang(zh){--paper:#f8f7f5;--white:#fff;--ink:#282531;--muted:#766e80;--rule:#ddd9e2;--accent:#6d536f;--dark:#282531}
.header{border-color:var(--rule)}
html .project-title-section h1,html:lang(zh) .project-title-section h1,.hero-title h1,.about-hero h1{font-family:var(--serif);font-weight:350;letter-spacing:-.045em;line-height:1.08;overflow-wrap:anywhere}
html .project-title-section h1,html:lang(zh) .project-title-section h1{font-size:clamp(64px,10.5vw,150px)}
.project-title-section{padding-bottom:46px}
.project-zh-title{font-weight:300;font-size:clamp(22px,2.5vw,36px)}
.project-main[data-project=wutopia] .project-subtitle{font:400 15px/1.5 var(--sans);letter-spacing:.14em;text-transform:uppercase;margin-top:16px}
.project-summary .large-serif,.large-serif{font-family:var(--serif);font-weight:350;letter-spacing:-.02em;line-height:1.5}
.section-head h2,.closing h2,.note-text h3,.film-dialog h2,.project-section h2,html:lang(zh) .project-section h2,.artist-note h2,.project-next strong{font-family:var(--serif);font-weight:350;letter-spacing:-.025em}
.project-next strong{font-size:clamp(36px,5vw,68px)}
.hero-title h1 em{font-family:var(--serif);font-weight:350}
.hero-title h1{letter-spacing:-.04em}
.room-study{background:#eeebf0}
.project-card-head h3,.film-card h3{font-family:var(--sans);font-weight:500}
.film-dialog button,.filter,.solid-link,.cv-layout aside,.pipeline,.system-diagram{font-family:var(--sans)}
@media(max-width:650px){
body{font-size:14px}.header{padding:18px 22px}.header nav{gap:12px}.shell{width:calc(100% - 44px)}
.project-title-section{padding-top:25px}.project-kicker{margin-bottom:25px}.backlink{margin-bottom:28px}
html .project-title-section h1,html:lang(zh) .project-title-section h1{font-size:clamp(48px,16vw,72px);line-height:1.1}
.project-heading{gap:8px 20px}.project-zh-title{font-size:25px}.project-wide-image{height:380px}
.project-overview{padding-top:35px;gap:25px}.project-section{gap:15px;padding-top:22px;margin-bottom:34px}
.project-summary .large-serif{font-size:27px}.room-study{padding:18px}.room-selector button{padding:10px;min-height:78px;font-size:11px}
.artist-note h2{font-size:28px}.project-dimensions strong{font-size:26px}.hero-title h1,html:lang(zh) .hero-title h1{font-size:clamp(46px,13vw,64px);letter-spacing:-.04em}
.about-hero h1{font-size:clamp(48px,15vw,64px)}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}