@mgks/docmd 0.2.4 → 0.2.5

package/docs/deployment.md

@@ -37,13 +37,13 @@ GitHub Pages is a popular and free way to host static sites directly from your G
 The simplest approach is to choose one of:
 
 *   **Built site in the `docs/` folder on the main branch:**
-    *   Configure `docmd`'s `outputDir` to be `docs` in your `config.js` (e.g., `outputDir: 'docs'`).
+    *   Configure `docmd`'s `outputDir` to be `docs` in your `docmd.config.js` (e.g., `outputDir: 'docs'`).
     *   Select "Deploy from a branch" → "main" → "/docs"
-    
-If you set `outputDir: 'docs'`, your `config.js` for `docmd` itself (when building its own docs) would look like:
+
+If you set `outputDir: 'docs'`, your `docmd.config.js` for `docmd` itself (when building its own docs) would look like:
 
 ```javascript
-// config.js for docmd's own docs, deploying from /docs on main
+// docmd.config.js for docmd's own docs, deploying from /docs on main
 module.exports = {
   siteTitle: 'docmd Docs',
   srcDir: 'documentation', // Assuming actual source MD files are NOT in the output 'docs'
@@ -92,7 +92,7 @@ jobs:
         run: npm install -g @mgks/docmd
 
       - name: Build site with docmd
-        run: docmd build # Assumes config.js is in the root and correctly points to srcDir/outputDir
+        run: docmd build # Assumes docmd.config.js is in the root and correctly points to srcDir/outputDir
 
       - name: Setup Pages
         uses: actions/configure-pages@v5

package/docs/getting-started/basic-usage.md

@@ -26,9 +26,9 @@ This command sets up the basic structure for your `docmd` project:
 
 *   `docs/`: An empty directory where your Markdown source files will live.
     *   `docs/index.md`: A sample Markdown file to get you started.
-*   `config.js`: A configuration file for your site, pre-filled with sensible defaults.
+*   `docmd.config.js`: A configuration file for your site, pre-filled with sensible defaults.
 
-You'll typically edit `config.js` to set your site title and define the navigation structure, and then start adding your `.md` files to the `docs/` directory.
+You'll typically edit config file to set your site title and define the navigation structure, and then start adding your `.md` files to the `docs/` directory.
 
 ## 2. Add and Structure Content
 
@@ -45,7 +45,7 @@ my-awesome-docs/
 │   └── guides/
 │       ├── setup.md
 │       └── advanced.md
-└── config.js
+└── docmd.config.js
 ```
 
 Each Markdown file should start with YAML frontmatter to define metadata like the page title. See [Content > Frontmatter](/content/frontmatter/) for details.
@@ -63,10 +63,10 @@ docmd dev
 This will:
 1.  Perform an initial build of your site.
 2.  Start a web server, typically at `http://localhost:3000`.
-3.  Watch your `docs/` directory and `config.js` for changes.
+3.  Watch your `docs/` directory and `docmd.config.js` for changes.
 4.  Automatically rebuild the site and refresh your browser when changes are detected.
 
-Open `http://localhost:3000` in your web browser to see your site. Any changes you save to your Markdown files or `config.js` will be reflected live in the browser.
+Open `http://localhost:3000` in your web browser to see your site. Any changes you save to your Markdown files or config file will be reflected live in the browser.
 
 To stop the development server, press `Ctrl+C` in your terminal.
 
@@ -79,10 +79,10 @@ docmd build
 ```
 
 This command:
-1.  Reads your `config.js`.
+1.  Reads your `docmd.config.js`.
 2.  Processes all `.md` files in your `docs/` directory.
 3.  Generates the complete static HTML, CSS, and JavaScript assets.
-4.  Outputs the entire site into a `site/` directory (by default, configurable in `config.js`).
+4.  Outputs the entire site into a `site/` directory (by default, configurable in `docmd.config.js`).
 
 The contents of the `site/` directory are all you need to deploy your documentation. You can upload this folder to any static web hosting provider. See [Deployment](/deployment/) for more information.
 

package/docs/overview.md

@@ -16,7 +16,7 @@ This very documentation site is built using `docmd`!
 ## Core Philosophy
 
 *   **Markdown First:** Your content lives in standard `.md` files with simple YAML frontmatter.
-*   **Minimal Configuration:** Sensible defaults with straightforward overrides via `config.js`.
+*   **Minimal Configuration:** Sensible defaults with straightforward overrides via `docmd.config.js`.
 *   **Lightweight Build:** Fast generation process using Node.js, no complex framework dependencies for the build itself.
 *   **Beautiful Defaults:** Clean, responsive design with light/dark themes and syntax highlighting out-of-the-box.
 *   **Static Output:** Deploy the generated `site/` folder anywhere (GitHub Pages, Netlify, Vercel, etc.).
@@ -26,7 +26,7 @@ This very documentation site is built using `docmd`!
 *   📝 **Standard Markdown & Frontmatter:** Write content naturally, define page metadata (title, description) easily.
 *   🎨 **Themeable:** Built-in light/dark modes, customizable via CSS variables. Uses `highlight.js` for code blocks.
 *   🧩 **Custom Containers:** Add richer components like callouts, cards, and steps using simple `::: name :::` syntax.
-*   ⚙️ **Config-Driven Navigation:** Define your site structure and sidebar navigation in `config.js`. Supports nested items.
+*   ⚙️ **Config-Driven Navigation:** Define your site structure and sidebar navigation in `docmd.config.js`. Supports nested items.
 *   🚀 **Fast Static Build:** Node.js script quickly processes files into optimized HTML & CSS.
 *   💻 **Simple CLI:** Easy-to-use commands (`docmd build`, `docmd init`, `docmd dev`) with clear feedback.
 *   🌐 **Deploy Anywhere:** Generates a standard static `site/` directory.

package/docs/plugins/analytics.md

@@ -9,12 +9,11 @@ description: "Integrate web analytics services like Google Analytics into your d
 
 ## Enabling Analytics Plugin
 
-You enable analytics by adding the analytics plugin and its configuration to the `plugins` object in your `config.js`.
+You enable analytics by adding the analytics plugin and its configuration to the `plugins` object in your config file.
 
 **Example:**
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   plugins: {

package/docs/plugins/index.md

@@ -9,10 +9,9 @@ description: "Extend docmd's functionality with built-in plugins."
 
 ## Enabling Plugins
 
-You enable and configure plugins in your `config.js` file within the `plugins` object. Each plugin is configured using its key with a corresponding configuration object.
+You enable and configure plugins in your config file within the `plugins` object. Each plugin is configured using its key with a corresponding configuration object.
 
 ```javascript
-// config.js
 module.exports = {
   // ... other config ...
   plugins: {
@@ -58,7 +57,7 @@ Plugins in `docmd` hook into various parts of the build process:
 * They can generate additional files in the output directory
 * They can modify the HTML output of pages
 
-All plugins are designed to be configurable through your `config.js` file, giving you control over their behavior.
+All plugins are designed to be configurable through your config file, giving you control over their behavior.
 
 ## Future Plugin Development
 

package/docs/plugins/seo.md

@@ -9,10 +9,9 @@ The `seo` plugin automatically generates important meta tags in the `<head>` of
 
 ## Enabling the Plugin
 
-Add the `seo` plugin to the `plugins` object in your `config.js`:
+Add the `seo` plugin to the `plugins` object in your config file:
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   plugins: {
@@ -36,7 +35,7 @@ module.exports = {
 
 ## Configuration Options
 
-The options in `config.js` serve as site-wide defaults. For the best results, you should provide specific metadata for each page using frontmatter.
+The options in the config file serve as site-wide defaults. For the best results, you should provide specific metadata for each page using frontmatter.
 
 ## Frontmatter for SEO
 

package/docs/plugins/sitemap.md

@@ -9,10 +9,9 @@ The `sitemap` plugin automatically generates a `sitemap.xml` file for your docum
 
 ## Enabling the Plugin
 
-Add the `sitemap` plugin to the `plugins` object in your `config.js`:
+Add the `sitemap` plugin to the `plugins` object in your config file:
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   plugins: {
@@ -48,7 +47,7 @@ The sitemap plugin automatically:
 2. Creates a `sitemap.xml` file in the root of your site output directory
 3. Includes all pages with their URLs, last modification dates, and configured priorities
 
-The plugin uses your `siteUrl` property from the config.js file to create absolute URLs, which is required for a valid sitemap. Make sure you have a `siteUrl` defined:
+The plugin uses your `siteUrl` property from the config file to create absolute URLs, which is required for a valid sitemap. Make sure you have a `siteUrl` defined:
 
 ```javascript
 module.exports = {

package/docs/theming/assets-management.md

@@ -18,7 +18,7 @@ your-project/
 │   ├── js/           # Custom JavaScript files
 │   └── images/       # Custom images
 ├── docs/             # Markdown content
-├── config.js
+├── docmd.config.js
 └── ...
 ```
 
@@ -45,7 +45,7 @@ The simplest and recommended approach is to use the `assets/` directory in your
    assets/images/logo.png
    ```
 
-2. Reference these files in your `config.js`:
+2. Reference these files in your config file:
    ```javascript
    module.exports = {
      // ...

package/docs/theming/available-themes.md

@@ -5,10 +5,9 @@ description: "An overview of the built-in themes provided by docmd."
 
 # Available Themes
 
-`docmd` allows you to choose from a selection of built-in themes to quickly change the overall look and feel of your documentation site. You can specify the theme in your `config.js` file using the `theme.name` property.
+`docmd` allows you to choose from a selection of built-in themes to quickly change the overall look and feel of your documentation site. You can specify the theme in your config file using the `theme.name` property.
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   theme: {
@@ -75,4 +74,4 @@ Each theme consists of CSS files located within `docmd`'s internal assets. When
 - `ruby` theme loads `docmd-theme-ruby.css` with its custom styling on top of the default CSS
 - `retro` theme loads `docmd-theme-retro.css` with its custom styling on top of the default CSS
 
-You can further customize any chosen theme using the `theme.customCss` option in your `config.js` to add your own overrides or additional styles. See [Custom CSS & JS](/theming/custom-css-js/) for details.
+You can further customize any chosen theme using the `theme.customCss` option in your config file to add your own overrides or additional styles. See [Custom CSS & JS](/theming/custom-css-js/) for details.

package/docs/theming/custom-css-js.md

@@ -5,14 +5,13 @@ description: "Learn how to add your own custom CSS and JavaScript to your docmd
 
 # Custom Styles & Scripts
 
-While `docmd` themes provide a solid foundation, you can further tailor the appearance and behavior of your site by injecting custom CSS and JavaScript files. This is configured in your `config.js` file.
+While `docmd` themes provide a solid foundation, you can further tailor the appearance and behavior of your site by injecting custom CSS and JavaScript files. This is configured in your config file.
 
 ## Custom CSS
 
-You can add one or more custom CSS files using the `theme.customCss` array in your `config.js`.
+You can add one or more custom CSS files using the `theme.customCss` array in your config file.
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   theme: {
@@ -54,10 +53,9 @@ module.exports = {
 
 ## Custom JavaScript
 
-You can add one or more custom JavaScript files using the top-level `customJs` array in your `config.js`.
+You can add one or more custom JavaScript files using the top-level `customJs` array in your config file.
 
 ```javascript
-// config.js
 module.exports = {
   // ...
   customJs: [

package/docs/theming/icons.md

@@ -9,10 +9,9 @@ description: "How to use Lucide icons in your docmd site navigation and content.
 
 ## Icons in Navigation
 
-You can specify an icon for each navigation item (including parent categories) in your `config.js` file using the `icon` property:
+You can specify an icon for each navigation item (including parent categories) in your config file using the `icon` property:
 
 ```javascript
-// config.js
 // ...
 navigation: [
   { title: 'Home', path: '/', icon: 'home' },

package/docs/theming/light-dark-mode.md

@@ -9,10 +9,9 @@ description: "How to configure and manage light and dark themes in your docmd do
 
 ## Setting the Default Theme
 
-You can set the default theme for your site in the `config.js` file:
+You can set the default theme for your site in the config file:
 
 ```javascript
-// config.js
 module.exports = {
   // ... other config ...
   theme: {
@@ -68,7 +67,6 @@ body {
 When `enableModeToggle` is set to `true`, a toggle button appears that allows users to switch between light and dark modes. The position of this button is controlled by the `positionMode` setting:
 
 ```javascript
-// config.js
 theme: {
   defaultMode: 'light',
   enableModeToggle: true, // Shows the toggle button

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mgks/docmd",
-  "version": "0.2.4",
+  "version": "0.2.5",
   "description": "Generate beautiful, lightweight static documentation sites directly from your Markdown files. Zero clutter, just content.",
   "main": "src/index.js",
   "exports": {

package/src/assets/css/docmd-main.css

@@ -4,4 +4,7 @@
  * Main CSS file for docmd
  */
  
-.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list>li.step-item::before,.docmd-container.steps-reset ol.steps-list>li.step-item::before,.docmd-container.steps-reset ol.steps-list[start]>li.step-item::before{content:counter(list-counter) ".";font-weight:700;margin-right:.5em;color:var(--accent-color,#007acc)}.docmd-tab-pane.active,.logo-link img,.logo-link img.logo-light,.tab-panel.active,.theme-toggle-button .icon-sun,body.sidebar-collapsible .sidebar-toggle-button,html[data-theme=dark] .logo-link img.logo-dark,html[data-theme=dark] .theme-toggle-button .icon-moon,img{display:block}:root{--font-family-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-family-mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;--bg-color:#ffffff;--text-color:#333333;--sidebar-bg:#f4f7f9;--sidebar-text:#2c3e50;--sidebar-link-active-bg:#e0e7ec;--sidebar-link-active-parent-bg:#e9eff3;--link-color:#007bff;--border-color:#e0e0e0;--code-bg:#f8f8f8;--code-text:#333;--header-bg:#ffffff;--header-border:#e0e0e0;--image-border-color:#e0e0e0;--image-shadow:0 2px 8px rgba(0, 0, 0, 0.1);--image-caption-bg:#f8f8f8;--image-caption-text:#666;--lightbox-bg:rgba(0, 0, 0, 0.9);--lightbox-text:#fff}[data-theme=dark]{--bg-color:#1a1a1a;--text-color:#e0e0e0;--sidebar-bg:#2c2c2c;--sidebar-text:#bdc3c7;--sidebar-link-active-bg:#3a3a3a;--sidebar-link-active-parent-bg:#343434;--link-color:#58a6ff;--border-color:#444444;--code-bg:#282c34;--code-text:#abb2bf;--header-bg:#1a1a1a;--header-border:#444444;--image-border-color:#444444;--image-shadow:0 2px 8px rgba(0, 0, 0, 0.3);--image-caption-bg:#2c2c2c;--image-caption-text:#bdc3c7;--lightbox-bg:rgba(0, 0, 0, 0.95);--lightbox-text:#fff}body{font-family:var(--font-family-sans);background-color:var(--bg-color);color:var(--text-color);margin:0;display:flex;min-height:100vh;line-height:1.6}code,pre{font-family:var(--font-family-mono);background-color:var(--code-bg)}.sidebar{width:260px;background-color:var(--sidebar-bg);color:var(--sidebar-text);padding:20px;border-right:1px solid var(--border-color);height:100vh;position:fixed;top:0;left:0;overflow-y:auto;box-sizing:border-box;flex-shrink:0}.sidebar h1{font-size:1.5em;margin-top:0;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.sidebar nav ul{list-style:none;padding:0;margin:0}.sidebar nav li a{display:block;padding:8px 10px;text-decoration:none;color:var(--sidebar-text);border-radius:4px;transition:background-color .2s}.copy-code-button:hover,.docmd-tabs-nav-item:hover,.sidebar nav li a.active,.sidebar nav li a:hover,.theme-toggle-button:hover{background-color:var(--sidebar-link-active-bg)}.sidebar nav li a.active{font-weight:600;color:var(--link-color)}.sidebar nav li.active-parent>a{background-color:var(--sidebar-link-active-parent-bg);font-weight:500;position:relative}.sidebar nav li.active-parent>a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--link-color);opacity:.5}.copy-code-button:hover,.sidebar nav li.active-parent>a.active::before,div:hover>.copy-code-button{opacity:1}.sidebar nav ul ul{padding-left:20px;margin-top:5px}.sidebar-toggle-button{background:0 0;border:1px solid transparent;color:var(--text-color);cursor:pointer;padding:0;margin:.5em 0 0;display:none;border-radius:4px}.sidebar-toggle-button:hover{background-color:var(--sidebar-bg);border-color:var(--border-color)}.sidebar-toggle-button .lucide-icon{width:2em;height:2em}body.sidebar-collapsed .sidebar{transform:translateX(-100%);visibility:hidden}.toc-level-2,body.sidebar-collapsed .main-content-wrapper{margin-left:0}.main-content-wrapper,.sidebar{transition:transform .3s,margin-left .3s,visibility .3s}.main-content-wrapper{margin-left:260px;flex-grow:1;display:flex;flex-direction:column;overflow:hidden}.header-left,.page-header{align-items:center;display:flex}.page-header{padding:15px 30px;border-bottom:1px solid var(--header-border);background-color:var(--header-bg);justify-content:space-between;min-height:2.5em}.header-left{gap:15px}.header-right{display:flex;align-items:center}.page-header h1{margin:0;font-size:1.8em}.theme-toggle-header{padding:8px;background:var(--content-bg);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:.2s}.theme-toggle-header:hover{background:var(--sidebar-bg);border-color:var(--accent-color)}.card .card-title,.sidebar-header{border-bottom:1px solid var(--border-color)}.content-area{padding:2.5rem 2rem;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}pre{color:var(--code-text);padding:1em;border-radius:4px;overflow-x:auto;position:relative}code{padding:.2em .4em;border-radius:3px;font-size:.9em}pre code{background-color:transparent;padding:0;font-size:inherit}.sidebar-header{padding-bottom:10px;margin-bottom:10px;text-align:center;height:2.5em}.sidebar-header h1{font-size:1.5em;margin-top:0;margin-bottom:0}.logo-link img{max-height:40px;width:auto;margin:0 auto}.docmd-tab-pane,.logo-link img.logo-dark,.tab-panel,.theme-toggle-button .icon-moon,html[data-theme=dark] .logo-link img.logo-light,html[data-theme=dark] .theme-toggle-button .icon-sun,.sidebar nav li.collapsible:not([aria-expanded=true])>.submenu{display:none}.sidebar-nav .lucide-icon{width:1em;height:1em;margin-right:.5em;vertical-align:-.15em;stroke-width:2}.sidebar-nav .nav-external-icon{width:1em;height:1.5em;float:right;margin-left:.3em;opacity:.7}.theme-toggle-button{background:0 0;border:1px solid var(--border-color);color:var(--sidebar-text);padding:8px;border-radius:4px;cursor:pointer;margin-top:.5em;display:flex;align-items:center;justify-content:center;width:100%}.next-page,.prev-page,.step::before{color:var(--link-color);display:flex}.callout .callout-content>:first-child,.card .card-content>:first-child,.docmd-container>:first-child,.step-content>:first-child,.step-title{margin-top:0}.theme-toggle-button .lucide-icon{width:1.2em;height:1.2em}.docmd-container{padding:1rem 1.5rem;margin-bottom:1.5rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--code-bg)}.callout .callout-content>:last-child,.card .card-content>:last-child,.docmd-container>:last-child,.step-content>:last-child{margin-bottom:0}.callout{border-left-width:5px;background-color:transparent}.callout-title{font-weight:700;margin-bottom:.5em}.callout-info{border-left-color:#3498db;background-color:rgba(52,152,219,.07)}.callout-warning{border-left-color:#f39c12;background-color:rgba(243,156,18,.07)}.callout-success,.callout-tip{border-left-color:#2ecc71;background-color:rgba(46,204,113,.07)}.callout-danger{border-left-color:#e74c3c;background-color:rgba(231,76,60,.07)}.card .card-title{font-weight:700;font-size:1.1em;margin:-1rem -1.5rem 1rem;padding:.75rem 1.5rem}.docmd-container.steps{position:relative;padding-left:3rem;border:none;background:0 0;box-shadow:none}.docmd-container.steps::before{content:"";position:absolute;top:1rem;bottom:1rem;left:2.5rem;width:2px;background-color:var(--border-color)}.step{position:relative;padding-bottom:1.5rem}.step:last-child{padding-bottom:0}.step::before{content:attr(data-step);position:absolute;left:-3rem;top:.1rem;width:2.5rem;height:2.5rem;background-color:var(--bg-color);border:2px solid var(--border-color);border-radius:50%;align-items:center;justify-content:center;font-size:1rem;font-weight:600;z-index:1}.step-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.docmd-container.steps-reset{counter-reset:step-counter 0}.docmd-container.steps-reset ol.steps-list{counter-reset:list-counter 0;list-style:none}.docmd-container.steps-reset ol.steps-list>li.step-item{counter-increment:list-counter 1;position:relative;padding-left:0;margin-bottom:2.5rem}.docmd-container.steps-reset ol.steps-list>li.step-item::before{font-size:2rem}.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list,.docmd-container.steps-reset ol.steps-list[start]{counter-reset:list-counter 0}.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list>li.step-item,.docmd-container.steps-reset ol.steps-list[start]>li.step-item{counter-increment:list-counter 1}.docmd-container.steps-reset ol:not(.steps-list)::before,.docmd-container.steps-reset ol:not(.steps-list)>li::before,.docmd-container.steps-reset ul::before,.docmd-container.steps-reset ul>li::before{width:.75rem;height:.75rem;left:-1.5rem;top:.5rem;content:""!important}:focus-visible{outline:2px solid var(--link-color);outline-offset:2px}:focus:not(:focus-visible){outline:currentcolor}.sidebar nav li a:focus-visible{background-color:var(--sidebar-link-active-bg);outline:2px solid var(--link-color);outline-offset:-2px}.theme-toggle-button:focus-visible{border-color:var(--link-color);box-shadow:0 0 0 2px var(--link-color)}.page-footer,.page-navigation{border-top:1px solid var(--border-color)}.page-navigation{display:flex;justify-content:space-between;margin-top:3rem;padding-top:1.5rem}.next-page,.prev-page{align-items:center;text-decoration:none;padding:.75rem;border-radius:6px;transition:background-color .2s;width:48%;max-width:48%}.next-page:hover,.prev-page:hover{background-color:rgba(0,0,0,.05);text-decoration:none}[data-theme=dark] .next-page:hover,[data-theme=dark] .prev-page:hover{background-color:rgba(255,255,255,.05)}.prev-page{justify-content:flex-start}.next-page{justify-content:flex-end;text-align:right}.next-page-placeholder,.prev-page-placeholder{width:48%}.next-page span,.prev-page span{display:flex;flex-direction:column}.next-page small,.prev-page small{font-size:.8rem;opacity:.8;margin-bottom:.25rem}.next-page strong,.prev-page strong{font-weight:500}.page-nav-icon{width:1.2rem;height:1.2rem}.prev-page .page-nav-icon{margin-right:.75rem}.next-page .page-nav-icon{margin-left:.75rem}.page-footer{text-align:center;padding:20px 30px;margin-top:auto;font-size:.9em;color:var(--text-color);background-color:var(--sidebar-bg)}.footer-content{display:flex;justify-content:space-between;align-items:center;margin:0 auto;width:100%}.user-footer{text-align:left}.branding-footer{text-align:right;opacity:.9;font-weight:500}.branding-footer svg{color:#fb3a3a}.page-footer a{color:var(--link-color);text-decoration:none}.page-footer a:hover,.toc-link:hover{text-decoration:underline}.content-layout{display:flex;gap:2rem;width:100%}.main-content{flex:1 1 0%;min-inline-size:0px}.toc-container{margin:0;padding:0;border:none;background-color:transparent}.docmd-container figure img,.toc-title{margin-bottom:.5rem}.toc-title{margin-top:0;font-size:1rem;font-weight:700;color:var(--text-muted)}.toc-list{list-style:none;padding-left:0;margin:0}.toc-item{margin-bottom:.25rem;line-height:1.4}.toc-link{text-decoration:none;color:var(--link-color);display:inline-block;padding:.1rem 0;font-size:.9rem;font-weight:500}.toc-level-3{margin-left:.75rem;font-size:.85rem}.toc-level-4{margin-left:1.5rem;font-size:.8rem}.toc-sidebar{width:180px;position:sticky;top:2rem;max-height:calc(-4rem + 100vh);overflow-y:auto;align-self:flex-start}@media (max-width:1024px){.content-layout{display:flex;flex-direction:column-reverse}.toc-sidebar{width:100%;position:static;margin-bottom:1rem}}.docmd-tabs,img{margin:1.5rem 0}img{max-width:100%;height:auto}img.align-left{float:left;margin-right:1.5rem;margin-bottom:1rem}img.align-center{margin-left:auto;margin-right:auto}img.align-right{float:right;margin-left:1.5rem;margin-bottom:1rem}img.size-small{max-width:300px}img.size-medium{max-width:500px}img.size-large{max-width:800px}img.with-border{border:1px solid var(--image-border-color);padding:4px}img.with-shadow{box-shadow:var(--image-shadow)}.docmd-container figure{margin:2rem 0}.docmd-container figcaption{font-size:.9rem;color:var(--image-caption-text);text-align:center;padding:.5rem;background-color:var(--image-caption-bg);border-radius:0 0 4px 4px}.docmd-container .image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin:2rem 0}.docmd-container .image-gallery figure{margin:0}.docmd-container .clear-float::after{content:"";display:table;clear:both}.docmd-tabs{border:1px solid var(--border-color);border-radius:6px;overflow:hidden;box-shadow:rgba(0,0,0,.05) 0 1px 3px}.docmd-tabs-nav{display:flex;background-color:var(--sidebar-bg);border-bottom:1px solid var(--border-color);overflow:auto hidden}.docmd-tabs-nav-item{padding:.75rem 1.25rem;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;font-weight:500;color:var(--sidebar-text);white-space:nowrap}.docmd-tabs-nav-item.active{color:var(--link-color);border-bottom-color:var(--link-color);background-color:var(--bg-color)}.docmd-tabs-content{padding:1.5rem}.tabs-container{margin:1rem 0;border:1px solid #e1e5e9;border-radius:.375rem}.tab-navigation{display:flex;background-color:#f8f9fa;border-bottom:1px solid #e1e5e9;border-radius:.375rem .375rem 0 0}.tab-button{padding:.75rem 1rem;border-width:medium medium 2px;border-style:none none solid;border-color:currentcolor currentcolor transparent;border-image:none;background:0 0;cursor:pointer;transition:.2s}.tab-button:hover{background-color:#e9ecef}.tab-button.active{border-bottom-color:#007bff;background-color:#fff}.tab-content{padding:1rem}.docmd-lightbox{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--lightbox-bg);z-index:9999;justify-content:center;align-items:center;flex-direction:column}.copy-code-button svg,.sponsor-icon{width:1rem;height:1rem}.docmd-lightbox-content{position:relative;max-width:90%;max-height:90%;text-align:center}.docmd-lightbox-content img{max-width:100%;max-height:80vh;object-fit:contain;margin:0 auto;box-shadow:rgba(0,0,0,.3) 0 0 20px}.docmd-lightbox-caption{color:var(--lightbox-text);padding:1rem;font-size:1rem;max-width:100%}.docmd-lightbox-close{position:absolute;top:20px;right:30px;color:var(--lightbox-text);font-size:2.5rem;cursor:pointer;z-index:10000}.docmd-lightbox-close:hover{color:#ddd}.docmd-button,.sponsor-link,.sponsor-link:hover{color:#fff;text-decoration:none}.docmd-container .image-gallery img,img.lightbox{cursor:zoom-in}.docmd-button{display:inline-block;padding:.6rem 1.2rem;margin:.5rem;border-radius:6px;background-color:var(--link-color);font-weight:500;transition:background-color .2s,transform .2s;border:none;cursor:pointer}.docmd-button:hover{text-decoration:none;filter:brightness(90%);transform:translateY(-1px)}.sponsor-ribbon{position:fixed;bottom:75px;right:10px;z-index:1000;transform:rotate(0);transform-origin:center center;opacity:.75;transition:.5s}.sponsor-ribbon:hover{opacity:1}.sponsor-link{display:flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,#ff6b6b,#ee5a24);padding:.75rem 1.5rem;border-radius:5px;box-shadow:rgba(255,107,107,.3) 0 4px 12px;font-weight:600;font-size:.875rem;transition:.3s;white-space:nowrap}.sponsor-link:hover{transform:scale(1.02);box-shadow:rgba(255,107,107,.4) 0 6px 20px}.sponsor-icon{animation:2s ease-in-out infinite heartbeat}.sponsor-text{font-family:inherit}@keyframes heartbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}@media (max-width:768px){body{flex-direction:column}.sidebar{width:100%;height:auto;position:static;border-right:currentcolor;border-bottom:1px solid var(--border-color)}.sidebar-toggle-button{display:block}.main-content-wrapper{margin-left:0}.content-area{padding:15px}.footer-content,.page-navigation{flex-direction:column;gap:1rem}.branding-footer,.user-footer{text-align:center}.next-page,.next-page-placeholder,.prev-page,.prev-page-placeholder{width:100%;max-width:100%}img.align-left,img.align-right{float:none;margin-left:auto;margin-right:auto}.docmd-container .image-gallery{grid-template-columns:1fr}.sponsor-ribbon{bottom:10px;right:10px}.sponsor-link{padding:.5rem 1rem;font-size:.75rem}.sponsor-icon{width:.875rem;height:.875rem}}html[data-theme=dark] .sponsor-link{background:linear-gradient(135deg,#ff6b6b,#c44569);box-shadow:rgba(255,107,107,.2) 0 4px 12px}html[data-theme=dark] .sponsor-link:hover{box-shadow:rgba(255,107,107,.3) 0 6px 20px}.copy-code-button{position:absolute;top:.75rem;right:.75rem;padding:.5rem;background-color:var(--code-bg);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;opacity:0;transition:opacity .2s ease-in-out,background-color .2s;color:var(--sidebar-text);display:flex;align-items:center;justify-content:center;z-index:10;pointer-events:auto}.copy-code-button.copied{color:#10b981;opacity:1}.sidebar nav li.collapsible>a{display:flex;justify-content:space-between;align-items:center}.sidebar nav li.collapsible>a .nav-item-title{flex-grow:1}.sidebar nav .collapse-icon{transition:transform .2s ease-in-out;flex-shrink:0;margin-left:.5em}.sidebar nav li.collapsible[aria-expanded=true]>a>.collapse-icon{transform:rotate(90deg)}hr{color:rgba(245,245,245,.27);border-top-width:1px}
+.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list>li.step-item::before,.docmd-container.steps-reset ol.steps-list>li.step-item::before,.docmd-container.steps-reset ol.steps-list[start]>li.step-item::before{content:counter(list-counter) ".";font-weight:700;margin-right:.5em;color:var(--accent-color,#007acc)}.docmd-tab-pane.active,.logo-link img,.logo-link img.logo-light,.tab-panel.active,.theme-toggle-button .icon-sun,body.sidebar-collapsible .sidebar-toggle-button,html[data-theme=dark] .logo-link img.logo-dark,html[data-theme=dark] .theme-toggle-button .icon-moon,img{display:block}:root{--font-family-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-family-mono:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,Courier,monospace;--bg-color:#ffffff;--text-color:#333333;--sidebar-bg:#f4f7f9;--sidebar-text:#2c3e50;--sidebar-link-active-bg:#e0e7ec;--sidebar-link-active-parent-bg:#e9eff3;--link-color:#007bff;--border-color:#e0e0e0;--code-bg:#f8f8f8;--code-text:#333;--header-bg:#ffffff;--header-border:#e0e0e0;--image-border-color:#e0e0e0;--image-shadow:0 2px 8px rgba(0, 0, 0, 0.1);--image-caption-bg:#f8f8f8;--image-caption-text:#666;--lightbox-bg:rgba(0, 0, 0, 0.9);--lightbox-text:#fff}[data-theme=dark]{--bg-color:#1a1a1a;--text-color:#e0e0e0;--sidebar-bg:#2c2c2c;--sidebar-text:#bdc3c7;--sidebar-link-active-bg:#3a3a3a;--sidebar-link-active-parent-bg:#343434;--link-color:#58a6ff;--border-color:#444444;--code-bg:#282c34;--code-text:#abb2bf;--header-bg:#1a1a1a;--header-border:#444444;--image-border-color:#444444;--image-shadow:0 2px 8px rgba(0, 0, 0, 0.3);--image-caption-bg:#2c2c2c;--image-caption-text:#bdc3c7;--lightbox-bg:rgba(0, 0, 0, 0.95);--lightbox-text:#fff}body{font-family:var(--font-family-sans);background-color:var(--bg-color);color:var(--text-color);margin:0;display:flex;min-height:100vh;line-height:1.6}code,pre{font-family:var(--font-family-mono);background-color:var(--code-bg)}.sidebar{width:260px;background-color:var(--sidebar-bg);color:var(--sidebar-text);padding:20px;border-right:1px solid var(--border-color);height:100vh;position:fixed;top:0;left:0;overflow-y:auto;box-sizing:border-box;flex-shrink:0}.sidebar h1{font-size:1.5em;margin-top:0;margin-bottom:20px;padding-bottom:10px;border-bottom:1px solid var(--border-color)}.sidebar nav ul{list-style:none;padding:0;margin:0}.sidebar nav li a{display:block;padding:8px 10px;text-decoration:none;color:var(--sidebar-text);border-radius:4px;transition:background-color .2s}.copy-code-button:hover,.docmd-tabs-nav-item:hover,.sidebar nav li a.active,.sidebar nav li a:hover,.theme-toggle-button:hover{background-color:var(--sidebar-link-active-bg)}.sidebar nav li a.active{font-weight:600;color:var(--link-color)}.sidebar nav li.active-parent>a{background-color:var(--sidebar-link-active-parent-bg);font-weight:500;position:relative}.sidebar nav li.active-parent>a::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background-color:var(--link-color);opacity:.5}.copy-code-button:hover,.sidebar nav li.active-parent>a.active::before,div:hover>.copy-code-button{opacity:1}.sidebar nav ul ul{padding-left:20px;margin-top:5px}.sidebar-toggle-button{background:0 0;border:1px solid transparent;color:var(--text-color);cursor:pointer;padding:0;margin:.5em 0 0;display:none;border-radius:4px}.sidebar-toggle-button:hover{background-color:var(--sidebar-bg);border-color:var(--border-color)}.sidebar-toggle-button .lucide-icon{width:2em;height:2em}body.sidebar-collapsed .sidebar{transform:translateX(-100%);visibility:hidden}.toc-level-2,body.sidebar-collapsed .main-content-wrapper{margin-left:0}.main-content-wrapper,.sidebar{transition:transform .3s,margin-left .3s,visibility .3s}.main-content-wrapper{margin-left:260px;flex-grow:1;display:flex;flex-direction:column;overflow:hidden}.header-left,.page-header{align-items:center;display:flex}.page-header{padding:15px 30px;border-bottom:1px solid var(--header-border);background-color:var(--header-bg);justify-content:space-between;min-height:2.5em}.header-left{gap:15px}.header-right{display:flex;align-items:center}.page-header h1{margin:0;font-size:1.8em}.theme-toggle-header{padding:8px;background:var(--content-bg);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;transition:.2s}.theme-toggle-header:hover{background:var(--sidebar-bg);border-color:var(--accent-color)}.card .card-title,.sidebar-header{border-bottom:1px solid var(--border-color)}.content-area{padding:2.5rem 2rem;max-width:1200px;margin:0 auto;width:100%;box-sizing:border-box}pre{color:var(--code-text);padding:1em;border-radius:4px;overflow-x:auto;position:relative}code{padding:.2em .4em;border-radius:3px;font-size:.9em}pre code{background-color:transparent;padding:0;font-size:inherit}.sidebar-header{padding-bottom:10px;margin-bottom:10px;text-align:center;height:2.5em}.sidebar-header h1{font-size:1.5em;margin-top:0;margin-bottom:0}.logo-link img{max-height:40px;width:auto;margin:0 auto}.docmd-tab-pane,.logo-link img.logo-dark,.tab-panel,.theme-toggle-button .icon-moon,html[data-theme=dark] .logo-link img.logo-light,html[data-theme=dark] .theme-toggle-button .icon-sun,.sidebar nav li.collapsible:not([aria-expanded=true])>.submenu{display:none}.sidebar-nav .lucide-icon{width:1em;height:1em;margin-right:.5em;vertical-align:-.15em;stroke-width:2}.sidebar-nav .nav-external-icon{width:1em;height:1.5em;float:right;margin-left:.3em;opacity:.7}.theme-toggle-button{background:0 0;border:1px solid var(--border-color);color:var(--sidebar-text);padding:8px;border-radius:4px;cursor:pointer;margin-top:.5em;display:flex;align-items:center;justify-content:center;width:100%}.next-page,.prev-page,.step::before{color:var(--link-color);display:flex}.callout .callout-content>:first-child,.card .card-content>:first-child,.docmd-container>:first-child,.step-content>:first-child,.step-title{margin-top:0}.theme-toggle-button .lucide-icon{width:1.2em;height:1.2em}.docmd-container{padding:1rem 1.5rem;margin-bottom:1.5rem;border-radius:6px;border:1px solid var(--border-color);background-color:var(--code-bg)}.callout .callout-content>:last-child,.card .card-content>:last-child,.docmd-container>:last-child,.step-content>:last-child{margin-bottom:0}.callout{border-left-width:5px;background-color:transparent}.callout-title{font-weight:700;margin-bottom:.5em}.callout-info{border-left-color:#3498db;background-color:rgba(52,152,219,.07)}.callout-warning{border-left-color:#f39c12;background-color:rgba(243,156,18,.07)}.callout-success,.callout-tip{border-left-color:#2ecc71;background-color:rgba(46,204,113,.07)}.callout-danger{border-left-color:#e74c3c;background-color:rgba(231,76,60,.07)}.card .card-title{font-weight:700;font-size:1.1em;margin:-1rem -1.5rem 1rem;padding:.75rem 1.5rem}.docmd-container.steps{position:relative;padding-left:3rem;border:none;background:0 0;box-shadow:none}.docmd-container.steps::before{content:"";position:absolute;top:1rem;bottom:1rem;left:2.5rem;width:2px;background-color:var(--border-color)}.step{position:relative;padding-bottom:1.5rem}.step:last-child{padding-bottom:0}.step::before{content:attr(data-step);position:absolute;left:-3rem;top:.1rem;width:2.5rem;height:2.5rem;background-color:var(--bg-color);border:2px solid var(--border-color);border-radius:50%;align-items:center;justify-content:center;font-size:1rem;font-weight:600;z-index:1}.step-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.docmd-container.steps-reset{counter-reset:step-counter 0}.docmd-container.steps-reset ol.steps-list{counter-reset:list-counter 0;list-style:none}.docmd-container.steps-reset ol.steps-list>li.step-item{counter-increment:list-counter 1;position:relative;padding-left:0;margin-bottom:2.5rem}.docmd-container.steps-reset ol.steps-list>li.step-item::before{font-size:2rem}.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list,.docmd-container.steps-reset ol.steps-list[start]{counter-reset:list-counter 0}.docmd-container.steps-reset .docmd-container.steps-reset ol.steps-list>li.step-item,.docmd-container.steps-reset ol.steps-list[start]>li.step-item{counter-increment:list-counter 1}.docmd-container.steps-reset ol:not(.steps-list)::before,.docmd-container.steps-reset ol:not(.steps-list)>li::before,.docmd-container.steps-reset ul::before,.docmd-container.steps-reset ul>li::before{width:.75rem;height:.75rem;left:-1.5rem;top:.5rem;content:""!important}:focus-visible{outline:2px solid var(--link-color);outline-offset:2px}:focus:not(:focus-visible){outline:currentcolor}.sidebar nav li a:focus-visible{background-color:var(--sidebar-link-active-bg);outline:2px solid var(--link-color);outline-offset:-2px}.theme-toggle-button:focus-visible{border-color:var(--link-color);box-shadow:0 0 0 2px var(--link-color)}.page-footer,.page-navigation{border-top:1px solid var(--border-color)}.page-navigation{display:flex;justify-content:space-between;margin-top:3rem;padding-top:1.5rem}.next-page,.prev-page{align-items:center;text-decoration:none;padding:.75rem;border-radius:6px;transition:background-color .2s;width:48%;max-width:48%}.next-page:hover,.prev-page:hover{background-color:rgba(0,0,0,.05);text-decoration:none}[data-theme=dark] .next-page:hover,[data-theme=dark] .prev-page:hover{background-color:rgba(255,255,255,.05)}.prev-page{justify-content:flex-start}.next-page{justify-content:flex-end;text-align:right}.next-page-placeholder,.prev-page-placeholder{width:48%}.next-page span,.prev-page span{display:flex;flex-direction:column}.next-page small,.prev-page small{font-size:.8rem;opacity:.8;margin-bottom:.25rem}.next-page strong,.prev-page strong{font-weight:500}.page-nav-icon{width:1.2rem;height:1.2rem}.prev-page .page-nav-icon{margin-right:.75rem}.next-page .page-nav-icon{margin-left:.75rem}.page-footer{text-align:center;padding:20px 30px;margin-top:auto;font-size:.9em;color:var(--text-color);background-color:var(--sidebar-bg)}.footer-content{display:flex;justify-content:space-between;align-items:center;margin:0 auto;width:100%}.user-footer{text-align:left}.branding-footer{text-align:right;opacity:.9;font-weight:500}.branding-footer svg{color:#fb3a3a}.page-footer a{color:var(--link-color);text-decoration:none}.page-footer a:hover,.toc-link:hover{text-decoration:underline}.content-layout{display:flex;gap:2rem;width:100%}.main-content{flex:1 1 0%;min-inline-size:0px}.toc-container{margin:0;padding:0;border:none;background-color:transparent}.docmd-container figure img,.toc-title{margin-bottom:.5rem}.toc-title{margin-top:0;font-size:1rem;font-weight:700;color:var(--text-muted)}.toc-list{list-style:none;padding-left:0;margin:0}.toc-item{margin-bottom:.25rem;line-height:1.4}.toc-link{text-decoration:none;color:var(--link-color);display:inline-block;padding:.1rem 0;font-size:.9rem;font-weight:500}.toc-level-3{margin-left:.75rem;font-size:.85rem}.toc-level-4{margin-left:1.5rem;font-size:.8rem}.toc-sidebar{width:180px;position:sticky;top:2rem;max-height:calc(-4rem + 100vh);overflow-y:auto;align-self:flex-start}@media (max-width:1024px){.content-layout{display:flex;flex-direction:column-reverse}.toc-sidebar{width:100%;position:static;margin-bottom:1rem}}.docmd-tabs,img{margin:1.5rem 0}img{max-width:100%;height:auto}img.align-left{float:left;margin-right:1.5rem;margin-bottom:1rem}img.align-center{margin-left:auto;margin-right:auto}img.align-right{float:right;margin-left:1.5rem;margin-bottom:1rem}img.size-small{max-width:300px}img.size-medium{max-width:500px}img.size-large{max-width:800px}img.with-border{border:1px solid var(--image-border-color);padding:4px}img.with-shadow{box-shadow:var(--image-shadow)}.docmd-container figure{margin:2rem 0}.docmd-container figcaption{font-size:.9rem;color:var(--image-caption-text);text-align:center;padding:.5rem;background-color:var(--image-caption-bg);border-radius:0 0 4px 4px}.docmd-container .image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;margin:2rem 0}.docmd-container .image-gallery figure{margin:0}.docmd-container .clear-float::after{content:"";display:table;clear:both}.docmd-tabs{border:1px solid var(--border-color);border-radius:6px;overflow:hidden;box-shadow:rgba(0,0,0,.05) 0 1px 3px}.docmd-tabs-nav{display:flex;background-color:var(--sidebar-bg);border-bottom:1px solid var(--border-color);overflow:auto hidden}.docmd-tabs-nav-item{padding:.75rem 1.25rem;cursor:pointer;border-bottom:3px solid transparent;margin-bottom:-1px;font-weight:500;color:var(--sidebar-text);white-space:nowrap}.docmd-tabs-nav-item.active{color:var(--link-color);border-bottom-color:var(--link-color);background-color:var(--bg-color)}.docmd-tabs-content{padding:1.5rem}.tabs-container{margin:1rem 0;border:1px solid #e1e5e9;border-radius:.375rem}.tab-navigation{display:flex;background-color:#f8f9fa;border-bottom:1px solid #e1e5e9;border-radius:.375rem .375rem 0 0}.tab-button{padding:.75rem 1rem;border-width:medium medium 2px;border-style:none none solid;border-color:currentcolor currentcolor transparent;border-image:none;background:0 0;cursor:pointer;transition:.2s}.tab-button:hover{background-color:#e9ecef}.tab-button.active{border-bottom-color:#007bff;background-color:#fff}.tab-content{padding:1rem}.docmd-lightbox{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:var(--lightbox-bg);z-index:9999;justify-content:center;align-items:center;flex-direction:column}.copy-code-button svg,.sponsor-icon{width:1rem;height:1rem}.docmd-lightbox-content{position:relative;max-width:90%;max-height:90%;text-align:center}.docmd-lightbox-content img{max-width:100%;max-height:80vh;object-fit:contain;margin:0 auto;box-shadow:rgba(0,0,0,.3) 0 0 20px}.docmd-lightbox-caption{color:var(--lightbox-text);padding:1rem;font-size:1rem;max-width:100%}.docmd-lightbox-close{position:absolute;top:20px;right:30px;color:var(--lightbox-text);font-size:2.5rem;cursor:pointer;z-index:10000}.docmd-lightbox-close:hover{color:#ddd}.docmd-button,.sponsor-link,.sponsor-link:hover{color:#fff;text-decoration:none}.docmd-container .image-gallery img,img.lightbox{cursor:zoom-in}.docmd-button{display:inline-block;padding:.6rem 1.2rem;margin:.5rem;border-radius:6px;background-color:var(--link-color);font-weight:500;transition:background-color .2s,transform .2s;border:none;cursor:pointer}.docmd-button:hover{text-decoration:none;filter:brightness(90%);transform:translateY(-1px)}.sponsor-ribbon{position:fixed;bottom:75px;right:10px;z-index:1000;transform:rotate(0);transform-origin:center center;opacity:.75;transition:.5s}.sponsor-ribbon:hover{opacity:1}.sponsor-link{display:flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,#ff6b6b,#ee5a24);padding:.75rem 1.5rem;border-radius:5px;box-shadow:rgba(255,107,107,.3) 0 4px 12px;font-weight:600;font-size:.875rem;transition:.3s;white-space:nowrap}.sponsor-link:hover{transform:scale(1.02);box-shadow:rgba(255,107,107,.4) 0 6px 20px}.sponsor-icon{animation:2s ease-in-out infinite heartbeat}.sponsor-text{font-family:inherit}@keyframes heartbeat{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}@media (max-width:768px){body{flex-direction:column}.sidebar{width:100%;height:auto;position:static;border-right:currentcolor;border-bottom:1px solid var(--border-color)}.sidebar-toggle-button{display:block}.main-content-wrapper{margin-left:0}.content-area{padding:15px}.footer-content,.page-navigation{flex-direction:column;gap:1rem}.branding-footer,.user-footer{text-align:center}.next-page,.next-page-placeholder,.prev-page,.prev-page-placeholder{width:100%;max-width:100%}img.align-left,img.align-right{float:none;margin-left:auto;margin-right:auto}.docmd-container .image-gallery{grid-template-columns:1fr}.sponsor-ribbon{bottom:10px;right:10px}.sponsor-link{padding:.5rem 1rem;font-size:.75rem}.sponsor-icon{width:.875rem;height:.875rem}}html[data-theme=dark] .sponsor-link{background:linear-gradient(135deg,#ff6b6b,#c44569);box-shadow:rgba(255,107,107,.2) 0 4px 12px}html[data-theme=dark] .sponsor-link:hover{box-shadow:rgba(255,107,107,.3) 0 6px 20px}.copy-code-button{position:absolute;top:.75rem;right:.75rem;padding:.5rem;background-color:var(--code-bg);border:1px solid var(--border-color);border-radius:6px;cursor:pointer;opacity:0;transition:opacity .2s ease-in-out,background-color .2s;color:var(--sidebar-text);display:flex;align-items:center;justify-content:center;z-index:10;pointer-events:auto}.copy-code-button.copied{color:#10b981;opacity:1}.sidebar nav li.collapsible>a{display:flex;justify-content:space-between;align-items:center}.sidebar nav li.collapsible>a .nav-item-title{flex-grow:1}.sidebar nav .collapse-icon{transition:transform .2s ease-in-out;flex-shrink:0;margin-left:.5em}.sidebar nav li.collapsible[aria-expanded=true]>a>.collapse-icon{transform:rotate(90deg)}hr{color:rgba(245,245,245,.27);border-top-width:1px}
+
+/* Mermaid diagram styles */
+.mermaid-container{margin:1.5rem 0;overflow-x:auto;text-align:center}.mermaid-container svg{max-width:100%;height:auto;display:inline-block}.mermaid-error{color:#e74c3c;padding:1rem;margin:0;background-color:rgba(231,76,60,.07);border-left:4px solid #e74c3c;border-radius:4px;font-size:.9rem}pre.mermaid{background-color:transparent;padding:0;margin:0;border:none;display:none}

package/src/assets/css/docmd-theme-sky.css

@@ -6,4 +6,4 @@
  * Features: Blue tones, clean lines, subtle gradients
  */
 
-.sidebar nav li a.active,.sidebar nav li a:hover{background-color:var(--sidebar-link-active-bg);color:var(--sidebar-link-active-text)}pre,table{margin:1.5em 0;border-radius:8px;box-shadow:var(--shadow-sm)}td,th{padding:.75rem 1rem}th,tr:hover{background-color:var(--sky-background-alt)}.callout,.steps{position:relative}.card,figure,table{overflow:hidden}.docmd-container,.sidebar,figure,pre,table{box-shadow:var(--shadow-sm)}.card .card-content>:last-child,figure img{margin-bottom:0}:root[data-theme=light]{--font-family-sans:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;--font-family-mono:'JetBrains Mono','SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;--sky-primary:#0097ff;--sky-primary-light:#e5f4ff;--sky-primary-dark:#0078cc;--sky-text:#1a1f36;--sky-text-light:#4a5568;--sky-text-lightest:#718096;--sky-background:#ffffff;--sky-background-alt:#f9fafb;--sky-border:#e2e8f0;--sky-border-light:#edf2f7;--bg-color:var(--sky-background);--text-color:var(--sky-text);--sidebar-bg:#f7fafc;--sidebar-text:var(--sky-text-light);--sidebar-link-active-bg:#e5f4ff;--sidebar-link-active-text:var(--sky-primary);--link-color:var(--sky-primary);--border-color:var(--sky-border);--code-bg:var(--sky-primary-light);--code-text:var(--sky-primary-dark);--header-bg:var(--sky-background);--header-border:var(--sky-border);--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1),0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);--image-border-color:var(--sky-border);--image-shadow:var(--shadow-md);--image-caption-bg:var(--sky-background-alt);--image-caption-text:var(--sky-text-light);--image-hover-transform:translateY(-2px);--image-hover-shadow:var(--shadow-lg);--image-border-radius:8px;--image-transition:all 0.3s ease}:root[data-theme=dark]{--sky-primary:#3b82f6;--sky-primary-light:#1e293b;--sky-primary-dark:#60a5fa;--sky-text:#f1f5f9;--sky-text-light:#cbd5e1;--sky-text-lightest:#94a3b8;--sky-background:#0f172a;--sky-background-alt:#1e293b;--sky-border:#334155;--sky-border-light:#1e293b;--bg-color:var(--sky-background);--text-color:var(--sky-text);--sidebar-bg:#0f172a;--sidebar-text:var(--sky-text-light);--sidebar-link-active-bg:#1e293b;--sidebar-link-active-text:var(--sky-primary);--link-color:var(--sky-primary);--border-color:var(--sky-border);--code-bg:var(--sky-primary-light);--code-text:var(--sky-text);--header-bg:var(--sky-background);--header-border:var(--sky-border);--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.3);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.3),0 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.3),0 4px 6px -2px rgba(0, 0, 0, 0.2);--image-border-color:var(--sky-border);--image-shadow:0 4px 8px rgba(0, 0, 0, 0.5);--image-caption-bg:var(--sky-background-alt);--image-caption-text:var(--sky-text-light);--image-hover-transform:translateY(-2px);--image-hover-shadow:0 6px 12px rgba(0, 0, 0, 0.7);--image-border-radius:8px;--image-transition:all 0.3s ease}body{font-feature-settings:"salt","ss01","ss02";letter-spacing:-.01em}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;margin-top:2em;margin-bottom:.5em;color:var(--sky-text)}.card .card-content>:first-child,h1{margin-top:0}h1{font-size:2.25rem;font-weight:700}h2{font-size:1.75rem;border-bottom:1px solid var(--sky-border-light);padding-bottom:.5rem}h3{font-size:1.5rem}h4{font-size:1.25rem}a{color:var(--link-color);text-decoration:none;transition:color .2s}a:hover{text-decoration:underline}p{margin:.5em 0;padding:.5em 0;line-height:1.7}.sidebar nav li a{border-radius:6px;margin-bottom:2px;transition:.2s}.sidebar nav li a.active{font-weight:500}.content-area{padding:2.5rem 5%}pre{background-color:var(--code-bg);padding:1.25em}code{font-size:.9em;border-radius:4px;padding:.2em .4em}table{width:100%;border-collapse:separate;border-spacing:0}th{text-align:left;font-weight:600}td{border-top:1px solid var(--sky-border-light)}.docmd-container{padding:.5rem 1.5rem;margin:1.75rem 0;border-radius:10px;border:1px solid var(--sky-border-light);background-color:var(--sky-background)}.callout,.card{background-color:var(--card-bg)}.callout{border:none;border-left:5px solid}.callout-title{font-weight:600;margin-bottom:.75em;display:flex;align-items:center}.callout-title::before{margin-right:.5rem;font-size:1.1em}.callout-info{border-left-color:var(--sky-primary)}.callout-info .callout-title::before{content:"ℹ️"}.callout-warning{border-left-color:#f59e0b}.callout-warning .callout-title::before{content:"⚠️"}.callout-success,.callout-tip{border-left-color:#10b981}.callout-tip .callout-title::before{content:"💡"}.callout-danger{border-left-color:#ef4444}.callout-danger .callout-title::before{content:"🚨"}.callout-success .callout-title::before{content:"✅"}.card{border:1px solid var(--sky-border);box-shadow:var(--text-color);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.card .card-title{padding:.5rem 1.5rem 1rem;border-bottom:1px solid var(--sky-border);font-weight:600;margin-top:0}.card .card-content{flex:1;padding:.25rem}.steps{counter-reset:step-counter;border:none;background-color:transparent;box-shadow:none;padding:0;margin-left:1rem}.steps::before{content:'';position:absolute;top:0;bottom:0!important;left:1.5rem!important;width:3px!important;background-color:var(--sky-border);transform:translateX(-50%);z-index:0}.steps .step{position:relative;padding:.5rem 2.5em;border-radius:10px;margin-bottom:1em;display:block;background-color:var(--card-bg)}.steps .step:last-child{padding-bottom:0}.steps h4,.steps ol li strong:first-child,.steps ol li:first-child{position:relative;counter-increment:step-counter;margin-bottom:1rem;font-weight:600;font-size:1.1rem;display:block}.steps h4::before,.steps ol li::before{content:counter(list-counter)!important;position:absolute;left:-2.55rem;top:.5rem;width:2rem;height:2rem;background-color:var(--sky-primary);color:#fff!important;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem!important;font-weight:500!important;z-index:1}.steps .step h4,.steps .step ol,.steps .step>div,.steps .step>p,.steps .step>pre,.steps ol,.steps ol li{display:block}.step-content,.step-content>div,.step-content>p,.step-content>pre{display:block;margin-top:.5rem;margin-bottom:1rem}.steps ol+*,.steps pre{margin-top:1rem}.steps ol{list-style:none;padding-left:0;margin-left:0}.steps ol li{position:relative;margin-bottom:1rem}.steps .step h4{font-weight:600;margin-bottom:1rem}.steps .step ol{counter-reset:none;list-style:decimal;padding-left:1.5rem;margin-top:.5rem}.steps .step ol li{padding-left:0;margin-bottom:.5rem;display:list-item}.steps .step ol li::before{display:none}.steps pre{margin-bottom:1rem}.button,button{padding:.5rem 1rem;background-color:var(--sky-primary);color:#fff;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:background-color .2s}.image-gallery figure,figure,img{transition:var(--image-transition)}.button:hover,button:hover{background-color:var(--sky-primary-dark)}.theme-toggle-button{background-color:var(--sky-background-alt);border-color:var(--sky-border-light);border-radius:6px;transition:.2s}.theme-toggle-button:hover{background-color:var(--sky-primary-light)}img{border-radius:var(--image-border-radius)}img.with-border{border:1px solid var(--image-border-color);padding:8px;background-color:var(--bg-color)}img.with-shadow{box-shadow:var(--image-shadow)}img.with-shadow:hover{box-shadow:var(--image-hover-shadow)}figure{border-radius:var(--image-border-radius)}figure:hover{box-shadow:var(--shadow-md)}figure img{border-radius:var(--image-border-radius) var(--image-border-radius) 0 0}figcaption{background-color:var(--image-caption-bg);color:var(--image-caption-text);padding:.75rem 1rem;font-size:.9rem;font-weight:500}.image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.image-gallery figure{height:100%;display:flex;flex-direction:column;margin:0}.image-gallery figure:hover{transform:var(--image-hover-transform)}.image-gallery img{height:200px;width:100%;object-fit:cover;margin:0}.image-gallery figcaption{flex:1;display:flex;align-items:center;justify-content:center;text-align:center}.image-gallery.zoom img{transition:transform .5s}.image-gallery.zoom figure:hover img{transform:scale(1.05)}img.lightbox{cursor:zoom-in}img.framed{border:8px solid #fff;box-shadow:0 0 0 1px var(--image-border-color),var(--image-shadow);box-sizing:border-box}figure.polaroid{background:#fff;padding:10px 10px 30px;box-shadow:var(--shadow-md)}figure.polaroid img{border-radius:0;box-shadow:none}figure.polaroid figcaption{background:#fff;color:var(--sky-text);font-family:Caveat,cursive,var(--font-family-sans);font-size:1.1rem}@media (max-width:768px){.content-area{padding:1.5rem 1rem}h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.image-gallery{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.image-gallery img{height:150px}}
+.sidebar nav li a.active,.sidebar nav li a:hover{background-color:var(--sidebar-link-active-bg);color:var(--sidebar-link-active-text)}pre,table{margin:1.5em 0;border-radius:8px;box-shadow:var(--shadow-sm)}td,th{padding:.75rem 1rem}th,tr:hover{background-color:var(--sky-background-alt)}.callout,.steps{position:relative}.card,figure,table{overflow:hidden}.docmd-container,.sidebar,figure,pre,table{box-shadow:var(--shadow-sm)}.card .card-content>:last-child,figure img{margin-bottom:0}:root{--sky-primary:#0097ff}:root[data-theme=light]{--font-family-sans:'Inter',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;--font-family-mono:'JetBrains Mono','SFMono-Regular',Consolas,'Liberation Mono',Menlo,monospace;--sky-primary:#0097ff;--sky-primary-light:#e5f4ff;--sky-primary-dark:#0078cc;--sky-text:#1a1f36;--sky-text-light:#4a5568;--sky-text-lightest:#718096;--sky-background:#ffffff;--sky-background-alt:#f9fafb;--sky-border:#e2e8f0;--sky-border-light:#edf2f7;--bg-color:var(--sky-background);--text-color:var(--sky-text);--sidebar-bg:#f7fafc;--sidebar-text:var(--sky-text-light);--sidebar-link-active-bg:#e5f4ff;--sidebar-link-active-text:var(--sky-primary);--link-color:var(--sky-primary);--border-color:var(--sky-border);--code-bg:var(--sky-primary-light);--code-text:var(--sky-primary-dark);--header-bg:var(--sky-background);--header-border:var(--sky-border);--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1),0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);--image-border-color:var(--sky-border);--image-shadow:var(--shadow-md);--image-caption-bg:var(--sky-background-alt);--image-caption-text:var(--sky-text-light);--image-hover-transform:translateY(-2px);--image-hover-shadow:var(--shadow-lg);--image-border-radius:8px;--image-transition:all 0.3s ease}:root[data-theme=dark]{--sky-primary:#3b82f6;--sky-primary-light:#1e293b;--sky-primary-dark:#60a5fa;--sky-text:#f1f5f9;--sky-text-light:#cbd5e1;--sky-text-lightest:#94a3b8;--sky-background:#0f172a;--sky-background-alt:#1e293b;--sky-border:#334155;--sky-border-light:#1e293b;--bg-color:var(--sky-background);--text-color:var(--sky-text);--sidebar-bg:#0f172a;--sidebar-text:var(--sky-text-light);--sidebar-link-active-bg:#1e293b;--sidebar-link-active-text:var(--sky-primary);--link-color:var(--sky-primary);--border-color:var(--sky-border);--code-bg:var(--sky-primary-light);--code-text:var(--sky-text);--header-bg:var(--sky-background);--header-border:var(--sky-border);--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.3);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.3),0 2px 4px -1px rgba(0, 0, 0, 0.2);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.3),0 4px 6px -2px rgba(0, 0, 0, 0.2);--image-border-color:var(--sky-border);--image-shadow:0 4px 8px rgba(0, 0, 0, 0.5);--image-caption-bg:var(--sky-background-alt);--image-caption-text:var(--sky-text-light);--image-hover-transform:translateY(-2px);--image-hover-shadow:0 6px 12px rgba(0, 0, 0, 0.7);--image-border-radius:8px;--image-transition:all 0.3s ease}body{font-feature-settings:"salt","ss01","ss02";letter-spacing:-.01em}h1,h2,h3,h4,h5,h6{font-weight:600;line-height:1.3;margin-top:2em;margin-bottom:.5em;color:var(--sky-text)}.card .card-content>:first-child,h1{margin-top:0}h1{font-size:2.25rem;font-weight:700}h2{font-size:1.75rem;border-bottom:1px solid var(--sky-border-light);padding-bottom:.5rem}h3{font-size:1.5rem}h4{font-size:1.25rem}a{color:var(--link-color);text-decoration:none;transition:color .2s}a:hover{text-decoration:underline}p{margin:.5em 0;padding:.5em 0;line-height:1.7}.sidebar nav li a{border-radius:6px;margin-bottom:2px;transition:.2s}.sidebar nav li a.active{font-weight:500}.content-area{padding:2.5rem 5%}pre{background-color:var(--code-bg);padding:1.25em}code{font-size:.9em;border-radius:4px;padding:.2em .4em}table{width:100%;border-collapse:separate;border-spacing:0}th{text-align:left;font-weight:600}td{border-top:1px solid var(--sky-border-light)}.docmd-container{padding:.5rem 1.5rem;margin:1.75rem 0;border-radius:10px;border:1px solid var(--sky-border-light);background-color:var(--sky-background)}.callout,.card{background-color:var(--card-bg)}.callout{border:none;border-left:5px solid}.callout-title{font-weight:600;margin-bottom:.75em;display:flex;align-items:center}.callout-title::before{margin-right:.5rem;font-size:1.1em}.callout-info{border-left-color:var(--sky-primary)}.callout-info .callout-title::before{content:"ℹ️"}.callout-warning{border-left-color:#f59e0b}.callout-warning .callout-title::before{content:"⚠️"}.callout-success,.callout-tip{border-left-color:#10b981}.callout-tip .callout-title::before{content:"💡"}.callout-danger{border-left-color:#ef4444}.callout-danger .callout-title::before{content:"🚨"}.callout-success .callout-title::before{content:"✅"}.card{border:1px solid var(--sky-border);box-shadow:var(--text-color);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column}.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.card .card-title{padding:.5rem 1.5rem 1rem;border-bottom:1px solid var(--sky-border);font-weight:600;margin-top:0}.card .card-content{flex:1;padding:.25rem}.steps{counter-reset:step-counter;border:none;background-color:transparent;box-shadow:none;padding:0;margin-left:1rem}.steps::before{content:'';position:absolute;top:0;bottom:0!important;left:1.5rem!important;width:3px!important;background-color:var(--sky-border);transform:translateX(-50%);z-index:0}.steps .step{position:relative;padding:.5rem 2.5em;border-radius:10px;margin-bottom:1em;display:block;background-color:var(--card-bg)}.steps .step:last-child{padding-bottom:0}.steps h4,.steps ol li strong:first-child,.steps ol li:first-child{position:relative;counter-increment:step-counter;margin-bottom:1rem;font-weight:600;font-size:1.1rem;display:block}.steps h4::before,.steps ol li::before{content:counter(list-counter)!important;position:absolute;left:-2.55rem;top:.5rem;width:2rem;height:2rem;background-color:var(--sky-primary);color:#fff!important;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1rem!important;font-weight:500!important;z-index:1}.steps .step h4,.steps .step ol,.steps .step>div,.steps .step>p,.steps .step>pre,.steps ol,.steps ol li{display:block}.step-content,.step-content>div,.step-content>p,.step-content>pre{display:block;margin-top:.5rem;margin-bottom:1rem}.steps ol+*,.steps pre{margin-top:1rem}.steps ol{list-style:none;padding-left:0;margin-left:0}.steps ol li{position:relative;margin-bottom:1rem}.steps .step h4{font-weight:600;margin-bottom:1rem}.steps .step ol{counter-reset:none;list-style:decimal;padding-left:1.5rem;margin-top:.5rem}.steps .step ol li{padding-left:0;margin-bottom:.5rem;display:list-item}.steps .step ol li::before{display:none}.steps pre{margin-bottom:1rem}.button,button{padding:.5rem 1rem;background-color:var(--sky-primary);color:#fff;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:background-color .2s}.image-gallery figure,figure,img{transition:var(--image-transition)}.button:hover,button:hover{background-color:var(--sky-primary-dark)}.theme-toggle-button{background-color:var(--sky-background-alt);border-color:var(--sky-border-light);border-radius:6px;transition:.2s}.theme-toggle-button:hover{background-color:var(--sky-primary-light)}img{border-radius:var(--image-border-radius)}img.with-border{border:1px solid var(--image-border-color);padding:8px;background-color:var(--bg-color)}img.with-shadow{box-shadow:var(--image-shadow)}img.with-shadow:hover{box-shadow:var(--image-hover-shadow)}figure{border-radius:var(--image-border-radius)}figure:hover{box-shadow:var(--shadow-md)}figure img{border-radius:var(--image-border-radius) var(--image-border-radius) 0 0}figcaption{background-color:var(--image-caption-bg);color:var(--image-caption-text);padding:.75rem 1rem;font-size:.9rem;font-weight:500}.image-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;margin:2rem 0}.image-gallery figure{height:100%;display:flex;flex-direction:column;margin:0}.image-gallery figure:hover{transform:var(--image-hover-transform)}.image-gallery img{height:200px;width:100%;object-fit:cover;margin:0}.image-gallery figcaption{flex:1;display:flex;align-items:center;justify-content:center;text-align:center}.image-gallery.zoom img{transition:transform .5s}.image-gallery.zoom figure:hover img{transform:scale(1.05)}img.lightbox{cursor:zoom-in}img.framed{border:8px solid #fff;box-shadow:0 0 0 1px var(--image-border-color),var(--image-shadow);box-sizing:border-box}figure.polaroid{background:#fff;padding:10px 10px 30px;box-shadow:var(--shadow-md)}figure.polaroid img{border-radius:0;box-shadow:none}figure.polaroid figcaption{background:#fff;color:var(--sky-text);font-family:Caveat,cursive,var(--font-family-sans);font-size:1.1rem}@media (max-width:768px){.content-area{padding:1.5rem 1rem}h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.image-gallery{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.image-gallery img{height:150px}}

package/src/assets/js/docmd-mermaid.js

@@ -0,0 +1,203 @@
+// Source file from the docmd project — https://github.com/mgks/docmd
+// Mermaid diagram integration with theme support
+
+(function() {
+  'use strict';
+
+  // Configuration for mermaid based on current theme
+  function getMermaidConfig(theme) {
+    const isDark = theme === 'dark';
+    
+    return {
+      startOnLoad: false,
+      theme: isDark ? 'dark' : 'default',
+      flowchart: {
+        useMaxWidth: true,
+        htmlLabels: true
+      },
+      sequence: {
+        useMaxWidth: true
+      },
+      gantt: {
+        useMaxWidth: true
+      }
+    };
+  }
+
+  // Initialize mermaid when DOM is ready
+  function initializeMermaid() {
+    if (typeof mermaid === 'undefined') {
+      console.warn('Mermaid library not loaded');
+      return;
+    }
+
+    const currentTheme = document.body.getAttribute('data-theme') || 'light';
+    const config = getMermaidConfig(currentTheme);
+    
+    mermaid.initialize(config);
+    
+    // Render all mermaid diagrams
+    renderMermaidDiagrams();
+  }
+
+  // Store for diagram codes
+  const diagramStore = new Map();
+  
+  // Render all mermaid diagrams on the page
+  function renderMermaidDiagrams() {
+    if (typeof mermaid === 'undefined') {
+      return;
+    }
+
+    const mermaidElements = document.querySelectorAll('pre.mermaid');
+    
+    mermaidElements.forEach((element, index) => {
+      // Skip if already rendered
+      if (element.getAttribute('data-processed') === 'true') {
+        return;
+      }
+
+      try {
+        // Get the diagram code
+        const code = element.textContent;
+        
+        // Create a unique ID for this diagram
+        const id = `mermaid-diagram-${index}-${Date.now()}`;
+        
+        // Store the original code for re-rendering
+        diagramStore.set(id, code);
+        
+        // Create a container div
+        const container = document.createElement('div');
+        container.className = 'mermaid-container';
+        container.setAttribute('data-mermaid-id', id);
+        container.setAttribute('data-processed', 'true');
+        
+        // Replace the pre element with the container
+        element.parentNode.replaceChild(container, element);
+        
+        // Render the diagram
+        renderSingleDiagram(container, id, code);
+      } catch (error) {
+        console.error('Mermaid processing error:', error);
+      }
+    });
+  }
+  
+  // Render a single diagram
+  function renderSingleDiagram(container, id, code) {
+    if (typeof mermaid === 'undefined') {
+      return;
+    }
+    
+    // Process the code to handle theme overrides
+    const currentTheme = document.body.getAttribute('data-theme') || 'light';
+    const processedCode = processThemeInCode(code, currentTheme);
+    
+    // Render the diagram
+    mermaid.render(id, processedCode).then(result => {
+      container.innerHTML = result.svg;
+    }).catch(error => {
+      console.error('Mermaid rendering error:', error);
+      container.innerHTML = `<pre class="mermaid-error">Error rendering diagram: ${error.message}</pre>`;
+    });
+  }
+  
+  // Process mermaid code to inject or override theme
+  function processThemeInCode(code, theme) {
+    const isDark = theme === 'dark';
+    const targetTheme = isDark ? 'dark' : 'default';
+    
+    // Check if code has %%{init: config - match the entire init block including nested objects
+    const initRegex = /%%\{init:\s*\{.*?\}\s*\}%%/s;
+    const match = code.match(initRegex);
+    
+    if (match) {
+      // Code has init config, replace only the theme property
+      const initBlock = match[0];
+      let updatedBlock = initBlock;
+      
+      // Try to replace theme property
+      if (initBlock.includes("'theme'")) {
+        updatedBlock = initBlock.replace(/'theme'\s*:\s*'[^']*'/, `'theme':'${targetTheme}'`);
+      } else if (initBlock.includes('"theme"')) {
+        updatedBlock = initBlock.replace(/"theme"\s*:\s*"[^"]*"/, `"theme":"${targetTheme}"`);
+      } else {
+        // Add theme to the config - insert after the first {
+        updatedBlock = initBlock.replace(/%%\{init:\s*\{/, `%%{init: {'theme':'${targetTheme}',`);
+      }
+      
+      return code.replace(initRegex, updatedBlock);
+    }
+    
+    // No init config, code will use global mermaid config
+    return code;
+  }
+
+  // Re-render mermaid diagrams when theme changes
+  function handleThemeChange() {
+    if (typeof mermaid === 'undefined') {
+      return;
+    }
+
+    const currentTheme = document.body.getAttribute('data-theme') || 'light';
+    const config = getMermaidConfig(currentTheme);
+    
+    // Re-initialize mermaid with new theme
+    mermaid.initialize(config);
+    
+    // Find all rendered diagrams and re-render them
+    const containers = document.querySelectorAll('.mermaid-container[data-processed="true"]');
+    
+    containers.forEach((container) => {
+      const mermaidId = container.getAttribute('data-mermaid-id');
+      const code = diagramStore.get(mermaidId);
+      
+      if (code) {
+        // Create a new unique ID for re-rendering
+        const newId = `${mermaidId}-${Date.now()}`;
+        
+        // Clear the container and re-render
+        container.innerHTML = '';
+        renderSingleDiagram(container, newId, code);
+      }
+    });
+  }
+
+  // Setup theme change observer
+  function setupThemeObserver() {
+    const observer = new MutationObserver((mutations) => {
+      mutations.forEach((mutation) => {
+        if (mutation.type === 'attributes' && mutation.attributeName === 'data-theme') {
+          handleThemeChange();
+        }
+      });
+    });
+
+    observer.observe(document.body, {
+      attributes: true,
+      attributeFilter: ['data-theme']
+    });
+  }
+
+  // Initialize when DOM is ready
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', function() {
+      initializeMermaid();
+      setupThemeObserver();
+    });
+  } else {
+    initializeMermaid();
+    setupThemeObserver();
+  }
+
+  // Handle tab switches - render mermaid in newly visible tabs
+  document.addEventListener('click', function(e) {
+    if (e.target.classList.contains('docmd-tabs-nav-item')) {
+      // Wait a bit for tab content to be visible
+      setTimeout(renderMermaidDiagrams, 100);
+    }
+  });
+
+})();
+

package/src/commands/dev.js

@@ -28,7 +28,7 @@ function formatPathForDisplay(absolutePath, cwd) {
   return relativePath;
 }
 
-async function startDevServer(configPathOption, options = { preserve: false }) {
+async function startDevServer(configPathOption, options = { preserve: false, port: undefined }) {
   let config = await loadConfig(configPathOption); // Load initial config
   const CWD = process.cwd(); // Current Working Directory where user runs `docmd dev`
 
@@ -264,9 +264,9 @@ async function startDevServer(configPathOption, options = { preserve: false }) {
   watcher.on('error', error => console.error(`Watcher error: ${error}`));
 
   // Try different ports if the default port is in use
-  const PORT = process.env.PORT || 3000;
+  const PORT = options.port || process.env.PORT || 3000;
   const MAX_PORT_ATTEMPTS = 10;
-  let currentPort = PORT;
+  let currentPort = parseInt(PORT, 10);
   
   // Function to try starting the server on different ports
   function tryStartServer(port, attempt = 1) {