.portrait-intro {
  position: fixed;
  inset: 0;
  z-index: 110;
  display: block;
  width: min(76vw, 56vh, 440px);
  aspect-ratio: 900 / 880;
  height: fit-content;
  max-height: 60vh;
  object-fit: contain;
  margin: auto;
  pointer-events: none;
}
html[data-signature-stage], html[data-signature-stage] body {
  background: var(--surface) !important;
}
html[data-signature-stage] body > :is(.portfolio-navigation,.info-topbar,.work-controls,main,footer,.rive-dock) {
  visibility: hidden;
}
body:is(.home-page,.info-shell) header .brand .brand-signature > :is(img,canvas[data-portrait]) {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 900 / 880;
  object-fit: contain;
  filter: none;
}
.portrait-intro > canvas { display:block; width:100%; height:auto }

body:is(.home-page,.info-shell) header .brand .brand-signature {
  position: relative;
  width: clamp(80px, 9vw, 104px);
  flex: 0 0 auto;
}


html[data-signature-stage] .brand-signature { opacity: 0 }