fix(a11y): update code highlight colors to meet contrast requirement

[dancormier]

Addresses:

• [x] https://stackoverflow.atlassian.net/browse/A11Y-10
• [x] https://stackoverflow.atlassian.net/browse/A11Y-11
• [x] https://stackoverflow.atlassian.net/browse/A11Y-12

---

This PR resolves outstanding contrast issues with code highlight colors. The changes should be subtle enough as to barely be noticeable.

[!NOTE] We could attempt to change many of these colors to use core Stacks colors, but I figure it's best to keep it simple for now in order to resolve A11Y issues and decide later if we want to make more sweeping changes here.

Color variable changes

variable name	mode	old color	old contrast	new color	new contrast
--highlight-literal	dark	hsl(27, 85%, 61.5%)	Lc 55	hsl(27, 95%, 65%)	Lc 60
--highlight-namespace	dark	hsl(27, 85%, 61.5%)	Lc 55	hsl(27, 95%, 65%)	Lc 60
--highlight-symbol	dark	hsl(306, 43%, 69%)	Lc 51	hsl(306, 50%, 75%)	Lc 60
--highlight-variable	light HC	hsl(88, 100%, 19%)	6.8:1	hsl(88, 100%, 18%)	7.3:1

Screenshot comparison (dark mode)

**Note**: The difference is in the orange (e.g.: `0.6em 0.7em`) and purple (e.g.: `border-radius`) text. ### Before  ### After 

Screenshot comparison (light HC mode)

**Note**: The difference is in the green (e.g.: `apples`) text. ### Before  ### After 

To test

• Go to https://deploy-preview-1724--stacks.netlify.app/product/components/code-blocks/
• Switch to dark mode
  • Look at the code blocks. They should look nearly identical to how they look in prod.
• Repeat, but for light HC mode

[netlify[bot]]

✅ Deploy Preview for stacks ready!

Name	Link
🔨 Latest commit	90e2854748d679e642bac08d9dc24715164b0d05
🔍 Latest deploy log	https://app.netlify.com/sites/stacks/deploys/66326cac46317e00084fcec7
😎 Deploy Preview	https://deploy-preview-1724--stacks.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.