@font-face{font-family:'Boska';src:url('fonts/boska.woff2') format('woff2');font-weight:200 900;font-style:normal;font-display:swap;unicode-range:U+0000-024F,U+2000-206F}
@font-face{font-family:'Boska';src:url('fonts/boska-italic.woff2') format('woff2');font-weight:200 900;font-style:italic;font-display:swap;unicode-range:U+0000-024F,U+2000-206F}
@font-face{font-family:'Portfolio TanSong';src:url('fonts/tansong.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+3000-FFFF}
@font-face{font-family:'Portfolio BuXu';src:url('fonts/buxucixing.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap;unicode-range:U+3000-FFFF}
:root{--type-sans:'Boska','Portfolio BuXu','Microsoft YaHei','PingFang SC',sans-serif;--type-black:'Boska','Microsoft YaHei','PingFang SC',sans-serif;--type-serif:'Boska','Portfolio BuXu','Museum CJK',serif;--type-body:'Boska','Portfolio BuXu','Microsoft YaHei',sans-serif}
body,button,input,select,textarea,a,h1,h2,h3,h4,p,small,em,strong,span,figcaption,nav,footer,.brand,.eyebrow,.meta,.hero-copy h1,.section-heading h2,.poster .num,.count,.detail-english,.about h1,.about h2,.other-projects h2,.project-english{font-family:var(--type-sans)}
body{letter-spacing:0;line-height:1.8}h1,h2,h3{font-weight:400}.brand{font-weight:400;letter-spacing:-.7px}.brand span,.type-serif,.hero-copy h1 em,.detail-title,.text-poster strong,.personal-first,.about-label h2,.about-closing h2,.project-english,.detail-english{font-family:var(--type-serif)}
.hero-copy h1{font-weight:400;letter-spacing:-1.5px;line-height:1.18}.hero-copy h1 em{font-style:normal;font-weight:400;letter-spacing:2px}.section-heading h2{letter-spacing:-.6px;font-weight:400}.section-heading h2 .type-serif{font-style:normal;letter-spacing:1px}.detail-title{font-weight:400;letter-spacing:2px}.detail-english{font-size:clamp(24px,3vw,40px);font-style:italic;line-height:1.35;letter-spacing:-.5px;margin-top:12px;color:#d4cfdf}.project-english{font-size:20px;font-style:italic;line-height:1.5;margin:6px 0 12px;color:#c5c0ce}.card h3{font-size:26px;letter-spacing:-.3px}.card h3 small{font-family:var(--type-sans);font-size:12px}.card p{font-size:15px;line-height:1.85}.eyebrow,.meta,.edition{font-size:11px;letter-spacing:2.2px}.caption,.facts small,figcaption{font-size:13px;letter-spacing:.3px}.category-title h1{letter-spacing:-2px}.about-intro h1{font-family:var(--type-sans);font-weight:400;letter-spacing:1px}.personal-english{font-family:var(--type-sans);font-size:clamp(30px,4vw,46px);letter-spacing:-1px}.personal-first{font-size:1.18em;font-style:italic;font-weight:400}.about-label h2{font-size:36px;letter-spacing:1px}.about-intro p,.detail-info p{font-size:17px;line-height:1.95}.entry-top h3{font-family:var(--type-sans);font-size:23px;letter-spacing:0}.cv-entry .entry-english{font-family:var(--type-serif);font-style:italic;font-size:19px}.about-closing h2{font-weight:400}.pill{font-family:var(--type-sans);font-size:14px}.recording-carousel{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:22px 0 4px}.recording-carousel[hidden]{display:none}.recording-choices{display:flex;gap:8px}.recording-choices button{border:1px solid var(--line);border-radius:50%;width:40px;height:40px;background:transparent;font-family:var(--type-sans);font-size:13px}.recording-choices button.selected{background:var(--accent);border-color:var(--accent);color:#111}.recording-carousel>span{font-size:12px;color:var(--muted);margin-left:auto}
@media(max-width:700px){.hero-copy h1{letter-spacing:-.5px;line-height:1.25}.hero-copy h1 em{letter-spacing:0}.detail-title{font-size:42px;letter-spacing:0}.detail-english{font-size:26px}.project-english{font-size:18px}.card h3{font-size:24px}.personal-english{font-size:32px}.about-intro h1{font-size:54px;letter-spacing:1px}.about-label h2{font-size:30px}.recording-carousel{gap:10px}.recording-carousel>span{margin-left:0;width:100%}.recording-choices{gap:6px}.recording-choices button{width:34px;height:34px}}
.project-english{font-size:23px}.detail-english{font-size:clamp(28px,3.6vw,48px)}.personal-first{font-size:1.3em}.cv-entry .entry-english{font-size:22px}@media(max-width:700px){.project-english{font-size:21px}.detail-english{font-size:30px}}

body,p,.card p,.hero-copy p,.about-intro p,.cv-entry p,.skill-grid p,.facts,.facts small,.caption,figcaption,.entry-detail,.entry-company,.about-email,.about-closing a,.award-list,footer span,.recording-carousel>span{font-family:var(--type-body)}

.hero-copy h1,.section-heading .intro-title{font-family:var(--type-black)}
.card[href="#/project/hehu"] .poster img{object-position:left center}
.hero-copy h1 em,.section-heading .intro-title em.type-serif{font-family:"Portfolio BuXu","Microsoft YaHei",sans-serif;font-weight:400;font-style:normal}

@font-face{font-family:'Portfolio BianZhiDai';src:url('fonts/bianzhidai-brand.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
.brand,.brand>span,footer>a{font-family:'Portfolio BianZhiDai',sans-serif;font-weight:400;letter-spacing:0}.brand{font-size:25px}.brand small{font-family:var(--type-body)}footer>a{font-size:20px}
.motion-carousel{margin-top:15px}.motion-carousel>.player{display:block;border-radius:16px;max-height:75vh;object-fit:contain;background:#111217}.motion-navigation{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:18px 0}.motion-navigation p{margin:0;color:var(--muted);font-size:14px}.motion-thumbnails{position:relative;display:flex;gap:14px;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-color:#777 #19191e;scrollbar-width:thin;padding:6px 3px 18px}.motion-thumbnails button{position:relative;flex:0 0 160px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:#17171c;aspect-ratio:16/9;opacity:.65;transition:opacity .2s,border-color .2s}.motion-thumbnails button.selected{border-color:var(--accent);opacity:1}.motion-thumbnails button:hover{opacity:1}.motion-thumbnails img{display:block;width:100%;height:100%;object-fit:cover}.motion-thumbnails span{position:absolute;bottom:6px;left:8px;padding:1px 6px;background:#0009;border-radius:3px;font-size:12px;font-family:var(--type-body)}@media(max-width:700px){.motion-thumbnails{gap:10px}.motion-thumbnails button{flex-basis:125px}.motion-carousel>.player{border-radius:10px}}
