This example demonstrates how basic geometric shapes—circles, rectangles, lines, and paths—can be composed and styled within an SVG canvas. Rendered using pure SVG markup with CSS for styling, it shows how individual elements inherit fill colors from parent groups, while explicitly set attributes like `fill="red"` or `fill="yellow"` override inherited defaults. The code uses SVG's native `transform` attribute for scaling and translation, and includes a path defined with `M` (move to) and `L` (line to) commands to draw a multi-segment line.