How do CSS Logical Properties map to physical properties?

Logical properties (e.g., margin-inline-start) adapt to the document's writing mode, replacing physical properties (e.g., margin-left).

For left-to-right (LTR) languages, inline-start is left, and block-start is top. If the page switches to a right-to-left (RTL) language like Arabic, inline-start automatically flips to right. This allows a single stylesheet to support multi-directional layouts seamlessly.