Every rendered element becomes one or more rectangular boxes, and layout is the work of sizing those boxes and placing them. The first five subsections treat a single box: its layers, its position and stacking, its size, its spacing and its decoration. The rest arranges many boxes with Flexbox, Grid, transforms, scroll snapping, anchor positioning and formatting contexts.
Keep one question in mind throughout: which box is this measuring from? Percentages and offsets resolve against the containing block, an ancestor chosen by the position value, and most "why is it over there?" bugs come from the wrong containing block.