The DOM (Document Object Model) is the browser's live representation of a webpage's structure. When a browser loads an HTML page, it parses the HTML and constructs a tree of objects, one for each element on the page. The DOM is that tree. JavaScript and browser extensions interact with the page by reading and modifying the DOM, not the original HTML file.
Every element on the page is a node in the DOM tree. Elements are nested inside each other in a parent-child relationship: a button is inside a div, which is inside a section, which is inside the body. This nesting is what Loupely Lens traverses when it reads the ancestor chain of the element you clicked.
The DOM is also where inline styles live. When JavaScript injects a style directly onto an element, it's setting a property on that element's DOM node, not writing to a CSS file. This is why inline styles injected by JavaScript don't appear in any stylesheet you can find. They exist only in the DOM, at runtime, after the page has loaded and JavaScript has run.