docs: apply M PLUS 1 and Manrope font defaults for docs content

docs-site/.vitepress/config.ts

@@ -84,8 +84,9 @@ export default {
           { text: 'MPV Plugin', link: '/mpv-plugin' },
           { text: 'Anki', link: '/anki-integration' },
           { text: 'Jellyfin', link: '/jellyfin-integration' },
-          { text: 'Jimaku', link: '/configuration#jimaku' },
-          { text: 'AniList', link: '/configuration#anilist' },
+          { text: 'YouTube', link: '/youtube-integration' },
+          { text: 'Jimaku', link: '/jimaku-integration' },
+          { text: 'AniList', link: '/anilist-integration' },
           { text: 'Character Dictionary', link: '/character-dictionary' },
         ],
       },

docs-site/.vitepress/theme/index.ts

@@ -134,6 +134,11 @@ async function getMermaid() {
         startOnLoad: false,
         securityLevel: 'loose',
         theme: 'base',
+        flowchart: {
+          padding: 16,
+          nodeSpacing: 30,
+          rankSpacing: 40,
+        },
         themeVariables: {
           background: '#24273a',
           primaryColor: '#363a4f',

docs-site/.vitepress/theme/mermaid-modal.css

@@ -1,6 +1,14 @@
 .mermaid-interactive {
   cursor: zoom-in;
   transition: outline-color 180ms ease;
+  overflow-x: auto;
+  overflow-y: hidden;
+  text-align: center;
+}
+
+.mermaid-interactive svg {
+  display: inline-block;
+  min-width: 0;
 }
 
 .mermaid-interactive:focus-visible {

docs-site/.vitepress/theme/tui-theme.css

@@ -2,23 +2,50 @@
 @import '@fontsource/jetbrains-mono/500.css';
 @import '@fontsource/jetbrains-mono/600.css';
 @import '@fontsource/jetbrains-mono/700.css';
-@import '@fontsource/manrope/400.css';
-@import '@fontsource/manrope/500.css';
-@import '@fontsource/manrope/600.css';
-@import '@fontsource/manrope/700.css';
-@import '@fontsource/manrope/800.css';
+
+@font-face {
+  font-family: 'M PLUS 1';
+  src: url('/assets/fonts/Mplus1-Medium.ttf') format('truetype');
+  font-weight: 500;
+  font-style: normal;
+  font-display: swap;
+}
+
+@font-face {
+  font-family: 'Manrope Default';
+  src: url('/assets/fonts/manrope-latin-600-normal.ttf') format('truetype');
+  font-weight: 600;
+  font-style: normal;
+  font-display: swap;
+}
 
 :root {
   --tui-font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
-  --tui-font-body: 'Manrope', system-ui, sans-serif;
+  --tui-font-body:
+    'Manrope Default',
+    'M PLUS 1',
+    'Manrope',
+    'Noto Sans CJK JP',
+    'Noto Sans JP',
+    'Hiragino Kaku Gothic ProN',
+    'Meiryo',
+    'Yu Gothic',
+    'Hiragino Sans',
+    system-ui,
+    sans-serif;
   --tui-transition: 180ms ease;
 }
 
 :root {
   --vp-font-family-base: var(--tui-font-body);
+  --vp-font-family-heading: var(--tui-font-body);
   --vp-font-family-mono: var(--tui-font-mono);
 }
 
+.vp-doc {
+  font-family: var(--vp-font-family-base);
+}
+
 /* === Selection === */
 ::selection {
   background: hsla(267, 83%, 80%, 0.22);
@@ -132,7 +159,7 @@ button,
 .vp-doc h2,
 .vp-doc h3,
 .vp-doc h4 {
-  font-family: var(--tui-font-mono);
+  font-family: var(--vp-font-family-heading);
 }
 
 .vp-doc h1 {
@@ -172,6 +199,8 @@ button,
   background: var(--vp-c-bg-soft);
   border: 1px solid var(--vp-c-divider);
   color: var(--vp-c-brand-1);
+  font-family: var(--tui-font-mono), 'M PLUS 1', 'Noto Sans CJK JP', 'Noto Sans JP',
+    monospace;
 }
 
 /* === Code blocks === */
@@ -179,6 +208,8 @@ button,
   border-radius: 0;
   border: 1px solid var(--vp-c-divider);
   background: var(--vp-c-bg-alt) !important;
+  font-family: var(--tui-font-mono), 'M PLUS 1', 'Noto Sans CJK JP', 'Noto Sans JP',
+    monospace;
 }
 
 .vp-doc div[class*='language-']::before {