@font-face{font-family:'My Font';src:url('assets/details/MyFont-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
:root{--edge:24px;--ink:#101010}
.masthead{min-height:104px;padding-top:18px}
.nav-brand{width:var(--split);flex:none}.nav-brand a{display:inline-block}
.masthead .display{font-size:30px;line-height:1.2;letter-spacing:0}.nav-caption{font-size:10px;padding-top:5px}
.home-hero{padding-top:91px;min-height:750px}.hero-kicker{font-size:11px;letter-spacing:.02em;margin-bottom:46px}
.name-title{font-weight:400;line-height:1;letter-spacing:-.025em}
.liquid-line{display:block;position:relative;isolation:isolate;color:#000;overflow:visible;filter:none}
.liquid-text{position:relative;z-index:0}.name-cn{font-weight:700;font-size:clamp(110px,15vw,216px);line-height:1.18;width:max-content;max-width:100%;padding:6px 12px 12px;margin-left:-12px;letter-spacing:-.045em}
.name-en{font-family:'My Font',serif;font-size:clamp(80px,10.5vw,154px);line-height:1.1;width:max-content;max-width:100%;padding:8px 12px 16px;margin-left:-12px;letter-spacing:-.035em}
.liquid-fusion{position:absolute;inset:0;padding:inherit;pointer-events:none;user-select:none;display:none;z-index:1;mask-image:radial-gradient(circle at var(--liquid-x) var(--liquid-y),transparent 0 12.1px,#000 12.4px 42px,transparent 58px);-webkit-mask-image:radial-gradient(circle at var(--liquid-x) var(--liquid-y),transparent 0 12.1px,#000 12.4px 42px,transparent 58px)}
.liquid-shape{position:absolute;inset:0;padding:inherit;pointer-events:none}
.liquid-ball{position:absolute;width:var(--ball-size,24px);height:var(--ball-size,24px);border-radius:50%;background:#000;pointer-events:none;left:0;top:0;z-index:1}
.liquid-line.liquid-active .liquid-fusion{display:block}.liquid-line[data-liquid=cn] .liquid-shape{filter:url('#liquid-cn04')}.liquid-line[data-liquid=en] .liquid-shape{filter:url('#liquid-en04')}
.hero-bottom{display:flex;align-items:flex-end;gap:30px;margin-top:45px;font-size:12px;line-height:1.5}.hero-bottom>p{width:37.8%}.hero-work-link{font-size:27px;font-weight:700;display:flex;gap:85px;align-items:center}.hero-work-link span{font-weight:400;font-size:44px;line-height:1}.hero-about{margin-left:auto}
.mood-section{margin-top:50px}.about-section{padding-top:135px}.portrait-region{width:190px}.site-footer{padding-top:190px}
.dot-cursor{position:fixed;width:24px;height:24px;top:0;left:0;z-index:2147483646;background:#fff;border:0;border-radius:50%;mix-blend-mode:difference;pointer-events:none!important;display:none;contain:layout style;will-change:transform}
.dot-cursor.in-dialog{background:transparent;mix-blend-mode:normal;backdrop-filter:invert(1);-webkit-backdrop-filter:invert(1)}
html.dot-ready,html.dot-ready *{cursor:none!important}html.dot-ready iframe{cursor:auto!important}.dot-ready .dot-cursor{display:block}.cursor-definitions{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.works-main04{padding-top:0}.works-statement{min-height:785px;padding:95px 0 82px}.works-statement .hero-kicker{margin-bottom:52px}
#statement-title{font-family:'My Font',serif;font-size:clamp(68px,8.8vw,134px);font-weight:400;line-height:1.035;letter-spacing:-.035em;padding:8px;margin-left:-8px;max-width:1410px}
.statement-bottom{display:flex;justify-content:space-between;gap:20px;font-size:11px;margin-top:60px}
.work-stage{position:relative;isolation:isolate;margin:0 calc(-1 * var(--edge));padding:0 var(--edge);background:#efefed}.stage-backdrop{display:none}.stage-heading{position:relative;z-index:2;display:flex;justify-content:space-between;font-size:11px;padding-top:30px}.stage-heading button{text-decoration:underline;text-underline-offset:4px}
.stage-grid{position:relative;z-index:1}.project-list{padding-top:65px}.project-entry{padding:65px 0 100px;position:relative;scroll-margin-top:70px}.project-meta{display:flex;align-items:center;gap:15px;font-size:11px;letter-spacing:.01em}.active-dot{width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.28;flex:none}
.project-entry h2{font-size:60px;line-height:1.22;font-weight:400;margin:20px 0 23px;letter-spacing:-.045em}.project-entry h2 a:hover{text-decoration:none}.name-arrow{font-size:.45em;margin-left:24px;vertical-align:middle}.project-entry[data-project=my-font] h2{font-family:'My Font',serif;font-size:88px}.project-entry[data-project=molly] h2{font-family:Anton,sans-serif;font-size:75px;letter-spacing:0}
.entry-description{font-size:13px;line-height:1.7;max-width:350px}.inline-cover{display:block;max-width:620px;margin-top:30px}.inline-cover img,.inline-secondary img{display:block;width:100%;height:auto}.project-entry[data-project=dream] .inline-cover,.project-entry[data-project=jian] .inline-cover{max-width:360px}.project-entry[data-project=molly] .inline-cover{max-width:290px}.inline-secondary{display:block;max-width:540px;margin-top:24px}.series-link{display:inline-block;margin-top:25px;font-size:12px;text-decoration:underline;text-underline-offset:4px}.ip-note{max-width:330px;font-size:10px;line-height:1.7;margin-top:24px;color:#555}.preview-rail{display:none}
@media(min-width:901px) and (hover:hover) and (pointer:fine){
 .work-stage.stage-enhanced .stage-backdrop{display:block;position:sticky;top:0;height:100vh;margin:0 calc(-1 * var(--edge)) -100vh;z-index:0;pointer-events:none;background:var(--stage-color,#ded7ce);transition:background-color .6s ease}
 .backdrop-images,.backdrop-wash{position:absolute;inset:0}.backdrop-images img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s ease}.backdrop-images img.is-active{opacity:.58}.backdrop-wash{background:linear-gradient(90deg,#efefed 0%,#efefed 30%,rgb(239 239 237 / 97%) 43%,rgb(239 239 237 / 75%) 57%,rgb(239 239 237 / 18%) 100%)}
 .stage-enhanced .stage-grid{display:grid;grid-template-columns:53% 47%;align-items:start}.stage-enhanced .project-entry{min-height:72vh;padding:125px 25px 80px 25px}.stage-enhanced .project-entry:last-child{min-height:95vh}.stage-enhanced .inline-cover,.stage-enhanced .inline-secondary{display:none}.stage-enhanced .project-entry.is-current .active-dot{opacity:1;width:11px;height:11px}.stage-enhanced .project-entry .active-dot{transition:opacity .25s}
 .stage-enhanced .preview-rail{display:flex;position:sticky;top:14vh;min-height:65vh;align-items:center;justify-content:center;padding:25px 0}.preview-window{width:max-content;max-width:100%;padding:12px;border:1px solid rgb(255 255 255 / 75%);border-radius:5px;background:rgb(255 255 255 / 18%);box-shadow:0 22px 55px rgb(26 26 26 / 18%);backdrop-filter:blur(10px);transition:transform .25s ease}.preview-window:has(a:hover){transform:translateY(-4px)}.preview-label{display:flex;justify-content:space-between;gap:40px;margin-bottom:10px;font-size:10px}.floating-preview{display:block}.floating-preview img{display:block;width:var(--preview-width,520px);max-width:100%;height:auto;max-height:60vh;object-fit:contain;background:#fff}.floating-preview:focus-visible{outline-offset:8px}
}
@media(max-width:1100px){.home-hero{min-height:660px}.name-en{font-size:10.2vw}.portrait-region{width:150px}.hero-work-link{gap:40px}.stage-enhanced .project-entry h2{font-size:50px}.preview-window{max-width:94%}}
@media(max-width:900px){:root{--edge:18px}.home-hero{min-height:560px;padding-top:70px}.name-cn{font-size:23vw}.name-en{font-size:10.6vw}.hero-bottom{gap:20px}.hero-bottom>p{width:32%}.hero-work-link{font-size:23px;gap:30px}.works-statement{min-height:630px}.project-entry h2{font-size:52px}.project-list{padding-top:20px}.project-entry{padding:65px 0 70px}.stage-heading{padding-top:25px}.dot-cursor{display:none!important}html.dot-ready,html.dot-ready *{cursor:revert!important}}
@media(max-width:600px){:root{--edge:14px}.masthead{min-height:85px;padding-top:16px}.masthead .display{font-size:18px}.nav-caption{font-size:9px}.nav-brand{width:52%}.home-hero{min-height:520px;padding-top:58px}.hero-kicker{font-size:9px;margin-bottom:50px}.name-cn{font-size:26vw;padding-left:6px;padding-right:6px;margin-left:-6px}.name-en{font-size:10.5vw;padding-left:5px;margin-left:-5px;letter-spacing:-.045em}.hero-bottom{flex-wrap:wrap;margin-top:48px;row-gap:35px}.hero-bottom>p{width:100%;font-size:11px}.hero-work-link{font-size:22px;gap:45px}.hero-about{font-size:11px}.mood-section{margin-top:20px}.mood-bar{font-size:10px;gap:8px}.mood-controls{gap:8px;max-width:205px}.frame-count{min-width:42px}.about-section{padding-top:75px}.portrait-region{width:28%}.profile-column{gap:18px}.site-footer{padding-top:100px}.footer-display{font-size:18.5vw}.works-statement{padding-top:58px;min-height:610px;padding-bottom:70px}.works-statement .hero-kicker{margin-bottom:50px}#statement-title{font-size:14.8vw;line-height:1.07;letter-spacing:-.035em}.statement-bottom{display:block;margin-top:50px;font-size:10px}.statement-bottom a{display:inline-block;margin-top:20px}.project-entry h2{font-size:48px}.project-entry[data-project=my-font] h2{font-size:65px}.project-entry[data-project=molly] h2{font-size:57px}.entry-description{font-size:12px}.inline-cover{max-width:100%}.preview-rail{display:none!important}}
@media(prefers-reduced-motion:reduce){.liquid-line{filter:none!important}.dot-cursor,.liquid-fusion{display:none!important}html.dot-ready,html.dot-ready *{cursor:revert!important}.preview-window{transform:none!important}}
