Vscode extension with katex in hover

Question

I had an idea to develop a simple extension for vscode that will help me to display math functions written in latex when I hover over python's comment.

Simple example:

# $y = x^2$
y = x ** 2

Even though vscode.Hover supports markdown (example), unfortunately, it does not support latex (example). I saw that vscode.MarkdownString partially supports html so I decided to try markdown-it-katex and was able to render something but I have no idea how to add KaTeX stylesheet and now I am getting the following results, while the expected output looks like this.

Even though, I have zero experience in TS, the code seems fairly simple now. I hope someone knows how the functionality can be achieved without some complicated overhead:

import * as markdownIt from 'markdown-it';
const markdownItKatex = require('markdown-it-katex');
const md = markdownIt({ html: true }).use(markdownItKatex);


vscode.languages.registerHoverProvider("python", {
    provideHover(document, position, token) {
        var text = document.lineAt(position).text;

        // if it is a comment in python, return content, otherwise return null
        // use katex to render math equations
        if (text.startsWith('#')) {
            // remove the comment symbol
            text = text.slice(1);

            // use markdown-it-katex to format the content
            const html = md.render(text);

            const contents = new vscode.MarkdownString(html);
            contents.isTrusted = true;
            contents.supportHtml = true;

            return new vscode.Hover(contents);
        }

        return null;
    }