feat(lint): add use-semantic-token rule with extensible token mapping

[natemoo-re]

Adds a new use-semantic-token ESLint rule that enforces semantic token usage in CSS properties.

Features

• Centralized configuration via TOKEN_RULES array - single source of truth for:

  • Token detection (which patterns to match)
  • Property validation (which properties each category allows)
  • Autofix suggestions (reverse lookup: property → correct category)

• Glob-like pattern matching for token paths:

  • content.* matches tokens.content.primary, tokens.content.onVibrant.light, etc.
  • interactive.*.content matches leaf content like tokens.interactive.chonky.embossed.accent.content
  • interactive.*.content.* matches nested content like tokens.interactive.chonky.debossed.neutral.content.primary
  • interactive.link.* matches all link tokens

• Full token path in error messages for clarity

Current Rules

Content tokens (content.*, interactive.*.content, interactive.*.content.*, interactive.link.*) are only allowed on:

• color
• text-decoration-color
• caret-color
• column-rule-color
• -webkit-text-fill-color
• -webkit-text-stroke-color

Extensibility

To add a new category (e.g., background), simply add to TOKEN_RULES:

{
  name: "background",
  tokenPatterns: ["background.*"],
  allowedProperties: new Set(["background", "background-color"]),
},

TODO before merge

• Fix existing violations
• Add autofix support

Closes DE-729

[linear]

DE-729 We have a lint rule for color: theme.tokens.content