Extending VSCode Markdown syntax highlighting to match nested Javascript code

I am trying to extend VSCode’s Markdown syntax highlighter in order to highlight some nested Javascript wrapped in a custom syntax. For example, the following Markdown file

# Example

@@$ var value = 10;

The result is @@{value}.

would be converted to

# Example

The result is 10.

I would like the following to be highlighted as Javascript in VSCode, as if they were wrapped in a fenced code block:

  • The contents of a line starting with @@$.

  • The contents wrapped between @@{ and }.

I tried modifying markdown.tmLanguage.json to add these:

"fenced_code_block_majsdown2": {
    "begin": "(^|\G)(@@$)",
    "name": "markup.fenced_code.block.markdown",
    "end": "(^|\G)(\r\n|\r|\n)\s*$",
    "patterns": [{ "include": "source.js" }]
},
"fenced_code_block_majsdown": {
    "begin": "(^|\G)(@@{)",
    "name": "markup.fenced_code.block.markdown",
    "end": "(^|\G)(})\s*$",
    "patterns": [{ "include": "source.js" }]
},

The code gets highlighted properly, but it seems that the "end" bit is ignored and I don’t understand why — starting from either a @@$ or @@{, the entire document is highlighted as Javascript. I’ve tried several combinations of regexes, and tried removing the initial part ((^|\G)), but I couldn’t figure out why the highlighter is so greedy.

How can I achieve my desired goal?