Runtime `children` on `<style>` requires `global`

Why this fires¶

A <style> with a children={expr} attribute carries runtime content — the compiler cannot see the CSS text, so it can neither hoist it into the deduplicated stylesheet nor apply the hermetic scope transform. Scoping unknown content would be a lie; the rule (spec §6.1) is that dynamic text must opt into global explicitly.

let css = comptime fs.read("./app.css")

fn page() -> View {
    <div>
        <style children={css}/>
    </div>
}
// error[TE731]: runtime `children` cannot be scoped; write `<style global children={…}>`

Fix it¶

Add global — the one style form that stays a render node and renders in place:

<style global children={css}/>

The builder spelling accepts the same pair: style(global: true, children: css).

If the content is actually static, write it as a literal body instead — then it hoists and scopes normally:

<style>.card { color: red }</style>

See also¶

• TE736 — <style> outside a component.
• TE730 — @() outside a declaration value.