My second mental picture

This is my second mental picture of Twitter's HTML for the cropped image of three cats. It's smaller now, and feels easier to deal with.

I started with the first mental picture and focused in on the part of the tree near the image tag. Also, I re-inserted two important elements that were taken out in the first one. Those are marked with a blue box.

div style="position: absolute; width: 100%; transform: translateY(1053.5px); transition: transform 0.15s linear 0s;"
 ╙─ div
    ╙─ div
       ╙─ article role="article" tabindex="0"
          ╙─ div
             ╙─ div
                ╙─ div
                   ╙─ div data-testid="tweet"
                      ╙─ div
                         ╙─ div
                            ╙─ div
                               ╙─ div
                                  ╙─ div
                                     ╙─ div
                                        ╙─ div
                                           ╙─ a href="/lowpolyanimals/status/1397613505595969539/photo/1" role="link"
                                              ╙─ div style=""
                                                 ║
                                                 ╟─ div style="padding-bottom: 56.25%;"
                                                 ║
                                                 ╙─ div
                                                    ║
                                                    ╙─ div aria-label="Image" data-testid="tweetPhoto" style="margin-bottom: -30%;"
                                                       ║
                                                       ╟─ div style="background-image: url('https://pbs.twimg.com/media/E14DAsgVEAAbk_-?format=png&name=small');"
                                                       ║
                                                       ╙─ img alt="Image" draggable="true" src="https://pbs.twimg.com/media/E14DAsgVEAAbk_-?format=png&name=small"

PS. Again, I made the tree with a program instead of by hand.