Replace builtin blocks Sass with vanilla CSS

[farhan]

Parent story: https://github.com/openedx/edx-platform/issues/35300

Copy the following tasks into the PR description of the XBlock and update the status on PR.

Tasks:

• [ ] Convert Sass variable into css variables

• [ ] Compile the css file of the block following given steps.

  • [ ] Change this line to the following to avoid adding comments in the compiled css files

         source_comments: int = SASS_COMMENTS_NONE
    

  • [ ] Compile the sass to uncompressed CSS using following command

          npm run compile-sass-dev
    

  • [ ] Copy the compiled XBlock linked CSS (lms/static/css/*Display.css and lms/static/css/*Editor.css) into xmodule/static/css-builtin-blocks.
  • [ ] Format the CSS files using the editor.
  • [ ] Add those CSS files to version control.

• [ ] Replace add_sass_to_fragment to add_css_to_fragment in blocks .py file

• [ ] Remove all .scss files linked to the block under xmodule/assets.

  • Make sure to remove the .scss file in a separate alone commit so reviewer could review scss changes and they stay in history.
  • Don't remove the scss file if its linked to some other block.

Testing Notes:

• [ ] Run npm run build to run webpack and compile sass files.
• [ ] Run ./manage.py lms collectstatic in lms shell to re-collect static files.
• [ ] Run ./manage.py cms collectstatic in cms shell to re-collect static files.
• [ ] Verify the block's compiled css and the css global variables in the LMS
• [ ] Verify the block's compiled css and the css global variables in the Studio
• [ ] Test the XBlock rendering and User Experience in LMS
• [ ] Test the XBlock rendering and User Experience in Studio

Reference PR:

Here is initial reference PR [Some the changes are only 1 time changes so don't need them in next block PR's.]

### Tasks
- [ ] https://github.com/openedx/edx-platform/pull/35506