/* The frame and signature stay still; depth belongs to the photograph. */
.portrait-motion > img {
  filter: none;
}
.dialog-overlay {
  backdrop-filter: none;
  background: rgb(2 3 4 / 84%);
}
/* Cache each soft glow once; only its opacity changes during the existing letter sequence. */
.site .masthead .amiux-brand-letter,
.amiux-distribution-letter {
  position: relative;
  will-change: auto;
}
.site[data-motion='true'] .masthead[data-amiux-motion='running'] .amiux-brand-letter,
.amiux-distribution-showcase[data-amiux-motion='running'] .amiux-distribution-letter {
  animation: none;
}
.amiux-brand-letter::after,
.amiux-distribution-letter::after {
  content: attr(data-letter);
  position: absolute;
  inset: 0;
  pointer-events: none;
  color: transparent;
  text-shadow:
    0 0 5px rgb(255 255 255 / 72%),
    0 0 16px rgb(255 255 255 / 32%);
  opacity: 0;
}
.site[data-motion='true'] .masthead[data-amiux-motion='running'] .amiux-brand-letter::after {
  animation: amiux-cached-glow 5.6s ease-in-out var(--letter-delay) infinite;
}
.amiux-distribution-showcase[data-amiux-motion='running'] .amiux-distribution-letter::after {
  text-shadow:
    0 0 7px rgb(255 255 255 / 82%),
    0 0 20px rgb(255 218 53 / 34%);
  animation: amiux-cached-distribution-glow 5.8s ease-in-out calc(var(--title-letter) * 110ms)
    infinite;
}
@keyframes amiux-cached-glow {
  0%,
  100% {
    opacity: 0;
  }
  45% {
    opacity: 1;
  }
  62% {
    opacity: 0.38;
  }
}
@keyframes amiux-cached-distribution-glow {
  0%,
  18%,
  100% {
    opacity: 0;
  }
  7% {
    opacity: 1;
  }
}
html[data-amiux-dialog-open='true'] .amiux-brand-letter::after,
html[data-amiux-dialog-open='true'] .amiux-distribution-letter::after,
html[data-amiux-controls-motion='paused'] .amiux-brand-letter::after,
html[data-amiux-controls-motion='paused'] .amiux-distribution-letter::after {
  animation-play-state: paused !important;
}
@media (prefers-reduced-motion: reduce) {
  .amiux-brand-letter::after,
  .amiux-distribution-letter::after {
    display: none;
  }
}
.artist-dialog .dialog-portrait[data-portrait-depth] .portrait-layers {
  inset: -5px;
  transition: none;
  transform-origin: 50% 46%;
}
.artist-dialog .dialog-portrait[data-portrait-depth] .portrait-motion,
.artist-dialog[data-motion='true'] .dialog-portrait[data-portrait-depth] .portrait-motion {
  transform: perspective(1200px) scale(1.045) rotateY(-1.1deg) rotateX(0.45deg);
  transform-origin: 50% 46%;
  animation: amiux-portrait-orbit 20s cubic-bezier(0.45, 0, 0.55, 1) infinite;
  animation-play-state: paused;
}
.artist-dialog .dialog-portrait[data-portrait-running='true'] .portrait-motion {
  animation-play-state: running;
}
.artist-dialog .dialog-portrait[data-portrait-depth] .portrait-motion > img,
.artist-dialog[data-motion='true']
  .dialog-portrait[data-portrait-depth]:hover
  .portrait-motion
  > img {
  animation: none;
  transform: none;
  will-change: auto;
  backface-visibility: hidden;
}
.amiux-portrait-light {
  position: absolute;
  z-index: 1;
  inset: -30%;
  pointer-events: none;
  background: linear-gradient(
    115deg,
    transparent 32%,
    rgb(203 221 244 / 7%) 46%,
    rgb(255 255 255 / 10%) 50%,
    transparent 62%
  );
  mix-blend-mode: normal;
  opacity: 0.32;
  transform: translateX(-8%) rotate(-4deg);
}
@keyframes amiux-portrait-orbit {
  0%,
  100% {
    transform: perspective(1200px) scale(1.045) rotateY(-1.1deg) rotateX(0.45deg)
      translate3d(-0.2%, 0.1%, 0);
  }
  25% {
    transform: perspective(1200px) scale(1.045) rotateY(0.35deg) rotateX(-0.65deg)
      translate3d(0.1%, -0.15%, 0);
  }
  50% {
    transform: perspective(1200px) scale(1.045) rotateY(1.2deg) rotateX(-0.15deg)
      translate3d(0.2%, -0.1%, 0);
  }
  75% {
    transform: perspective(1200px) scale(1.045) rotateY(-0.2deg) rotateX(0.7deg)
      translate3d(-0.1%, 0.15%, 0);
  }
}
html[data-amiux-dialog-open='true'] .site .portrait-motion,
html[data-amiux-dialog-open='true'] .site .ambient-field__particle,
html[data-amiux-dialog-open='true'] .site .ambient-field__particle b,
html[data-amiux-dialog-open='true'] .site .amiux-brand-letter,
html[data-amiux-dialog-open='true'] .site .play-disc,
html[data-amiux-dialog-open='true'] .site .play-disc::after {
  animation-play-state: paused !important;
}
@media (max-width: 699px), (prefers-reduced-motion: reduce) {
  .artist-dialog .dialog-portrait[data-portrait-depth] .portrait-layers {
    transform: none !important;
  }
  .artist-dialog .dialog-portrait[data-portrait-depth] .portrait-motion,
  .artist-dialog[data-motion='true'] .dialog-portrait[data-portrait-depth] .portrait-motion {
    animation: none;
    transform: scale(1.025);
  }
  .amiux-portrait-light {
    display: none;
  }
}