{
  "$description": "Component tier: what happens at a specific spot. Commitments, not suggestions: this component, this part, this token, resolved through the semantic tier. Extend per component only where precision pays. From tokenstoagents.ai/kit.",
  "button": {
    "primary": {
      "background":       { "$value": "{color.action.primary}",       "$type": "color", "$description": "Primary button fill." },
      "background-hover": { "$value": "{color.action.primary-hover}", "$type": "color", "$description": "Primary button hover fill." },
      "label":            { "$value": "{color.text.inverse}",         "$type": "color", "$description": "Primary button label color." }
    },
    "destructive": {
      "background": { "$value": "{color.feedback.danger}", "$type": "color", "$description": "Destructive button fill. The only button allowed to carry the danger role." },
      "label":      { "$value": "{color.text.inverse}",    "$type": "color", "$description": "Destructive button label color." }
    },
    "padding":      { "$value": "{space.inset.control}", "$type": "dimension", "$description": "Button inner padding, all variants." },
    "radius":       { "$value": "{radius.small}",        "$type": "dimension", "$description": "Button corner radius, all variants." },
    "label-size":   { "$value": "{text.body}",           "$type": "dimension", "$description": "Button label size, all variants." },
    "label-weight": { "$value": "{font.weight.medium}",  "$type": "fontWeight", "$description": "Button label weight, all variants." }
  },
  "input": {
    "background":    { "$value": "{color.surface.page}",  "$type": "color", "$description": "Input field background." },
    "border":        { "$value": "{color.border.default}","$type": "color", "$description": "Input border, resting state." },
    "border-focus":  { "$value": "{color.border.strong}", "$type": "color", "$description": "Input border, focused state." },
    "border-error":  { "$value": "{color.feedback.danger}","$type": "color", "$description": "Input border when validation fails." },
    "text":          { "$value": "{color.text.primary}",  "$type": "color", "$description": "Input value text." },
    "placeholder":   { "$value": "{color.text.muted}",    "$type": "color", "$description": "Input placeholder text." },
    "padding":       { "$value": "{space.inset.control}", "$type": "dimension", "$description": "Input inner padding." },
    "radius":        { "$value": "{radius.small}",        "$type": "dimension", "$description": "Input corner radius." }
  },
  "card": {
    "background": { "$value": "{color.surface.raised}",  "$type": "color", "$description": "Card background." },
    "border":     { "$value": "{color.border.default}",  "$type": "color", "$description": "Card border." },
    "padding":    { "$value": "{space.inset.card}",      "$type": "dimension", "$description": "Card inner padding." },
    "radius":     { "$value": "{radius.medium}",         "$type": "dimension", "$description": "Card corner radius." }
  }
}