z-index is the CSS property that controls which element sits on top when 2 or more elements occupy the same visual space. A higher z-index value means closer to the viewer. A lower value means further back.
The part that trips people up: z-index doesn't work globally across the entire page. It only works within a stacking context. A stacking context is a group of elements that share the same layering scope. When a parent element creates a new stacking context (which happens automatically when a parent has a non-static position combined with a z-index, or when it uses certain CSS properties like transform or opacity), every child element's z-index is calculated relative to that context, not to the page as a whole.
The practical result: an element with z-index: 9999 can still appear behind another element if it's trapped inside a stacking context that sits below the other element's context. The number is high, but it's measuring within a container that the browser renders last. This is why navigation dropdowns disappear behind page sections, and why modals appear under content they should be covering. Loupely Lens identifies the stacking contexts involved and tells you which one is creating the layering problem.