docmk 1.0.0

package/my-docs/tutorials/customization.md

@@ -0,0 +1,492 @@
+---
+title: 自定义文档站点
+description: 学习如何自定义 DocGen 文档站点的外观和功能
+---
+
+# 自定义文档站点
+
+让你的文档站点与众不同。
+
+## 自定义样式
+
+### 修改颜色主题
+
+创建自定义 CSS 文件覆盖默认变量：
+
+```css
+/* custom.css */
+:root {
+  /* 主色调 */
+  --color-primary: #3b82f6;
+  --color-primary-foreground: #ffffff;
+  
+  /* 背景色 */
+  --color-background: #f9fafb;
+  --color-foreground: #111827;
+  
+  /* 强调色 */
+  --color-accent: #dbeafe;
+  --color-accent-foreground: #1e40af;
+  
+  /* 边框和分隔线 */
+  --color-border: #e5e7eb;
+  --color-muted: #f3f4f6;
+}
+```
+
+### 自定义字体
+
+使用 Google Fonts 或本地字体：
+
+```css
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
+
+:root {
+  --font-sans: 'Inter', -apple-system, sans-serif;
+  --font-mono: 'Fira Code', monospace;
+}
+
+body {
+  font-family: var(--font-sans);
+}
+
+code, pre {
+  font-family: var(--font-mono);
+}
+```
+
+### 响应式断点
+
+自定义移动端和桌面端样式：
+
+```css
+/* 移动端 */
+@media (max-width: 768px) {
+  .container {
+    padding: 0 1rem;
+  }
+  
+  .sidebar {
+    transform: translateX(-100%);
+  }
+}
+
+/* 平板 */
+@media (min-width: 769px) and (max-width: 1024px) {
+  .container {
+    max-width: 720px;
+  }
+}
+
+/* 桌面端 */
+@media (min-width: 1025px) {
+  .container {
+    max-width: 1200px;
+  }
+}
+```
+
+## 自定义组件
+
+### 添加自定义 Logo
+
+替换默认 Logo：
+
+```html
+<!-- 在 index.html 中 -->
+<div class="logo">
+  <img src="/logo.svg" alt="My Docs" />
+  <span>My Documentation</span>
+</div>
+```
+
+### 自定义导航栏
+
+添加额外的导航链接：
+
+```vue
+<template>
+  <header class="header">
+    <nav class="nav">
+      <a href="/">首页</a>
+      <a href="/docs">文档</a>
+      <a href="/blog">博客</a>
+      <a href="/about">关于</a>
+    </nav>
+  </header>
+</template>
+```
+
+### 添加页脚
+
+创建自定义页脚组件：
+
+```vue
+<template>
+  <footer class="footer">
+    <div class="footer-content">
+      <div class="footer-section">
+        <h3>产品</h3>
+        <ul>
+          <li><a href="/features">功能特性</a></li>
+          <li><a href="/pricing">价格方案</a></li>
+          <li><a href="/roadmap">产品路线图</a></li>
+        </ul>
+      </div>
+      
+      <div class="footer-section">
+        <h3>资源</h3>
+        <ul>
+          <li><a href="/docs">文档</a></li>
+          <li><a href="/api">API 参考</a></li>
+          <li><a href="/examples">示例代码</a></li>
+        </ul>
+      </div>
+      
+      <div class="footer-section">
+        <h3>社区</h3>
+        <ul>
+          <li><a href="/blog">博客</a></li>
+          <li><a href="/forum">论坛</a></li>
+          <li><a href="/discord">Discord</a></li>
+        </ul>
+      </div>
+    </div>
+    
+    <div class="footer-bottom">
+      <p>&copy; 2026 Your Company. All rights reserved.</p>
+    </div>
+  </footer>
+</template>
+
+<style scoped>
+.footer {
+  background: var(--color-muted);
+  border-top: 1px solid var(--color-border);
+  padding: 3rem 0 1rem;
+  margin-top: 4rem;
+}
+
+.footer-content {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
+  gap: 2rem;
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: 0 2rem;
+}
+
+.footer-section h3 {
+  font-size: 0.875rem;
+  font-weight: 600;
+  margin-bottom: 1rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.footer-section ul {
+  list-style: none;
+  padding: 0;
+}
+
+.footer-section li {
+  margin-bottom: 0.5rem;
+}
+
+.footer-section a {
+  color: var(--color-muted-foreground);
+  text-decoration: none;
+  font-size: 0.875rem;
+}
+
+.footer-section a:hover {
+  color: var(--color-primary);
+}
+
+.footer-bottom {
+  text-align: center;
+  margin-top: 2rem;
+  padding-top: 2rem;
+  border-top: 1px solid var(--color-border);
+  color: var(--color-muted-foreground);
+  font-size: 0.875rem;
+}
+</style>
+```
+
+## 自定义 Markdown 渲染
+
+### 添加自定义容器
+
+支持警告、提示等容器：
+
+```markdown
+::: warning
+这是一个警告信息
+:::
+
+::: tip
+这是一个提示信息
+:::
+
+::: danger
+这是一个危险警告
+:::
+```
+
+实现自定义容器：
+
+```typescript
+import MarkdownIt from 'markdown-it'
+import container from 'markdown-it-container'
+
+const md = new MarkdownIt()
+  .use(container, 'warning', {
+    render: (tokens, idx) => {
+      if (tokens[idx].nesting === 1) {
+        return '<div class="warning">\n'
+      } else {
+        return '</div>\n'
+      }
+    }
+  })
+  .use(container, 'tip', {
+    render: (tokens, idx) => {
+      if (tokens[idx].nesting === 1) {
+        return '<div class="tip">\n'
+      } else {
+        return '</div>\n'
+      }
+    }
+  })
+```
+
+### 代码块增强
+
+添加复制按钮和行号：
+
+```typescript
+md.renderer.rules.fence = (tokens, idx) => {
+  const token = tokens[idx]
+  const lang = token.info.trim()
+  const code = token.content
+  
+  return `
+    <div class="code-block">
+      <div class="code-header">
+        <span class="language">${lang}</span>
+        <button class="copy-button" onclick="copyCode(this)">
+          复制
+        </button>
+      </div>
+      <pre><code class="language-${lang}">${escapeHtml(code)}</code></pre>
+    </div>
+  `
+}
+```
+
+### 自动链接标题
+
+为所有标题添加锚点链接：
+
+```typescript
+import anchor from 'markdown-it-anchor'
+
+md.use(anchor, {
+  permalink: true,
+  permalinkBefore: true,
+  permalinkSymbol: '#',
+  permalinkClass: 'header-anchor'
+})
+```
+
+## 添加交互功能
+
+### 代码复制功能
+
+```javascript
+function copyCode(button) {
+  const codeBlock = button.closest('.code-block')
+  const code = codeBlock.querySelector('code').textContent
+  
+  navigator.clipboard.writeText(code).then(() => {
+    button.textContent = '已复制!'
+    setTimeout(() => {
+      button.textContent = '复制'
+    }, 2000)
+  })
+}
+```
+
+### 目录高亮
+
+滚动时高亮当前章节：
+
+```javascript
+const observer = new IntersectionObserver((entries) => {
+  entries.forEach(entry => {
+    if (entry.isIntersecting) {
+      const id = entry.target.id
+      document.querySelectorAll('.toc-link').forEach(link => {
+        link.classList.remove('active')
+      })
+      document.querySelector(`a[href="#${id}"]`)?.classList.add('active')
+    }
+  })
+}, {
+  rootMargin: '-100px 0px -80% 0px'
+})
+
+document.querySelectorAll('h2, h3').forEach(heading => {
+  observer.observe(heading)
+})
+```
+
+### 深色模式切换
+
+添加手动切换深色模式：
+
+```vue
+<template>
+  <button @click="toggleDarkMode" class="theme-toggle">
+    <span v-if="isDark">🌞</span>
+    <span v-else>🌙</span>
+  </button>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+
+const isDark = ref(false)
+
+onMounted(() => {
+  isDark.value = localStorage.getItem('theme') === 'dark'
+  applyTheme()
+})
+
+function toggleDarkMode() {
+  isDark.value = !isDark.value
+  localStorage.setItem('theme', isDark.value ? 'dark' : 'light')
+  applyTheme()
+}
+
+function applyTheme() {
+  if (isDark.value) {
+    document.documentElement.classList.add('dark')
+  } else {
+    document.documentElement.classList.remove('dark')
+  }
+}
+</script>
+```
+
+## 集成第三方服务
+
+### 添加评论系统
+
+使用 Giscus：
+
+```html
+<script src="https://giscus.app/client.js"
+        data-repo="your-username/your-repo"
+        data-repo-id="your-repo-id"
+        data-category="Announcements"
+        data-category-id="your-category-id"
+        data-mapping="pathname"
+        data-reactions-enabled="1"
+        data-emit-metadata="0"
+        data-input-position="bottom"
+        data-theme="light"
+        data-lang="zh-CN"
+        crossorigin="anonymous"
+        async>
+</script>
+```
+
+### 添加搜索功能
+
+集成 Algolia DocSearch：
+
+```html
+<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3" />
+
+<script src="https://cdn.jsdelivr.net/npm/@docsearch/js@3"></script>
+<script>
+  docsearch({
+    appId: 'YOUR_APP_ID',
+    apiKey: 'YOUR_API_KEY',
+    indexName: 'YOUR_INDEX_NAME',
+    container: '#docsearch',
+  })
+</script>
+```
+
+### 添加分析统计
+
+Google Analytics 4：
+
+```html
+<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
+<script>
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){dataLayer.push(arguments);}
+  gtag('js', new Date());
+  gtag('config', 'G-XXXXXXXXXX');
+</script>
+```
+
+## 性能优化
+
+### 图片懒加载
+
+```html
+<img src="placeholder.jpg" 
+     data-src="actual-image.jpg" 
+     loading="lazy" 
+     alt="描述">
+```
+
+### 预加载关键资源
+
+```html
+<link rel="preload" href="/fonts/inter.woff2" as="font" type="font/woff2" crossorigin>
+<link rel="preload" href="/critical.css" as="style">
+```
+
+### Service Worker 缓存
+
+```javascript
+// service-worker.js
+self.addEventListener('install', (event) => {
+  event.waitUntil(
+    caches.open('docs-v1').then((cache) => {
+      return cache.addAll([
+        '/',
+        '/index.html',
+        '/assets/main.css',
+        '/assets/main.js'
+      ])
+    })
+  )
+})
+
+self.addEventListener('fetch', (event) => {
+  event.respondWith(
+    caches.match(event.request).then((response) => {
+      return response || fetch(event.request)
+    })
+  )
+})
+```
+
+## 总结
+
+通过这些自定义选项，你可以：
+
+- ✅ 创建独特的视觉风格
+- ✅ 添加自定义功能组件
+- ✅ 增强 Markdown 渲染
+- ✅ 集成第三方服务
+- ✅ 优化性能和用户体验
+
+继续探索更多可能性！

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "docmk",
+  "version": "1.0.0",
+  "description": "A CLI tool for scanning directories and generating static documentation websites",
+  "main": "dist/index.js",
+  "bin": {
+    "docmk": "./bin/docmk.js"
+  },
+  "type": "module",
+  "scripts": {
+    "dev": "tsx src/cli/index.ts",
+    "build": "tsup",
+    "typecheck": "tsc --noEmit",
+    "lint": "eslint src --ext .ts,.vue"
+  },
+  "keywords": [
+    "cli",
+    "documentation",
+    "markdown",
+    "skills"
+  ],
+  "author": "pan",
+  "homepage": "https://github.com/pan/docmk",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/pan/docmk.git"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@tailwindcss/typography": "^0.5.19",
+    "@types/markdown-it": "^14.1.2",
+    "@types/node": "^20.0.0",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "autoprefixer": "^10.4.23",
+    "eslint": "^8.0.0",
+    "postcss": "^8.5.6",
+    "tailwindcss": "^3.4.17",
+    "tsup": "^8.0.0",
+    "tsx": "^4.0.0",
+    "typescript": "^5.0.0"
+  },
+  "dependencies": {
+    "@vitejs/plugin-vue": "^5.0.0",
+    "chokidar": "^3.5.3",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "commander": "^11.0.0",
+    "gray-matter": "^4.0.3",
+    "lucide-vue-next": "^0.562.0",
+    "markdown-it": "^14.0.0",
+    "shiki": "^1.29.2",
+    "sirv": "^2.0.4",
+    "tailwind-merge": "^3.4.0",
+    "vite": "^5.0.0",
+    "vue": "^3.3.0",
+    "vue-router": "^4.2.0"
+  }
+}

package/postcss.config.js

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}

package/site/assets/main-BZUsYUCF.css

@@ -0,0 +1 @@
+.search-box[data-v-732fbf59]{position:relative;width:100%}.relative[data-v-732fbf59]{position:relative}.absolute[data-v-732fbf59]{position:absolute}.w-full[data-v-732fbf59]{width:100%}.h-4[data-v-732fbf59]{height:1rem}.w-4[data-v-732fbf59]{width:1rem}.h-5[data-v-732fbf59]{height:1.25rem}.h-9[data-v-732fbf59]{height:2.25rem}.left-3[data-v-732fbf59]{left:.75rem}.right-3[data-v-732fbf59]{right:.75rem}.top-1\/2[data-v-732fbf59]{top:50%}.top-full[data-v-732fbf59]{top:100%}.left-0[data-v-732fbf59]{left:0}.right-0[data-v-732fbf59]{right:0}.-translate-y-1\/2[data-v-732fbf59]{transform:translateY(-50%)}.pl-9[data-v-732fbf59]{padding-left:2.25rem}.pr-4[data-v-732fbf59]{padding-right:1rem}.px-1\.5[data-v-732fbf59]{padding-left:.375rem;padding-right:.375rem}.p-3[data-v-732fbf59]{padding:.75rem}.p-4[data-v-732fbf59]{padding:1rem}.mt-2[data-v-732fbf59]{margin-top:.5rem}.mb-1[data-v-732fbf59]{margin-bottom:.25rem}.gap-1[data-v-732fbf59]{gap:.25rem}.text-sm[data-v-732fbf59]{font-size:.875rem}.text-xs[data-v-732fbf59]{font-size:.75rem}.font-medium[data-v-732fbf59]{font-weight:500}.font-mono[data-v-732fbf59]{font-family:var(--font-mono)}.text-muted-foreground[data-v-732fbf59]{color:var(--color-muted-foreground)}.text-foreground[data-v-732fbf59]{color:var(--color-foreground)}.placeholder-muted-foreground[data-v-732fbf59]::-moz-placeholder{color:var(--color-muted-foreground)}.placeholder-muted-foreground[data-v-732fbf59]::placeholder{color:var(--color-muted-foreground)}.bg-secondary[data-v-732fbf59]{background-color:var(--color-secondary)}.bg-muted[data-v-732fbf59]{background-color:var(--color-muted)}.bg-card[data-v-732fbf59]{background-color:var(--color-card)}.bg-accent[data-v-732fbf59]{background-color:var(--color-accent)}.border[data-v-732fbf59]{border-width:1px}.border-b[data-v-732fbf59]{border-bottom-width:1px}.border-border[data-v-732fbf59]{border-color:var(--color-border)}.rounded-md[data-v-732fbf59]{border-radius:var(--radius-md)}.rounded-lg[data-v-732fbf59]{border-radius:var(--radius-lg)}.rounded[data-v-732fbf59]{border-radius:var(--radius-sm)}.shadow-lg[data-v-732fbf59]{box-shadow:var(--shadow-lg)}.z-50[data-v-732fbf59]{z-index:50}.max-h-96[data-v-732fbf59]{max-height:24rem}.overflow-y-auto[data-v-732fbf59]{overflow-y:auto}.items-center[data-v-732fbf59]{align-items:center}.text-center[data-v-732fbf59]{text-align:center}.block[data-v-732fbf59]{display:block}.hidden[data-v-732fbf59]{display:none}.inline-flex[data-v-732fbf59]{display:inline-flex}.transition-colors[data-v-732fbf59]{transition:color .2s ease,background-color .2s ease}.hover\:bg-accent[data-v-732fbf59]:hover{background-color:var(--color-accent)}.last\:border-b-0[data-v-732fbf59]:last-child{border-bottom-width:0}.line-clamp-2[data-v-732fbf59]{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.focus-outline[data-v-732fbf59]:focus{outline:none;border-color:var(--color-ring);box-shadow:0 0 0 2px #0000001a}@media (min-width: 640px){.sm\:inline-flex[data-v-732fbf59]{display:inline-flex}}#app[data-v-00943de1]{min-height:100vh}.home-page[data-v-b5063bba]{max-width:1000px;margin:0 auto}.hero-section[data-v-b5063bba]{text-align:center;padding:3rem 0;margin-bottom:3rem}.hero-title[data-v-b5063bba]{font-size:3rem;font-weight:700;color:#2c3e50;margin-bottom:1rem}.hero-description[data-v-b5063bba]{font-size:1.2rem;color:#666;max-width:600px;margin:0 auto;line-height:1.6}.content-overview[data-v-b5063bba]{space-y:3rem}.stats-grid[data-v-b5063bba]{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;margin-bottom:3rem}.stat-card[data-v-b5063bba]{background:linear-gradient(135deg,#3b82f6,#1e40af);color:#fff;padding:2rem;border-radius:12px;text-align:center;box-shadow:0 4px 6px #0000001a}.stat-number[data-v-b5063bba]{font-size:2.5rem;font-weight:700;margin-bottom:.5rem}.stat-label[data-v-b5063bba]{font-size:1rem;opacity:.9}.recent-section[data-v-b5063bba],.navigation-section[data-v-b5063bba]{margin-bottom:3rem}.recent-section h2[data-v-b5063bba],.navigation-section h2[data-v-b5063bba]{font-size:1.8rem;font-weight:600;color:#2c3e50;margin-bottom:1.5rem}.recent-files[data-v-b5063bba]{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}.recent-file-card[data-v-b5063bba]{background:#fff;border:1px solid #e1e5e9;border-radius:8px;padding:1.5rem;text-decoration:none;color:inherit;transition:all .2s ease}.recent-file-card[data-v-b5063bba]:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:#3182ce}.file-title[data-v-b5063bba]{font-weight:600;color:#2c3e50;margin-bottom:.5rem}.file-description[data-v-b5063bba]{color:#666;font-size:.9rem;margin-bottom:1rem;line-height:1.4}.file-meta[data-v-b5063bba]{color:#999;font-size:.8rem}.skill-grid[data-v-b5063bba]{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.skill-card[data-v-b5063bba]{background:#fff;border:1px solid #e1e5e9;border-radius:8px;padding:1.5rem;text-decoration:none;color:inherit;transition:all .2s ease}.skill-card[data-v-b5063bba]:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a;border-color:#3182ce}.skill-name[data-v-b5063bba]{font-weight:600;color:#2c3e50;font-size:1.1rem;margin-bottom:.5rem}.skill-description[data-v-b5063bba]{color:#666;font-size:.9rem;line-height:1.4;margin-bottom:1rem}.skill-files-count[data-v-b5063bba]{color:#3182ce;font-size:.8rem;font-weight:500}@media (max-width: 768px){.hero-title[data-v-b5063bba]{font-size:2rem}.hero-description[data-v-b5063bba]{font-size:1rem}.stats-grid[data-v-b5063bba],.recent-files[data-v-b5063bba],.skill-grid[data-v-b5063bba]{grid-template-columns:1fr}}.skill-page[data-v-277070de]{max-width:800px;margin:0 auto}.skill-header[data-v-277070de]{margin-bottom:3rem;padding-bottom:2rem;border-bottom:1px solid var(--color-border)}.skill-title[data-v-277070de]{font-size:2.25rem;font-weight:700;color:var(--color-foreground);margin-bottom:1rem;line-height:1.2;letter-spacing:-.02em}.skill-description[data-v-277070de]{font-size:1.125rem;color:var(--color-muted-foreground);margin-bottom:1.5rem;line-height:1.6}.skill-meta[data-v-277070de]{color:var(--color-muted-foreground);font-size:.875rem}.toc[data-v-277070de]{background:var(--color-muted);border-radius:var(--radius-lg);padding:1.5rem;margin-bottom:3rem;border:1px solid var(--color-border)}.toc h3[data-v-277070de]{margin:0 0 1rem;color:var(--color-foreground);font-size:.875rem;text-transform:uppercase;letter-spacing:.05em;font-weight:600}.toc-list[data-v-277070de]{list-style:none;padding:0;margin:0}.toc-list li[data-v-277070de]{margin-bottom:.5rem}.toc-level-1[data-v-277070de],.toc-level-2[data-v-277070de]{padding-left:0}.toc-level-3[data-v-277070de]{padding-left:1rem}.toc-level-4[data-v-277070de]{padding-left:2rem}.toc-link[data-v-277070de]{color:var(--color-muted-foreground);text-decoration:none;font-size:.875rem;transition:color .2s ease}.toc-link[data-v-277070de]:hover{color:var(--color-primary)}[data-v-277070de] .markdown-content{line-height:1.7;border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.875em;color:var(--color-foreground);border:1px solid var(--color-code-border)}[data-v-277070de] .markdown-content pre{background:var(--color-code-bg);border:1px solid var(--color-code-border);border-radius:var(--radius-lg);padding:1.25rem;overflow-x:auto;margin:1.5rem 0}[data-v-277070de] .markdown-content pre code{background:none;padding:0;border:none;border-radius:0;color:inherit;font-size:.875rem}[data-v-277070de] .markdown-content blockquote{border-left:4px solid var(--color-primary);background:var(--color-muted);padding:1rem 1.5rem;margin:1.5rem 0;border-radius:0 var(--radius-md) var(--radius-md) 0;color:var(--color-muted-foreground);font-style:italic}[data-v-277070de] .markdown-content table{width:100%;border-collapse:collapse;margin:2rem 0;font-size:.875rem}[data-v-277070de] .markdown-content th,[data-v-277070de] .markdown-content td{border-bottom:1px solid var(--color-border);padding:.75rem 1rem;text-align:left}[data-v-277070de] .markdown-content th{color:var(--color-foreground);font-weight:600;background:var(--color-muted)}.page-navigation[data-v-277070de]{display:flex;justify-content:space-between;margin-top:4rem;padding-top:2rem;border-top:1px solid var(--color-border);gap:1.5rem}.nav-link[data-v-277070de]{flex:1;text-decoration:none;color:inherit;padding:1.5rem;border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all .2s ease;background:var(--color-card)}.nav-link[data-v-277070de]:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.nav-prev[data-v-277070de]{text-align:left}.nav-next[data-v-277070de]{text-align:right}.nav-direction[data-v-277070de]{color:var(--color-muted-foreground);font-size:.875rem;font-weight:500;margin-bottom:.5rem}.nav-title[data-v-277070de]{color:var(--color-foreground);font-weight:600;font-size:1rem}.not-found[data-v-277070de]{text-align:center;padding:4rem 0}.not-found h1[data-v-277070de]{font-size:2.5rem;color:var(--color-foreground);margin-bottom:1rem}.not-found p[data-v-277070de]{color:var(--color-muted-foreground);margin-bottom:2rem;font-size:1.125rem}.back-home[data-v-277070de]{display:inline-block;padding:.75rem 1.5rem;background:var(--color-primary);color:var(--color-primary-foreground);border-radius:var(--radius-md);font-weight:500;transition:opacity .2s ease}.back-home[data-v-277070de]:hover{opacity:.9;text-decoration:none}@media (max-width: 768px){.skill-title[data-v-277070de]{font-size:1.875rem}.page-navigation[data-v-277070de]{flex-direction:column}.nav-next[data-v-277070de]{text-align:left}}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SF Mono,Menlo,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}:root{--background: 0 0% 100%;--foreground: 222.2 84% 4.9%;--card: 0 0% 100%;--card-foreground: 222.2 84% 4.9%;--popover: 0 0% 100%;--popover-foreground: 222.2 84% 4.9%;--primary: 222.2 47.4% 11.2%;--primary-foreground: 210 40% 98%;--secondary: 210 40% 96.1%;--secondary-foreground: 222.2 47.4% 11.2%;--muted: 210 40% 96.1%;--muted-foreground: 215.4 16.3% 46.9%;--accent: 210 40% 96.1%;--accent-foreground: 222.2 47.4% 11.2%;--destructive: 0 84.2% 60.2%;--destructive-foreground: 210 40% 98%;--border: 214.3 31.8% 91.4%;--input: 214.3 31.8% 91.4%;--ring: 222.2 84% 4.9%;--radius: .5rem}*{border-color:hsl(var(--border))}body{background-color:hsl(var(--background));color:hsl(var(--foreground))}.prose{color:var(--tw-prose-body);max-width:65ch}.prose :where(p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where([class~=lead]):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-lead);font-size:1.25em;line-height:1.6;margin-top:1.2em;margin-bottom:1.2em}.prose :where(a):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-links);text-decoration:underline;font-weight:500}.prose :where(strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-bold);font-weight:600}.prose :where(a strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th strong):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(ol):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal;margin-top:1.25em;margin-bottom:1.25em;padding-inline-start:1.625em}.prose :where(ol[type=A]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=A s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-alpha}.prose :where(ol[type=a s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-alpha}.prose :where(ol[type=I]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type=I s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:upper-roman}.prose :where(ol[type=i s]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:lower-roman}.prose :where(ol[type="1"]):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:decimal}.prose :where(ul):not(:where([class~=not-prose],[class~=not-prose] *)){list-style-type:disc;margin-top:1.25em;margin-bottom:1.25em;padding-inline-start:1.625em}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{font-weight:400;color:var(--tw-prose-counters)}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *))::marker{color:var(--tw-prose-bullets)}.prose :where(dt):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.25em}.prose :where(hr):not(:where([class~=not-prose],[class~=not-prose] *)){border-color:var(--tw-prose-hr);border-top-width:1px;margin-top:3em;margin-bottom:3em}.prose :where(blockquote):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-style:italic;color:var(--tw-prose-quotes);border-inline-start-width:.25rem;border-inline-start-color:var(--tw-prose-quote-borders);quotes:"“""”""‘""’";margin-top:1.6em;margin-bottom:1.6em;padding-inline-start:1em}.prose :where(blockquote p:first-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:open-quote}.prose :where(blockquote p:last-of-type):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:close-quote}.prose :where(h1):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:800;font-size:2.25em;margin-top:0;margin-bottom:.8888889em;line-height:1.1111111}.prose :where(h1 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:900;color:inherit}.prose :where(h2):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:700;font-size:1.5em;margin-top:2em;margin-bottom:1em;line-height:1.3333333}.prose :where(h2 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:800;color:inherit}.prose :where(h3):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;font-size:1.25em;margin-top:1.6em;margin-bottom:.6em;line-height:1.6}.prose :where(h3 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(h4):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;margin-top:1.5em;margin-bottom:.5em;line-height:1.5}.prose :where(h4 strong):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:700;color:inherit}.prose :where(img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(picture):not(:where([class~=not-prose],[class~=not-prose] *)){display:block;margin-top:2em;margin-bottom:2em}.prose :where(video):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(kbd):not(:where([class~=not-prose],[class~=not-prose] *)){font-weight:500;font-family:inherit;color:var(--tw-prose-kbd);box-shadow:0 0 0 1px var(--tw-prose-kbd-shadows),0 3px 0 var(--tw-prose-kbd-shadows);font-size:.875em;border-radius:.3125rem;padding-top:.1875em;padding-inline-end:.375em;padding-bottom:.1875em;padding-inline-start:.375em}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-code);font-weight:600;font-size:.875em}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:"`"}.prose :where(code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:"`"}.prose :where(a code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h1 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(h2 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.875em}.prose :where(h3 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit;font-size:.9em}.prose :where(h4 code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(blockquote code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(thead th code):not(:where([class~=not-prose],[class~=not-prose] *)){color:inherit}.prose :where(pre):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-pre-code);background-color:var(--tw-prose-pre-bg);overflow-x:auto;font-weight:400;font-size:.875em;line-height:1.7142857;margin-top:1.7142857em;margin-bottom:1.7142857em;border-radius:.375rem;padding-top:.8571429em;padding-inline-end:1.1428571em;padding-bottom:.8571429em;padding-inline-start:1.1428571em}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)){background-color:transparent;border-width:0;border-radius:0;padding:0;font-weight:inherit;color:inherit;font-size:inherit;font-family:inherit;line-height:inherit}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):before{content:none}.prose :where(pre code):not(:where([class~=not-prose],[class~=not-prose] *)):after{content:none}.prose :where(table):not(:where([class~=not-prose],[class~=not-prose] *)){width:100%;table-layout:auto;margin-top:2em;margin-bottom:2em;font-size:.875em;line-height:1.7142857}.prose :where(thead):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-th-borders)}.prose :where(thead th):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-headings);font-weight:600;vertical-align:bottom;padding-inline-end:.5714286em;padding-bottom:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody tr):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:1px;border-bottom-color:var(--tw-prose-td-borders)}.prose :where(tbody tr:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){border-bottom-width:0}.prose :where(tbody td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:baseline}.prose :where(tfoot):not(:where([class~=not-prose],[class~=not-prose] *)){border-top-width:1px;border-top-color:var(--tw-prose-th-borders)}.prose :where(tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){vertical-align:top}.prose :where(th,td):not(:where([class~=not-prose],[class~=not-prose] *)){text-align:start}.prose :where(figure>*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(figcaption):not(:where([class~=not-prose],[class~=not-prose] *)){color:var(--tw-prose-captions);font-size:.875em;line-height:1.4285714;margin-top:.8571429em}.prose{--tw-prose-body: #374151;--tw-prose-headings: #111827;--tw-prose-lead: #4b5563;--tw-prose-links: #111827;--tw-prose-bold: #111827;--tw-prose-counters: #6b7280;--tw-prose-bullets: #d1d5db;--tw-prose-hr: #e5e7eb;--tw-prose-quotes: #111827;--tw-prose-quote-borders: #e5e7eb;--tw-prose-captions: #6b7280;--tw-prose-kbd: #111827;--tw-prose-kbd-shadows: rgb(17 24 39 / 10%);--tw-prose-code: #111827;--tw-prose-pre-code: #e5e7eb;--tw-prose-pre-bg: #1f2937;--tw-prose-th-borders: #d1d5db;--tw-prose-td-borders: #e5e7eb;--tw-prose-invert-body: #d1d5db;--tw-prose-invert-headings: #fff;--tw-prose-invert-lead: #9ca3af;--tw-prose-invert-links: #fff;--tw-prose-invert-bold: #fff;--tw-prose-invert-counters: #9ca3af;--tw-prose-invert-bullets: #4b5563;--tw-prose-invert-hr: #374151;--tw-prose-invert-quotes: #f3f4f6;--tw-prose-invert-quote-borders: #374151;--tw-prose-invert-captions: #9ca3af;--tw-prose-invert-kbd: #fff;--tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);--tw-prose-invert-code: #fff;--tw-prose-invert-pre-code: #d1d5db;--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);--tw-prose-invert-th-borders: #4b5563;--tw-prose-invert-td-borders: #374151;font-size:1rem;line-height:1.75}.prose :where(picture>img):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0;margin-bottom:0}.prose :where(li):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;margin-bottom:.5em}.prose :where(ol>li):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:.375em}.prose :where(ul>li):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:.375em}.prose :where(.prose>ul>li p):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(.prose>ul>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ul>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(.prose>ol>li>p:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em}.prose :where(.prose>ol>li>p:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:1.25em}.prose :where(ul ul,ul ol,ol ul,ol ol):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.75em;margin-bottom:.75em}.prose :where(dl):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:1.25em;margin-bottom:1.25em}.prose :where(dd):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:.5em;padding-inline-start:1.625em}.prose :where(hr+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h2+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h3+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(h4+*):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(thead th:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:0}.prose :where(thead th:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-end:0}.prose :where(tbody td,tfoot td):not(:where([class~=not-prose],[class~=not-prose] *)){padding-top:.5714286em;padding-inline-end:.5714286em;padding-bottom:.5714286em;padding-inline-start:.5714286em}.prose :where(tbody td:first-child,tfoot td:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-start:0}.prose :where(tbody td:last-child,tfoot td:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){padding-inline-end:0}.prose :where(figure):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:2em;margin-bottom:2em}.prose :where(.prose>:first-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-top:0}.prose :where(.prose>:last-child):not(:where([class~=not-prose],[class~=not-prose] *)){margin-bottom:0}.prose-zinc{--tw-prose-body: #3f3f46;--tw-prose-headings: #18181b;--tw-prose-lead: #52525b;--tw-prose-links: #18181b;--tw-prose-bold: #18181b;--tw-prose-counters: #71717a;--tw-prose-bullets: #d4d4d8;--tw-prose-hr: #e4e4e7;--tw-prose-quotes: #18181b;--tw-prose-quote-borders: #e4e4e7;--tw-prose-captions: #71717a;--tw-prose-kbd: #18181b;--tw-prose-kbd-shadows: rgb(24 24 27 / 10%);--tw-prose-code: #18181b;--tw-prose-pre-code: #e4e4e7;--tw-prose-pre-bg: #27272a;--tw-prose-th-borders: #d4d4d8;--tw-prose-td-borders: #e4e4e7;--tw-prose-invert-body: #d4d4d8;--tw-prose-invert-headings: #fff;--tw-prose-invert-lead: #a1a1aa;--tw-prose-invert-links: #fff;--tw-prose-invert-bold: #fff;--tw-prose-invert-counters: #a1a1aa;--tw-prose-invert-bullets: #52525b;--tw-prose-invert-hr: #3f3f46;--tw-prose-invert-quotes: #f4f4f5;--tw-prose-invert-quote-borders: #3f3f46;--tw-prose-invert-captions: #a1a1aa;--tw-prose-invert-kbd: #fff;--tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);--tw-prose-invert-code: #fff;--tw-prose-invert-pre-code: #d4d4d8;--tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);--tw-prose-invert-th-borders: #52525b;--tw-prose-invert-td-borders: #3f3f46}.collapse{visibility:collapse}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0;right:0;bottom:0;left:0}.left-0{left:0}.left-3{left:.75rem}.right-0{right:0}.right-3{right:.75rem}.top-0{top:0}.top-1{top:.25rem}.top-1\/2{top:50%}.top-14{top:3.5rem}.top-20{top:5rem}.top-full{top:100%}.z-40{z-index:40}.z-50{z-index:50}.m-0{margin:0}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-6{margin-top:1.5rem;margin-bottom:1.5rem}.mb-1{margin-bottom:.25rem}.mb-10{margin-bottom:2.5rem}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-6{margin-left:1.5rem}.mr-2{margin-right:.5rem}.mt-1{margin-top:.25rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-8{margin-top:2rem}.line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.block{display:block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.grid{display:grid}.hidden{display:none}.h-14{height:3.5rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-9{height:2.25rem}.h-\[50vh\]{height:50vh}.h-\[calc\(100vh-3\.5rem\)\]{height:calc(100vh - 3.5rem)}.h-\[calc\(100vh-5rem\)\]{height:calc(100vh - 5rem)}.max-h-96{max-height:24rem}.min-h-screen{min-height:100vh}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-\[300px\]{width:300px}.w-full{width:100%}.min-w-0{min-width:0px}.max-w-6xl{max-width:72rem}.max-w-md{max-width:28rem}.max-w-none{max-width:none}.flex-1{flex:1 1 0%}.shrink-0{flex-shrink:0}.border-collapse{border-collapse:collapse}.-translate-x-full{--tw-translate-x: -100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1{--tw-translate-y: -.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y: -50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.scroll-m-20{scroll-margin:5rem}.flex-col{flex-direction:column}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-10{gap:2.5rem}.gap-2{gap:.5rem}.space-x-2>:not([hidden])~:not([hidden]){--tw-space-x-reverse: 0;margin-right:calc(.5rem * var(--tw-space-x-reverse));margin-left:calc(.5rem * calc(1 - var(--tw-space-x-reverse)))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem * var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem * var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded{border-radius:.25rem}.rounded-lg{border-radius:var(--radius)}.rounded-md{border-radius:calc(var(--radius) - 2px)}.rounded-b-lg{border-bottom-right-radius:var(--radius);border-bottom-left-radius:var(--radius)}.border{border-width:1px}.border-0{border-width:0px}.border-b{border-bottom-width:1px}.border-l{border-left-width:1px}.border-r{border-right-width:1px}.border-t{border-top-width:1px}.border-border{border-color:hsl(var(--border))}.bg-accent{background-color:hsl(var(--accent))}.bg-background{background-color:hsl(var(--background))}.bg-background\/80{background-color:hsl(var(--background) / .8)}.bg-background\/95{background-color:hsl(var(--background) / .95)}.bg-card{background-color:hsl(var(--card))}.bg-muted{background-color:hsl(var(--muted))}.bg-muted\/30{background-color:hsl(var(--muted) / .3)}.bg-primary{background-color:hsl(var(--primary))}.bg-primary\/5{background-color:hsl(var(--primary) / .05)}.bg-secondary{background-color:hsl(var(--secondary))}.bg-secondary\/50{background-color:hsl(var(--secondary) / .5)}.p-2{padding:.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-20{padding-top:5rem;padding-bottom:5rem}.pb-10{padding-bottom:2.5rem}.pl-3{padding-left:.75rem}.pl-4{padding-left:1rem}.pl-6{padding-left:1.5rem}.pl-8{padding-left:2rem}.pl-9{padding-left:2.25rem}.pr-4{padding-right:1rem}.pt-8{padding-top:2rem}.text-center{text-align:center}.text-right{text-align:right}.font-mono{font-family:ui-monospace,SF Mono,Menlo,monospace}.font-sans{font-family:Inter,ui-sans-serif,system-ui,sans-serif}.text-2xl{font-size:1.5rem;line-height:2rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-medium{font-weight:500}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-relaxed{line-height:1.625}.tracking-tight{letter-spacing:-.025em}.text-foreground{color:hsl(var(--foreground))}.text-muted-foreground{color:hsl(var(--muted-foreground))}.text-primary{color:hsl(var(--primary))}.text-primary-foreground{color:hsl(var(--primary-foreground))}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.placeholder-muted-foreground::-moz-placeholder{color:hsl(var(--muted-foreground))}.placeholder-muted-foreground::placeholder{color:hsl(var(--muted-foreground))}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);--tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.backdrop-blur{--tw-backdrop-blur: blur(8px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.backdrop-blur-sm{--tw-backdrop-blur: blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.shiki{padding:1rem 1.25rem;border-radius:.5rem;overflow-x:auto;font-size:.875rem;line-height:1.7;background-color:#24292e!important}.shiki code{background:transparent!important;padding:0!important;font-size:inherit!important;color:inherit!important;font-family:ui-monospace,SFMono-Regular,SF Mono,Menlo,Consolas,monospace!important}.shiki span{color:inherit!important}.prose pre{background:transparent!important;padding:0!important;margin:0!important;color:inherit!important}.prose code{color:inherit!important}.prose .shiki{margin:1.5rem 0}.dark\:prose-invert:is(.dark *){--tw-prose-body: var(--tw-prose-invert-body);--tw-prose-headings: var(--tw-prose-invert-headings);--tw-prose-lead: var(--tw-prose-invert-lead);--tw-prose-links: var(--tw-prose-invert-links);--tw-prose-bold: var(--tw-prose-invert-bold);--tw-prose-counters: var(--tw-prose-invert-counters);--tw-prose-bullets: var(--tw-prose-invert-bullets);--tw-prose-hr: var(--tw-prose-invert-hr);--tw-prose-quotes: var(--tw-prose-invert-quotes);--tw-prose-quote-borders: var(--tw-prose-invert-quote-borders);--tw-prose-captions: var(--tw-prose-invert-captions);--tw-prose-kbd: var(--tw-prose-invert-kbd);--tw-prose-kbd-shadows: var(--tw-prose-invert-kbd-shadows);--tw-prose-code: var(--tw-prose-invert-code);--tw-prose-pre-code: var(--tw-prose-invert-pre-code);--tw-prose-pre-bg: var(--tw-prose-invert-pre-bg);--tw-prose-th-borders: var(--tw-prose-invert-th-borders);--tw-prose-td-borders: var(--tw-prose-invert-td-borders)}.last\:border-b-0:last-child{border-bottom-width:0px}.hover\:bg-accent:hover{background-color:hsl(var(--accent))}.hover\:bg-primary\/90:hover{background-color:hsl(var(--primary) / .9)}.hover\:text-foreground:hover{color:hsl(var(--foreground))}.focus-visible\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px}.focus-visible\:ring-1:focus-visible{--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color: hsl(var(--ring))}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:-translate-x-1{--tw-translate-x: -.25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-x-1{--tw-translate-x: .25rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:text-foreground{color:hsl(var(--foreground))}.group:hover .group-hover\:text-primary{color:hsl(var(--primary))}.prose-headings\:scroll-m-20 :is(:where(h1,h2,h3,h4,h5,h6,th):not(:where([class~=not-prose],[class~=not-prose] *))){scroll-margin:5rem}.prose-headings\:font-semibold :is(:where(h1,h2,h3,h4,h5,h6,th):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:600}.prose-headings\:tracking-tight :is(:where(h1,h2,h3,h4,h5,h6,th):not(:where([class~=not-prose],[class~=not-prose] *))){letter-spacing:-.025em}.prose-h2\:mb-4 :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){margin-bottom:1rem}.prose-h2\:mt-10 :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){margin-top:2.5rem}.prose-h2\:border-b :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){border-bottom-width:1px}.prose-h2\:pb-2 :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){padding-bottom:.5rem}.prose-h2\:text-2xl :is(:where(h2):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:1.5rem;line-height:2rem}.prose-h3\:mb-4 :is(:where(h3):not(:where([class~=not-prose],[class~=not-prose] *))){margin-bottom:1rem}.prose-h3\:mt-8 :is(:where(h3):not(:where([class~=not-prose],[class~=not-prose] *))){margin-top:2rem}.prose-h3\:text-xl :is(:where(h3):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:1.25rem;line-height:1.75rem}.prose-p\:mb-6 :is(:where(p):not(:where([class~=not-prose],[class~=not-prose] *))){margin-bottom:1.5rem}.prose-p\:leading-7 :is(:where(p):not(:where([class~=not-prose],[class~=not-prose] *))){line-height:1.75rem}.prose-code\:relative :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){position:relative}.prose-code\:rounded :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){border-radius:.25rem}.prose-code\:bg-muted :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){background-color:hsl(var(--muted))}.prose-code\:px-\[0\.3rem\] :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){padding-left:.3rem;padding-right:.3rem}.prose-code\:py-\[0\.2rem\] :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){padding-top:.2rem;padding-bottom:.2rem}.prose-code\:font-mono :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){font-family:ui-monospace,SF Mono,Menlo,monospace}.prose-code\:text-sm :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){font-size:.875rem;line-height:1.25rem}.prose-code\:font-semibold :is(:where(code):not(:where([class~=not-prose],[class~=not-prose] *))){font-weight:600}.prose-pre\:border-0 :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){border-width:0px}.prose-pre\:bg-transparent :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){background-color:transparent}.prose-pre\:p-0 :is(:where(pre):not(:where([class~=not-prose],[class~=not-prose] *))){padding:0}.prose-ul\:my-6 :is(:where(ul):not(:where([class~=not-prose],[class~=not-prose] *))){margin-top:1.5rem;margin-bottom:1.5rem}.prose-ul\:ml-6 :is(:where(ul):not(:where([class~=not-prose],[class~=not-prose] *))){margin-left:1.5rem}.prose-ul\:list-disc :is(:where(ul):not(:where([class~=not-prose],[class~=not-prose] *))){list-style-type:disc}.prose-li\:my-2 :is(:where(li):not(:where([class~=not-prose],[class~=not-prose] *))){margin-top:.5rem;margin-bottom:.5rem}@media (min-width: 640px){.sm\:inline-flex{display:inline-flex}}@media (min-width: 768px){.md\:sticky{position:sticky}.md\:hidden{display:none}.md\:translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}}@media (min-width: 1024px){.lg\:mx-8{margin-left:2rem;margin-right:2rem}.lg\:px-10{padding-left:2.5rem;padding-right:2.5rem}.lg\:px-6{padding-left:1.5rem;padding-right:1.5rem}}@media (min-width: 1280px){.xl\:block{display:block}.xl\:grid{display:grid}.xl\:grid-cols-\[1fr_300px\]{grid-template-columns:1fr 300px}}