Render bracket references as superscript text

This commit improves markdown rendering to convert reference labels
(e.g., `[1]`) to superscripts, improving document readability without
cluttering the text. This improvement applies documentation of all
scripts and categories.

Changes:

- Implement superscript conversion for reference labels within markdown
  content, ensuring a cleaner presentation of textual references.
- Enable HTML content within markdown, necessary for inserting `<sup>`
  elements due to limitations in `markdown-it`, see
  markdown-it/markdown-it#999 for details.
- Refactor markdown rendering process for improved testability and
  adherence to the Single Responsibility Principle.
- Create `_typography.scss` with font size definitions, facilitating
  better control over text presentation.
- Adjust external URL indicator icon sizing for consistency, aligning
  images with the top of the text to maintain a uniform appearence.
- Use normal font-size explicitly for documentation text to ensure
  consistency.
- Remove text size specification in `markdown-styles` mixin, using `1em`
  for spacing to simplify styling.
- Rename font sizing variables for clarity, distinguishing between
  absolute and relative units.
- Change `font-size-relative-smaller` to be `80%`, browser default for
  `font-size: smaller;` CSS style and use it with `<sup>` elements.
- Improve the logic for converting plain URLs to hyperlinks, removing
  trailing whitespace for cleaner link generation.
- Fix plain URL to hyperlink (autolinking) logic removing trailing
  whitespace from the original markdown content. This was revealed by
  tests after separating its logic.
- Increase test coverage with more tests.
- Add types for `markdown-it` through `@types/markdown-it` package for
  better editor support and maintainability.
- Simplify implementation of adding custom anchor attributes in
  `markdown-it` using latest documentation.

src/presentation/components/Code/CodeButtons/IconButton.vue

@@ -81,7 +81,7 @@ export default defineComponent({
   border-radius: 4px;
 
   .button__icon {
-    font-size: $font-size-larger;
+    font-size: $font-size-absolute-x-large;
   }
 
   @include clickable;
@@ -99,7 +99,7 @@ export default defineComponent({
   .button__text {
     display: none;
     font-family: $font-artistic;
-    font-size: $font-size-large;
+    font-size: $font-size-absolute-large;
     color: $color-primary;
     font-weight: 500;
     @include hover-or-touch {

src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.vue

@@ -63,14 +63,14 @@ export default defineComponent({
   padding: 0.2rem;
   .dollar {
     margin-right: 0.5rem;
-    font-size: $font-size-smaller;
+    font-size: $font-size-absolute-x-small;
     user-select: none;
   }
   .copy-action-container {
     margin-left: 1rem;
   }
   code {
-    font-size: $font-size-small;
+    font-size: $font-size-absolute-small;
   }
 }
 </style>