@font-face{font-family:WorksBodoni;src:url('fonts/works-bodoni-regular.woff') format('woff');font-weight:400;font-display:block}
@font-face{font-family:WorksBodoni;src:url('fonts/works-bodoni-black.woff') format('woff');font-weight:900;font-display:block}
@font-face{font-family:WorksSongti;src:url('fonts/works-songti-regular.woff') format('woff');font-weight:400;font-display:block}
@font-face{font-family:WorksSongti;src:url('fonts/works-songti-bold.woff') format('woff');font-weight:700;font-display:block}
/* Reference A: fixed proportional composition, scaling together on phone and desktop. */
.artist-portfolio .works-page .works-editorial{position:relative;isolation:isolate;container-type:inline-size;--serif:WorksBodoni,WorksSongti,serif;font-synthesis:none;display:block;box-sizing:content-box;height:auto;min-height:0;aspect-ratio:974/1155;padding:0;margin:28px auto 36px;max-width:1240px;overflow:visible;border-bottom:1px solid var(--line);color:var(--ink);background:var(--paper)}
.artist-portfolio .works-editorial>div{position:absolute;inset:auto;text-shadow:none;min-width:0}
.artist-portfolio .works-editorial .we-masthead{inset:0;z-index:3;pointer-events:none}
.artist-portfolio .works-editorial .we-kicker{position:absolute;left:0;top:0;font:400 1.75cqw/1.4 var(--serif);letter-spacing:.19em;color:var(--red);margin:0}
.artist-portfolio .works-editorial h1{position:absolute;inset:0;display:block;margin:0;font-weight:400;line-height:1;white-space:nowrap}
.artist-portfolio .works-editorial .we-word{position:absolute;left:0;top:3.4632%;width:73%;height:23.1006cqw;display:block;color:#090909;letter-spacing:0}
.artist-portfolio .works-editorial .we-word svg{display:block;width:100%;height:100%;overflow:visible;fill:currentColor}
/* A feathered paper-colored halo separates the crisp black lettering from the photograph. */
/* Apply the feather to the HTML wrapper, so its visible pixel radius is not
   reduced by the glyph SVG's large internal coordinate system. Layered white
   halos retain an opaque inner edge and fade smoothly into the photograph. */
.artist-portfolio .works-editorial .we-word{filter:drop-shadow(0 0 clamp(1px,.18cqw,2px) #fff) drop-shadow(0 0 clamp(2px,.45cqw,5px) #fff) drop-shadow(0 0 clamp(3px,.75cqw,9px) #fff)}
.artist-portfolio .works-editorial .we-word svg path{stroke:none;filter:none}
.artist-portfolio .works-editorial .we-chinese{position:absolute;left:75%;top:9.2%;width:17.04cqw;height:8.83cqw;font:700 9.6cqw/1 WorksSongti,serif;letter-spacing:0;color:#090909;padding:0}
.artist-portfolio .works-editorial .we-archive{position:absolute;left:0;top:25%;z-index:3;font:400 1.9cqw/1.5 var(--serif);letter-spacing:.16em;color:var(--red);margin:0;max-width:none}
.artist-portfolio .works-editorial .we-image{position:absolute;left:30%;top:19%;width:calc(70% + var(--edge, 0px));height:78.265cqw;display:block;min-width:0;padding:0;margin:0;border:0;background:transparent;border-radius:0;box-shadow:none;overflow:hidden;cursor:pointer;appearance:none;-webkit-appearance:none;z-index:1}
.artist-portfolio .works-editorial .we-image img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;opacity:1;filter:none;border:0;transform:none;transition:filter .3s}
.artist-portfolio .works-editorial .we-image:hover img{filter:brightness(1.04)}
.artist-portfolio .works-editorial .we-album{position:absolute;left:0;top:43.5%;z-index:2;pointer-events:none;padding:0;width:max-content;max-width:50%}
.artist-portfolio .works-editorial .we-number{display:flex;gap:2cqw;align-items:center;font:400 2.6cqw/1 var(--serif);color:var(--red);letter-spacing:.08em;margin-bottom:2.5cqw}
.artist-portfolio .works-editorial .we-number i{width:6cqw;height:1px;background:var(--red)}
.artist-portfolio .works-editorial .we-album h2{display:block;width:37.78cqw;height:10.68cqw;font:700 10.2cqw/1.16 WorksSongti,serif;letter-spacing:0;margin:0 0 2.1cqw -.6cqw;padding:0;color:#090909;background:transparent;text-shadow:0 0 .12em var(--paper),0 0 .28em var(--paper);white-space:nowrap}
.artist-portfolio .works-editorial .we-album p{display:table;font:400 2.55cqw/1.6 var(--serif);letter-spacing:.17em;background:transparent;text-shadow:0 0 .24em var(--paper),0 0 .5em var(--paper);color:var(--red);padding:0 .25em .2em 0;margin:0;white-space:nowrap}
.artist-portfolio .works-editorial .we-note{position:absolute;left:0;top:82.5%;z-index:2;padding:0;width:52%}
.artist-portfolio .works-editorial .we-note h2{font:700 3.7cqw/1.4 WorksSongti,serif;margin:0 0 1.6cqw;color:var(--ink)}
.artist-portfolio .works-editorial .we-note p{font:400 2.45cqw/1.7 WorksSongti,serif;letter-spacing:.02em;color:var(--muted);margin:0;white-space:nowrap}
.artist-portfolio .works-editorial .we-explore{position:absolute;right:0;bottom:4.1%;width:38%;display:flex;align-items:center;justify-content:flex-end;gap:3cqw;padding:0;min-height:44px;border:0;background:transparent;color:var(--ink);font:400 2.5cqw/1.5 var(--serif);letter-spacing:.08em;border-radius:0;box-shadow:none;cursor:pointer}
.artist-portfolio .works-editorial .we-explore span{font:inherit;letter-spacing:inherit;color:inherit;white-space:nowrap}
.artist-portfolio .works-editorial .we-explore span:last-child{font-size:3.2cqw;color:var(--red)}
.artist-portfolio .works-editorial .we-explore i{display:block;flex:1;height:1px;background:var(--ink)}
.artist-portfolio .works-page .past-universes{scroll-margin-top:100px}
@media(min-width:1440px){.artist-portfolio .works-editorial .we-image{width:74%}}
@media(max-width:650px){
 .artist-portfolio .works-page .works-editorial{margin-top:20px;margin-bottom:24px}
 .artist-portfolio .works-editorial .we-kicker{font-size:9px}
 .artist-portfolio .works-editorial .we-archive{font-size:8px;letter-spacing:.1em}
 .artist-portfolio .works-editorial .we-note p{font-size:max(10px,2.45cqw)}
 .artist-portfolio .works-editorial .we-explore{font-size:max(10px,2.5cqw);gap:2cqw;bottom:2.8%}
 .artist-portfolio .works-editorial .we-album p{letter-spacing:.13em}
}
@media(prefers-reduced-motion:reduce){.artist-portfolio .works-editorial .we-image img{transition:none}}

/* Match the reference masthead only while viewing Works; other pages retain their typography. */
body.artist-portfolio:has(.works-page:not([hidden]))>header .brand{font-family:WorksBodoni,serif;font-weight:400;letter-spacing:.16em}
body.artist-portfolio:has(.works-page:not([hidden]))>header .brand span{font-family:WorksSongti,serif;font-weight:400}
body.artist-portfolio:has(.works-page:not([hidden]))>header .social-menu summary span{font-family:WorksBodoni,serif;letter-spacing:.13em}

/* Tight glyph bounds match the reference lettering proportions at every viewport size. */
.artist-portfolio .works-editorial .we-chinese svg,.artist-portfolio .works-editorial .we-album h2 svg{display:block;width:100%;height:100%;fill:currentColor;overflow:visible}
.artist-portfolio .works-editorial .we-album h2 svg{filter:drop-shadow(0 0 .12em var(--paper)) drop-shadow(0 0 .28em var(--paper))}
