This example demonstrates basic SVG shape creation and styling using inline SVG elements within an HTML document. It shows circles, rectangles, lines, and paths rendered directly to the SVG canvas, with colors and transformations applied through attributes and CSS. The code uses raw SVG APIs like `<circle>`, `<rect>`, `<line>`, `<path>`, and the `transform` attribute to group and position shapes. CSS classes, such as `.lines`, control stroke properties like width and color, while global styles set the page margin and hide overflow. No external libraries are used, relying entirely on native browser SVG support.