How to edit linked styles?

[grester]

For example I have a gallery with images, when I select an image vvveb warns that it has a linked style shared with the other images in the gallery, which makes sense and I understand the concept, however I don't understand where/how to actually edit that shared style. The parent div doesn't seem to have any particular image related settings.
Does it mean that it simply shares classes with other elements and the class is what's actually considered a shared style?

Follow up question if true, these style classes where are they defined? Is it the vvvebjs-css(css/custom.css) concept I've read somewhere? What's the best way to edit these custom styles as they are simply linked in the html file?
Besides the show code button to show the html of the page, extra buttons to edit style.css directly from the page would be great!

[givanz]

Shared style means that there are more than one element on the page that have the same css selector, making changes to styles (color, font etc) will apply to all elements that share the same selector.

The element selector is shown inside the warning, hovering over # elements will highlight the linked elements.

You can set a unique id to a linked element to 'unlink' it and apply style changes only to the element, in this case the #element-id will be used as css selector.

You can view the generated selector and css for the element in the css editor, this was moved from the left panel to code editor in the last update.

The selector is generated automatically by using the classes or id from the element, parent and grand parent elements up to body element.

All page builder generated styles are saved in public/theme/active-theme-name/css/custom.css this css is applied for the entire theme and is shared by all pages.

You can edit the file directly or use the css editor inside the page builder, everything in a theme is standard plain html/css and editing html and css files by hand will not break anything.