:root{--ink:#171717;--paper:#f7f5f0;--muted:#676762;--line:#d8d6d0;--silver:#42423f;--placeholder:#ebe8e1;--serif:Didot,"Bodoni 72","Times New Roman",serif;--sans:Inter,"Helvetica Neue",Arial,sans-serif;--pad:clamp(1.25rem,4vw,4.5rem)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55}body.menu-open{overflow:hidden}a{color:inherit}button,a{touch-action:manipulation}img,video{max-width:100%;display:block}.skip-link{position:fixed;z-index:100;left:1rem;top:-4rem;background:var(--ink);color:var(--paper);padding:.7rem 1rem}.skip-link:focus{top:1rem}:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.site-header{height:82px;padding:0 var(--pad);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:20;background:rgba(247,245,240,.95);backdrop-filter:blur(12px)}.wordmark{text-decoration:none;font-family:var(--serif);font-size:1.55rem;letter-spacing:-.08em}.wordmark span{font-family:var(--sans);font-size:.46rem;vertical-align:top;margin-left:.25rem;letter-spacing:0}.site-header nav{display:flex;gap:2.5rem}.site-header nav a{text-decoration:none;text-transform:uppercase;font-size:.72rem;letter-spacing:.18em;color:var(--muted)}.site-header nav a:hover,.site-header nav a[aria-current="page"]{color:var(--ink)}.menu-toggle{display:none;background:none;border:0;color:var(--ink);font:inherit;text-transform:uppercase;font-size:.72rem;letter-spacing:.15em}
main{min-height:calc(100vh - 160px)}.page{padding:0 var(--pad)}.eyebrow{text-transform:uppercase;letter-spacing:.19em;font-size:.68rem;color:var(--muted);margin:0 0 1rem}.display{font-family:var(--serif);font-weight:400;line-height:.86;letter-spacing:-.055em;margin:0}.lede{font-size:clamp(1.15rem,2vw,1.65rem);line-height:1.45;color:var(--silver);max-width:42rem}.text-link{display:inline-flex;align-items:center;gap:.65rem;text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;text-decoration:none;border-bottom:1px solid var(--silver);padding-bottom:.35rem}.text-link::after{content:"↗"}.text-link.internal::after{content:"→"}.button-row{display:flex;gap:1.6rem;flex-wrap:wrap;margin-top:2rem}.rule{border:0;border-top:1px solid var(--line);margin:0}.section-head{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-bottom:2rem}.section-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.3rem,6vw,5.4rem);letter-spacing:-.045em;line-height:.95;margin:0}.section{padding:clamp(5rem,10vw,9rem) 0}
.hero{min-height:calc(100svh - 82px);display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);grid-template-rows:1fr auto;gap:2rem;padding:clamp(3rem,7vh,6rem) 0 2rem}.hero-copy{align-self:center}.hero h1{font-size:clamp(5rem,13vw,12rem)}.hero .role{font-family:var(--serif);font-style:italic;font-size:clamp(1.5rem,3.3vw,3.4rem);margin:.8rem 0 0;color:var(--silver)}.hero-side{align-self:end;border-left:1px solid var(--line);padding:1.5rem 0 1rem 2rem}.hero-side p{max-width:28rem}.hero-meta{grid-column:1/-1;border-top:1px solid var(--line);padding-top:1rem;display:flex;justify-content:space-between;text-transform:uppercase;letter-spacing:.14em;color:var(--muted);font-size:.65rem}
.project-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(2rem,5vw,5rem) 1.5rem}.project-card{grid-column:span 6}.project-card:nth-child(3n+1){grid-column:span 7}.project-card:nth-child(3n+2){grid-column:span 5;margin-top:clamp(3rem,10vw,9rem)}.project-card:nth-child(3n){grid-column:3/span 8}.project-card a{text-decoration:none}.project-card h3{font-family:var(--serif);font-size:clamp(1.7rem,3vw,3rem);font-weight:400;line-height:1;margin:.85rem 0 .45rem}.project-card p{color:var(--muted);max-width:38rem;margin:.25rem 0}.project-card .meta{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem;border-top:1px solid var(--line);padding-top:.8rem;text-transform:uppercase;font-size:.62rem;letter-spacing:.14em;color:var(--silver)}
.media{background:var(--placeholder);overflow:hidden;position:relative;aspect-ratio:var(--ratio,4/3)}.media img,.media video{width:100%;height:100%;object-fit:var(--crop,cover);transition:transform .6s ease}.media video{background:#0b0b0b}.project-card a:hover img{transform:scale(1.015)}.placeholder{width:100%;height:100%;min-height:240px;display:flex;align-items:center;justify-content:center;position:relative;color:#6d6b66;text-transform:uppercase;letter-spacing:.16em;font-size:.64rem;background:var(--placeholder)}.placeholder::before,.placeholder::after{content:"";position:absolute;background:#cfccc4}.placeholder::before{width:1px;height:58%;}.placeholder::after{height:1px;width:58%}
.capability-strip{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}.capability-strip div{padding:2rem 1.2rem 2rem 0;border-bottom:1px solid var(--line)}.capability-strip div:nth-child(3n+2),.capability-strip div:nth-child(3n+3){padding-left:1.2rem;border-left:1px solid var(--line)}.capability-strip span{font-family:var(--serif);font-size:1.5rem}.about-preview{display:grid;grid-template-columns:.7fr 1.3fr;gap:3rem}.about-preview .lede{margin-top:0}
.page-intro{padding:clamp(5rem,10vw,9rem) 0 clamp(3rem,6vw,6rem);display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:end}.page-intro h1{font-size:clamp(4.5rem,11vw,10rem)}.filters{display:flex;gap:.6rem;flex-wrap:wrap;padding:0 0 3rem}.filter{background:transparent;color:var(--muted);border:1px solid var(--line);border-radius:99px;padding:.65rem 1rem;font:inherit;font-size:.72rem;letter-spacing:.08em;cursor:pointer}.filter:hover{color:var(--ink);border-color:#9d9b95}.filter[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.filter:focus-visible{outline-color:var(--ink)}.archive-grid{padding-bottom:8rem}.archive-grid .project-card[hidden]{display:none}
.project-hero{padding:clamp(5rem,9vw,8rem) 0 3rem}.project-hero h1{font-size:clamp(4rem,10vw,9rem);max-width:1100px}.project-kicker{display:flex;justify-content:space-between;gap:2rem;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted)}.project-cover{margin-bottom:clamp(4rem,9vw,8rem)}.project-body{display:grid;grid-template-columns:.7fr 1.3fr;gap:clamp(3rem,8vw,9rem);max-width:1200px;margin:0 auto;padding-bottom:clamp(5rem,9vw,9rem)}.project-body h2{font-family:var(--serif);font-size:clamp(2rem,4vw,4rem);font-weight:400;line-height:1;margin:0}.project-copy section{padding:0 0 3.5rem;border-bottom:1px solid var(--line);margin-bottom:3.5rem}.project-copy h3{text-transform:uppercase;letter-spacing:.16em;color:var(--muted);font-size:.68rem;margin:0 0 1rem}.project-copy p{font-size:1.08rem;color:var(--silver)}.clean-list{padding:0;margin:0;list-style:none}.clean-list li{border-top:1px solid var(--line);padding:.75rem 0;color:var(--silver)}.tags{display:flex;gap:.5rem;flex-wrap:wrap}.tag{border:1px solid var(--line);border-radius:99px;padding:.4rem .75rem;font-size:.72rem;color:var(--silver)}.gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--pad);padding-bottom:8rem}.gallery figure{margin:0}.gallery figure:nth-child(3n){grid-column:1/-1}.gallery figcaption{font-size:.75rem;color:var(--muted);margin-top:.65rem}.next-project{border-top:1px solid var(--line);padding:4rem 0 6rem;display:flex;justify-content:space-between;align-items:end;text-decoration:none}.next-project strong{font-family:var(--serif);font-size:clamp(2rem,6vw,6rem);font-weight:400;line-height:1}
.about-layout{display:grid;grid-template-columns:.75fr 1.25fr;gap:clamp(3rem,8vw,9rem);padding-bottom:8rem}.timeline-item{display:grid;grid-template-columns:180px 1fr;gap:2rem;padding:2rem 0;border-top:1px solid var(--line)}.timeline-item .period{color:var(--muted);font-size:.75rem;text-transform:uppercase;letter-spacing:.1em}.timeline-item h3{font-family:var(--serif);font-weight:400;font-size:1.6rem;margin:0}.timeline-item h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--silver);margin:.35rem 0 1rem}.timeline-item p{color:var(--muted);margin:0}.about-block{padding:3rem 0;border-top:1px solid var(--line)}.about-block h2{font-family:var(--serif);font-weight:400;font-size:2.5rem;margin:0 0 2rem}.education{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.education p{color:var(--muted)}
.contact{min-height:calc(100svh - 160px);display:flex;flex-direction:column;justify-content:center;padding-top:5rem;padding-bottom:5rem}.contact h1{font-size:clamp(4rem,11vw,10rem)}.contact-email{font-family:var(--serif);font-size:clamp(1.2rem,3.5vw,3.5rem);text-decoration:none;border-bottom:1px solid var(--line);padding:1.5rem 0;word-break:break-word}.contact-email:hover{color:var(--muted)}.site-footer{margin:0;border-top:0;padding:1.5rem var(--pad) 2rem;display:flex;justify-content:space-between;background:var(--ink);color:#c9c7c1;font-size:.68rem;text-transform:uppercase;letter-spacing:.12em}
@media(max-width:760px){.site-header{height:68px}.menu-toggle{display:block}.site-header nav{display:none;position:fixed;inset:68px 0 0;background:var(--paper);padding:var(--pad);flex-direction:column;justify-content:center;align-items:center;gap:2.5rem;border-top:1px solid var(--line)}.site-header nav.open{display:flex}.site-header nav a{font-family:var(--serif);font-size:2.4rem;text-transform:none;letter-spacing:-.02em;color:var(--ink)}.hero{min-height:calc(100svh - 68px);display:flex;flex-direction:column;justify-content:space-between;padding-top:4rem}.hero h1{font-size:clamp(4.6rem,22vw,7.5rem)}.hero-side{border-left:0;border-top:1px solid var(--line);padding:1.3rem 0}.hero-meta span:last-child{display:none}.project-grid{display:block}.project-card,.project-card:nth-child(n){margin:0 0 4rem}.capability-strip{grid-template-columns:1fr}.capability-strip div:nth-child(n){padding:1.2rem 0;border-left:0}.about-preview,.page-intro,.project-body,.about-layout{grid-template-columns:1fr}.page-intro{align-items:start}.page-intro .lede{margin:0}.gallery{grid-template-columns:1fr}.gallery figure:nth-child(n){grid-column:auto}.project-kicker{display:block}.project-kicker span{display:block;margin-top:.5rem}.timeline-item{grid-template-columns:1fr;gap:.5rem}.education{grid-template-columns:1fr}.section-head{align-items:start;flex-direction:column}.site-footer{display:block}.site-footer p{margin:.35rem 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* 素材重整后的交互与图库补充 */
body.lightbox-open{overflow:hidden}.media img,.media video{object-position:var(--position,center)}
.card-actions,.project-links,.profile-links,.contact-links{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;margin-top:1.25rem}.card-external{display:flex}.card-external .text-link{margin:0}.project-card .card-visual:hover img{transform:scale(1.015)}
.lightbox-trigger{display:block;width:100%;height:100%;padding:0;border:0;background:transparent;color:inherit;cursor:zoom-in}.lightbox-trigger span{position:absolute;right:1rem;bottom:1rem;background:rgba(247,245,240,.92);border:1px solid var(--line);padding:.4rem .65rem;text-transform:uppercase;letter-spacing:.12em;font-size:.58rem}.lightbox{position:fixed;z-index:1000;inset:0;background:rgba(23,23,23,.96);padding:clamp(1rem,4vw,3rem);color:var(--paper)}.lightbox[hidden]{display:none}.lightbox-stage{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.lightbox-stage img{max-width:100%;max-height:100%;object-fit:contain}.lightbox-close{position:absolute;z-index:2;top:1rem;right:1rem;border:1px solid #777;background:#171717;color:#fff;padding:.65rem .9rem;text-transform:uppercase;letter-spacing:.12em;cursor:pointer}.gallery.gallery-compact{max-width:1050px;margin:0 auto}.about-layout aside>.media{margin-bottom:2rem;max-width:520px}

/* 原图比例优先：尺寸由网格和最大宽度控制，不裁切作品 */
.media{aspect-ratio:auto;background:transparent;overflow:hidden}.media img{width:100%;height:auto;object-fit:contain;object-position:center}.media video{width:100%;height:auto;object-fit:contain}.lightbox-trigger{height:auto;position:relative}.lightbox-trigger img{width:100%;height:auto}.card-visual{display:block;overflow:hidden;background:var(--placeholder)}
.project-cover{max-width:1280px;margin-left:auto;margin-right:auto}.project-cover.cover-portrait{max-width:680px}.project-cover.cover-square{max-width:860px}
.gallery{grid-template-columns:repeat(12,minmax(0,1fr));max-width:1280px;margin-left:auto;margin-right:auto;align-items:start}.gallery figure,.gallery figure:nth-child(3n){grid-column:1/-1}.gallery figure.is-portrait{grid-column:span 6;max-width:560px;justify-self:center;width:100%}.gallery figure.is-square{grid-column:span 6;max-width:620px;justify-self:center;width:100%}.gallery figure.is-landscape{grid-column:1/-1;width:100%}.media-group{padding:clamp(4rem,8vw,7rem) 0;border-top:1px solid var(--line)}.media-group-head{display:grid;grid-template-columns:.55fr 1fr;gap:1.5rem 4rem;align-items:end;margin-bottom:3rem}.media-group-head .eyebrow{grid-column:1/-1}.media-group-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.5rem,6vw,5.5rem);line-height:.95;letter-spacing:-.04em;margin:0}.media-group-head>p:last-child{color:var(--muted);max-width:34rem;margin:0}.editorial-gallery{padding-bottom:0}.editorial-gallery figure{margin-bottom:var(--pad)}
@media(max-width:760px){.gallery{display:grid;grid-template-columns:1fr;gap:2.5rem}.gallery figure,.gallery figure:nth-child(n),.gallery figure.is-portrait,.gallery figure.is-square,.gallery figure.is-landscape{grid-column:1;max-width:100%;width:100%;margin-left:auto;margin-right:auto}.gallery figure.is-portrait{max-width:520px}.project-cover.cover-portrait{max-width:560px}.media-group-head{grid-template-columns:1fr;gap:1rem}.media-group-head .eyebrow{grid-column:auto}.media-group{padding:4rem 0}}

/* 官网、社媒与 CV 专用按钮；不影响普通文字链接和导航 */
.button-link{min-height:48px;padding:12px 22px;border-radius:4px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;text-decoration:none;font-size:15px;font-weight:600;line-height:1.2;letter-spacing:0;transition:background-color .18s ease;cursor:pointer}.button-link.button-primary{background:#171717;color:#fff}.button-link.button-primary:hover{background:#333}.button-link.button-social{background:#e8e5df;color:#171717;border-color:#c8c4bc}.button-link.button-social:hover{background:#dcd8d0}.button-link:focus-visible{outline:3px solid #171717;outline-offset:3px}.project-links,.profile-links,.contact-links,.card-external{gap:12px}.button-row{gap:12px;align-items:center}.card-external .button-link{margin:0}
@media(max-width:760px){.profile-links,.contact-links{width:100%;flex-direction:column;align-items:stretch}.profile-links .button-link,.contact-links .button-link{width:100%;justify-content:space-between}.project-links .button-link{flex:1 1 auto}.button-row .button-link{max-width:100%}}

/* 仅 Fortune Tail 详情与 About 按钮组统一为黑底白字 */
.fortune-links .button-link,.fortune-links .button-link:visited,.profile-links .button-link,.profile-links .button-link:visited{background:#171717;color:#fff;border-color:#171717}.fortune-links .button-link:hover,.profile-links .button-link:hover{background:#333;color:#fff}.fortune-links .button-link:focus-visible,.profile-links .button-link:focus-visible{outline:3px solid #171717;outline-offset:3px}
