How to correctly apply styling for nested widgets?

[dunric]

When rendering multiple lipgloss styled strings inside a styled container, background styling of that container is not preserved.

There is a simplified example from View method:

        // import gloss "github.com/charmbracelet/lipgloss"
	stylem := gloss.NewStyle().
		Background(gloss.Color("4")).
		Padding(1, 2)
	style1 := gloss.NewStyle().
		Foreground(gloss.Color("15")).
		Background(gloss.Color("2"))
	style2 := gloss.NewStyle().
		Foreground(gloss.Color("227")).
		Background(gloss.Color("5"))

	out := stylem.Render(
		style1.Render("Hello, World!"),
		style2.Render("Thats all, folks…"),
	)

which gets rendered like

See dark spot behind "Hello, World!", which has default terminal background instead of expected lightblue from stylem.

[dunric]

Just extending the question, what escape codes library produces:

\x1b[44m\x1b[97;42mHello, World!\x1b[0m \x1b[0m
                                                                ˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆˆ

Escape color code for "Hello, World!" is reset afterwards, then uncolored space is produced also with trailing reset.
It is expected, it will inherit containing stylem coloring.

Not clear if I try to use nested styling improperly and there is an other way.