zyzz 0.0.28 → 0.0.29

package/src/web/Css.ts

@@ -1,19 +1,16 @@
 /**
  * Emits deterministic CSS, class mappings, and live theme scopes from ordered styles.
+ * The Rust compiler emits the CSS: Node runs its native addon and browsers its WebAssembly build.
  * @module
  */
-import * as Targets from '../internal/Targets.js'
-import * as ClassName from './internal/ClassName.js'
-import * as Identity from '../internal/Identity.js'
-import * as Contributions from './internal/Contributions.js'
-import * as Binding from '../internal/Binding.js'
-import * as Cascade from '../internal/Cascade.js'
-import * as Literal from '../internal/Literal.js'
-import * as Token from '../internal/Token.js'
 import type * as Style from '../Style.js'
 import type * as Vars from '../Vars.js'
 import type * as Theme from '../internal/Theme.js'
-import * as Themes from './internal/Themes.js'
+import * as ClassName from './internal/ClassName.js'
+import type * as Contributions from './internal/Contributions.js'
+import * as Engine from './internal/Engine.js'
+import type * as Themes from './internal/Themes.js'
+import * as Wire from './internal/Wire.js'
 
 /** Explicit ordered stylesheet contribution data. */
 export type Contribution = Contributions.Definition
@@ -35,898 +32,13 @@ export function compile<
 >(
   options: compile.Options<name, themeName>,
 ): compile.ReturnType<name, themeName> {
-  const labels = options[ClassName.labels] ?? options.styles[ClassName.labels]
-  const units =
-    options[ClassName.units] ??
-    ClassName.registry().scope({ owner: '', qualifier: '' })
-  options = {
-    ...options,
-    styles: { styles: options.styles.styles.map(Targets.web) },
-  }
-  let theme: ReturnType<typeof Themes.create> | undefined
-
-  const references = new Map<object, boolean>()
-
-  function isReference(value: unknown): value is Token.Reference {
-    if (typeof value !== 'object' || value === null) return false
-
-    const previous = references.get(value)
-    if (previous !== undefined) return previous
-
-    const result = Token.is(value)
-
-    references.set(value, result)
-
-    return result
-  }
-
-  const bodies = new Map<Style.NamedStyle, string>()
-  const declarations = new Map<Style.Declaration, string>()
-  type Property = {
-    readonly important: Map<Style.Declaration['value'], string>
-    readonly name: string
-    readonly normal: Map<Style.Declaration['value'], string>
-  }
-  const declarationProperties = new Map<string, Property>()
-  const serialized = new Map<object, string>()
-
-  // Only primitive declaration lists can be interned without erasing token identity.
-  // Reuse their emitted bodies throughout analysis and output.
-  const repeated = new Map<string, Style.NamedStyle>()
-
-  const canonicalStyles = options.styles.styles.map((style) => {
-    if (
-      'rules' in style ||
-      style.declarations.some(
-        (declaration) => typeof declaration.value === 'object',
-      )
-    )
-      return style
-
-    const key = nested(style)
-    const previous = repeated.get(key)
-    if (previous) return previous
-
-    repeated.set(key, style)
-
-    return style
-  })
-
-  const analyzed = [...new Set(canonicalStyles)]
-  const classes = Object.create(null) as Record<name, string>
-  const diagnostics: Diagnostic[] = []
-  const groups = new Map<string, false | string>()
-  const nestedComposition = options.styles.styles.some(
-    (style) => style.rules && !isolated(style),
-  )
-
-  const properties = new Set<Style.Declaration['property']>()
-  // Conditional and composed declarations join the same conflict domains.
-  function collect(style: Style.NamedStyle): void {
-    for (const { property } of style.declarations) properties.add(property)
-    for (const rule of style.rules ?? []) collect(rule.style)
-  }
-  for (const style of analyzed) collect(style)
-
-  // Logical dimensions may alias either physical axis in inherited writing modes.
-  // Preserve physical-only factoring when no logical dimension is authored.
-  const logicalSizing = [...properties].some((property) =>
-    /^(min|max)?(blockSize|inlineSize)$/i.test(canonical(property)),
-  )
-  const resets = properties.has('all')
-  const combinedLines = new Set<string>()
-
-  for (const property of properties)
-    if (Literal.rule(property)?.kind === 'line') {
-      const name = canonical(property)
-      combinedLines.add(name.startsWith('border') ? 'border' : name)
-    }
-
-  function canonical(property: string): string {
-    return property in Literal.aliases
-      ? Literal.aliases[property as keyof typeof Literal.aliases]
-      : property
-  }
-
-  function domain(property: string): string {
-    if (
-      resets &&
-      !property.startsWith('--') &&
-      property !== 'direction' &&
-      property !== 'unicodeBidi'
-    )
-      return 'all'
-
-    if (/^marker(?:Start|Mid|End)?$/.test(property)) return 'marker'
-    if (property.startsWith('corner')) return 'cornerShape'
-    if (property.startsWith('containIntrinsic')) return 'containIntrinsicSize'
-    if (property.startsWith('interestDelay')) return 'interestDelay'
-    if (property.startsWith('backgroundPosition')) return 'backgroundPosition'
-
-    if (combinedLines.has('columnRule') && property.startsWith('columnRule'))
-      return 'columnRule'
-
-    if (combinedLines.has('outline') && property.startsWith('outline'))
-      return 'outline'
-
-    if (property.startsWith('borderImage')) return 'borderImage'
-
-    if (property.startsWith('border')) {
-      if (combinedLines.has('border')) return 'border'
-
-      if (property.endsWith('Color')) {
-        return 'borderColor'
-      }
-
-      if (property.endsWith('Style')) {
-        return 'borderStyle'
-      }
-
-      if (property.endsWith('Width')) {
-        return 'borderWidth'
-      }
-
-      return 'borderRadius'
-    }
-
-    if (['flexDirection', 'flexFlow', 'flexWrap'].includes(property))
-      return 'flexFlow'
-
-    if (/^(pageBreak|break)(After|Before|Inside)$/.test(property))
-      return property.replace('pageBreak', 'break')
-
-    if (['fontStretch', 'fontWidth'].includes(property)) return 'fontWidth'
-    if (property.startsWith('fontSynthesis')) return 'fontSynthesis'
-
-    if (
-      [
-        'whiteSpace',
-        'whiteSpaceCollapse',
-        'whiteSpaceTrim',
-        'textWrap',
-        'textWrapMode',
-        'textWrapStyle',
-      ].includes(property)
-    )
-      return 'whiteSpace'
-
-    if (['wordWrap', 'overflowWrap'].includes(property)) return 'overflowWrap'
-
-    if (property.startsWith('margin')) {
-      return 'margin'
-    }
-
-    if (property.startsWith('padding')) {
-      return 'padding'
-    }
-
-    if (
-      property === 'overflow' ||
-      property === 'overflowX' ||
-      property === 'overflowY' ||
-      property === 'overflowBlock' ||
-      property === 'overflowInline'
-    ) {
-      return 'overflow'
-    }
-
-    if (property.startsWith('overscrollBehavior')) {
-      return 'overscrollBehavior'
-    }
-
-    if (property.startsWith('scrollMargin')) {
-      return 'scrollMargin'
-    }
-
-    if (property.startsWith('scrollPadding')) {
-      return 'scrollPadding'
-    }
-
-    if (['columnGap', 'gap', 'rowGap'].includes(property)) {
-      return 'gap'
-    }
-
-    if (/^(inset|top$|right$|bottom$|left$)/.test(property)) {
-      return 'inset'
-    }
-
-    if (
-      logicalSizing &&
-      /^(min|max)?(width|height|blockSize|inlineSize)$/i.test(property)
-    ) {
-      if (property.startsWith('min')) {
-        return 'min-size'
-      }
-
-      if (property.startsWith('max')) {
-        return 'max-size'
-      }
-
-      return 'size'
-    }
-
-    return property
-  }
-
-  const parents = new Map<string, string>()
-
-  function root(domain: string): string {
-    const parent = parents.get(domain)
-    if (!parent) return domain
-
-    const result = root(parent)
-
-    parents.set(domain, result)
-
-    return result
-  }
-
-  // Union only authored shorthands. Unrelated axes retain their original factoring.
-  // Recursion includes nested and reset-only shorthands without parsing CSS values.
-  function join(property: string, target: string, visited = new Set<string>()) {
-    if (visited.has(property)) return
-
-    visited.add(property)
-
-    const current = root(domain(canonical(property)))
-    const group = root(target)
-
-    if (current !== group) parents.set(current, group)
-
-    if (Object.hasOwn(Cascade.shorthands, property))
-      for (const child of Cascade.shorthands[
-        property as keyof typeof Cascade.shorthands
-      ])
-        join(child, target, visited)
-  }
-
-  for (const property of new Set([...properties].map(canonical)))
-    if (Object.hasOwn(Cascade.shorthands, property))
-      join(property, domain(property))
-
-  function serialize(input: Style.Declaration['value']): number | string {
-    if (typeof input !== 'object' || input === null) return input
-
-    const cached = serialized.get(input)
-    if (cached !== undefined) return cached
-
-    const value = serializeReference(input)
-
-    if (typeof value === 'string') serialized.set(input, value)
-
-    return value
-  }
-
-  function serializeReference(
-    input: Style.Declaration['value'],
-  ): number | string {
-    if (Binding.is(input)) return `var(${input.name})`
-    if (isReference(input)) return (theme ??= Themes.create()).serialize(input)
-
-    if (Token.isExpression(input))
-      return input.parts
-        .map((part) => (typeof part === 'string' ? part : serialize(part)))
-        .join('')
-
-    return input as number | string
-  }
-
-  function declarationBody(declaration: Style.Declaration): string {
-    const previous = declarations.get(declaration)
-    if (previous !== undefined) return previous
-
-    const { important, property, value } = declaration
-    let entry = declarationProperties.get(property)
-    if (!entry) {
-      entry = {
-        important: new Map(),
-        name: Literal.name(property),
-        normal: new Map(),
-      }
-      declarationProperties.set(property, entry)
-    }
+  const input = Wire.encode(options as compile.Options)
 
-    const values = important ? entry.important : entry.normal
-    let body = values.get(value)
-    if (body === undefined) {
-      body = `${entry.name}:${serialize(value)}${important ? '!important' : ''};`
-      values.set(value, body)
-    }
-
-    declarations.set(declaration, body)
-    return body
-  }
-
-  function nested(style: Style.NamedStyle): string {
-    const previous = bodies.get(style)
-    if (previous !== undefined) return previous
-    const body = renderNested(style)
-    bodies.set(style, body)
-    return body
-  }
-
-  function renderNested(style: Style.NamedStyle): string {
-    if (style.rules)
-      return style.rules
-        .map((rule) => {
-          const body = nested(rule.style)
-
-          return rule.condition === undefined
-            ? body
-            : `${rule.condition}{${body}}`
-        })
-        .join('')
-
-    return style.declarations.map(declarationBody).join('')
-  }
-
-  const domainsByProperty = new Map<string, string>()
-  function conflict(property: string): string {
-    const previous = domainsByProperty.get(property)
-    if (previous !== undefined) return previous
-    const value = root(domain(canonical(property)))
-    domainsByProperty.set(property, value)
-    return value
-  }
-
-  // Sharing is safe only when every use of a conflict domain has the same
-  // declaration sequence. Conditions conservatively retain contextual identities.
-  // Isolated class lists never combine, so atomic sharing considers ordered styles only.
-  const ordered = new Map<string, false | string>()
-  const combinable = new Set<Style.NamedStyle>()
-  for (const [index, style] of options.styles.styles.entries())
-    if (!isolated(style)) combinable.add(canonicalStyles[index]!)
-
-  for (const style of analyzed) {
-    const domains = new Map<
-      string,
-      { body: string; mixed: boolean; property: string }
-    >()
-
-    for (const item of style.declarations) {
-      const property = item.property
-      const key = conflict(property)
-      const entry = domains.get(key) ?? { body: '', mixed: false, property }
-      entry.body += declarationBody(item)
-      entry.mixed ||= entry.property !== property
-      domains.set(key, entry)
-    }
-
-    for (const [key, entry] of domains)
-      for (const map of combinable.has(style) ? [groups, ordered] : [groups]) {
-        const previous = map.get(key)
-        map.set(
-          key,
-          previous === false ||
-            entry.mixed ||
-            (previous !== undefined && previous !== entry.body)
-            ? false
-            : entry.body,
-        )
-      }
-  }
-
-  const defaultMode = options.cssOutput ?? 'atomic'
-  if (defaultMode !== 'atomic' && defaultMode !== 'grouped')
-    throw new CompileError([
-      {
-        code: 'invalid_output',
-        message: 'cssOutput must be atomic or grouped.',
-        path: ['cssOutput'],
-      },
-    ])
-
-  function outputMode(style: Style.NamedStyle) {
-    return Object.getOwnPropertyDescriptor(style, 'cssOutput')?.value as
-      | 'atomic'
-      | 'grouped'
-      | undefined
-  }
-
-  function compositionMode(style: Style.NamedStyle) {
-    const mode = Object.getOwnPropertyDescriptor(style, 'composition')
-      ?.value as 'independent' | 'ordered' | undefined
-
-    return mode ?? options.composition ?? 'ordered'
-  }
-
-  // Development keeps every style ordered so names survive value edits.
-  function isolated(style: Style.NamedStyle) {
-    return compositionMode(style) === 'independent' && !options.development
-  }
-
-  type Item = {
-    readonly conditions: readonly string[]
-    readonly property: string
-    readonly value: string
-  }
-
-  // Lists declaration groups in authored order; undefined marks styles whose
-  // nested grouped output or anonymous layers emit one opaque rule.
-  function flatten(
-    style: Style.NamedStyle,
-    conditions: readonly string[] = [],
-  ): Item[] | undefined {
-    if (outputMode(style) === 'grouped') return undefined
-
-    if (style.rules) {
-      const items: Item[] = []
-      for (const rule of style.rules) {
-        if (rule.condition?.trim() === '@layer') return undefined
-
-        const nested = flatten(
-          rule.style,
-          rule.condition === undefined
-            ? conditions
-            : [...conditions, rule.condition],
-        )
-        if (!nested) return undefined
-
-        items.push(...nested)
-      }
-      return items
-    }
-
-    const items: Item[] = []
-    for (let index = 0; index < style.declarations.length; ) {
-      const property = style.declarations[index]!.property
-      let value = ''
-      // Keep same-property fallbacks ordered; they form one semantic value.
-      while (style.declarations[index]?.property === property) {
-        const declaration = style.declarations[index++]!
-        value += `${Literal.name(property)}:${serialize(declaration.value)}${declaration.important ? '!important' : ''};`
-      }
-      items.push({ conditions, property, value })
-    }
-    return items
-  }
-
-  function byDomain(items: readonly Item[]) {
-    const result = new Map<string, Item[]>()
-    for (const item of items) {
-      const key = conflict(item.property)
-      const domain = result.get(key)
-      if (domain) domain.push(item)
-      else result.set(key, [item])
-    }
-    return result
-  }
-
-  function representation(style: Style.NamedStyle): unknown {
-    return [
-      outputMode(style),
-      style.rules?.map((rule) => representation(rule.style)),
-    ]
-  }
-
-  function validate(style: Style.NamedStyle) {
-    const mode = outputMode(style)
-    if (mode !== undefined && mode !== 'atomic' && mode !== 'grouped')
-      throw new CompileError([
-        {
-          code: 'invalid_output',
-          message: 'cssOutput must be atomic or grouped.',
-          path: [style.name, 'cssOutput'],
-        },
-      ])
-    for (const rule of style.rules ?? []) validate(rule.style)
-  }
-  for (const style of options.styles.styles) validate(style)
-
-  const identities = new Map<string, string>()
-  const rules = new Map<string, string>()
-  type ConditionalRule = { conditions: readonly string[]; value: string }
-  const conditionalRules = new Map<string, ConditionalRule>()
-  type SharedRules = Record<'atomic' | 'grouped', Map<string, string>>
-  const identical = new Map<string | undefined, SharedRules>()
-  const explicitBodies = new Map<string, string>()
-  const selectors = new Map<string, string>()
-  const explicitModes = new Set<string>()
-  const applications = new Map<string, string>()
-  const occurrences = new Map<string, number>()
-  for (const style of options.styles.styles)
-    for (const declaration of style.declarations) {
-      const key = conflict(declaration.property)
-      occurrences.set(key, (occurrences.get(key) ?? 0) + 1)
-    }
-
-  // An ordered atomic style reuses the rules of the previous style that set a
-  // domain to the same sequence: no differing rule sits between them.
-  const runs = new Map<number, Map<string, number>>()
-  const owned = new Map<number, Map<string, string[]>>()
-  if (!options.development) {
-    const last = new Map<string, { key: string; owner: number }>()
-
-    for (const [index, style] of options.styles.styles.entries()) {
-      if (isolated(style)) continue
-
-      const items =
-        (outputMode(style) ?? defaultMode) === 'atomic' &&
-        options.names?.[style.name] === undefined
-          ? flatten(style)
-          : undefined
-      // Grouped, explicit, and opaque rules may set any domain.
-      if (!items) {
-        last.clear()
-        continue
-      }
-
-      for (const [domain, list] of byDomain(items)) {
-        const key = JSON.stringify(
-          list.map((item) => [item.conditions, item.value]),
-        )
-        const previous = last.get(domain)
-        if (previous?.key !== key) {
-          last.set(domain, { key, owner: index })
-          continue
-        }
-
-        const reuse = runs.get(index) ?? new Map<string, number>()
-        reuse.set(domain, previous.owner)
-        runs.set(index, reuse)
-      }
-    }
-  }
-
-  for (const [styleIndex, style] of options.styles.styles.entries()) {
-    const mode = outputMode(style) ?? defaultMode
-    const independent =
-      compositionMode(style) === 'independent' && !options.development
-    if (!style.name || Object.hasOwn(classes, style.name)) {
-      diagnostics.push({
-        code: 'invalid_name',
-        message: 'Style names must be nonempty and unique.',
-        path: [style.name],
-      })
-      continue
-    }
-
-    const explicit = options.names?.[style.name]
-    if (explicit !== undefined) {
-      const body = nested(style)
-      const previous = explicitBodies.get(explicit)
-      if (previous !== undefined && previous !== body)
-        diagnostics.push({
-          code: 'identity_collision',
-          message: 'An explicit id is used for different styles.',
-          path: [style.name],
-        })
-      explicitBodies.set(explicit, body)
-      classes[style.name] = explicit
-      const key = `${explicit}:${mode}`
-      if (explicitModes.has(key)) continue
-      explicitModes.add(key)
-    }
-
-    const application =
-      explicit === undefined && independent
-        ? `${mode}:${style.rules ? JSON.stringify(representation(style)) : ''}:${nested(canonicalStyles[styleIndex]!)}`
-        : undefined
-    if (application !== undefined && applications.has(application)) {
-      classes[style.name] = applications.get(application)!
-      continue
-    }
-
-    const names: string[] = explicit === undefined ? [] : [explicit]
-    let ordinal = 0
-    const cssName = labels?.[style.name]?.name ?? encode(style.name)
-    const cssNamespace =
-      labels?.[style.name]?.namespace ??
-      (options.scope ? Identity.name(options.scope) : undefined)
-    let sharedRules = identical.get(cssNamespace)
-    if (!sharedRules) {
-      sharedRules = { atomic: new Map(), grouped: new Map() }
-      identical.set(cssNamespace, sharedRules)
-    }
-
-    function emit(
-      body: string,
-      label: string,
-      shared: boolean,
-      output = mode,
-      conditional?: ConditionalRule,
-    ): string | undefined {
-      if (!body) return undefined
-
-      const reusable =
-        explicit === undefined &&
-        (shared || (independent && mode === 'grouped' && output === mode))
-      const previous = reusable ? sharedRules![output].get(body) : undefined
-      if (previous && !names.includes(previous)) {
-        names.push(previous)
-        return previous
-      }
-
-      if (previous) shared = false
-
-      // Contextual slots preserve authored ordering; development names survive value edits.
-      const slot = ordinal++
-      const identity = (() => {
-        if (explicit !== undefined)
-          return `${explicit}-${mode}-${encode(label)}-${slot}`
-        if (output === 'grouped' && mode === 'grouped') {
-          return `z-${cssNamespace ? `${cssNamespace}-` : ''}${cssName}${slot ? `__${slot}` : ''}`
-        }
-        return ClassName.create({
-          body,
-          context: !shared ? cssName : undefined,
-          namespace: cssNamespace,
-          property: label,
-          slot: !shared ? slot : undefined,
-        })
-      })()
-      const owner =
-        mode === 'atomic' && !shared ? `${style.name}:${slot}` : undefined
-      if (
-        (rules.has(identity) && rules.get(identity) !== body) ||
-        (owner !== undefined &&
-          identities.has(identity) &&
-          identities.get(identity) !== owner)
-      )
-        diagnostics.push({
-          code: 'identity_collision',
-          message:
-            'Generated class names conflict. Supply distinct config or style ids.',
-          path: [style.name],
-        })
-
-      if (owner !== undefined) identities.set(identity, owner)
-      rules.set(identity, body)
-      if (
-        conditional?.conditions.some((condition) =>
-          /^@(media|supports)\b/.test(condition),
-        )
-      )
-        conditionalRules.set(identity, conditional)
-      if (explicit !== undefined) selectors.set(identity, explicit)
-      else {
-        if (reusable) sharedRules![output].set(body, identity)
-        names.push(identity)
-      }
-
-      return identity
-    }
-
-    function atoms(
-      style: Style.NamedStyle,
-      conditions: readonly string[] = [],
-    ) {
-      if (outputMode(style) === 'grouped') {
-        const body = conditions.reduceRight(
-          (body, condition) => `${condition}{${body}}`,
-          nested(style),
-        )
-        emit(body, 'style', false, 'grouped')
-        return
-      }
-      if (style.rules) {
-        for (const rule of style.rules) {
-          if (rule.condition?.trim() === '@layer') {
-            // Repeating an anonymous layer would change cascade precedence.
-            const body = [...conditions, rule.condition].reduceRight(
-              (body, condition) => `${condition}{${body}}`,
-              nested(rule.style),
-            )
-            emit(body, 'layer', false)
-            continue
-          }
-          atoms(
-            rule.style,
-            rule.condition === undefined
-              ? conditions
-              : [...conditions, rule.condition],
-          )
-        }
-        return
-      }
-
-      for (let index = 0; index < style.declarations.length; ) {
-        const declaration = style.declarations[index++]!
-        const property = declaration.property
-        const values = [declaration]
-        // Keep same-property fallbacks ordered; they form one semantic value.
-        while (style.declarations[index]?.property === property)
-          values.push(style.declarations[index++]!)
-
-        const domain = conflict(property)
-        const owner = runs.get(styleIndex)?.get(domain)
-        const reused =
-          owner === undefined ? undefined : owned.get(owner)?.get(domain)
-        if (reused) {
-          for (const identity of reused)
-            if (!names.includes(identity)) names.push(identity)
-          continue
-        }
-
-        const value = values
-          .map(
-            ({ important, value }) =>
-              `${Literal.name(property)}:${serialize(value)}${important ? '!important' : ''};`,
-          )
-          .join('')
-        const body = conditions.reduceRight(
-          (body, condition) => `${condition}{${body}}`,
-          value,
-        )
-        const shared =
-          !nestedComposition &&
-          !conditions.length &&
-          ordered.get(domain) !== false
-        const identity = emit(body, property, shared, mode, {
-          conditions,
-          value,
-        })
-        if (identity === undefined) continue
-
-        const domains = owned.get(styleIndex) ?? new Map<string, string[]>()
-        domains.set(domain, [...(domains.get(domain) ?? []), identity])
-        owned.set(styleIndex, domains)
-      }
-    }
-
-    // Independent class lists never combine, so only declarations within one
-    // conflict domain need relative order. Equal domain bodies share one rule.
-    function share(style: Style.NamedStyle) {
-      const items = flatten(style)
-      if (!items) return atoms(style)
-
-      for (const domain of byDomain(items).values()) {
-        // Conditional rules stay contextual to keep their order against base declarations.
-        if (domain.some((item) => item.conditions.length)) {
-          for (const item of domain)
-            emit(
-              item.conditions.reduceRight(
-                (body, condition) => `${condition}{${body}}`,
-                item.value,
-              ),
-              item.property,
-              false,
-              mode,
-              item,
-            )
-          continue
-        }
-
-        const body = domain.map((item) => item.value).join('')
-        const identity = units.name(body, cssNamespace)
-        if (rules.has(identity) && rules.get(identity) !== body)
-          diagnostics.push({
-            code: 'identity_collision',
-            message:
-              'Generated class names conflict. Supply distinct config or style ids.',
-            path: [style.name],
-          })
-
-        rules.set(identity, body)
-        names.push(identity)
-      }
-    }
-
-    try {
-      if (mode === 'grouped') {
-        const shared: Style.Declaration[] = []
-        const local: Style.Declaration[] = []
-        for (const declaration of style.declarations) {
-          const key = conflict(declaration.property)
-          const reusable =
-            !style.rules &&
-            independent &&
-            groups.get(key) !== false &&
-            (occurrences.get(key) ?? 0) > 1
-          if (reusable) shared.push(declaration)
-          else local.push(declaration)
-        }
-        if (shared.length && local.length) {
-          emit(shared.map(declarationBody).join(''), 'shared', false)
-          emit(local.map(declarationBody).join(''), 'style', false)
-        } else emit(nested(style), 'style', false)
-      } else if (explicit === undefined && independent) share(style)
-      else atoms(style)
-    } catch (error) {
-      diagnostics.push({
-        code: 'invalid_declaration',
-        message: (error as Error).message,
-        path: [style.name],
-      })
-    }
-
-    classes[style.name] = [...new Set(names)].join(' ')
-    if (application !== undefined)
-      applications.set(application, classes[style.name])
-  }
-
-  if (diagnostics.length) throw new CompileError(diagnostics)
-
-  const contributionCss = (() => {
-    try {
-      return Contributions.render(options.contributions ?? [], nested)
-    } catch (error) {
-      throw new CompileError([
-        {
-          code: 'invalid_declaration',
-          message: (error as Error).message,
-          path: ['contributions'],
-        },
-      ])
-    }
-  })()
-
-  let scopes: ReturnType<NonNullable<typeof theme>['emit']>
-
-  try {
-    scopes =
-      theme || options.vars || options.schemes
-        ? (theme ??= Themes.create()).emit(
-            options.vars ?? {},
-            options.schemes ?? false,
-            options[Themes.shared],
-          )
-        : { classes: Object.freeze({}), css: '', resources: [], rules: [] }
-  } catch (error) {
-    throw new CompileError([
-      {
-        code: 'invalid_theme',
-        message: (error as Error).message,
-        path: ['vars'],
-      },
-    ])
-  }
-
-  const scopedCss = [
-    scopes.css,
-    ...[...rules].map((entry) => {
-      const [name, body] = entry
-      const selector = `.${ClassName.selector(selectors.get(name) ?? name)}`
-      const conditional = conditionalRules.get(name)
-      if (
-        !conditional ||
-        conditional.conditions.some(
-          (condition) =>
-            condition.startsWith('@') &&
-            !/^@(media|supports)\b/.test(condition),
-        )
-      )
-        return `${selector}{${body}}`
-
-      // Inactive conditions must surround the class rather than leave a matched empty wrapper.
-      const conditions = conditional.conditions.filter((condition) =>
-        condition.startsWith('@'),
-      )
-      const nested = conditional.conditions
-        .filter((condition) => !condition.startsWith('@'))
-        .reduceRight(
-          (body, condition) => `${condition}{${body}}`,
-          conditional.value,
-        )
-      return conditions.reduceRight(
-        (body, condition) => `${condition}{${body}}`,
-        `${selector}{${nested}}`,
-      )
-    }),
-  ]
-    .filter(Boolean)
-    .join('\n')
-
-  const result = {
-    ...(scopes.resources.length ? { [Themes.shared]: scopes.resources } : {}),
-    ...(contributionCss ? { contributionCss, scopedCss } : {}),
-    [ClassName.units]: units.used,
-    [ClassName.rules]: Object.freeze({
-      ...Object.fromEntries(rules),
-      ...Object.fromEntries(
-        scopes.rules.map((rule) => [
-          `@scope:${rule.selector.slice(1)}:${Identity.name(rule.property)}:${Identity.name(JSON.stringify(rule.conditions))}`,
-          rule.value,
-        ]),
-      ),
-    }),
-    classes: Object.freeze(classes),
-    css: [contributionCss, scopedCss].filter(Boolean).join('\n'),
-    vars: scopes.classes as Readonly<Record<themeName, string>>,
-  }
-  Object.defineProperty(result, ClassName.rules, { enumerable: false })
-  Object.defineProperty(result, ClassName.units, { enumerable: false })
-  return Object.freeze(result)
+  // A supplied unit scope receives the naming decisions the engine made against its table.
+  return Wire.decode(
+    Engine.call('css.compile', input),
+    options[ClassName.units],
+  ) as compile.ReturnType<name, themeName>
 }
 
 /** Input and output contracts for literal compilation. */
@@ -1036,11 +148,3 @@ export type Diagnostic = {
   /** Authored style name, followed by a property when applicable. */
   readonly path: readonly string[]
 }
-
-// Encoding underscores and delimiters makes the value form injective.
-function encode(value: string): string {
-  return value.replace(
-    /[^a-zA-Z0-9-]/g,
-    (character) => `_${character.charCodeAt(0).toString(16)}_`,
-  )
-}