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/Scripts/View/Cards/CardListItem.vue

@@ -168,7 +168,7 @@ $card-horizontal-gap    : $card-gap;
       flex-direction: column;
       flex: 1;
       justify-content: center;
-      font-size: $font-size-large;
+      font-size: $font-size-absolute-large;
     }
     .card__inner__selection_indicator {
       height: $card-inner-padding;
@@ -181,7 +181,7 @@ $card-horizontal-gap    : $card-gap;
       width: 100%;
       margin-top: .25em;
       vertical-align: middle;
-      font-size: $font-size-normal;
+      font-size: $font-size-absolute-normal;
     }
   }
   .card__expander {
@@ -203,7 +203,7 @@ $card-horizontal-gap    : $card-gap;
     }
 
     .card__expander__close-button {
-      font-size: $font-size-large;
+      font-size: $font-size-absolute-large;
       align-self: flex-end;
       margin-right: 0.25em;
       @include clickable;