/* The opaque photo dissolves over the illustration, so the portrait never goes blank. */
@media (max-width:740px), (hover:none) and (pointer:coarse) {
  .masthead .avatar .avatar-illustration { opacity:1; }
  .masthead .avatar .avatar-photo { opacity:0; transition:none; }
  .masthead .avatar.is-dissolving .avatar-photo {
    animation:portrait-dissolve 10s ease-in-out infinite;
  }
  .ky-motion-paused .masthead .avatar .avatar-photo { animation:none; }
}
@keyframes portrait-dissolve {
  0%,25%,100% { opacity:0; }
  40%,70% { opacity:1; }
  85% { opacity:0; }
}
@media (prefers-reduced-motion:reduce), (forced-colors:active) {
  .masthead .avatar.is-dissolving .avatar-photo { animation:none; }
}