/* Character-led portrait / a continuous, responsive exhibition sequence. */
.identity-sequence { height: 235svh; --face-alpha: 1; --profile-alpha: 0; }
.identity-sticky { height: calc(100svh - 70px); min-height: 610px; }
.identity-grid { background: #eceae3; }
.identity-sequence::after, .identity-grid::before { display: none; }
.poster-edition { position: absolute; z-index: 8; inset: 0 0 auto; height: 38px; display: flex; justify-content: space-between; align-items: center; padding: 0 24px; border-bottom: 1px solid #11110f; background: #eceae3; font: 700 9px/1 Arial,sans-serif; letter-spacing: .12em; }
.identity-copy { top: 38px; height: calc(100% - 96px); padding: 26px clamp(26px,4vw,62px); }
.identity-copy-face { justify-content: flex-start; opacity: var(--face-alpha); transform: translateY(calc(var(--identity-p) * -22px)); }
.identity-copy-profile { opacity: var(--profile-alpha); transform: translateY(calc((1 - var(--identity-p)) * 22px)); }
.identity-copy .hero-kicker { margin: 0 0 22px; font-size: 9px; letter-spacing: .12em; }
.identity-copy h1 { gap: 14px; }
.identity-copy h1 .name-cn { font-size: clamp(22px,2.6vw,42px); color: #11110f; letter-spacing: -.06em; }
.identity-copy h1 .name-en { color: var(--red); font: 900 clamp(68px,9.7vw,155px)/.76 Arial,sans-serif; letter-spacing: -.085em; transform: scaleX(.93); transform-origin: left; }
.identity-tags { gap: 0; margin-top: 22px; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); padding: 10px 0; }
.identity-tags span { padding: 0 10px 0 0; border: 0; font-size: 8px; letter-spacing: .055em; }
.identity-tags span + span::before { content: '/'; color: var(--red); margin-right: 10px; }
.identity-caption { margin-top: 12px; font-size: 12px; }
.poster-statement { margin-top: auto; padding-top: 18px; font: 700 clamp(18px,2vw,28px)/1.3 Arial,"PingFang SC",sans-serif; letter-spacing: -.04em; }
.poster-notation { margin: 18px 0 0; color: #77736b; font: 9px/1.45 Arial,sans-serif; letter-spacing: .13em; }
.identity-portrait { inset: 38px 0 58px 50%; background: #d5d3ca; border-left: 1px solid #11110f; }
.identity-portrait::before { background: linear-gradient(110deg,rgba(255,255,255,.18),transparent 70%); mix-blend-mode: screen; }
.identity-portrait::after { opacity: .35; }
.identity-portrait img { filter: grayscale(1) contrast(1.16); height: calc(182% - var(--identity-p) * 82%); bottom: calc(-78% + var(--identity-p) * 78%); transform: translateX(calc(-48% + (1 - var(--identity-p)) * 12%)); }
.identity-portrait figcaption { bottom: 14px; right: 14px; padding: 6px; background: #11110f; }
.identity-side-label { top: 54px; color: #11110f; }
.identity-progress { top: 38px; bottom: 58px; }
.identity-progress span { display: none; }
.poster-folio { position: absolute; z-index: 8; inset: auto 0 0; height: 58px; display: flex; align-items: center; gap: 20px; padding: 0 24px; border-top: 1px solid #11110f; background: #eceae3; font: 700 8px/1.4 Arial,sans-serif; letter-spacing: .12em; }
.poster-folio b { color: var(--red); font: 400 38px/1 Arial,sans-serif; }
.poster-stage-number { margin-left: auto; }
.identity-copy-profile h2 { font-size: clamp(28px,3.3vw,51px); line-height: 1.13; text-wrap: balance; }
.identity-copy-profile .hero-summary { font-size: clamp(14px,1.2vw,18px); line-height: 1.7; }
.identity-copy-profile .identity-detail { font-size: 13px; line-height: 1.7; }
.identity-copy-profile .masthead-links { margin-top: 22px; }
.work-index .section-intro { grid-template-columns: 1.5fr 1fr; padding: 36px var(--pad); gap: 7vw; }
.work-display { display: block; font: 900 clamp(56px,8.3vw,128px)/.78 Arial,sans-serif; letter-spacing: -.085em; }
.work-display i { font-style: normal; color: var(--red); }
.work-display sup { vertical-align: top; margin-left: 14px; font: 400 18px/1 Arial,sans-serif; letter-spacing: -.05em; }
.work-caption { display: block; margin-top: 22px; font: 400 15px/1.4 Arial,"PingFang SC",sans-serif; letter-spacing: 0; }
.showcase { height: 420svh; }
.showcase-sticky { display: grid; grid-template-rows: 58px minmax(0,1fr) 98px 48px; height: calc(100svh - 70px); min-height: 530px; }
.showcase-toolbar { min-height: 58px; }
.showcase-toolbar > div { height: 58px; }
.showcase-stage { height: auto; min-height: 0; background: #171715; perspective: 1600px; }
.showcase-stage::before { top: 21%; background: #44433d; }
.showcase-stage::after { bottom: 9%; background: #44433d; }
.showcase-word { top: 12%; font-size: clamp(68px,11vw,160px); -webkit-text-stroke: 0; color: #e7e4dc; letter-spacing: -.07em; opacity: .85; }
.showcase-signal { top: auto; bottom: 3%; }
.showcase-orbit { perspective: 1600px; }
.showcase-card { top: 60%; width: min(50vw,640px); height: 68%; padding: 16px; transform: translate(-50%,-50%) translateX(calc(var(--offset) * 86%)) translateZ(calc(var(--distance) * -100px)) rotateY(calc(var(--offset) * -16deg)); opacity: clamp(0,calc(1 - var(--distance) * .4),1); border: 1px solid #626057; box-shadow: 0 25px 50px #0005; filter: grayscale(1) brightness(.55); transition: transform .85s cubic-bezier(.18,.8,.2,1),opacity .65s,filter .65s; }
.showcase-card img { object-fit: contain; background: #151513; padding-bottom: 36px; }
.showcase-card::before { display: none; }
.showcase-card::after { background: linear-gradient(transparent 75%,#11110f 94%); }
.showcase-card.is-active { transform: translate(-50%,-50%); filter: none; box-shadow: 0 20px 70px #0007; }
.showcase-card.is-active::after { background: linear-gradient(transparent 75%,#11110f 94%); }
.showcase-card strong { font-size: 22px; }
.showcase-card.is-active span::before { content: ''; }
.showcase-rail { bottom: 0; left: 0; right: 0; height: 2px; }
.showcase-detail { min-height: 98px; grid-template-columns: 115px 1fr 1fr auto; }
.showcase-detail > * { min-height: 98px; padding: 0 20px; }
.showcase-detail h3 { font-size: clamp(21px,2.7vw,40px); }
.cabinet-index { display: flex; overflow-x: auto; scrollbar-width: none; border-top: 1px solid #494841; }
.cabinet-index button { flex: 1; min-width: max-content; padding: 0 14px; background: #11110f; color: #99978e; border: 0; border-right: 1px solid #494841; cursor: pointer; font: 700 9px/1 Arial,sans-serif; }
.cabinet-index button[aria-current='true'] { background: #eceae3; color: #11110f; }
.cabinet-index button:hover { color: var(--red); }
.cabinet-index button:focus-visible { outline: 2px solid var(--red); outline-offset: -3px; }
.fx-off .identity-copy-face { display: none; }
.fx-off .identity-copy-profile { opacity: 1; }
@media (max-height: 760px) and (min-width: 821px) {
  .identity-copy { padding-top: 20px; padding-bottom: 20px; }
  .identity-copy h1 .name-en { font-size: min(9vw,100px); }
  .identity-copy .hero-kicker { margin-bottom: 15px; }
  .poster-notation { display: none; }
  .identity-copy-profile h2 { font-size: 32px; }
  .identity-copy-profile .hero-summary { margin-top: 16px; font-size: 14px; }
}
@media (max-width: 820px) {
  .identity-sticky { top: 60px; height: calc(100svh - 60px); min-height: 650px; }
  .identity-grid { display: block; }
  .identity-copy { top: 38px; width: 50%; height: calc(100% - 96px); padding: 28px 20px; }
  .identity-copy h1 { display: block; }
  .identity-copy h1 .name-cn { display: block; font-size: 28px; margin-bottom: 16px; }
  .identity-copy h1 .name-en { font-size: 8.7vw; }
  .identity-copy .hero-kicker { font-size: 8px; line-height: 1.5; }
  .identity-tags { display: grid; gap: 8px; }
  .identity-tags span + span::before { content: none; }
  .identity-portrait { inset: 38px 0 58px 50%; }
  .identity-portrait img { height: calc(160% - var(--identity-p) * 60%); bottom: calc(-55% + var(--identity-p) * 55%); }
  .poster-notation { font-size: 7px; letter-spacing: 0; }
  .identity-detail { display: block; }
  .identity-copy-profile h2 { font-size: 26px; }
  .identity-copy-profile .hero-summary { font-size: 13px; line-height: 1.6; }
  .identity-copy-profile .identity-detail { font-size: 12px; }
  .showcase-sticky { top: 60px; height: calc(100svh - 60px); }
  .showcase-detail { grid-template-columns: 85px 1fr auto; }
  .showcase-detail p { display: none; }
  .showcase-card { width: 64vw; }
}
@media (max-width: 560px) {
  .identity-sequence { height: 235svh; }
  .identity-sticky { min-height: 620px; }
  .poster-edition { padding: 0 12px; font-size: 7px; height: 32px; }
  .poster-edition span:nth-child(2) { display: none; }
  .identity-copy-face { top: 32px; height: calc(100% - 80px); padding: 25px 14px; }
  .identity-copy h1 .name-cn { font-size: 23px; }
  .identity-copy h1 .name-en { font-size: 9vw; line-height: .88; }
  .identity-tags { margin-top: 20px; }
  .identity-tags span { font-size: 7px; padding: 0; }
  .identity-caption { font-size: 11px; }
  .poster-statement { font-size: 17px; }
  .poster-notation { display: none; }
  .identity-portrait { top: 32px; bottom: 48px; left: calc(50% - var(--portrait-expand,0) * 50%); height: calc((100% - 80px) * (1 - var(--portrait-expand,0) * .55)); }
  .identity-portrait img { height: calc(135% - var(--identity-p) * 35%); bottom: calc(-33% + var(--identity-p) * 33%); }
  .identity-copy-profile { top: calc(32px + (100% - 80px) * .45); width: 100%; height: calc((100% - 80px) * .55); padding: 16px 18px; border: 0; }
  .identity-copy-profile .hero-kicker { margin-bottom: 9px; }
  .identity-copy-profile h2 { font-size: 24px; }
  .identity-copy-profile .hero-summary { display: block; margin-top: 10px; font-size: 12px; line-height: 1.55; overflow: visible; }
  .identity-copy-profile .identity-detail { display: none; }
  .identity-copy-profile .masthead-links { margin-top: 12px; }
  .identity-copy-profile .button { min-height: 36px; font-size: 10px; }
  .identity-side-label { display: none; }
  .identity-progress { display: none; }
  .poster-folio { height: 48px; padding: 0 12px; gap: 10px; font-size: 6px; }
  .poster-folio b { font-size: 26px; }
  .work-index .section-intro { grid-template-columns: 1fr; gap: 18px; padding: 28px 20px; }
  .work-display { font-size: 21vw; }
  .work-index .section-intro > p { font-size: 12px; }
  .showcase { height: 350svh; }
  .showcase-sticky { grid-template-rows: 54px minmax(0,1fr) 106px 45px; min-height: 500px; }
  .showcase-toolbar, .showcase-toolbar > div { min-height: 54px; height: 54px; }
  .showcase-word { font-size: 15vw; }
  .showcase-card { width: 78vw; height: 68%; padding: 10px; }
  .showcase-card strong { font-size: 18px; }
  .showcase-detail { grid-template-columns: 65px 1fr; grid-template-rows: 58px 48px; min-height: 106px; }
  .showcase-detail > * { min-height: 58px; padding: 0 12px; }
  .showcase-detail a { grid-column: 1 / 3; min-height: 48px; }
  .showcase-detail h3 { font-size: 25px; }
  .showcase-detail-no { font-size: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .identity-sequence { height: auto; --identity-p: 1 !important; }
  .identity-sticky { position: relative; top: 0; }
  .identity-copy-profile { opacity: 1; transform: none; }
  .showcase { height: auto; }
  .showcase-sticky { position: relative; top: 0; }
}

/* V12 — CCI editorial poster, focused watch prototype and responsive refinement. */
.identity-grid { background: #e9e6de; }
.identity-grid::before { display: block; inset: 38px 50% 58px 0; opacity: .34; background-image: radial-gradient(#11110f 0.6px,transparent .7px); background-size: 8px 8px; mask-image: linear-gradient(135deg,transparent 0 52%,#000 53% 100%); transform: none; }
.poster-spine { position: absolute; z-index: 10; left: 0; top: 38px; bottom: 58px; width: 42px; display: flex; flex-direction: column; align-items: center; justify-content: space-between; padding: 15px 0; background: var(--red); color: #fff; font: 700 7px/1 Arial,sans-serif; letter-spacing: .14em; writing-mode: vertical-rl; opacity: var(--face-alpha); }
.poster-spine b { color: #11110f; font: 900 25px/1 Arial,sans-serif; writing-mode: horizontal-tb; transform: rotate(-90deg); }
.identity-copy { padding-left: clamp(66px,6vw,94px); }
.identity-copy-face { overflow: hidden; }
.identity-copy-face::before { content: 'DESIGN / TECHNOLOGY / HUMAN'; position: absolute; left: clamp(66px,6vw,94px); right: clamp(24px,4vw,62px); top: 54%; height: 1px; background: #11110f; color: #77736b; padding-top: 7px; font: 700 7px/1 Arial,sans-serif; letter-spacing: .16em; }
.identity-copy h1 .name-en { min-font-size: 82px; font-size: clamp(82px,10.6vw,174px); line-height: .72; letter-spacing: -.1em; }
.identity-copy h1 .name-cn { font-size: clamp(19px,2vw,32px); letter-spacing: .03em; }
.identity-copy .hero-kicker { max-width: 320px; margin-bottom: 17px; color: #11110f; line-height: 1.4; }
.identity-tags { position: relative; z-index: 2; margin-top: 18px; }
.identity-caption { color: #11110f; font-weight: 700; }
.poster-statement { position: relative; z-index: 2; max-width: 390px; margin-top: auto; padding: 18px 18px 17px; background: #11110f; color: #f2efe7; font-size: clamp(19px,2.1vw,31px); }
.poster-statement::before { content: '“'; position: absolute; right: 8px; top: -11px; color: var(--red); font: 900 54px/1 Arial,sans-serif; }
.poster-coordinate { display: flex; gap: 9px; align-items: center; margin-top: 12px; color: #6f6c65; font: 700 7px/1 Arial,sans-serif; letter-spacing: .12em; }
.poster-coordinate i { color: var(--red); font-style: normal; }
.identity-portrait { background: #bdbab2; }
.identity-portrait::before { background: linear-gradient(90deg,rgba(227,58,47,.18),transparent 26%),linear-gradient(140deg,transparent 0 58%,rgba(17,17,15,.16) 59% 100%); mix-blend-mode: multiply; }
.identity-portrait::after { opacity: .46; }
.identity-portrait img { filter: grayscale(1) contrast(1.24) brightness(1.03); }
.identity-portrait figcaption { right: 0; bottom: 0; min-height: 38px; align-items: center; padding: 0 14px; background: var(--red); }
.identity-side-label { right: 11px; top: 53px; color: #11110f; mix-blend-mode: multiply; }
.identity-copy-profile { padding-left: clamp(38px,4.5vw,70px); background: linear-gradient(90deg,#e9e6de 0 94%,var(--red) 94% 100%); }
.identity-copy-profile h2 { max-width: 590px; }
.identity-copy-profile .hero-summary { max-width: 560px; }
@media (max-width: 820px) {
  .identity-copy { padding-left: 54px; }
  .poster-spine { width: 34px; }
  .identity-copy h1 .name-en { font-size: clamp(60px,11vw,92px); }
  .identity-copy-profile { padding-left: 28px; }
  .kairos-wearable { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  :root { --page: 100%; --pad: 18px; }
  body { overflow-x: hidden; }
  .site-header { grid-template-columns: 64px 1fr 44px 44px; width: 100%; }
  .wordmark img { width: 42px; }
  .site-header nav a { padding: 0 7px; font-size: 8px; }
  .fx-toggle,.lang-toggle { font-size: 8px; }
  .masthead-meta { grid-template-columns: 1fr; }
  .masthead-meta > span:first-child,.masthead-meta > span:last-child { display: none; }
  .masthead-meta > span + span { border-left: 0; }
  .poster-edition { padding-left: 31px; }
  .poster-spine { top: 32px; bottom: 48px; width: 22px; padding: 10px 0; font-size: 5px; }
  .poster-spine b { font-size: 18px; }
  .identity-grid::before { inset: 32px 50% 48px 0; }
  .identity-copy-face { width: 50%; padding: 22px 10px 18px 32px; }
  .identity-copy-face::before { left: 32px; right: 10px; top: 49%; font-size: 5px; letter-spacing: .04em; }
  .identity-copy .hero-kicker { margin-bottom: 12px; font-size: 6px; }
  .identity-copy h1 .name-cn { margin-bottom: 10px; font-size: 17px; }
  .identity-copy h1 .name-en { font-size: clamp(43px,12vw,58px); line-height: .75; }
  .identity-tags { display: flex; flex-direction: column; gap: 5px; margin-top: 14px; padding: 8px 0; }
  .identity-tags span { line-height: 1.25; }
  .identity-caption { margin-top: 8px; font-size: 9px; }
  .poster-statement { padding: 10px; font-size: 13px; line-height: 1.35; }
  .poster-statement::before { display: none; }
  .poster-coordinate { gap: 4px; margin-top: 8px; font-size: 5px; letter-spacing: 0; }
  .identity-portrait figcaption { display: flex; min-height: 28px; padding: 0 8px; font-size: 6px; }
  .identity-copy-profile { top: calc(32px + (100% - 80px) * .45); padding: 15px 18px; background: #e9e6de; }
  .identity-copy-profile h2 { font-size: clamp(22px,6.3vw,28px); line-height: 1.08; }
  .identity-copy-profile .hero-summary { font-size: 11px; line-height: 1.5; }
  .poster-folio span:nth-child(2) { max-width: 150px; }
  .showcase-toolbar > p { display: none; }
  .showcase-toolbar > span { padding-left: 12px; font-size: 7px; }
  .showcase-toolbar button { width: 42px; }
  .showcase-card { width: 84vw; height: 62%; }
  .cabinet-index button { padding: 0 11px; font-size: 8px; }
  .case-header { grid-template-columns: 44px 1fr; }
  .case-number { padding-top: 24px; font-size: 8px; }
  .case-header > div:nth-child(2) { padding: 22px 14px; }
  .case-header h2 { font-size: 36px; }
  .case-links { grid-column: 1 / 3; min-width: 0; flex-direction: row; overflow-x: auto; border-top: 1px solid currentColor; border-left: 0; }
  .case-links a { min-width: max-content; min-height: 44px; border-right: 1px solid #5e5d56; border-bottom: 0; font-size: 8px; }
  .kairos-hero { grid-template-columns: 1fr; }
  .kairos-hero video { min-height: 0; aspect-ratio: 16/10; border-right: 0; border-bottom: 1px solid #5e5d56; }
  .kairos-thesis { padding: 26px 18px; }
  .kairos-thesis p { margin-top: 16px; font-size: 16px; }
  .kairos-system { grid-template-columns: 1fr 1fr; }
  .kairos-system article { min-height: 170px; padding: 20px; }
  .kairos-system article:nth-child(3) { border-left: 0; border-top: 1px solid #5e5d56; }
  .kairos-system article:nth-child(4) { border-top: 1px solid #5e5d56; }
  .kairos-system b { font-size: 34px; }
  .kairos-system h3 { margin-top: 18px; }
  .kairos-gallery-latest { grid-template-columns: 1fr; }
  .kairos-gallery-latest button,.kairos-gallery-latest button:nth-child(1),.kairos-gallery-latest button:nth-child(2) { grid-column: auto; border-left: 0; border-top: 1px solid #5e5d56; }
  .iteration-block { grid-template-columns: 1fr; }
  .iteration-intro { padding: 30px 18px; border-right: 0; border-bottom: 1px solid #5e5d56; }
  .iteration-list li { padding: 10px 16px; }
}

/* V13 — magazine-cover opening, torn-paper transition and mobile polish. */
.identity-sequence { height: 245svh; }
.identity-grid {
  isolation: isolate;
  background: #e9e6de;
}
.identity-grid::before {
  display: block;
  z-index: 0;
  inset: 38px 0 58px;
  opacity: calc(var(--face-alpha) * .28);
  background:
    radial-gradient(#11110f .6px,transparent .72px) 0 0/8px 8px,
    linear-gradient(115deg,transparent 0 61%,rgba(227,58,47,.12) 61% 100%);
  mask-image: linear-gradient(90deg,#000,transparent 74%);
}
.poster-torn-layer {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 47%;
  bottom: 58px;
  opacity: var(--face-alpha);
  background: linear-gradient(155deg,#242321 0%,#11110f 48%,#070707 100%);
  clip-path: polygon(0 7%,3% 4%,7% 8%,11% 3%,16% 6%,21% 1%,27% 7%,33% 2%,39% 6%,45% 1%,52% 7%,58% 3%,64% 8%,71% 2%,78% 6%,84% 1%,91% 7%,96% 3%,100% 6%,100% 100%,0 100%);
  transform: translateY(calc(var(--identity-p) * 10%));
  transition: opacity .2s linear;
}
.poster-edition { font-family: var(--display); }
.poster-spine { font-family: var(--display); }
.identity-copy-face {
  z-index: 7;
  top: 38px;
  width: 100%;
  height: calc(100% - 96px);
  padding: clamp(28px,4.5vh,58px) clamp(28px,4vw,62px) 34px clamp(58px,6.2vw,100px);
  justify-content: flex-start;
  overflow: visible;
  color: #11110f;
  opacity: var(--face-alpha);
  transform: translate3d(0,calc(var(--identity-p) * -4vh),0) scale(calc(1 - var(--identity-p) * .018));
  transform-origin: 25% 18%;
}
.identity-copy-face::before {
  content: 'ISSUE 01 / INTERDISCIPLINARY PRACTICE';
  left: auto;
  right: clamp(28px,4vw,62px);
  top: 23px;
  width: 220px;
  height: auto;
  padding: 0;
  background: none;
  color: #11110f;
  font: 700 8px/1 var(--display);
  letter-spacing: .15em;
  text-align: right;
}
.identity-copy-face .hero-kicker {
  width: max-content;
  max-width: 100%;
  margin: 0 0 8px;
  padding: 7px 10px 6px;
  background: #11110f;
  color: #f3f0e7;
  font-size: 8px;
  letter-spacing: .14em;
}
.identity-copy-face h1 {
  display: block;
  width: min(74vw,1050px);
  margin: 0;
}
.identity-copy-face h1 .name-en {
  display: block;
  color: var(--red);
  font-family: "Bodoni 72 Smallcaps","Bodoni 72",Didot,"Times New Roman",serif;
  font-size: clamp(92px,13.2vw,216px);
  font-weight: 700;
  line-height: .65;
  letter-spacing: -.075em;
  transform: scaleX(.9);
  transform-origin: left top;
}
.identity-copy-face h1 .name-cn {
  position: absolute;
  left: clamp(58px,6.2vw,100px);
  top: 51%;
  color: #f2efe7;
  font-size: clamp(16px,1.4vw,23px);
  letter-spacing: .18em;
}
.identity-copy-face .identity-tags {
  position: absolute;
  z-index: 3;
  left: clamp(58px,6.2vw,100px);
  top: 57%;
  width: min(34vw,460px);
  margin: 0;
  padding: 12px 0;
  border-color: rgba(242,239,231,.7);
  color: #f2efe7;
}
.identity-copy-face .identity-caption {
  position: absolute;
  left: clamp(58px,6.2vw,100px);
  top: 66%;
  margin: 0;
  color: #f2efe7;
  font-size: 13px;
  letter-spacing: .08em;
}
.identity-copy-face .poster-statement {
  position: absolute;
  left: clamp(58px,6.2vw,100px);
  bottom: 46px;
  width: min(32vw,430px);
  margin: 0;
  padding: 0 0 0 16px;
  border-left: 5px solid var(--red);
  background: transparent;
  color: #f2efe7;
  font: 700 clamp(20px,2.25vw,35px)/1.24 var(--body-cn);
}
.identity-copy-face .poster-statement::before { display: none; }
.identity-copy-face .poster-coordinate {
  position: absolute;
  left: clamp(58px,6.2vw,100px);
  bottom: 18px;
  margin: 0;
  color: #8f8c84;
}
.identity-portrait {
  z-index: 3;
  left: calc(var(--identity-p) * 50%);
  top: 38px;
  bottom: 58px;
  border-left-color: rgba(17,17,15,calc(var(--identity-p) * 1));
  background: #b9b6ae;
  transition: none;
}
.identity-portrait::before {
  z-index: 0;
  inset: 0;
  opacity: calc(.98 - var(--identity-p) * .7);
  background: linear-gradient(155deg,rgba(36,35,33,.62),rgba(8,8,8,.92));
  clip-path: polygon(0 50.6%,4% 49.3%,9% 50.9%,14% 49%,20% 50.2%,26% 48.8%,32% 50.8%,39% 49.2%,46% 50.4%,53% 49%,60% 50.7%,68% 49.5%,75% 51%,82% 49.1%,90% 50.5%,96% 49%,100% 50.2%,100% 100%,0 100%);
  mix-blend-mode: multiply;
}
.identity-portrait::after { opacity: .42; }
.identity-portrait img {
  left: calc(63% - var(--identity-p) * 13%);
  bottom: calc(-4% + var(--identity-p) * 4%);
  height: calc(116% - var(--identity-p) * 16%);
  filter: grayscale(1) contrast(1.38) brightness(.98) drop-shadow(0 30px 42px rgba(0,0,0,.44));
  transform: translate3d(calc(-50% + var(--pointer-x,0) * 7px),calc(var(--pointer-y,0) * 4px),0) scale(calc(1 + (1 - var(--identity-p)) * .035));
  transform-origin: 54% 20%;
}
.identity-portrait figcaption { opacity: var(--profile-alpha); }
.poster-qr {
  position: absolute;
  z-index: 9;
  right: clamp(22px,3vw,46px);
  bottom: 78px;
  width: clamp(90px,8.2vw,126px);
  margin: 0;
  padding: 5px;
  border: 1px solid rgba(242,239,231,.65);
  background: #f3f0e7;
  opacity: var(--face-alpha);
  transform: translateY(calc(var(--identity-p) * 22px)) rotate(1deg);
  box-shadow: 0 14px 35px rgba(0,0,0,.25);
}
.poster-qr div { aspect-ratio: .78; overflow: hidden; background: #fff; }
.poster-qr img { display: block; width: 100%; height: 100%; object-fit: cover; }
.poster-qr figcaption { padding: 5px 2px 1px; color: #11110f; font: 700 7px/1 var(--display); letter-spacing: .12em; text-align: center; }
.identity-copy-profile { z-index: 6; }
.poster-folio { font-family: var(--display); }
.kairos-status { display: grid; gap: 9px; margin-top: 24px; padding: 15px 0; border-top: 1px solid #4a4945; border-bottom: 1px solid #4a4945; color: #d0cec6 !important; }
.kairos-status b { color: var(--red); font: 700 9px/1 var(--display); letter-spacing: .12em; }
.work-index .section-intro { overflow: hidden; }
.work-index .section-intro > * { min-width: 0; max-width: 100%; }
.fx-transition {
  position: fixed;
  z-index: 1000;
  inset: 0;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: #e33a2f;
  color: #f4f2ed;
  pointer-events: none;
  transform: translate3d(0,102%,0);
}
.fx-transition::before,.fx-transition::after { content: ''; position: absolute; background: #11110f; }
.fx-transition::before { left: 0; right: 0; top: 50%; height: 1px; }
.fx-transition::after { top: 0; bottom: 0; left: 50%; width: 1px; }
.fx-transition strong { font: 700 clamp(68px,15vw,230px)/.75 "Bodoni 72",Didot,serif; letter-spacing: -.07em; }
.fx-transition span { position: absolute; left: 28px; top: 24px; font: 700 9px/1 var(--display); letter-spacing: .14em; }
.fx-transition.is-playing { animation: fx-wipe 1.05s cubic-bezier(.76,0,.24,1) both; }
@keyframes fx-wipe { 0% { transform: translate3d(0,102%,0); } 40%,60% { transform: translate3d(0,0,0); } 100% { transform: translate3d(0,-102%,0); } }
body:not(.fx-off) .showcase-card.is-active,body:not(.fx-off) .kairos-gallery button:hover img,body:not(.fx-off) .case-split button:hover img { will-change: transform,filter; }

@media (max-width: 820px) {
  .identity-sequence { height: 235svh; }
  .identity-grid { display: block; background: #e9e6de; }
  .identity-grid::before { inset: 38px 0 58px; mask-image: linear-gradient(90deg,#000,transparent 85%); }
  .poster-torn-layer { top: 52%; }
  .identity-copy-face { top: 38px; width: 100%; height: calc(100% - 96px); padding: 28px 24px 32px 54px; }
  .identity-copy-face::before { right: 22px; top: 18px; width: 170px; font-size: 6px; }
  .identity-copy-face .hero-kicker { font-size: 7px; }
  .identity-copy-face h1 { width: 82vw; }
  .identity-copy-face h1 .name-en { font-size: clamp(76px,18vw,150px); }
  .identity-copy-face h1 .name-cn,.identity-copy-face .identity-tags,.identity-copy-face .identity-caption,.identity-copy-face .poster-statement,.identity-copy-face .poster-coordinate { left: 54px; }
  .identity-copy-face h1 .name-cn { top: 56%; }
  .identity-copy-face .identity-tags { top: 61%; width: 43vw; }
  .identity-copy-face .identity-caption { top: 70%; }
  .identity-copy-face .poster-statement { bottom: 50px; width: 44vw; }
  .identity-portrait { inset: 38px 0 58px calc(var(--identity-p) * 0%); height: auto; }
  .identity-portrait img { left: calc(68% - var(--identity-p) * 18%); bottom: calc(-3% + var(--identity-p) * 3%); height: calc(110% - var(--identity-p) * 10%); }
  .identity-copy-profile { top: 47%; width: 100%; height: 53%; padding: 28px 24px 34px; }
  .poster-qr { right: 18px; bottom: 70px; width: 90px; }
}

@media (max-width: 560px) {
  .site-header { grid-template-columns: 58px minmax(0,1fr) 50px 44px; }
  .site-header nav { min-width: 0; overflow: hidden; }
  .site-header nav a { min-width: 0; flex: 1; padding: 0 5px; font-size: 7px; white-space: nowrap; }
  .site-header nav a:nth-child(2),.site-header nav a:nth-child(4) { display: none; }
  .wordmark img { width: 38px; }
  .fx-toggle,.lang-toggle { min-width: 0; padding: 0 3px; font-size: 7px; letter-spacing: .02em; }
  .poster-edition { padding-left: 34px; }
  .poster-edition span:last-child { margin-left: auto; }
  .poster-torn-layer { top: 51%; bottom: 48px; clip-path: polygon(0 7%,8% 3%,16% 8%,25% 2%,34% 7%,43% 1%,52% 8%,62% 3%,72% 7%,82% 1%,91% 7%,100% 3%,100% 100%,0 100%); }
  .identity-copy-face { top: 32px; height: calc(100% - 80px); padding: 20px 14px 22px 32px; }
  .identity-copy-face::before { right: 12px; top: 13px; width: 145px; font-size: 5px; }
  .identity-copy-face .hero-kicker { font-size: 5.5px; padding: 6px 7px 5px; }
  .identity-copy-face h1 { width: 92vw; }
  .identity-copy-face h1 .name-en { font-size: clamp(67px,21vw,92px); line-height: .64; }
  .identity-copy-face h1 .name-cn { left: 32px; top: 56%; font-size: 13px; }
  .identity-copy-face .identity-tags { left: 32px; top: 61%; width: 48vw; gap: 5px; padding: 8px 0; }
  .identity-copy-face .identity-tags span { font-size: 6px; line-height: 1.15; }
  .identity-copy-face .identity-caption { left: 32px; top: 70%; font-size: 9px; }
  .identity-copy-face .poster-statement { left: 32px; bottom: 46px; width: 52vw; padding-left: 10px; border-width: 3px; font-size: 16px; }
  .identity-copy-face .poster-coordinate { display: none; }
  .identity-portrait { inset: 32px 0 48px 0; }
  .identity-portrait img { left: calc(73% - var(--identity-p) * 23%); bottom: 0; height: calc(102% - var(--identity-p) * 2%); }
  .identity-copy-profile { top: calc(32px + (100% - 80px) * .45); height: calc((100% - 80px) * .55); }
  .poster-qr { right: 12px; bottom: 58px; width: 72px; padding: 3px; }
  .poster-qr figcaption { font-size: 5px; }
  .poster-folio { z-index: 11; }
  .work-display { max-width: 100%; font-size: min(19vw,78px); overflow-wrap: anywhere; }
  .work-display sup { margin-left: 6px; font-size: 12px; }
  .showcase-sticky { grid-template-rows: 54px minmax(0,1fr) 112px 45px; }
  .showcase-card { width: min(76vw,294px); height: min(43vh,390px); }
  .wearable-copy { padding: 34px 18px; }
  .wearable-copy h3 { margin-top: 22px; font-size: 28px; }
  .wearable-slide iframe { height: 760px; }
}

@media (prefers-reduced-motion: reduce) {
  .poster-torn-layer,.poster-qr { display: none; }
  .fx-transition { display: none; }
}

/* V14 — archive-paper cover, true close-up-to-half-body transition. */
.site-header { grid-template-columns: 112px minmax(0,1fr) 72px; }
.identity-grid {
  background:
    radial-gradient(64% 88% at 78% 38%,#393733 0%,#1a1917 49%,#080808 100%);
}
.identity-grid::before {
  display: block;
  z-index: 1;
  inset: 38px 0 58px;
  opacity: calc(var(--face-alpha) * .18);
  background:
    linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size: 34px 34px;
  mask-image: none;
}
.poster-torn-layer {
  z-index: 2;
  top: 38px;
  bottom: auto;
  height: 54%;
  overflow: hidden;
  opacity: var(--face-alpha);
  background:
    radial-gradient(8% 13% at 84% 21%,rgba(148,105,50,.18),transparent 70%),
    radial-gradient(12% 18% at 12% 70%,rgba(140,99,45,.12),transparent 72%),
    radial-gradient(120% 130% at 50% 16%,transparent 58%,rgba(157,127,78,.23) 89%,rgba(112,84,44,.35) 100%),
    repeating-linear-gradient(0deg,rgba(104,83,47,.055) 0 1px,transparent 1px 25px),
    linear-gradient(165deg,#f1ead8 0%,#e7ddc5 55%,#d6c8a8 100%);
  clip-path: polygon(0 0,100% 0,100% 91%,97% 92.7%,94% 91.3%,91% 94.5%,87% 92.4%,83% 96.1%,79% 93.2%,75% 96.8%,71% 93.6%,67% 97.2%,63% 94.1%,58% 96.6%,54% 93.3%,50% 97.4%,46% 94.1%,42% 96.8%,38% 93.4%,34% 97%,30% 94%,26% 96.5%,22% 93.3%,18% 96.8%,14% 93.7%,10% 96.2%,6% 92.8%,3% 95%,0 92%);
  filter: drop-shadow(0 5px 2px rgba(5,4,2,.3)) drop-shadow(0 18px 20px rgba(0,0,0,.38));
  transform: translate3d(0,calc(var(--identity-p) * -4%),0) rotate(-.12deg);
}
.poster-torn-layer::before {
  content: '';
  position: absolute;
  inset: 0;
  opacity: .48;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.78' numOctaves='4' stitchTiles='stitch' seed='17'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.31'/%3E%3C/svg%3E");
}
.poster-torn-layer::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 2%;
  height: 15%;
  background: linear-gradient(180deg,transparent,rgba(104,75,37,.13));
  mix-blend-mode: multiply;
}
.identity-copy-face {
  top: 38px;
  height: calc(100% - 96px);
  padding: clamp(28px,4.2vh,48px) clamp(30px,4.4vw,68px) 36px clamp(62px,6.5vw,104px);
}
.identity-copy-face::before { top: 26px; }
.identity-copy-face .hero-kicker {
  margin-bottom: clamp(18px,2.5vh,28px);
  background: #11110f;
}
.identity-copy-face h1 { width: min(76vw,1080px); }
.identity-copy-face h1 .name-en {
  font-size: clamp(88px,12.4vw,202px);
  line-height: .72;
  letter-spacing: -.072em;
  text-shadow: 0 1px 0 rgba(255,255,255,.12);
}
.identity-copy-face h1 .name-cn { top: 49%; }
.identity-copy-face .identity-tags { top: 56%; }
.identity-copy-face .identity-caption { top: 66%; }
.identity-copy-face .poster-statement { bottom: 68px; }
.identity-copy-face .poster-coordinate { bottom: 38px; }
.identity-portrait {
  z-index: 4;
  left: calc(var(--identity-p) * 50%);
  background: rgb(185 182 174 / var(--identity-p));
}
.identity-portrait::before {
  opacity: calc(.95 - var(--identity-p) * .5);
  background:
    linear-gradient(90deg,rgba(227,58,47,.18),transparent 24%),
    radial-gradient(58% 68% at 61% 30%,rgba(255,248,229,.17),transparent 62%),
    linear-gradient(180deg,transparent 52%,rgba(0,0,0,.58) 100%);
  clip-path: none;
  mix-blend-mode: screen;
}
.identity-portrait img {
  left: calc(71% - var(--identity-p) * 21%);
  bottom: calc(-78% + var(--identity-p) * 78%);
  height: calc(190% - var(--identity-p) * 90%);
  filter: grayscale(1) contrast(1.44) brightness(.98) drop-shadow(0 32px 44px rgba(0,0,0,.48));
  transform: translate3d(calc(-50% + var(--pointer-x,0) * 6px),calc(var(--pointer-y,0) * 3px),0);
}
.identity-copy-profile {
  z-index: 6;
  background: linear-gradient(90deg,#ece7da 0 94%,var(--red) 94% 100%);
}
.poster-qr { bottom: 74px; }

@media (max-width: 820px) {
  .identity-copy-face { padding-left: 54px; }
  .identity-copy-face h1 .name-en { font-size: clamp(70px,17vw,138px); }
  .identity-portrait img {
    left: calc(74% - var(--identity-p) * 24%);
    bottom: calc(-74% + var(--identity-p) * 74%);
    height: calc(184% - var(--identity-p) * 84%);
  }
}

@media (max-width: 560px) {
  .site-header { grid-template-columns: 58px minmax(0,1fr) 48px; }
  .site-header nav a { padding: 0 6px; }
  .poster-torn-layer {
    top: 32px;
    height: 53%;
    clip-path: polygon(0 0,100% 0,100% 91%,96% 94%,92% 91.6%,87% 95.5%,82% 92.2%,77% 96.4%,72% 92.6%,67% 96.6%,62% 93.2%,57% 97%,52% 92.9%,47% 96.3%,42% 93%,37% 96.8%,32% 92.7%,27% 96.3%,22% 93%,17% 96.5%,12% 92.6%,7% 95.8%,3% 92.6%,0 94%);
  }
  .identity-copy-face { padding: 22px 14px 22px 32px; }
  .identity-copy-face::before { top: 14px; }
  .identity-copy-face .hero-kicker { margin-bottom: 16px; }
  .identity-copy-face h1 .name-en { font-size: clamp(65px,20.5vw,88px); line-height: .71; }
  .identity-copy-face h1 .name-cn { top: 54%; }
  .identity-copy-face .identity-tags { top: 60%; }
  .identity-copy-face .identity-caption { top: 70%; }
  .identity-copy-face .poster-statement { bottom: 48px; }
  .identity-portrait {
    top: 32px;
    right: 0;
    bottom: auto;
    left: 0;
    height: calc((100% - 80px) * (1 - var(--portrait-expand,0) * .55));
  }
  .identity-portrait img {
    left: calc(78% - var(--identity-p) * 28%);
    bottom: calc(-72% + var(--identity-p) * 72%);
    height: calc(178% - var(--identity-p) * 78%);
  }
  .identity-copy-profile {
    top: calc(32px + (100% - 80px) * .45);
    width: 100%;
    height: calc((100% - 80px) * .55);
    background: #ece7da;
  }
  .poster-qr { bottom: 58px; }
}

@media (prefers-reduced-motion: reduce) {
  .poster-torn-layer { display: none; }
}

/* V17 — direct KAIROS archive-paper mask and poster-accurate two-stage composition. */
.poster-torn-layer {
  left: -2.5%;
  right: -2.5%;
  top: 27px;
  height: 58%;
  clip-path: none;
  -webkit-mask: url('assets/kairos-torn-mask.png') center / 100% 100% no-repeat;
  mask: url('assets/kairos-torn-mask.png') center / 100% 100% no-repeat;
  filter:
    drop-shadow(2px 5px 5px rgba(6,4,2,.34))
    drop-shadow(1px 16px 22px rgba(0,0,0,.46))
    drop-shadow(0 28px 38px rgba(0,0,0,.3));
  transform: translate3d(0,calc(var(--identity-p) * -5%),0) scale(1.018) rotate(-.16deg);
  transform-origin: center;
}
.poster-torn-layer::before {
  opacity: .72;
  background-image:
    linear-gradient(180deg,rgba(255,255,255,.15),transparent 26%,rgba(109,81,44,.11)),
    url('assets/kairos-paper-crumple.png');
  background-position: center;
  background-size: cover;
  mix-blend-mode: multiply;
}
.identity-copy-face h1 .name-cn { top: 46%; }
.identity-copy-face h1 .name-en b { display: block; font: inherit; }
.identity-copy-face h1 .name-en b:first-child { color: #11110f; }
.identity-copy-face h1 .name-en b:last-child { color: var(--red); }
.identity-copy-face .identity-tags { top: 57%; }
.identity-copy-face .identity-caption { top: 67%; }

@media (max-width: 560px) {
  .poster-torn-layer {
    left: -5%;
    right: -5%;
    top: 22px;
    height: 57%;
    clip-path: none;
    transform: translate3d(0,calc(var(--identity-p) * -5%),0) scale(1.03) rotate(-.2deg);
  }
  .identity-copy-face h1 .name-cn { top: 53%; }
  .identity-copy-face .identity-tags { top: 61%; }
  .identity-copy-face .identity-caption { top: 71%; }
  .identity-portrait {
    top: 32px;
    right: 0;
    bottom: 48px;
    left: calc(var(--portrait-expand,0) * 50%);
    height: auto;
  }
  .identity-portrait img {
    left: calc(78% - var(--identity-p) * 28%);
    bottom: calc(-72% + var(--identity-p) * 72%);
    height: calc(178% - var(--identity-p) * 78%);
  }
  .identity-copy-profile {
    top: 32px;
    left: 0;
    width: 50%;
    height: calc(100% - 80px);
    padding: 22px 14px 18px;
    justify-content: center;
    border-right: 1px solid #11110f;
    background: #ece7da;
  }
  .identity-copy-profile .hero-kicker { margin-bottom: 13px; font-size: 7px; }
  .identity-copy-profile h2 { font-size: clamp(17px,5vw,21px); line-height: 1.12; }
  .identity-copy-profile .hero-summary { margin-top: 12px; font-size: 9px; line-height: 1.5; }
  .identity-copy-profile .identity-detail { display: none; }
  .identity-copy-profile .masthead-links { display: grid; margin-top: 14px; }
  .identity-copy-profile .button { min-height: 34px; padding: 0 8px; font-size: 7px; }
  .identity-copy-profile .button:not(.primary) { display: none; }
}



/* V19 — magazine-faithful cover and split profile. */
.poster-torn-layer {
  --paper-surface:
    linear-gradient(180deg,rgba(255,255,255,.12),transparent 28%,rgba(109,81,44,.09)),
    url('assets/kairos-paper-crumple.png'),
    radial-gradient(8% 13% at 84% 21%,rgba(148,105,50,.18),transparent 70%),
    radial-gradient(12% 18% at 12% 70%,rgba(140,99,45,.12),transparent 72%),
    repeating-linear-gradient(0deg,rgba(104,83,47,.055) 0 1px,transparent 1px 25px),
    linear-gradient(165deg,#f1ead8 0%,#e7ddc5 55%,#d6c8a8 100%);
  left: 0;
  right: 0;
  top: 38px;
  height: 52%;
  overflow: visible;
  clip-path: none;
  -webkit-mask: none;
  mask: none;
  filter: none;
  background-image: var(--paper-surface);
  background-position: center top,center top,center top,center top,center top,center top;
  background-size: 100% 100%,100vw calc(52vh + 44px),100% 100%,100% 100%,100% 100%,100% 100%;
  background-repeat: no-repeat;
  background-blend-mode: normal,multiply,normal,normal,multiply,normal;
  transform: translate3d(0,calc(var(--identity-p) * -4%),0);
}
.poster-torn-layer::before {
  display: none;
}
.poster-torn-layer::after {
  left: -10%;
  right: -10%;
  bottom: -44px;
  height: 72px;
  background-image: var(--paper-surface);
  background-position: center bottom,center bottom,center bottom,center bottom,center bottom,center bottom;
  background-size: 100% 100%,100vw calc(52vh + 44px),100% 100%,100% 100%,100% 100%,100% 100%;
  background-repeat: no-repeat;
  background-blend-mode: normal,multiply,normal,normal,multiply,normal;
  -webkit-mask: url('assets/kairos-torn-mask.png') center bottom / 120% 900% no-repeat;
  mask: url('assets/kairos-torn-mask.png') center bottom / 120% 900% no-repeat;
  filter:
    drop-shadow(0 5px 3px rgba(6,4,2,.34))
    drop-shadow(0 16px 20px rgba(0,0,0,.42));
  mix-blend-mode: normal;
}
.identity-copy-face { z-index: 3; }
.identity-copy-face .hero-kicker {
  position: absolute;
  left: clamp(64px,6.5vw,104px);
  top: 3.2%;
  margin: 0;
  padding: 0;
  background: transparent;
  color: #11110f;
}
.identity-copy-face h1 {
  position: absolute;
  z-index: 1;
  left: clamp(64px,6.5vw,104px);
  right: clamp(22px,2.5vw,40px);
  top: 6.2%;
  width: auto;
  margin: 0;
  cursor: pointer;
  outline: none;
}
.identity-copy-face h1:focus-visible { outline: 2px solid var(--red); outline-offset: 7px; }
.identity-copy-face h1 .name-en {
  display: flex;
  align-items: baseline;
  gap: .035em;
  width: 100%;
  font-size: clamp(76px,10.65vw,170px);
  line-height: .82;
  letter-spacing: -.075em;
  white-space: nowrap;
  transform: scaleX(.94);
}
.identity-copy-face h1 .name-en b {
  display: inline-block;
  transition: color .58s cubic-bezier(.22,.8,.2,1),text-shadow .58s cubic-bezier(.22,.8,.2,1);
}
.identity-copy-face h1 .name-en b:first-child { color: #11110f; }
.identity-copy-face h1 .name-en b:last-child { color: var(--red); }
.identity-sequence.name-scroll-shift .name-en b:first-child,
#hero-title.name-color-click .name-en b:first-child { color: var(--red); }
.identity-sequence.name-scroll-shift .name-en b:last-child,
#hero-title.name-color-click .name-en b:last-child { color: #11110f; }
.identity-sequence.name-scroll-shift #hero-title.name-color-click .name-en b:first-child { color: #11110f; }
.identity-sequence.name-scroll-shift #hero-title.name-color-click .name-en b:last-child { color: var(--red); }
.identity-copy-face h1 .name-cn {
  position: absolute;
  left: 0;
  top: 3.2em;
  color: #11110f;
  font-size: clamp(13px,1.1vw,18px);
  letter-spacing: .2em;
}
.poster-cover-note {
  position: absolute;
  z-index: 5;
  top: 28%;
  width: clamp(118px,11vw,168px);
  color: #11110f;
  font: 600 clamp(7px,.58vw,9px)/1.35 var(--display);
  letter-spacing: .08em;
}
.poster-cover-note b,.poster-cover-note span { display: block; }
.poster-cover-note b { margin-bottom: 6px; color: var(--red); font-size: 1.55em; line-height: 1.04; letter-spacing: -.015em; }
.poster-cover-note-left { left: clamp(64px,6.5vw,104px); }
.poster-cover-note-right { right: clamp(28px,3.3vw,52px); text-align: right; }
.identity-copy-face .identity-tags {
  left: clamp(64px,6.5vw,104px);
  top: 43%;
  width: clamp(150px,17vw,250px);
  border-color: rgba(17,17,15,.62);
  color: #11110f;
}
.identity-copy-face .identity-caption {
  left: clamp(64px,6.5vw,104px);
  top: 51.5%;
  color: #11110f;
}
.identity-copy-face .poster-statement {
  left: clamp(64px,6.5vw,104px);
  bottom: 63px;
  width: min(31vw,430px);
  color: #f4f2ed;
}
.identity-portrait {
  z-index: 4;
  background: rgb(246 244 238 / var(--identity-p));
}
.identity-portrait::before {
  opacity: calc(.86 - var(--identity-p) * .86);
  background:
    radial-gradient(54% 62% at 58% 39%,rgba(255,248,229,.13),transparent 68%),
    linear-gradient(180deg,transparent 49%,rgba(0,0,0,.52) 100%);
}
.identity-portrait img {
  left: calc(66% - var(--identity-p) * 16%);
  bottom: calc(-72% + var(--identity-p) * 72%);
  height: calc(162% - var(--identity-p) * 62%);
  filter: grayscale(1) contrast(1.48) brightness(.99) drop-shadow(0 28px 40px rgba(0,0,0,.38));
}
.identity-copy-profile {
  z-index: 6;
  color: #f4f2ed;
  background: #0b0b0b;
  border-right: 1px solid #f4f2ed;
}
.identity-copy-profile .hero-kicker { color: var(--red); }
.identity-copy-profile h2 { color: #f4f2ed; }
.identity-copy-profile .hero-summary { color: #d3d0c8; }
.identity-copy-profile .identity-detail { color: #898780; }
.identity-copy-profile .button { border-color: #f4f2ed; color: #f4f2ed; }
.identity-copy-profile .button.primary { border-color: var(--red); }
.identity-copy-profile .button:hover { background: #f4f2ed; color: #0b0b0b; }
.identity-portrait figcaption { color: #f4f2ed; }

@media (max-width: 820px) {
  .identity-copy-face h1 { left: 54px; right: 18px; top: 6%; }
  .identity-copy-face h1 .name-en { font-size: clamp(64px,12.4vw,104px); }
  .identity-copy-face .hero-kicker,.poster-cover-note-left,.identity-copy-face .identity-tags,.identity-copy-face .identity-caption,.identity-copy-face .poster-statement { left: 54px; }
  .poster-cover-note-right { right: 22px; }
  .poster-cover-note { top: 29%; }
  .identity-portrait img { left: calc(68% - var(--identity-p) * 18%); }
}

@media (max-width: 560px) {
  .poster-torn-layer {
    left: 0;
    right: 0;
    top: 32px;
    height: 51%;
    background-size: 100% 100%,100vw calc(51vh + 34px),100% 100%,100% 100%,100% 100%,100% 100%;
    transform: translate3d(0,calc(var(--identity-p) * -4%),0);
  }
  .poster-torn-layer::after {
    left: -18%;
    right: -18%;
    bottom: -34px;
    height: 56px;
    background-size: 100% 100%,100vw calc(51vh + 34px),100% 100%,100% 100%,100% 100%,100% 100%;
    -webkit-mask-size: 136% 820%;
    mask-size: 136% 820%;
  }
  .identity-copy-face { z-index: 3; }
  .identity-copy-face .hero-kicker { left: 32px; top: 3%; font-size: 5px; }
  .identity-copy-face h1 { left: 32px; right: 8px; top: 6.2%; }
  .identity-copy-face h1 .name-en { gap: .02em; font-size: clamp(46px,13.1vw,58px); line-height: .86; transform: none; }
  .identity-copy-face h1 .name-cn { top: 3.25em; font-size: 9px; }
  .poster-cover-note { top: 27%; width: 82px; font-size: 5px; }
  .poster-cover-note b { margin-bottom: 3px; font-size: 1.45em; }
  .poster-cover-note-left { left: 32px; }
  .poster-cover-note-right { right: 10px; }
  .identity-copy-face .identity-tags { left: 32px; top: 41%; width: 112px; }
  .identity-copy-face .identity-tags span { font-size: 5px; }
  .identity-copy-face .identity-caption { left: 32px; top: 51%; font-size: 8px; }
  .identity-copy-face .poster-statement { left: 32px; bottom: 42px; width: 54vw; font-size: 15px; }
  .identity-portrait { top: 32px; right: 0; bottom: 48px; left: calc(var(--portrait-expand,0) * 50%); height: auto; }
  .identity-portrait img {
    left: calc(68% - var(--identity-p) * 18%);
    bottom: calc(-62% + var(--identity-p) * 62%);
    height: calc(152% - var(--identity-p) * 52%);
  }
  .identity-copy-profile {
    top: 32px;
    left: 0;
    width: 50%;
    height: calc(100% - 80px);
    padding: 20px 13px 16px;
    justify-content: center;
    color: #f4f2ed;
    background: #0b0b0b;
    border-right: 1px solid #f4f2ed;
  }
  .identity-copy-profile .hero-kicker { margin-bottom: 12px; font-size: 6px; }
  .identity-copy-profile h2 { font-size: clamp(16px,4.7vw,20px); line-height: 1.12; }
  .identity-copy-profile .hero-summary { margin-top: 12px; color: #cfccc4; font-size: 8.5px; line-height: 1.48; }
  .identity-copy-profile .masthead-links { display: grid; margin-top: 13px; }
  .identity-copy-profile .button { min-height: 33px; padding: 0 6px; font-size: 6.5px; }
  .identity-copy-profile .button:not(.primary) { display: none; }
}
/* Stable editorial layout: independent text and portrait areas. */
.identity-sequence { height: 220svh; }
.identity-sticky { min-height: 580px; }
.identity-grid { background: #151513; }
.identity-grid::before,.identity-copy-face::before,.identity-side-label,.poster-spine,.poster-cover-note,.poster-coordinate { display: none; }
.poster-torn-layer {
  inset: 38px 0 auto;
  height: 63%;
  background: none;
  transform: none;
  filter: drop-shadow(0 8px 7px #0003);
}
.poster-torn-layer::before {
  display: block;
  inset: 0;
  opacity: 1;
  mix-blend-mode: normal;
  background: linear-gradient(#f0ece3df,#e9e4d9df),url('assets/kairos-paper-crumple.png') center / cover;
  -webkit-mask: none;
  mask: none;
  clip-path: polygon(0 0,100% 0,100% 97%,97% 96%,94% 98%,90% 97%,87% 99%,83% 97%,79% 98%,75% 96%,71% 98%,67% 97%,64% 99%,60% 98%,57% 97%,53% 99%,49% 97%,45% 98%,41% 97%,38% 99%,34% 98%,30% 99%,26% 97%,22% 98%,18% 97%,14% 99%,10% 98%,7% 99%,3% 97%,0 98%);
}
.poster-torn-layer::after { display: none; }
.identity-copy-face {
  inset: 38px 0 58px;
  width: 100%;
  height: auto;
  padding: clamp(24px,3vw,48px);
  display: grid;
  grid-template-columns: 44% 56%;
  grid-template-rows: auto auto 1fr auto;
  align-content: stretch;
  gap: 20px 0;
  overflow: hidden;
  transform: translateY(calc(var(--identity-p) * -12px));
}
.identity-copy-face .hero-kicker { position: static; grid-column: 1 / -1; max-width: none; margin: 0; font-size: 10px; line-height: 1.5; }
.identity-copy-face h1 { position: relative; inset: auto; grid-column: 1 / -1; width: 100%; margin: 0; pointer-events: auto; }
.identity-copy-face h1 .name-en { font-size: clamp(64px,10.8vw,160px); line-height: .9; letter-spacing: -.065em; gap: .09em; transform: none; }
.identity-copy-face h1 .name-cn { display: none; }
.identity-copy-face .identity-tags { position: static; grid-column: 1; grid-row: 3; align-self: start; width: 88%; display: grid; gap: 12px; padding: 20px 0; margin: 14px 0 0; border-bottom: 0; }
.identity-copy-face .identity-tags span { padding: 0; font-size: clamp(10px,.9vw,13px); line-height: 1.5; }
.identity-tags span + span::before { display: none; }
.identity-copy-face .identity-caption { position: static; grid-column: 1; grid-row: 3; align-self: end; width: fit-content; max-width: 92%; padding: 8px 12px; background: #151513; margin: 0 0 28px; font-size: clamp(12px,1.1vw,16px); line-height: 1.5; color: #f2efe7; }
.identity-copy-face .poster-statement { position: static; grid-column: 1; grid-row: 4; align-self: end; width: 95%; max-width: none; padding: 0; margin: 0 0 20px; border: 0; background: none; font-size: clamp(21px,2.5vw,36px); line-height: 1.45; letter-spacing: -.025em; }
.poster-statement::before { display: none; }
.identity-portrait {
  inset: calc(38px + (1 - var(--identity-p)) * 25%) 0 58px 50%;
  height: auto;
  border: 0;
  background: rgb(246 244 238 / var(--identity-p));
  pointer-events: none;
}
.identity-portrait img {
  left: 50%;
  bottom: 0;
  height: 100%;
  width: 100%;
  max-width: 100%;
  object-fit: contain;
  object-position: center bottom;
  transform: translateX(-50%) scale(calc(.97 + var(--identity-p) * .03));
  transform-origin: center bottom;
  filter: grayscale(1) contrast(1.12);
  will-change: transform;
}
.identity-portrait::before,.identity-portrait::after { display: none; }
.identity-portrait figcaption { display: none; }
.poster-qr { right: 18px; bottom: 76px; width: 84px; padding: 6px; transform: none; }
.poster-qr figcaption { font-size: 6px; }
.identity-copy-profile { inset: 38px auto 58px 0; height: auto; width: 50%; padding: clamp(28px,4vw,64px); justify-content: center; gap: 0; }
.identity-copy-profile h2 { font-size: clamp(25px,3vw,44px); line-height: 1.25; letter-spacing: -.035em; }
.identity-copy-profile .hero-kicker { margin: 0 0 24px; font-size: 10px; }
.identity-copy-profile .hero-summary { display: block; overflow: visible; margin: 26px 0 0; font-size: 15px; line-height: 1.85; }
.identity-copy-profile .identity-detail { margin: 18px 0 0; font-size: 13px; line-height: 1.8; }
.identity-copy-profile .masthead-links { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.identity-copy-profile .button { min-height: 44px; font-size: 11px; padding: 10px 16px; }
@media (max-width: 820px) {
  .identity-sticky { min-height: 580px; }
  .identity-copy-face h1 .name-en { font-size: 11.2vw; }
  .identity-copy-profile { padding: 26px; }
  .identity-copy-profile h2 { font-size: 26px; }
  .identity-copy-profile .hero-summary { font-size: 13px; }
}
@media (max-width: 560px) {
  .identity-sticky { min-height: 590px; }
  .identity-copy-face { inset: 32px 0 48px; padding: 24px 18px; gap: 18px 0; }
  .identity-copy-face .hero-kicker { font-size: 8px; letter-spacing: .035em; }
  .identity-copy-face h1 .name-en { font-size: 12vw; gap: .075em; }
  .identity-copy-face .identity-tags { gap: 10px; margin-top: 12px; padding: 14px 0; }
  .identity-copy-face .identity-tags span { font-size: 9px; letter-spacing: 0; }
  .identity-copy-face .identity-caption { font-size: 12px; margin-bottom: 26px; }
  .identity-copy-face .poster-statement { font-size: 16px; margin-bottom: 12px; }
  .poster-torn-layer { inset: 32px 0 auto; height: 60%; }
  .identity-portrait { inset: calc(32px + (1 - var(--identity-p)) * 22%) 0 48px 50%; }
  .identity-portrait img { width: calc(100% + (1 - var(--identity-p)) * 100%); max-width: none; object-position: center calc(100% - var(--identity-p) * 50%); }
  .poster-qr { width: 60px; right: 10px; bottom: 61px; padding: 4px; }
  .poster-qr figcaption { font-size: 5px; }
  .identity-copy-profile { inset: 32px auto 48px 0; height: auto; width: 50%; padding: 22px 16px; }
  .identity-copy-profile .hero-kicker { font-size: 8px; margin-bottom: 18px; }
  .identity-copy-profile h2 { font-size: 19px; line-height: 1.4; }
  .identity-copy-profile .hero-summary { font-size: 12px; line-height: 1.8; margin-top: 20px; }
  .identity-copy-profile .identity-detail { display: none; }
  .identity-copy-profile .masthead-links { margin-top: 20px; }
  .identity-copy-profile .button { min-height: 42px; padding: 8px; font-size: 10px; }
}