[Bug] `delimiter.parenthesis` and `delimiter.bracket` values not applied

Reproducible in vscode.dev or in VS Code Desktop?

• Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

• Not reproducible in the monaco editor playground

Monaco Editor Playground Link

Playground link

Monaco Editor Playground Code

// Theme matching (i.e. applying a style to a token) happens in JavaScript.
// We must therefore register the theme rules in JavaScript.

// A custom theme must name its base theme (i.e. 'vs', 'vs-dark' or 'hc-black')
// It can then choose to inherit the rules from the base theme or not
// A rule token matching is prefix based: e.g.
//  - string will match a token with type: string, string.double.js or string.html
//  - string.double will match a token with type string.double but will not match string or string.html

// !!! Tokens can be inspected using F1 > Developer: Inspect Tokens !!!

monaco.editor.defineTheme("myCustomTheme", {
	base: "vs", // can also be vs-dark or hc-black
	inherit: true, // can also be false to completely replace the builtin rules
	rules: [
		{
			token: "comment",
			foreground: "ffa500",
			fontStyle: "italic underline",
		},
		{ token: "comment.js", foreground: "008800", fontStyle: "bold" },
		{ token: "comment.css", foreground: "0000ff" }, // will inherit fontStyle from `comment` above
		{
			token: 'delimiter.bracket',
			foreground: "202020",
			background: "202020",
      	},
		{
			token: 'delimiter.parenthesis',
			foreground: "202020",
			background: "202020",
      	},
	],
	colors: {
		"editor.foreground": "#000000",
	},
});

monaco.editor.create(document.getElementById("container"), {
	value: getCode(),
	language: "javascript",
	theme: "myCustomTheme",
});

function getCode() {
	return (
		`// Imports
import mongoose, { Schema } from 'mongoose'

// Collection name
export const collection = 'Product'

// Schema
const schema = new Schema({
  name: {
    type: String,
    required: true
  },

  description: {
    type: String
  }
}, {timestamps: true})

// Model
export default mongoose.model(collection, schema, collection)`
	);
}

Reproduction Steps

Set delimiter.parenthesis and delimiter.bracket to whatever colour you want.

Actual (Problematic) Behavior

if you try to set a colour for delimiter.parenthesis and delimiter.bracket they don't seem to get applied.

Expected Behavior

delimiter.parenthesis and delimiter.bracket are set when applied.

Additional Context

I am using @monaco-editor/react v4.6.0
What's weird is when you inspect the token in the editor the foreground and background values are correct but the parenthesis and bracket colours arent correct.

Start with the linked Monaco Editor Playground reproduction and inspect the delimiter.bracket and delimiter.parenthesis tokens using Developer: Inspect Tokens. Trace how the custom theme rules are applied to these tokens, then verify in the playground that both configured foreground and background colors take effect.