This example demonstrates how to create and style basic SVG shapes—circles, rectangles, lines, and paths—using inline attributes and CSS classes. It shows how CSS rules, such as setting stroke width and color on a group with class `lines`, can apply consistent styling to multiple elements. The code uses raw SVG markup within an HTML page, with a linked `styles.css` for presentation. A transform on the outer group scales and translates the entire composition, while nested groups inherit fill and stroke properties, illustrating SVG’s grouping and inheritance model.