This example shows a Mermaid.js state diagram that depicts the lifecycle of a data loading process (Idle, Loading, Succeeded, Failed) for a web application. The visualization is rendered dynamically by fetching the diagram definition from a separate `.mermaid` file and passing it to Mermaid's `render` method. The code uses Mermaid's `initialize` API to configure theme variables and spacing, and it waits for the Inconsolata font to load before rendering. After the render, the HTML is post-processed to enforce custom styling on SVG elements, including specific font sizes and black fills for state and edge labels.