refactor(design): map semantic tokens to new primitive layer

[jd]

Co-Authored-By: Claude Sonnet 4.6 noreply@anthropic.com

Depends-On: #11305

[jd]

This pull request is part of a Mergify stack:

#	Pull Request	Link
1	feat(design): add primitive token layer (tokens.css)	#11299
2	feat(design): add typography utilities (typography.css)	#11300
3	feat(design): load tokens.css and typography.css	#11301
4	docs(design): add DESIGN.md design system documentation	#11302
5	docs(design): link DESIGN.md from AGENTS.md and CLAUDE.md	#11303
6	fix(lint): exclude root *.md files from remark-lint rules	#11304
7	fix(design): address Phase 1 code review findings	#11305
8	refactor(design): map semantic tokens to new primitive layer	#11307	👈
9	fix(header): tighten navbar opacity for link readability	#11308

[mergify]

Merge Protections

Your pull request matches the following merge protections and will not be merged until they are valid.

🔴 ⛓️ Depends-On Requirements

Waiting for:

• depends-on = Mergifyio/docs#11299 [⛓️ feat(design): add primitive token layer (tokens.css) #11299 [stack]]
• depends-on = Mergifyio/docs#11300 [⛓️ feat(design): add typography utilities (typography.css) #11300 [stack]]
• depends-on = Mergifyio/docs#11301 [⛓️ feat(design): load tokens.css and typography.css #11301 [stack]]
• depends-on = Mergifyio/docs#11302 [⛓️ docs(design): add DESIGN.md design system documentation #11302 [stack]]
• depends-on = Mergifyio/docs#11303 [⛓️ docs(design): link DESIGN.md from AGENTS.md and CLAUDE.md #11303 [stack]]
• depends-on = Mergifyio/docs#11304 [⛓️ fix(lint): exclude root *.md files from remark-lint rules #11304 [stack]]
• depends-on = Mergifyio/docs#11305 [⛓️ fix(design): address Phase 1 code review findings #11305 [stack]]

This rule is failing.

Requirement based on the presence of Depends-On in the body of the pull request

• depends-on = Mergifyio/docs#11299 [⛓️ feat(design): add primitive token layer (tokens.css) #11299 [stack]]
• depends-on = Mergifyio/docs#11300 [⛓️ feat(design): add typography utilities (typography.css) #11300 [stack]]
• depends-on = Mergifyio/docs#11301 [⛓️ feat(design): load tokens.css and typography.css #11301 [stack]]
• depends-on = Mergifyio/docs#11302 [⛓️ docs(design): add DESIGN.md design system documentation #11302 [stack]]
• depends-on = Mergifyio/docs#11303 [⛓️ docs(design): link DESIGN.md from AGENTS.md and CLAUDE.md #11303 [stack]]
• depends-on = Mergifyio/docs#11304 [⛓️ fix(lint): exclude root *.md files from remark-lint rules #11304 [stack]]
• depends-on = Mergifyio/docs#11305 [⛓️ fix(design): address Phase 1 code review findings #11305 [stack]]

🔴 👀 Review Requirements

Waiting for:

• #approved-reviews-by >= 2

This rule is failing.

• any of:
  • #approved-reviews-by >= 2
  • author = dependabot[bot]
  • author = mergify-ci-bot

🔴 🔎 Reviews

Waiting for:

• #review-requested = 0

This rule is failing.

• #review-requested = 0
• #changes-requested-reviews-by = 0
• #review-threads-unresolved = 0

🟢 🤖 Continuous Integration

Wonderful, this rule succeeded.

• all of:
  • check-success = build
  • check-success = lint
  • check-success = test
  • any of:
    • check-success = test-broken-links
    • label = ignore-broken-links
  • any of:
    • check-success=Cloudflare Pages
    • -head-repo-full-name~=^Mergifyio/

🟢 Enforce conventional commit

Wonderful, this rule succeeded.

Make sure that we follow https://www.conventionalcommits.org/en/v1.0.0/

• title ~= ^(fix|feat|docs|style|refactor|perf|test|build|ci|chore|revert|ui)(?:\(.+\))?:

🟢 📕 PR description

Wonderful, this rule succeeded.

• body ~= (?ms:.{48,})

[jd]

Revision history

#	Type	Changes	Reason	Date
1	initial	24bb55c		2026-04-29 13:21 UTC
2	rebase	24bb55c → 7396871		2026-04-29 13:21 UTC