# CEM CSS generators

HTML templates that read built token specs and emit generated CSS.

Generator | Token spec | Generated CSS | Scope
--- | --- | --- | ---
Breakpoints | cem-breakpoints.xhtml | cem-breakpoints.css | Viewport, height, and container-query reference tokens.
Colors | cem-colors.xhtml | cem-colors.css | Palette, theme mode, action intent, and zebra state tokens.
Controls | cem-controls.xhtml | cem-controls.css | Visual control geometry: heights, paddings, icon button, list/menu/table row sizes, per-coupling-mode overrides.
Coupling | cem-coupling.xhtml | cem-coupling.css | Operability safety contract: zone, guard, halo, and per-mode halo policy.
Dimension | cem-dimension.xhtml | cem-dimension.css | Scale, spacing, rhythm, layout, and density mode tokens.
Shape | cem-shape.xhtml | cem-shape.css | Bend basis, semantic endpoints, attachment patterns, and brand mode (sharp/smooth/round) overrides.
Stroke | cem-stroke.xhtml | cem-stroke.css | Stroke basis, semantic endpoints, ring recipes, and forced-colors fallbacks.
Layering | cem-layering.xhtml | cem-layering.css | Signed-depth ladder (recess/elevation rungs as box-shadow recipes), semantic layer endpoints, and forced-colors fallbacks.
Voice / Fonts / Typography | cem-voice-fonts-typography.xhtml | cem-voice-fonts-typography.css | Family stacks, weight/size/line-height/tracking primitives, feature policies, reading ergonomics, voice channels (ink + speech), 8 semantic role endpoints, and dark/contrast ink projections.
Timing | cem-timing.xhtml | cem-timing.css | Duration, easing, and reduced-motion tokens.