css`...` (from pota/use/css) is a tagged-template helper that returns a CSSStyleSheet. Results are cached by source text, so the same template produces the same sheet across calls — you can safely use it at module scope. The underlying sheet(cssString) helper does the same from a plain string.

The sheet is not adopted automatically. Assign it via addAdoptedStyleSheet(document, sheet), by including it in a CustomElement's static styleSheets array, or by applying it through the use:css prop described below.

Any element with a css prop (a CSSStyleSheet or a CSS string) has that sheet adopted into its owning document while the element is mounted, and removed when it is destroyed.

In the use:css attribute of an element you can use the keyword class in a selector — it's rewritten to a random class name that's then added to the element. That way you can co-locate a scoped stylesheet with the markup without hand-generating a class.