Hide content from automatic summary from within shortcode

I am using a fork of an image gallery shortcode and it adds a hidden div (initially with display: none; - will be toggled on later:

<div class="simple-lightbox"><!-- has "display: none;" initially-->
<!-- [...] -->
    <div class="lightbox-close">&times;</div>
    <div class="lightbox-nav lightbox-prev">&lt;</div>
    <div class="lightbox-nav lightbox-next">&gt;</div>
</div>

Now when adding this figure to the beginning of a post, using the automated summary will extract the × < > from the three divs, even though they are hidden. Is there a way to work around this that is not “don’t put the div in there statically, but create it dynamically”? Did I overlook a way to tell Hugo “this part is irrelevant for the summary”?

Another option would be to render SVGs instead of these three characters, since the parser should ignore them as well ^^

I think this is the parser: hugo/resources/page/page_markup.go at 61c39ae63b62667d965c2ff96d085f4eda59bcb2 · gohugoio/hugo · GitHub and I don’t see something like that. Since it just manually parses the HTML it also does not check for the display: none

Another option would be to replace the automated summary with one that additionally filters these characters, but that would mean that everyone using the shortcode would need to implement this.

What are possible approaches here (ideally so that the shortcode is as easily usable for anyone as possible)? What would your approach be?
Thank you!

Manually define the summary in front matter.