:root{color-scheme:dark;--bg:#0b0c0d;--text:#eeeede;--muted:#8b8d89;--line:rgba(230,235,220,.18);--accent:#e4ec89;--gutter:clamp(22px,4.6vw,88px);font-family:Arial,"Noto Sans SC","Microsoft YaHei",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:110px}body{margin:0;background:var(--bg);color:var(--text)}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 var(--accent);outline-offset:7px}::selection{background:var(--accent);color:var(--bg)}[hidden]{display:none!important}.screen-reader-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:20px;padding:14px;background:var(--accent);color:#111;z-index:200}.skip-link:focus{top:10px}#water-canvas{position:fixed;inset:0;width:100%;height:100%;z-index:1;pointer-events:none}.grain{position:fixed;inset:0;z-index:9;pointer-events:none;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.84' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.65' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.site-header{position:fixed;top:0;left:0;right:0;z-index:20;padding:27px var(--gutter);height:104px;transition:background .4s,border-color .4s;border-bottom:1px solid transparent}.site-header.scrolled{background:rgba(11,12,13,.87);backdrop-filter:blur(18px);border-color:var(--line)}.home-navigation,.project-navigation{display:flex;align-items:center;justify-content:space-between;gap:24px;height:100%}.wordmark{font-size:clamp(22px,2.35vw,36px);font-weight:500;letter-spacing:-1.5px}.wordmark span{font-size:14px;vertical-align:top;margin-left:4px;display:inline-block;padding-top:4px}.personal-links{display:flex;gap:30px;font-size:14px}.personal-links a{position:relative}.personal-links a:after{content:'';position:absolute;bottom:-6px;left:0;width:0;height:1px;background:var(--text);transition:width .3s}.personal-links a:hover:after{width:100%}.edition{font-size:12px;border:1px solid var(--line);border-radius:40px;padding:11px 17px;letter-spacing:.04em}.edition span{color:var(--muted);margin-left:12px}main{position:relative;z-index:2}.hero{padding:142px var(--gutter) 24px;min-height:100svh}.hero-heading{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:23px;gap:20px}.hero-heading h1{font-size:clamp(21px,2.4vw,37px);font-weight:400;letter-spacing:.035em;margin:0}.hero-heading>span{font-size:12px;letter-spacing:.12em;color:var(--muted)}.hero-frame{position:relative;width:100%;height:clamp(290px,49vh,670px);overflow:hidden;border-radius:3px;background:#101113}.hero-frame>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 54%;filter:saturate(.8) brightness(.76)}.hero-shade{position:absolute;inset:0;background:linear-gradient(0deg,rgba(3,6,15,.52),transparent 44%);pointer-events:none}.hero-image-label{position:absolute;bottom:27px;left:30px;display:flex;flex-direction:column;gap:10px}.hero-image-label span:first-child{font-size:12px;letter-spacing:.17em}.hero-image-label span:last-child{font-size:19px;letter-spacing:.07em}.hero-image-index{position:absolute;right:30px;bottom:29px;font:12px monospace;letter-spacing:.1em}.project-selector{display:grid;grid-template-columns:repeat(3,1fr);margin-top:26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.project-choice{display:flex;align-items:center;gap:18px;position:relative;text-align:left;padding:24px 23px 24px 0;min-height:100px;transition:color .25s}.project-choice+.project-choice{padding-left:30px;border-left:1px solid var(--line)}.project-choice .choice-number{font:12px monospace;color:var(--muted);align-self:flex-start;margin-top:7px}.project-choice .choice-title{font-size:clamp(18px,1.6vw,25px);letter-spacing:.035em;display:block}.project-choice .choice-subtitle{display:block;margin-top:9px;font-size:11px;letter-spacing:.09em;color:var(--muted)}.choice-mark{width:34px;height:34px;border:1px solid #64665e;border-radius:50%;display:grid;place-items:center;font-size:21px;margin-left:auto;flex-shrink:0;transition:transform .45s,background .3s,color .3s}.project-choice:hover{color:var(--accent)}.project-choice:hover .choice-mark{background:var(--accent);border-color:var(--accent);color:#10110d;transform:rotate(90deg)}.hero-footnote{display:flex;align-items:center;justify-content:space-between;padding-top:18px;color:var(--muted);font-size:12px;gap:16px}.hero-footnote>span:last-child{font-size:11px;letter-spacing:.1em}.motion-toggle{display:flex;gap:9px;align-items:center;padding:5px 0;font-size:12px;color:var(--muted)}.wave-icon{color:var(--accent);font-size:23px;line-height:14px}.motion-toggle[aria-pressed=false] .wave-icon{color:var(--muted)}.projects-section{padding:76px var(--gutter) 20px;scroll-margin-top:30px;min-height:100svh}.section-rule{display:flex;justify-content:space-between;align-items:center;padding-top:22px;border-top:1px solid var(--line);margin-bottom:70px;font:12px monospace;letter-spacing:.06em;color:var(--muted)}.text-button{padding:5px 0;font-size:13px;color:var(--muted)}.text-button:hover{color:var(--text)}.project-overview{display:grid;grid-template-columns:minmax(190px,1fr) minmax(0,2.9fr);gap:5vw;align-items:start}.project-introduction{position:sticky;top:144px}.eyebrow{font-size:11px!important;letter-spacing:.12em;line-height:1.7!important;color:var(--muted);margin:0 0 23px}.project-introduction h2{font-weight:400;font-size:clamp(28px,3.3vw,52px);line-height:1.4;letter-spacing:.03em;margin:0 0 25px}.project-introduction .intro-description{font-size:14px;line-height:1.95;color:#b1b3ab;max-width:300px}.project-meta{border-top:1px solid var(--line);margin-top:42px;padding-top:16px;font-size:12px;line-height:1.9;display:grid;gap:13px}.project-meta>div{display:flex;justify-content:space-between;gap:18px}.project-meta dt{color:var(--muted)}.project-meta dd{margin:0;text-align:right}.project-cover{margin:0}.image-button{padding:0;display:block;width:100%;position:relative;text-align:left;overflow:hidden;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.065);border-radius:3px}.image-button img{display:block;width:100%;height:auto;aspect-ratio:var(--ratio,16/9);object-fit:contain}.image-button:after{content:'查看作品';position:absolute;right:18px;bottom:18px;border-radius:100px;padding:10px 18px;background:rgba(14,16,17,.7);border:1px solid #ffffff40;backdrop-filter:blur(12px);font-size:12px;opacity:0;transform:translateY(5px);transition:.25s;pointer-events:none}.image-button:hover:after,.image-button:focus-visible:after{opacity:1;transform:translateY(0)}.image-caption{display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px;margin:17px 0 0;line-height:1.6}.image-caption span:first-child{color:#c9cbc2}.project-artworks{margin:78px 0 0 29.5%;display:grid;gap:62px}.artwork{margin:0}.project-footer{margin-top:108px;border-top:1px solid var(--line);padding:30px 0;display:flex;align-items:center;justify-content:space-between;gap:30px}.project-footer>span{font:11px monospace;letter-spacing:.1em;color:var(--muted)}#footer-projects{display:flex;gap:30px}#footer-projects button{font-size:14px}.project-navigation .current-project{display:flex;align-items:center;gap:24px;font-size:23px;font-weight:400}.current-project small{font:12px monospace;color:var(--muted)}.project-switches{display:flex;gap:36px;align-items:center}.project-switches button{font-size:14px;color:#bdc0b6}.project-switches button:hover{color:var(--accent)}.nav-home{font-size:12px!important;border-left:1px solid var(--line);padding-left:28px;color:var(--muted)!important}.details{position:fixed;inset:0 0 0 auto;margin:0;width:min(520px,92vw);max-width:none;max-height:none;height:100dvh;padding:0;border:0;border-left:1px solid #ffffff26;background:rgba(24,27,28,.79);backdrop-filter:blur(32px) saturate(.8);color:var(--text);box-shadow:-25px 0 100px #0005;overflow:hidden;opacity:0;transform:translateX(100%);transition:transform .42s cubic-bezier(.2,.75,.2,1),opacity .3s;z-index:100}.details.is-open{opacity:1;transform:translateX(0)}.details::backdrop{background:rgba(0,0,0,.25)}.detail-top{display:flex;align-items:center;justify-content:space-between;height:83px;padding:0 30px;border-bottom:1px solid var(--line);font:12px monospace;color:var(--muted)}.close-detail{font-size:30px;width:40px;height:40px;font-weight:300}.detail-scroll{height:calc(100% - 157px);overflow-y:auto;overscroll-behavior:contain;padding:30px}.detail-scroll>img{width:100%;display:block;border-radius:3px;object-fit:contain;background:#111}.detail-body{padding-top:30px}.detail-body .eyebrow{margin-bottom:12px}.detail-body h2{font-size:29px;font-weight:400;margin:0 0 20px;line-height:1.45}.detail-body h3{font-size:21px;font-weight:400;margin:0 0 15px}.detail-body>p:not(.eyebrow){font-size:15px;line-height:1.95;color:#c3c6bc}.detail-divider{height:1px;background:var(--line);margin:32px 0}.detail-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:23px}.detail-tags span{border:1px solid var(--line);border-radius:20px;padding:6px 10px;font-size:12px;color:#c3c6bc}.detail-pagination{height:74px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px;font-size:13px}.detail-pagination>span{font:12px monospace;color:var(--muted)}.detail-pagination button:disabled{opacity:.3;cursor:default}.detail-pagination button{padding:12px 0}.is-switching{animation:project-in .5s ease both}@keyframes project-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1800px){.hero{padding-top:165px}.hero-frame{height:55vh}.project-choice{min-height:130px}.project-choice+.project-choice{padding-left:45px}}
@media(max-width:900px){.site-header{height:86px;padding-top:21px;padding-bottom:21px}.edition{display:none}.hero{padding-top:116px}.hero-frame{height:47vh;min-height:300px}.hero-heading>span{font-size:10px}.project-choice{gap:10px;padding-right:14px}.project-choice+.project-choice{padding-left:17px}.choice-mark{width:28px;height:28px}.project-choice .choice-subtitle{font-size:9px}.project-overview{grid-template-columns:1fr 2fr;gap:30px}.project-introduction h2{font-size:28px}.project-meta{margin-top:25px}.project-artworks{margin-left:calc(33.33% + 10px)}.project-switches{gap:20px}.project-navigation .current-project{gap:12px;font-size:19px}.nav-home{padding-left:15px}.project-switches button{font-size:13px}.section-rule{margin-bottom:45px}.hero-footnote>span:last-child{display:none}}
@media(max-width:600px){html{scroll-padding-top:88px}.site-header{height:82px}.wordmark{font-size:25px}.wordmark span{font-size:11px}.personal-links{font-size:11px;gap:15px}.hero{padding-top:112px;padding-bottom:16px}.hero-heading{display:block;margin-bottom:20px}.hero-heading h1{font-size:23px}.hero-heading>span{display:block;margin-top:10px;font-size:10px}.hero-frame{height:39vh;min-height:280px;max-height:430px}.hero-frame>img{object-position:center}.hero-image-label{left:18px;bottom:23px;gap:8px}.hero-image-label span:first-child{font-size:10px}.hero-image-label span:last-child{font-size:16px}.hero-image-index{right:18px;bottom:24px;font-size:10px}.project-selector{margin-top:23px;grid-template-columns:1fr}.project-choice,.project-choice+.project-choice{padding:16px 0;min-height:76px;border-left:0;gap:20px}.project-choice+.project-choice{border-top:1px solid var(--line)}.project-choice .choice-title{font-size:19px}.project-choice .choice-subtitle{font-size:9px;margin-top:5px}.project-choice .choice-number{margin-top:4px}.choice-mark{width:30px;height:30px}.hero-footnote{font-size:10px;padding-top:15px}.motion-toggle{font-size:11px}.project-navigation{gap:10px;align-items:flex-start;flex-direction:column;justify-content:center}.project-navigation .current-project{font-size:16px;gap:10px}.project-switches{width:100%;gap:20px}.project-switches button{font-size:11px;padding:3px 0}.project-switches .nav-home{margin-left:auto;border:0;padding-left:0}.projects-section{padding-top:40px;scroll-margin-top:45px}.section-rule{padding-top:19px;margin-bottom:34px;font-size:10px}.section-rule .text-button{font-size:11px}.project-overview{display:flex;flex-direction:column;gap:30px}.project-introduction{position:static;width:100%}.project-introduction .eyebrow{margin-bottom:15px;font-size:10px!important}.project-introduction h2{font-size:35px;margin-bottom:17px}.project-introduction .intro-description{max-width:100%;font-size:14px;line-height:1.9}.project-meta{display:flex;justify-content:space-between;margin-top:23px;padding-top:14px;gap:20px;font-size:11px}.project-meta>div{display:block}.project-meta dd{text-align:left;margin-top:5px}.project-cover{width:100%}.project-artworks{margin:40px 0 0;gap:36px}.image-caption{font-size:11px;margin-top:12px}.image-caption span:last-child{font-size:10px}.image-button:after{font-size:10px;padding:7px 12px;right:10px;bottom:10px}.project-footer{margin-top:65px;flex-wrap:wrap;gap:24px;padding:25px 0}.project-footer>span{font-size:10px}#footer-projects{order:2;width:100%;justify-content:space-between;gap:16px}#footer-projects button{font-size:13px}.detail-top{padding:0 22px}.detail-scroll{padding:24px 22px}.detail-body h2{font-size:25px}.details{width:94vw}.detail-pagination{padding:0 22px}}
/* Keep the WebGL image surface beneath readable text and controls. */
main{z-index:auto}.hero-heading,.project-selector,.hero-footnote,.section-rule,.image-caption,.project-footer{position:relative;z-index:2}.project-introduction{z-index:2}.hero-shade,.hero-image-label,.hero-image-index{z-index:2}.image-button:after{z-index:3}.liquid-active .liquid-image[data-liquid-ready=true]{opacity:0}.browse-hint{font-size:12px;color:var(--muted);margin-top:28px}.modal-open{overflow:hidden}.project-content{position:relative}.project-choice[aria-current=true] .choice-number{color:var(--accent)}
.is-switching{animation:none}.is-switching .project-introduction,.is-switching .image-caption{animation:project-in .5s ease both}
.hero-frame>img{object-position:center top}.project-introduction .intro-description,.detail-body>p:not(.eyebrow){font-size:16px}.image-caption,.project-meta,.text-button,.detail-pagination{font-size:14px}.project-choice .choice-subtitle,.eyebrow{font-size:12px!important}.browse-hint,.hero-footnote,.motion-toggle{font-size:13px}.grain{opacity:.032}
@media(max-width:600px){.hero-frame{height:auto;min-height:0;aspect-ratio:16/10}.hero-image-label{bottom:15px}.hero-image-label span:first-child{display:none}.hero-image-label span:last-child{font-size:14px}.hero-image-index{bottom:17px}.project-navigation .current-project{font-size:16px}.project-switches button{font-size:13px}.personal-links{font-size:12px}.project-choice .choice-subtitle{font-size:10px!important}.image-caption{font-size:12px}.hero-footnote{font-size:11px}.motion-toggle{font-size:12px}.project-meta{font-size:12px}.detail-body>p:not(.eyebrow){font-size:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
