move docs back repo

docs-site/.vitepress/config.ts

@@ -0,0 +1,119 @@
+export default {
+  title: 'SubMiner Docs',
+  description:
+    'SubMiner: an MPV immersion-mining overlay with Yomitan and AnkiConnect integration.',
+  head: [
+    ['link', { rel: 'icon', href: '/favicon.ico', sizes: 'any' }],
+    [
+      'link',
+      {
+        rel: 'icon',
+        type: 'image/png',
+        href: '/favicon-32x32.png',
+        sizes: '32x32',
+      },
+    ],
+    [
+      'link',
+      {
+        rel: 'icon',
+        type: 'image/png',
+        href: '/favicon-16x16.png',
+        sizes: '16x16',
+      },
+    ],
+    [
+      'link',
+      {
+        rel: 'apple-touch-icon',
+        href: '/apple-touch-icon.png',
+        sizes: '180x180',
+      },
+    ],
+  ],
+  appearance: 'dark',
+  cleanUrls: true,
+  metaChunk: true,
+  sitemap: { hostname: 'https://docs.subminer.moe' },
+  lastUpdated: true,
+  srcExclude: ['subagents/**'],
+  markdown: {
+    theme: {
+      light: 'catppuccin-latte',
+      dark: 'catppuccin-macchiato',
+    },
+  },
+  themeConfig: {
+    logo: {
+      light: '/assets/SubMiner.png',
+      dark: '/assets/SubMiner.png',
+    },
+    siteTitle: 'SubMiner Docs',
+    nav: [
+      { text: 'Home', link: '/' },
+      { text: 'Get Started', link: '/installation' },
+      { text: 'Mining', link: '/mining-workflow' },
+      { text: 'Configuration', link: '/configuration' },
+      { text: 'Changelog', link: '/changelog' },
+      { text: 'Troubleshooting', link: '/troubleshooting' },
+    ],
+    sidebar: [
+      {
+        text: 'Getting Started',
+        items: [
+          { text: 'Overview', link: '/' },
+          { text: 'Installation', link: '/installation' },
+          { text: 'Usage', link: '/usage' },
+          { text: 'Mining Workflow', link: '/mining-workflow' },
+          { text: 'Launcher Script', link: '/launcher-script' },
+        ],
+      },
+      {
+        text: 'Reference',
+        items: [
+          { text: 'Configuration', link: '/configuration' },
+          { text: 'Keyboard Shortcuts', link: '/shortcuts' },
+          { text: 'Subtitle Annotations', link: '/subtitle-annotations' },
+          { text: 'Immersion Tracking', link: '/immersion-tracking' },
+          { text: 'Troubleshooting', link: '/troubleshooting' },
+        ],
+      },
+      {
+        text: 'Integrations',
+        items: [
+          { 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: 'Character Dictionary', link: '/character-dictionary' },
+        ],
+      },
+      {
+        text: 'Development',
+        items: [
+          { text: 'Building & Testing', link: '/development' },
+          { text: 'Architecture', link: '/architecture' },
+          { text: 'IPC + Runtime Contracts', link: '/ipc-contracts' },
+          { text: 'Changelog', link: '/changelog' },
+        ],
+      },
+    ],
+    search: {
+      provider: 'local',
+    },
+    footer: {
+      message: 'Released under the GPL-3.0 License.',
+      copyright: 'Copyright © 2026-present sudacode',
+    },
+    editLink: {
+      pattern: 'https://github.com/ksyasuda/SubMiner/edit/main/docs-site/:path',
+      text: 'Edit this page on GitHub',
+    },
+    outline: { level: [2, 3], label: 'On this page' },
+    externalLinkIcon: true,
+    docFooter: { prev: 'Previous', next: 'Next' },
+    returnToTopLabel: 'Back to top',
+    socialLinks: [{ icon: 'github', link: 'https://github.com/ksyasuda/SubMiner' }],
+  },
+};

docs-site/.vitepress/theme/TuiLayout.vue

@@ -0,0 +1,18 @@
+<script setup>
+import DefaultTheme from 'vitepress/theme';
+import StatusLine from './components/StatusLine.vue';
+import BlinkingCursor from './components/BlinkingCursor.vue';
+
+const { Layout } = DefaultTheme;
+</script>
+
+<template>
+  <Layout>
+    <template #home-hero-info-after>
+      <BlinkingCursor />
+    </template>
+    <template #layout-bottom>
+      <StatusLine />
+    </template>
+  </Layout>
+</template>

docs-site/.vitepress/theme/components/BlinkingCursor.vue

@@ -0,0 +1,3 @@
+<template>
+  <span class="tui-cursor" aria-hidden="true">█</span>
+</template>

docs-site/.vitepress/theme/components/StatusLine.vue

@@ -0,0 +1,48 @@
+<script setup>
+import { useRoute, useData } from 'vitepress';
+import { computed } from 'vue';
+
+const route = useRoute();
+const { page, frontmatter } = useData();
+
+const mode = computed(() => {
+  const layout = frontmatter.value.layout;
+  if (layout === 'home') return 'HOME';
+  return 'NORMAL';
+});
+
+const filePath = computed(() => {
+  const path = route.path;
+  return path === '/' ? 'index.md' : `${path.replace(/^\//, '')}.md`;
+});
+
+const section = computed(() => {
+  const path = route.path;
+  if (path === '/') return 'root';
+  const parts = path.split('/').filter(Boolean);
+  return parts[0] || 'root';
+});
+
+const lastUpdated = computed(() => {
+  if (!page.value.lastUpdated) return '';
+  const date = new Date(page.value.lastUpdated);
+  return date.toISOString().slice(0, 10);
+});
+</script>
+
+<template>
+  <footer class="tui-statusline" aria-label="Page info">
+    <div class="tui-statusline__left">
+      <span class="tui-statusline__mode" :data-mode="mode">{{ mode }}</span>
+      <span class="tui-statusline__sep"></span>
+      <span class="tui-statusline__file">{{ filePath }}</span>
+    </div>
+    <div class="tui-statusline__right">
+      <span class="tui-statusline__section">{{ section }}</span>
+      <span class="tui-statusline__sep"></span>
+      <span v-if="lastUpdated" class="tui-statusline__date">{{ lastUpdated }}</span>
+      <span v-if="lastUpdated" class="tui-statusline__sep"></span>
+      <span class="tui-statusline__branch">GPL-3.0</span>
+    </div>
+  </footer>
+</template>

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

@@ -0,0 +1,222 @@
+import DefaultTheme from 'vitepress/theme';
+import { useRoute } from 'vitepress';
+import { nextTick, onMounted, watch } from 'vue';
+import '@catppuccin/vitepress/theme/macchiato/mauve.css';
+import './tui-theme.css';
+import './mermaid-modal.css';
+import TuiLayout from './TuiLayout.vue';
+
+let mermaidLoader: Promise<any> | null = null;
+let plausibleTrackerInitialized = false;
+const MERMAID_MODAL_ID = 'mermaid-diagram-modal';
+const PLAUSIBLE_DOMAIN = 'subminer.moe';
+const PLAUSIBLE_ENDPOINT = 'https://worker.subminer.moe/api/event';
+
+async function initPlausibleTracker() {
+  if (typeof window === 'undefined' || plausibleTrackerInitialized) {
+    return;
+  }
+
+  const { init } = await import('@plausible-analytics/tracker');
+  init({
+    domain: PLAUSIBLE_DOMAIN,
+    endpoint: PLAUSIBLE_ENDPOINT,
+    outboundLinks: true,
+    fileDownloads: true,
+    formSubmissions: true,
+    captureOnLocalhost: false,
+  });
+  plausibleTrackerInitialized = true;
+}
+
+function closeMermaidModal() {
+  if (typeof document === 'undefined') {
+    return;
+  }
+
+  const modal = document.getElementById(MERMAID_MODAL_ID);
+  if (!modal) {
+    return;
+  }
+
+  modal.classList.remove('is-open');
+  document.body.classList.remove('mermaid-modal-open');
+}
+
+function ensureMermaidModal(): HTMLDivElement {
+  const existing = document.getElementById(MERMAID_MODAL_ID);
+  if (existing) {
+    return existing as HTMLDivElement;
+  }
+
+  const modal = document.createElement('div');
+  modal.id = MERMAID_MODAL_ID;
+  modal.className = 'mermaid-modal';
+  modal.innerHTML = `
+    <div class="mermaid-modal__backdrop" data-mermaid-close="true"></div>
+    <div class="mermaid-modal__dialog" role="dialog" aria-modal="true" aria-label="Expanded Mermaid diagram">
+      <button class="mermaid-modal__close" type="button" aria-label="Close Mermaid diagram">Close</button>
+      <div class="mermaid-modal__content"></div>
+    </div>
+  `;
+
+  modal.addEventListener('click', (event) => {
+    const target = event.target as HTMLElement | null;
+    if (!target) {
+      return;
+    }
+
+    if (target.closest('[data-mermaid-close="true"]') || target.closest('.mermaid-modal__close')) {
+      closeMermaidModal();
+    }
+  });
+
+  document.addEventListener('keydown', (event) => {
+    if (event.key === 'Escape' && modal.classList.contains('is-open')) {
+      closeMermaidModal();
+    }
+  });
+
+  document.body.appendChild(modal);
+  return modal;
+}
+
+function openMermaidModal(sourceNode: HTMLElement) {
+  if (typeof document === 'undefined') {
+    return;
+  }
+
+  const modal = ensureMermaidModal();
+  const content = modal.querySelector<HTMLDivElement>('.mermaid-modal__content');
+  if (!content) {
+    return;
+  }
+
+  content.replaceChildren(sourceNode.cloneNode(true));
+  modal.classList.add('is-open');
+  document.body.classList.add('mermaid-modal-open');
+}
+
+function attachMermaidInteractions(nodes: HTMLElement[]) {
+  for (const node of nodes) {
+    if (node.dataset.mermaidInteractive === 'true') {
+      continue;
+    }
+
+    const svg = node.querySelector<HTMLElement>('svg');
+    if (!svg) {
+      continue;
+    }
+
+    node.classList.add('mermaid-interactive');
+    node.setAttribute('role', 'button');
+    node.setAttribute('tabindex', '0');
+    node.setAttribute('aria-label', 'Open Mermaid diagram in full view');
+
+    const open = () => openMermaidModal(svg);
+    node.addEventListener('click', open);
+    node.addEventListener('keydown', (event) => {
+      if (event.key === 'Enter' || event.key === ' ') {
+        event.preventDefault();
+        open();
+      }
+    });
+
+    node.dataset.mermaidInteractive = 'true';
+  }
+}
+
+async function getMermaid() {
+  if (!mermaidLoader) {
+    mermaidLoader = import('mermaid').then((module) => {
+      const mermaid = module.default;
+      mermaid.initialize({
+        startOnLoad: false,
+        securityLevel: 'loose',
+        theme: 'base',
+        themeVariables: {
+          background: '#24273a',
+          primaryColor: '#363a4f',
+          primaryTextColor: '#cad3f5',
+          primaryBorderColor: '#c6a0f6',
+          secondaryColor: '#494d64',
+          secondaryTextColor: '#cad3f5',
+          secondaryBorderColor: '#b7bdf8',
+          tertiaryColor: '#5b6078',
+          tertiaryTextColor: '#cad3f5',
+          tertiaryBorderColor: '#8aadf4',
+          lineColor: '#939ab7',
+          textColor: '#cad3f5',
+          mainBkg: '#363a4f',
+          nodeBorder: '#c6a0f6',
+          clusterBkg: '#1e2030',
+          clusterBorder: '#494d64',
+          edgeLabelBackground: '#24273a',
+          labelTextColor: '#cad3f5',
+        },
+      });
+      return mermaid;
+    });
+  }
+  return mermaidLoader;
+}
+
+async function renderMermaidBlocks() {
+  if (typeof document === 'undefined') {
+    return;
+  }
+  const blocks = Array.from(document.querySelectorAll<HTMLElement>('div.language-mermaid'));
+  if (blocks.length === 0) {
+    return;
+  }
+
+  const mermaid = await getMermaid();
+  const nodes: HTMLElement[] = [];
+
+  for (const block of blocks) {
+    if (block.dataset.mermaidRendered === 'true') {
+      continue;
+    }
+    const code = block.querySelector('pre code');
+    const source = code?.textContent?.trim();
+    if (!source) {
+      continue;
+    }
+
+    const mount = document.createElement('div');
+    mount.className = 'mermaid';
+    mount.textContent = source;
+
+    block.replaceChildren(mount);
+    block.dataset.mermaidRendered = 'true';
+    nodes.push(mount);
+  }
+
+  if (nodes.length > 0) {
+    await mermaid.run({ nodes });
+    attachMermaidInteractions(nodes);
+  }
+}
+
+export default {
+  Layout: TuiLayout,
+  extends: DefaultTheme,
+  setup() {
+    const route = useRoute();
+    const render = () => {
+      nextTick(() => {
+        renderMermaidBlocks().catch((error) => {
+          console.error('Failed to render Mermaid diagram:', error);
+        });
+      });
+    };
+
+    onMounted(() => {
+      initPlausibleTracker().catch((error) => {
+        console.error('Failed to initialize Plausible tracker:', error);
+      });
+      render();
+    });
+    watch(() => route.path, render);
+  },
+};

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

@@ -0,0 +1,80 @@
+.mermaid-interactive {
+  cursor: zoom-in;
+  transition: outline-color 180ms ease;
+}
+
+.mermaid-interactive:focus-visible {
+  outline: 2px solid var(--vp-c-brand-1);
+  outline-offset: 4px;
+  border-radius: 0;
+}
+
+.mermaid-modal {
+  position: fixed;
+  inset: 0;
+  z-index: 200;
+  display: none;
+}
+
+.mermaid-modal.is-open {
+  display: block;
+}
+
+.mermaid-modal__backdrop {
+  position: absolute;
+  inset: 0;
+  background: rgba(0, 0, 0, 0.72);
+  backdrop-filter: blur(4px);
+  -webkit-backdrop-filter: blur(4px);
+}
+
+.mermaid-modal__dialog {
+  position: relative;
+  z-index: 1;
+  margin: 4vh auto;
+  width: min(96vw, 1800px);
+  max-height: 92vh;
+  border: 1px solid var(--vp-c-border);
+  border-radius: 0;
+  background: var(--vp-c-bg);
+  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 24px 64px rgba(0, 0, 0, 0.2);
+  overflow: hidden;
+}
+
+.mermaid-modal__close {
+  display: block;
+  margin-left: auto;
+  margin-right: 16px;
+  margin-top: 12px;
+  border: 1px solid var(--vp-c-border);
+  border-radius: 0;
+  padding: 4px 10px;
+  background: var(--vp-c-bg-soft);
+  color: var(--vp-c-text-1);
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  cursor: pointer;
+  transition: border-color 180ms ease, color 180ms ease;
+}
+
+.mermaid-modal__close:hover {
+  border-color: var(--vp-c-brand-1);
+  color: var(--vp-c-brand-1);
+}
+
+.mermaid-modal__content {
+  overflow: auto;
+  max-height: calc(92vh - 56px);
+  padding: 8px 16px 16px;
+}
+
+.mermaid-modal__content svg {
+  max-width: none;
+  width: max-content;
+  height: auto;
+  min-width: 100%;
+}
+
+body.mermaid-modal-open {
+  overflow: hidden;
+}

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

@@ -0,0 +1,637 @@
+@import '@fontsource/jetbrains-mono/400.css';
+@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';
+
+:root {
+  --tui-font-mono: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', monospace;
+  --tui-font-body: 'Manrope', system-ui, sans-serif;
+  --tui-transition: 180ms ease;
+}
+
+:root {
+  --vp-font-family-base: var(--tui-font-body);
+  --vp-font-family-mono: var(--tui-font-mono);
+}
+
+/* === Selection === */
+::selection {
+  background: hsla(267, 83%, 80%, 0.22);
+  color: var(--vp-c-text-1);
+}
+
+/* === Scrollbar === */
+::-webkit-scrollbar {
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background: transparent;
+}
+
+::-webkit-scrollbar-thumb {
+  background: var(--vp-c-divider);
+  border-radius: 0;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: var(--vp-c-text-3);
+}
+
+/* === Global transitions === */
+a,
+button,
+.VPFeature,
+.VPNavBarMenuLink,
+.VPSidebarItem .text {
+  transition: color var(--tui-transition), background var(--tui-transition),
+    border-color var(--tui-transition), opacity var(--tui-transition);
+}
+
+/* === Nav bar === */
+.VPNav .VPNavBarTitle .title {
+  font-family: var(--tui-font-mono);
+  font-weight: 600;
+  font-size: 14px;
+  letter-spacing: -0.02em;
+}
+
+.VPNav .VPNavBarMenuLink {
+  font-family: var(--tui-font-mono);
+  font-size: 13px;
+  font-weight: 500;
+}
+
+.VPNav .VPNavBar {
+  border-bottom: 1px solid var(--vp-c-divider);
+  backdrop-filter: blur(12px) saturate(1.2);
+  -webkit-backdrop-filter: blur(12px) saturate(1.2);
+}
+
+.VPNav .VPNavBar:not(.has-sidebar) {
+  background: hsla(232, 23%, 18%, 0.82);
+}
+
+.VPNav .VPNavBar.has-sidebar .content {
+  backdrop-filter: blur(12px) saturate(1.2);
+  -webkit-backdrop-filter: blur(12px) saturate(1.2);
+}
+
+/* === Sidebar === */
+.VPSidebar .VPSidebarItem .text {
+  font-family: var(--tui-font-mono);
+  font-size: 13px;
+}
+
+.VPSidebar .VPSidebarItem.is-active.is-link > .item .text::before {
+  content: '> ';
+  color: var(--vp-c-brand-1);
+}
+
+.VPSidebar .VPSidebarItem.is-link:not(.is-active) > .item .text::before {
+  content: '  ';
+  opacity: 0.4;
+}
+
+.VPSidebar .VPSidebarItem.is-link:not(.is-active) > .item:hover .text::before {
+  content: '> ';
+  color: var(--vp-c-text-3);
+  opacity: 0.6;
+}
+
+.VPSidebar .VPSidebarItem.is-link:not(.is-active) > .item:hover .text {
+  color: var(--vp-c-text-1) !important;
+}
+
+.VPSidebar .VPSidebarItem.level-0 > .item .text {
+  font-weight: 700;
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+}
+
+.VPSidebar .VPSidebarItem.level-0 > .item .text::before {
+  content: '# ';
+  color: var(--vp-c-text-3);
+}
+
+.VPSidebar .VPSidebarItem.level-0 .items {
+  border-left: 1px solid var(--vp-c-divider);
+  margin-left: 6px;
+  padding-left: 12px;
+}
+
+/* === Headings === */
+.vp-doc h1,
+.vp-doc h2,
+.vp-doc h3,
+.vp-doc h4 {
+  font-family: var(--tui-font-mono);
+}
+
+.vp-doc h1 {
+  letter-spacing: -0.02em;
+}
+
+.vp-doc h1::before {
+  content: '> ';
+  color: var(--vp-c-brand-1);
+  font-weight: 400;
+}
+
+.vp-doc h2 {
+  border-bottom: none;
+  padding-bottom: 4px;
+}
+
+.vp-doc h2::after {
+  content: '';
+  display: block;
+  margin-top: 6px;
+  height: 1px;
+  background: repeating-linear-gradient(
+    to right,
+    var(--vp-c-divider) 0,
+    var(--vp-c-divider) 1ch,
+    transparent 1ch,
+    transparent 1.5ch
+  );
+}
+
+/* === Inline code === */
+.vp-doc :not(pre) > code {
+  border-radius: 0;
+  padding: 2px 6px;
+  font-size: 0.88em;
+  background: var(--vp-c-bg-soft);
+  border: 1px solid var(--vp-c-divider);
+  color: var(--vp-c-brand-1);
+}
+
+/* === Code blocks === */
+.vp-doc div[class*='language-'] {
+  border-radius: 0;
+  border: 1px solid var(--vp-c-divider);
+  background: var(--vp-c-bg-alt) !important;
+}
+
+.vp-doc div[class*='language-']::before {
+  font-family: var(--tui-font-mono);
+  font-size: 11px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  color: var(--vp-c-text-3);
+}
+
+.vp-doc div[class*='language-'] > button.copy {
+  border-radius: 0;
+}
+
+/* === Tables === */
+.vp-doc table {
+  border-collapse: collapse;
+  border: 1px solid var(--vp-c-divider);
+}
+
+.vp-doc table th {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+  background: var(--vp-c-bg-soft);
+}
+
+.vp-doc table td,
+.vp-doc table th {
+  border: 1px solid var(--vp-c-divider);
+}
+
+.vp-doc table tr:hover td {
+  background: hsla(232, 23%, 18%, 0.4);
+}
+
+/* === Links === */
+.vp-doc a {
+  text-decoration: none;
+  border-bottom: 1px solid hsla(267, 83%, 80%, 0.3);
+  transition: border-color var(--tui-transition), color var(--tui-transition);
+}
+
+.vp-doc a:hover {
+  border-bottom-color: var(--vp-c-brand-1);
+}
+
+/* === Custom containers === */
+.vp-doc .custom-block {
+  border: 1px solid var(--vp-c-divider);
+  border-radius: 0;
+  padding: 16px 20px;
+  margin: 16px 0;
+  position: relative;
+  background: var(--vp-c-bg-soft);
+}
+
+.vp-doc .custom-block::before {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  font-weight: 600;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  position: absolute;
+  top: -1px;
+  left: 12px;
+  transform: translateY(-50%);
+  padding: 0 6px;
+  background: var(--vp-c-bg);
+}
+
+.vp-doc .custom-block.tip,
+.vp-doc .custom-block.info,
+.vp-doc .custom-block.warning,
+.vp-doc .custom-block.danger,
+.vp-doc .custom-block.details {
+  border-left-width: 1px;
+}
+
+.vp-doc .custom-block.tip { border-color: var(--vp-c-brand-1); }
+.vp-doc .custom-block.tip::before { content: '-- tip'; color: var(--vp-c-brand-1); }
+
+.vp-doc .custom-block.info { border-color: var(--vp-c-brand-2); }
+.vp-doc .custom-block.info::before { content: '-- info'; color: var(--vp-c-brand-2); }
+
+.vp-doc .custom-block.warning { border-color: var(--vp-c-warning-1); }
+.vp-doc .custom-block.warning::before { content: '-- warning'; color: var(--vp-c-warning-1); }
+
+.vp-doc .custom-block.danger { border-color: var(--vp-c-danger-1); }
+.vp-doc .custom-block.danger::before { content: '-- danger'; color: var(--vp-c-danger-1); }
+
+.vp-doc .custom-block.details { border-color: var(--vp-c-divider); }
+.vp-doc .custom-block.details::before { content: '-- details'; color: var(--vp-c-text-2); }
+
+.vp-doc .custom-block .custom-block-title {
+  font-family: var(--tui-font-mono);
+  font-size: 13px;
+  font-weight: 600;
+}
+
+/* === Blockquotes === */
+.vp-doc blockquote {
+  border-left: 2px solid var(--vp-c-divider);
+  padding: 4px 0 4px 16px;
+  margin: 16px 0;
+  color: var(--vp-c-text-2);
+  font-style: normal;
+  position: relative;
+}
+
+.vp-doc blockquote::before {
+  content: '│';
+  position: absolute;
+  left: -2px;
+  top: 4px;
+  color: var(--vp-c-brand-1);
+  font-family: var(--tui-font-mono);
+  font-size: 14px;
+  line-height: 1;
+  opacity: 0;
+}
+
+/* === Horizontal rules === */
+.vp-doc hr {
+  border: none;
+  height: 1px;
+  margin: 24px 0;
+  background: repeating-linear-gradient(
+    to right,
+    var(--vp-c-divider) 0,
+    var(--vp-c-divider) 1ch,
+    transparent 1ch,
+    transparent 1.5ch
+  );
+}
+
+/* === Lists === */
+.vp-doc ul > li::marker {
+  color: var(--vp-c-text-3);
+}
+
+.vp-doc ol > li::marker {
+  font-family: var(--tui-font-mono);
+  font-size: 0.85em;
+  color: var(--vp-c-text-3);
+}
+
+/* === Focus-visible === */
+:focus-visible {
+  outline: 2px solid var(--vp-c-brand-1);
+  outline-offset: 2px;
+}
+
+.vp-doc a:focus-visible {
+  outline-offset: 3px;
+  border-bottom-color: transparent;
+}
+
+/* === Feature icon hover === */
+.VPFeatures .VPFeature .icon {
+  transition: transform 280ms ease;
+}
+
+.VPFeatures .VPFeature:hover .icon {
+  transform: translateY(-2px);
+}
+
+/* === Blinking cursor === */
+.tui-cursor {
+  display: inline-block;
+  color: var(--vp-c-brand-1);
+  animation: tui-blink 1s step-end infinite;
+  font-family: var(--tui-font-mono);
+  font-size: 0.9em;
+  vertical-align: baseline;
+  margin-left: 2px;
+  line-height: 1;
+}
+
+@keyframes tui-blink {
+  0%, 100% { opacity: 1; }
+  50% { opacity: 0; }
+}
+
+
+/* === Statusline === */
+.tui-statusline {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 50;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  height: 28px;
+  padding: 0 12px;
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  font-weight: 500;
+  background: var(--vp-c-bg-soft);
+  border-top: 1px solid var(--vp-c-divider);
+  color: var(--vp-c-text-2);
+  user-select: none;
+}
+
+.tui-statusline__left,
+.tui-statusline__right {
+  display: flex;
+  align-items: center;
+  gap: 0;
+}
+
+.tui-statusline__mode {
+  padding: 0 10px;
+  font-weight: 700;
+  font-size: 11px;
+  letter-spacing: 0.04em;
+  color: var(--vp-c-bg);
+  background: var(--vp-c-brand-1);
+  line-height: 28px;
+  margin-left: -12px;
+}
+
+.tui-statusline__mode[data-mode="HOME"] {
+  background: var(--vp-c-brand-2);
+}
+
+.tui-statusline__sep {
+  display: inline-block;
+  margin: 0 2px;
+  color: var(--vp-c-divider);
+}
+
+.tui-statusline__sep::after {
+  content: '|';
+}
+
+.tui-statusline__file {
+  padding: 0 8px;
+  color: var(--vp-c-text-1);
+}
+
+.tui-statusline__section {
+  padding: 0 8px;
+  color: var(--vp-c-text-2);
+}
+
+.tui-statusline__date {
+  padding: 0 8px;
+  color: var(--vp-c-text-3);
+}
+
+.tui-statusline__branch {
+  padding: 0 10px;
+  font-weight: 600;
+  color: var(--vp-c-bg);
+  background: var(--vp-c-brand-3, var(--vp-c-brand-1));
+  line-height: 28px;
+  margin-right: -12px;
+}
+
+body {
+  padding-bottom: 28px;
+}
+
+@media (max-width: 640px) {
+  .tui-statusline__section,
+  .tui-statusline__date {
+    display: none;
+  }
+
+  .VPHome .VPHero::before {
+    display: none;
+  }
+}
+
+/* === Hero === */
+.VPHero .name {
+  font-family: var(--tui-font-mono) !important;
+}
+
+.VPHero .clip {
+  -webkit-text-fill-color: var(--vp-c-brand-1) !important;
+}
+
+.VPHero .text {
+  font-family: var(--tui-font-mono) !important;
+  font-size: 2rem !important;
+}
+
+.VPHero .tagline {
+  font-family: var(--tui-font-body);
+  color: var(--vp-c-text-2);
+}
+
+.VPHero .actions .action .VPButton {
+  font-family: var(--tui-font-mono);
+  font-size: 13px;
+  border-radius: 8px;
+  text-transform: lowercase;
+  transition: all var(--tui-transition);
+}
+
+.VPHero .actions .action .VPButton:hover {
+  transform: translateY(-1px);
+}
+
+.VPHero .actions .action .VPButton::before {
+  content: '[';
+  opacity: 0.5;
+  margin-right: 2px;
+}
+
+.VPHero .actions .action .VPButton::after {
+  content: ']';
+  opacity: 0.5;
+  margin-left: 2px;
+}
+
+.VPHero .image-container .image-bg {
+  opacity: 0.6;
+}
+
+/* === Features === */
+.VPFeatures .VPFeature {
+  border-radius: 8px !important;
+  border: 1px solid var(--vp-c-divider) !important;
+  transition: border-color var(--tui-transition), background var(--tui-transition),
+    transform var(--tui-transition);
+  position: relative;
+  overflow: hidden;
+}
+
+.VPFeatures .VPFeature::after {
+  content: '';
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  width: 0;
+  height: 2px;
+  background: var(--vp-c-brand-1);
+  transition: width 280ms ease;
+}
+
+.VPFeatures .VPFeature:hover {
+  border-color: var(--vp-c-brand-1) !important;
+  transform: translateY(-2px);
+}
+
+.VPFeatures .VPFeature:hover::after {
+  width: 100%;
+}
+
+.VPFeatures .VPFeature .title {
+  font-family: var(--tui-font-mono);
+  font-size: 14px;
+}
+
+.VPFeatures .VPFeature .details {
+  font-family: var(--tui-font-body);
+}
+
+/* === Outline === */
+.VPDocAsideOutline .outline-title {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+.VPDocAsideOutline .outline-link {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  transition: color var(--tui-transition);
+}
+
+.VPDocAsideOutline .outline-link.active {
+  color: var(--vp-c-brand-1);
+}
+
+.VPDocAsideOutline .outline-link.active::before {
+  content: '> ';
+}
+
+/* === Doc footer === */
+.VPDocFooter .edit-link-button,
+.VPDocFooter .last-updated-text {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+}
+
+.VPDocFooter .pager-link {
+  border-radius: 0;
+  transition: border-color var(--tui-transition);
+}
+
+.VPDocFooter .pager-link:hover {
+  border-color: var(--vp-c-brand-1);
+}
+
+.VPDocFooter .pager-link .title {
+  font-family: var(--tui-font-mono);
+}
+
+.VPDocFooter .pager-link .desc {
+  font-family: var(--tui-font-mono);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+/* === Search === */
+.VPLocalSearchBox .search-input {
+  font-family: var(--tui-font-mono);
+}
+
+/* === Background texture === */
+.VPDoc,
+.VPHome {
+  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.015'/%3E%3C/svg%3E");
+  background-repeat: repeat;
+  background-size: 200px 200px;
+}
+
+/* === Hero glow === */
+.VPHome .VPHero {
+  position: relative;
+  overflow: hidden;
+}
+
+.VPHome .VPHero::before {
+  content: '';
+  position: absolute;
+  top: -120px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 600px;
+  height: 400px;
+  background: radial-gradient(
+    ellipse at center,
+    hsla(267, 83%, 80%, 0.06) 0%,
+    transparent 70%
+  );
+  pointer-events: none;
+  z-index: -1;
+}
+
+/* === Footer === */
+.VPFooter {
+  font-family: var(--tui-font-mono);
+  font-size: 12px;
+  border-top: 1px solid var(--vp-c-divider);
+}