From 23133386c3cd4f4312324033964d24be57f9bb9f Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Fri, 9 Oct 2026 22:44:13 +0530
Subject: [PATCH 01/25] Render catalog, fee category, and shortcut page words
 from MDX

Copy each page's live intro into content files beside its route. Catalogs
and fee categories map content by slug, and a published slug with no
entry is an error. Shortcut app routes pass their own intro to the
template, which renders the print link itself.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../[slug]/content/developer-tools/intro.mdx  |  1 +
 .../[slug]/content/dns-tools/intro.mdx        |  1 +
 .../[slug]/content/domain-tools/intro.mdx     |  1 +
 .../content/hosting-cloud-tools/intro.mdx     |  1 +
 app/(site)/(catalogs)/[slug]/content/index.ts | 21 +++++++++++++++++++
 .../[slug]/content/kdp-tools/intro.mdx        |  1 +
 .../content/productivity-tools/intro.mdx      |  1 +
 .../[slug]/content/saas-tools/intro.mdx       |  1 +
 .../[slug]/content/storage-tools/intro.mdx    |  1 +
 app/(site)/(catalogs)/[slug]/page.tsx         | 11 ++++++----
 .../1password/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/1password/page.tsx     |  3 ++-
 .../7-zip/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/7-zip/page.tsx         |  3 ++-
 .../ableton-live/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/ableton-live/page.tsx  |  3 ++-
 .../adobe-acrobat-pro/content/intro.mdx       |  1 +
 .../adobe-acrobat-pro/page.tsx                |  3 ++-
 .../adobe-acrobat-reader/content/intro.mdx    |  1 +
 .../adobe-acrobat-reader/page.tsx             |  3 ++-
 .../adobe-after-effects/content/intro.mdx     |  1 +
 .../adobe-after-effects/page.tsx              |  3 ++-
 .../adobe-audition/content/intro.mdx          |  1 +
 .../adobe-audition/page.tsx                   |  3 ++-
 .../adobe-illustrator/content/intro.mdx       |  1 +
 .../adobe-illustrator/page.tsx                |  3 ++-
 .../adobe-indesign/content/intro.mdx          |  1 +
 .../adobe-indesign/page.tsx                   |  3 ++-
 .../adobe-lightroom-classic/content/intro.mdx |  1 +
 .../adobe-lightroom-classic/page.tsx          |  3 ++-
 .../adobe-premiere-pro/content/intro.mdx      |  1 +
 .../adobe-premiere-pro/page.tsx               |  3 ++-
 .../adobe-premiere-rush/content/intro.mdx     |  1 +
 .../adobe-premiere-rush/page.tsx              |  3 ++-
 .../content/intro.mdx                         |  1 +
 .../adobe-substance-3d-painter/page.tsx       |  3 ++-
 .../adobe-xd/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/adobe-xd/page.tsx      |  3 ++-
 .../affinity-designer/content/intro.mdx       |  1 +
 .../affinity-designer/page.tsx                |  3 ++-
 .../affinity-photo/content/intro.mdx          |  1 +
 .../affinity-photo/page.tsx                   |  3 ++-
 .../aider/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/aider/page.tsx         |  3 ++-
 .../airtable/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/airtable/page.tsx      |  3 ++-
 .../alfred/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/alfred/page.tsx        |  3 ++-
 .../amplitude/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/amplitude/page.tsx     |  3 ++-
 .../android-studio/content/intro.mdx          |  1 +
 .../android-studio/page.tsx                   |  3 ++-
 .../anydesk/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/anydesk/page.tsx       |  3 ++-
 .../apple-music/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/apple-music/page.tsx   |  3 ++-
 .../apple-notes/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/apple-notes/page.tsx   |  3 ++-
 .../arc-browser/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/arc-browser/page.tsx   |  3 ++-
 .../asana/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/asana/page.tsx         |  3 ++-
 .../audacity/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/audacity/page.tsx      |  3 ++-
 .../autocad/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/autocad/page.tsx       |  3 ++-
 .../autodesk-maya/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/autodesk-maya/page.tsx |  3 ++-
 .../autodesk-revit/content/intro.mdx          |  1 +
 .../autodesk-revit/page.tsx                   |  3 ++-
 .../axure-rp/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/axure-rp/page.tsx      |  3 ++-
 .../azure-devops/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/azure-devops/page.tsx  |  3 ++-
 .../balsamiq-wireframes/content/intro.mdx     |  1 +
 .../balsamiq-wireframes/page.tsx              |  3 ++-
 .../basecamp/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/basecamp/page.tsx      |  3 ++-
 .../keyboard-shortcuts/bear/content/intro.mdx |  1 +
 .../keyboard-shortcuts/bear/page.tsx          |  3 ++-
 .../bitbucket/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/bitbucket/page.tsx     |  3 ++-
 .../blender/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/blender/page.tsx       |  3 ++-
 .../bluebeam-revu/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/bluebeam-revu/page.tsx |  3 ++-
 .../brave/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/brave/page.tsx         |  3 ++-
 .../buffer/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/buffer/page.tsx        |  3 ++-
 .../canva/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/canva/page.tsx         |  3 ++-
 .../chrome/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/chrome/page.tsx        |  3 ++-
 .../cinema-4d/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/cinema-4d/page.tsx     |  3 ++-
 .../claude-code/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/claude-code/page.tsx   |  3 ++-
 .../clickup/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/clickup/page.tsx       |  3 ++-
 .../clip-studio-paint/content/intro.mdx       |  1 +
 .../clip-studio-paint/page.tsx                |  3 ++-
 .../clockify/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/clockify/page.tsx      |  3 ++-
 .../keyboard-shortcuts/coda/content/intro.mdx |  1 +
 .../keyboard-shortcuts/coda/page.tsx          |  3 ++-
 .../codex/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/codex/page.tsx         |  3 ++-
 .../confluence/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/confluence/page.tsx    |  3 ++-
 .../craft/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/craft/page.tsx         |  3 ++-
 .../cubase/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/cubase/page.tsx        |  3 ++-
 .../cursor/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/cursor/page.tsx        |  3 ++-
 .../content/intro.mdx                         |  1 +
 .../davinci-resolve-fusion-page/page.tsx      |  3 ++-
 .../davinci-resolve/content/intro.mdx         |  1 +
 .../davinci-resolve/page.tsx                  |  3 ++-
 .../dbeaver/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/dbeaver/page.tsx       |  3 ++-
 .../deepl/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/deepl/page.tsx         |  3 ++-
 .../descript/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/descript/page.tsx      |  3 ++-
 .../discord/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/discord/page.tsx       |  3 ++-
 .../draw-io-diagrams-net/content/intro.mdx    |  1 +
 .../draw-io-diagrams-net/page.tsx             |  3 ++-
 .../eclipse/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/eclipse/page.tsx       |  3 ++-
 .../emacs/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/emacs/page.tsx         |  3 ++-
 .../evernote/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/evernote/page.tsx      |  3 ++-
 .../excalidraw/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/excalidraw/page.tsx    |  3 ++-
 .../excel/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/excel/page.tsx         |  3 ++-
 .../fantastical/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/fantastical/page.tsx   |  3 ++-
 .../figjam/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/figjam/page.tsx        |  3 ++-
 .../figma/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/figma/page.tsx         |  3 ++-
 .../filezilla/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/filezilla/page.tsx     |  3 ++-
 .../final-cut-pro/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/final-cut-pro/page.tsx |  3 ++-
 .../firefox/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/firefox/page.tsx       |  3 ++-
 .../fl-studio/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/fl-studio/page.tsx     |  3 ++-
 .../framer/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/framer/page.tsx        |  3 ++-
 .../freshdesk/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/freshdesk/page.tsx     |  3 ++-
 .../front/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/front/page.tsx         |  3 ++-
 .../fusion-360/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/fusion-360/page.tsx    |  3 ++-
 .../ghostty/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/ghostty/page.tsx       |  3 ++-
 .../keyboard-shortcuts/gimp/content/intro.mdx |  1 +
 .../keyboard-shortcuts/gimp/page.tsx          |  3 ++-
 .../github-copilot/content/intro.mdx          |  1 +
 .../github-copilot/page.tsx                   |  3 ++-
 .../github-desktop/content/intro.mdx          |  1 +
 .../github-desktop/page.tsx                   |  3 ++-
 .../github/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/github/page.tsx        |  3 ++-
 .../gitkraken/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/gitkraken/page.tsx     |  3 ++-
 .../gitlab/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/gitlab/page.tsx        |  3 ++-
 .../gmail/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/gmail/page.tsx         |  3 ++-
 .../gnome/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/gnome/page.tsx         |  3 ++-
 .../godot-engine/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/godot-engine/page.tsx  |  3 ++-
 .../goodnotes/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/goodnotes/page.tsx     |  3 ++-
 .../google-docs/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/google-docs/page.tsx   |  3 ++-
 .../google-drive/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/google-drive/page.tsx  |  3 ++-
 .../google-forms/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/google-forms/page.tsx  |  3 ++-
 .../google-gemini/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/google-gemini/page.tsx |  3 ++-
 .../google-meet/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/google-meet/page.tsx   |  3 ++-
 .../google-sheets/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/google-sheets/page.tsx |  3 ++-
 .../google-slides/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/google-slides/page.tsx |  3 ++-
 .../grammarly/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/grammarly/page.tsx     |  3 ++-
 .../harvest/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/harvest/page.tsx       |  3 ++-
 .../httpie/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/httpie/page.tsx        |  3 ++-
 .../ia-writer/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/ia-writer/page.tsx     |  3 ++-
 .../imessage/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/imessage/page.tsx      |  3 ++-
 .../inkscape/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/inkscape/page.tsx      |  3 ++-
 .../insomnia/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/insomnia/page.tsx      |  3 ++-
 .../intellij-idea/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/intellij-idea/page.tsx |  3 ++-
 .../intercom/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/intercom/page.tsx      |  3 ++-
 .../iterm2/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/iterm2/page.tsx        |  3 ++-
 .../keyboard-shortcuts/jira/content/intro.mdx |  1 +
 .../keyboard-shortcuts/jira/page.tsx          |  3 ++-
 .../joplin/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/joplin/page.tsx        |  3 ++-
 .../jupyter-notebook/content/intro.mdx        |  1 +
 .../jupyter-notebook/page.tsx                 |  3 ++-
 .../keyboard-shortcuts-app-page.tsx           |  5 +++--
 .../keyboard-shortcuts-reference.tsx          | 17 ++++++++-------
 .../keynote/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/keynote/page.tsx       |  3 ++-
 .../krita/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/krita/page.tsx         |  3 ++-
 .../libreoffice-writer/content/intro.mdx      |  1 +
 .../libreoffice-writer/page.tsx               |  3 ++-
 .../linear/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/linear/page.tsx        |  3 ++-
 .../linkedin/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/linkedin/page.tsx      |  3 ++-
 .../linux-kde-plasma/content/intro.mdx        |  1 +
 .../linux-kde-plasma/page.tsx                 |  3 ++-
 .../logic-pro/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/logic-pro/page.tsx     |  3 ++-
 .../logseq/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/logseq/page.tsx        |  3 ++-
 .../looker/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/looker/page.tsx        |  3 ++-
 .../keyboard-shortcuts/loom/content/intro.mdx |  1 +
 .../keyboard-shortcuts/loom/page.tsx          |  3 ++-
 .../macos-finder/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/macos-finder/page.tsx  |  3 ++-
 .../macos-spotlight/content/intro.mdx         |  1 +
 .../macos-spotlight/page.tsx                  |  3 ++-
 .../macos/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/macos/page.tsx         |  3 ++-
 .../mastodon/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/mastodon/page.tsx      |  3 ++-
 .../matlab/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/matlab/page.tsx        |  3 ++-
 .../mattermost/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/mattermost/page.tsx    |  3 ++-
 .../microsoft-edge/content/intro.mdx          |  1 +
 .../microsoft-edge/page.tsx                   |  3 ++-
 .../microsoft-onedrive/content/intro.mdx      |  1 +
 .../microsoft-onedrive/page.tsx               |  3 ++-
 .../microsoft-onenote/content/intro.mdx       |  1 +
 .../microsoft-onenote/page.tsx                |  3 ++-
 .../microsoft-outlook/content/intro.mdx       |  1 +
 .../microsoft-outlook/page.tsx                |  3 ++-
 .../microsoft-powerpoint/content/intro.mdx    |  1 +
 .../microsoft-powerpoint/page.tsx             |  3 ++-
 .../microsoft-powertoys/content/intro.mdx     |  1 +
 .../microsoft-powertoys/page.tsx              |  3 ++-
 .../microsoft-teams/content/intro.mdx         |  1 +
 .../microsoft-teams/page.tsx                  |  3 ++-
 .../microsoft-word/content/intro.mdx          |  1 +
 .../microsoft-word/page.tsx                   |  3 ++-
 .../milanote/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/milanote/page.tsx      |  3 ++-
 .../keyboard-shortcuts/miro/content/intro.mdx |  1 +
 .../keyboard-shortcuts/miro/page.tsx          |  3 ++-
 .../monday-com/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/monday-com/page.tsx    |  3 ++-
 .../mozilla-thunderbird/content/intro.mdx     |  1 +
 .../mozilla-thunderbird/page.tsx              |  3 ++-
 .../neovim/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/neovim/page.tsx        |  3 ++-
 .../netflix/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/netflix/page.tsx       |  3 ++-
 .../notability/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/notability/page.tsx    |  3 ++-
 .../notepad-plus-plus/content/intro.mdx       |  1 +
 .../notepad-plus-plus/page.tsx                |  3 ++-
 .../notion/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/notion/page.tsx        |  3 ++-
 .../numbers/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/numbers/page.tsx       |  3 ++-
 .../obs-studio/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/obs-studio/page.tsx    |  3 ++-
 .../obsidian/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/obsidian/page.tsx      |  3 ++-
 .../omnifocus/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/omnifocus/page.tsx     |  3 ++-
 .../opencode/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/opencode/page.tsx      |  3 ++-
 .../opera/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/opera/page.tsx         |  3 ++-
 .../oracle-virtualbox/content/intro.mdx       |  1 +
 .../oracle-virtualbox/page.tsx                |  3 ++-
 .../otter-ai/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/otter-ai/page.tsx      |  3 ++-
 .../pages/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/pages/page.tsx         |  3 ++-
 .../paint-net/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/paint-net/page.tsx     |  3 ++-
 .../penpot/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/penpot/page.tsx        |  3 ++-
 .../pi-coding-agent/content/intro.mdx         |  1 +
 .../pi-coding-agent/page.tsx                  |  3 ++-
 .../power-bi/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/power-bi/page.tsx      |  3 ++-
 .../powershell/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/powershell/page.tsx    |  3 ++-
 .../presonus-studio-one/content/intro.mdx     |  1 +
 .../presonus-studio-one/page.tsx              |  3 ++-
 .../prezi/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/prezi/page.tsx         |  3 ++-
 .../pro-tools/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/pro-tools/page.tsx     |  3 ++-
 .../protopie/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/protopie/page.tsx      |  3 ++-
 .../pycharm/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/pycharm/page.tsx       |  3 ++-
 .../quickbooks-online/content/intro.mdx       |  1 +
 .../quickbooks-online/page.tsx                |  3 ++-
 .../raycast/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/raycast/page.tsx       |  3 ++-
 .../reddit/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/reddit/page.tsx        |  3 ++-
 .../riverside-fm/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/riverside-fm/page.tsx  |  3 ++-
 .../rocket-chat/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/rocket-chat/page.tsx   |  3 ++-
 .../rstudio/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/rstudio/page.tsx       |  3 ++-
 .../safari/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/safari/page.tsx        |  3 ++-
 .../salesforce/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/salesforce/page.tsx    |  3 ++-
 .../scrivener/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/scrivener/page.tsx     |  3 ++-
 .../signal/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/signal/page.tsx        |  3 ++-
 .../simplenote/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/simplenote/page.tsx    |  3 ++-
 .../sketch/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/sketch/page.tsx        |  3 ++-
 .../sketchup/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/sketchup/page.tsx      |  3 ++-
 .../slack/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/slack/page.tsx         |  3 ++-
 .../smartsheet/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/smartsheet/page.tsx    |  3 ++-
 .../solidworks/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/solidworks/page.tsx    |  3 ++-
 .../spark-mail/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/spark-mail/page.tsx    |  3 ++-
 .../spotify/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/spotify/page.tsx       |  3 ++-
 .../squarespace/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/squarespace/page.tsx   |  3 ++-
 .../sublime-text/content/intro.mdx            |  1 +
 .../keyboard-shortcuts/sublime-text/page.tsx  |  3 ++-
 .../superhuman/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/superhuman/page.tsx    |  3 ++-
 .../tableau/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/tableau/page.tsx       |  3 ++-
 .../tableplus/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/tableplus/page.tsx     |  3 ++-
 .../tally-forms/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/tally-forms/page.tsx   |  3 ++-
 .../telegram/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/telegram/page.tsx      |  3 ++-
 .../things-3/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/things-3/page.tsx      |  3 ++-
 .../keyboard-shortcuts/tmux/content/intro.mdx |  1 +
 .../keyboard-shortcuts/tmux/page.tsx          |  3 ++-
 .../todoist/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/todoist/page.tsx       |  3 ++-
 .../typora/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/typora/page.tsx        |  3 ++-
 .../ulysses/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/ulysses/page.tsx       |  3 ++-
 .../keyboard-shortcuts/vim/content/intro.mdx  |  1 +
 .../keyboard-shortcuts/vim/page.tsx           |  3 ++-
 .../visual-studio/content/intro.mdx           |  1 +
 .../keyboard-shortcuts/visual-studio/page.tsx |  3 ++-
 .../vmware-workstation/content/intro.mdx      |  1 +
 .../vmware-workstation/page.tsx               |  3 ++-
 .../vscode/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/vscode/page.tsx        |  3 ++-
 .../keyboard-shortcuts/warp/content/intro.mdx |  1 +
 .../keyboard-shortcuts/warp/page.tsx          |  3 ++-
 .../webflow/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/webflow/page.tsx       |  3 ++-
 .../webstorm/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/webstorm/page.tsx      |  3 ++-
 .../whimsical/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/whimsical/page.tsx     |  3 ++-
 .../windows-file-explorer/content/intro.mdx   |  1 +
 .../windows-file-explorer/page.tsx            |  3 ++-
 .../windows-snipping-tool/content/intro.mdx   |  1 +
 .../windows-snipping-tool/page.tsx            |  3 ++-
 .../windows-terminal/content/intro.mdx        |  1 +
 .../windows-terminal/page.tsx                 |  3 ++-
 .../windows/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/windows/page.tsx       |  3 ++-
 .../winmerge/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/winmerge/page.tsx      |  3 ++-
 .../wireshark/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/wireshark/page.tsx     |  3 ++-
 .../keyboard-shortcuts/wix/content/intro.mdx  |  1 +
 .../keyboard-shortcuts/wix/page.tsx           |  3 ++-
 .../wondershare-filmora/content/intro.mdx     |  1 +
 .../wondershare-filmora/page.tsx              |  3 ++-
 .../wordpress-admin/content/intro.mdx         |  1 +
 .../wordpress-admin/page.tsx                  |  3 ++-
 .../wps-office/content/intro.mdx              |  1 +
 .../keyboard-shortcuts/wps-office/page.tsx    |  3 ++-
 .../wrike/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/wrike/page.tsx         |  3 ++-
 .../x-twitter/content/intro.mdx               |  1 +
 .../keyboard-shortcuts/x-twitter/page.tsx     |  3 ++-
 .../youtrack/content/intro.mdx                |  1 +
 .../keyboard-shortcuts/youtrack/page.tsx      |  3 ++-
 .../youtube/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/youtube/page.tsx       |  3 ++-
 .../zbrush/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/zbrush/page.tsx        |  3 ++-
 .../keyboard-shortcuts/zed/content/intro.mdx  |  1 +
 .../keyboard-shortcuts/zed/page.tsx           |  3 ++-
 .../zen-browser/content/intro.mdx             |  1 +
 .../keyboard-shortcuts/zen-browser/page.tsx   |  3 ++-
 .../zendesk/content/intro.mdx                 |  1 +
 .../keyboard-shortcuts/zendesk/page.tsx       |  3 ++-
 .../zeplin/content/intro.mdx                  |  1 +
 .../keyboard-shortcuts/zeplin/page.tsx        |  3 ++-
 .../keyboard-shortcuts/zoom/content/intro.mdx |  1 +
 .../keyboard-shortcuts/zoom/page.tsx          |  3 ++-
 .../zulip/content/intro.mdx                   |  1 +
 .../keyboard-shortcuts/zulip/page.tsx         |  3 ++-
 .../content/apps-and-software/intro.mdx       |  1 +
 .../content/creative-assets/intro.mdx         |  1 +
 .../creators-and-communities/intro.mdx        |  1 +
 .../digital-products-and-stores/intro.mdx     |  1 +
 .../platform-fees/[section]/content/index.ts  | 21 +++++++++++++++++++
 .../content/music-and-audio/intro.mdx         |  1 +
 .../[section]/content/payments/intro.mdx      |  1 +
 .../content/teaching-and-courses/intro.mdx    |  1 +
 .../content/writing-and-books/intro.mdx       |  1 +
 .../platform-fees/[section]/page.tsx          |  6 ++++++
 .../platform-fees/components.tsx              | 12 ++++++-----
 .../platform-fees/content/intro.mdx           |  1 +
 .../(directories)/platform-fees/page.tsx      |  3 ++-
 461 files changed, 748 insertions(+), 237 deletions(-)
 create mode 100644 app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/index.ts
 create mode 100644 app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/index.ts
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/content/intro.mdx

diff --git a/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
new file mode 100644
index 00000000..cbb0d5ad
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
@@ -0,0 +1 @@
+Test permissions, ignore rules, compose files, user mappings, and file sync patterns with your own inputs.
diff --git a/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
new file mode 100644
index 00000000..fd530f7c
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
@@ -0,0 +1 @@
+Look up current records, trace referrals, compare cached answers, and check the DNS settings that affect websites, email, and certificates.
diff --git a/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
new file mode 100644
index 00000000..c63980c8
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
@@ -0,0 +1 @@
+Check registration, availability, ownership, expiry, transfers, and status codes using current registry and registrar data.
diff --git a/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
new file mode 100644
index 00000000..ee3322e6
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
@@ -0,0 +1 @@
+Estimate app resources, inspect network information, and review firewall and reverse proxy settings before deployment.
diff --git a/app/(site)/(catalogs)/[slug]/content/index.ts b/app/(site)/(catalogs)/[slug]/content/index.ts
new file mode 100644
index 00000000..306622be
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/index.ts
@@ -0,0 +1,21 @@
+import type { MDXContent } from "mdx/types";
+import DeveloperToolsIntro from "./developer-tools/intro.mdx";
+import DnsToolsIntro from "./dns-tools/intro.mdx";
+import DomainToolsIntro from "./domain-tools/intro.mdx";
+import HostingCloudToolsIntro from "./hosting-cloud-tools/intro.mdx";
+import KdpToolsIntro from "./kdp-tools/intro.mdx";
+import ProductivityToolsIntro from "./productivity-tools/intro.mdx";
+import SaasToolsIntro from "./saas-tools/intro.mdx";
+import StorageToolsIntro from "./storage-tools/intro.mdx";
+
+/** Each catalog's own words, keyed by its slug. Add an entry before a catalog is published. */
+export const catalogContent: Record<string, { Intro: MDXContent; Article?: MDXContent }> = {
+  "developer-tools": { Intro: DeveloperToolsIntro },
+  "dns-tools": { Intro: DnsToolsIntro },
+  "domain-tools": { Intro: DomainToolsIntro },
+  "hosting-cloud-tools": { Intro: HostingCloudToolsIntro },
+  "kdp-tools": { Intro: KdpToolsIntro },
+  "productivity-tools": { Intro: ProductivityToolsIntro },
+  "saas-tools": { Intro: SaasToolsIntro },
+  "storage-tools": { Intro: StorageToolsIntro },
+};
diff --git a/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
new file mode 100644
index 00000000..4fbf4f9a
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
@@ -0,0 +1 @@
+Tools for Amazon KDP authors. Size your pages and cover, check files and listing details, and estimate royalties, price floors, advertising cost per click, and payment months.
diff --git a/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
new file mode 100644
index 00000000..a8d009b2
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
@@ -0,0 +1 @@
+Build a keyboard shortcut reference around the actions you use, then keep it close while you work.
diff --git a/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
new file mode 100644
index 00000000..78c12d99
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
@@ -0,0 +1 @@
+Start with a monthly view of recurring revenue, retention, customer churn, margin, and acquisition cost. Each calculator explains what its result means and which figures it needs.
diff --git a/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
new file mode 100644
index 00000000..0b0bf3e0
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
@@ -0,0 +1 @@
+Compare capacity, protection, rebuild exposure, growth, and cost using the drives and layout you actually plan to run.
diff --git a/app/(site)/(catalogs)/[slug]/page.tsx b/app/(site)/(catalogs)/[slug]/page.tsx
index d967b4e2..948490bf 100644
--- a/app/(site)/(catalogs)/[slug]/page.tsx
+++ b/app/(site)/(catalogs)/[slug]/page.tsx
@@ -5,7 +5,6 @@ import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { PageHeader } from "@/app/ui/site/page-header";
 import { PageMeta } from "@/app/ui/site/page-meta";
 import { PageTitleIcon } from "@/app/ui/site/page-title-icon";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { proseClassName, proseFlowClassName } from "@/app/ui/site/prose";
 import { ToolCatalog } from "@/app/ui/catalogs/tool-catalog";
@@ -14,11 +13,15 @@ import { DomainCatalogReference } from "./domain-catalog-reference";
 import { cardArt } from "@/lib/card-art";
 import { cardIcon } from "@/lib/card-icons";
 import { getPublishedToolCatalog } from "@/lib/tool-catalogs";
+import { catalogContent } from "./content";
 
 export default async function ToolCatalogPage({ params }: { params: Promise<{ slug: string }> }) {
   const { slug } = await params;
   const catalog = await getPublishedToolCatalog(slug);
   if (!catalog) notFound();
+  const content = catalogContent[slug];
+  if (!content) throw new Error(`Published catalog has no content: ${slug}`);
+  const { Intro, Article } = content;
   const Icon = cardIcon(catalog.card_icon_key);
 
   return (
@@ -35,16 +38,16 @@ export default async function ToolCatalogPage({ params }: { params: Promise<{ sl
             <DirectoryPageTitle title={catalog.title} />
           </h1>
           <PageMeta updatedAt={catalog.updated_at} />
-          <ContentMarkdown markdown={catalog.intro_markdown} />
+          <Intro />
         </PageHeader>
       </EntryHero>
       <PageCanvas>
         <ToolCatalog heading="Tools" tools={catalog.tools} />
         {slug === "domain-tools" ? <DomainCatalogReference /> : null}
       </PageCanvas>
-      {catalog.content_markdown ? (
+      {Article ? (
         <PageCanvas as="article" reading className={`${proseClassName} ${proseFlowClassName}`}>
-          <ContentMarkdown markdown={catalog.content_markdown} />
+          <Article />
         </PageCanvas>
       ) : null}
     </AppShell>
diff --git a/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
new file mode 100644
index 00000000..41c6a665
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
@@ -0,0 +1 @@
+1Password has separate keyboard layers for the desktop app, Quick Access, and the browser extension. The bindings below keep those contexts separate so the same key can be read without guessing where it works.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/1password/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/1password/page.tsx
index 62b3cc6e..43b9c1b2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/1password/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/1password/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/1password";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
new file mode 100644
index 00000000..35979aee
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
@@ -0,0 +1 @@
+7-Zip File Manager uses function keys for file work and numeric keypad keys for selection. The official source defines the bindings directly in the File Manager key handler.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/7-zip/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/7-zip/page.tsx
index 8fc67f44..1cee6286 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/7-zip/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/7-zip/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/7-zip";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
new file mode 100644
index 00000000..177fbcab
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
@@ -0,0 +1 @@
+Ableton Live's keymap reaches almost every part of a set: views, devices, clips, arrangement editing, tracks, transport, and the browser. The groups follow Live's own manual so a binding stays tied to the view where it works.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ableton-live/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/page.tsx
index 5f52bf05..533181f8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ableton-live/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/ableton-live";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
new file mode 100644
index 00000000..546afb73
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
@@ -0,0 +1 @@
+Acrobat's desktop keymap covers tool selection, PDF navigation, comments, form work, task panes, bookmarks, search, and accessibility. Focus-sensitive and single-key commands stay grouped with the interface state they require.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/page.tsx
index ce8d2aed..6f96e745 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-acrobat-pro";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
new file mode 100644
index 00000000..9518055d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
@@ -0,0 +1 @@
+Adobe documents one desktop keyboard map for Acrobat Reader and Acrobat. This Reader reference keeps the viewing, commenting, form-entry, search, portfolio, navigation, and accessibility commands, while leaving Acrobat-only authoring tools on the Acrobat Pro page.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/page.tsx
index 76c03e85..d19af6f0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-acrobat-reader";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
new file mode 100644
index 00000000..63f540b9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
@@ -0,0 +1 @@
+After Effects assigns shortcuts across the application and inside individual panels. This reference keeps timeline properties, layers, views, tools, keyframes, masks, paint, text, previews, and rendering in separate groups so focus-dependent commands retain their context.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/page.tsx
index 66be8361..3f27dc2f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-after-effects";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
new file mode 100644
index 00000000..a77a2e6e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
@@ -0,0 +1 @@
+Audition's published defaults cover transport and zoom, markers, Waveform Editor processing, spectral editing, and Multitrack clip or mixer adjustments. Editor-specific commands stay separate so a binding is not mistaken for an application-wide action.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/page.tsx
index 906c516d..d23f919d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-audition";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
new file mode 100644
index 00000000..afd9557b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
@@ -0,0 +1 @@
+Illustrator's default keymap covers document work, its dense tool palette, artboards, object selection, drawing, color, type, and effects. These tables keep Adobe's Windows and macOS defaults separate.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/page.tsx
index 5b2cf5b5..5e78af45 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-illustrator";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
new file mode 100644
index 00000000..e76d9a3e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
@@ -0,0 +1 @@
+InDesign's default shortcuts cover layout tools, frames, transformations, typography, tables, document navigation, panels, styles, and production previews. The same key can change meaning when a text insertion point is active, so context stays in each action.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/page.tsx
index e8a640dd..45bf1474 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-indesign";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
new file mode 100644
index 00000000..1d6ee3cd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
@@ -0,0 +1 @@
+Lightroom Classic's keymap follows its module-based workflow. It covers the workspace, catalog and photo management, Library views, ratings, collections, metadata, Develop controls, and local adjustment tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/page.tsx
index 47771266..126d0409 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-lightroom-classic";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
new file mode 100644
index 00000000..3a64f636
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
@@ -0,0 +1 @@
+Premiere Pro separates application commands from panel-specific commands. This reference keeps file, edit, clip, sequence, marker, graphics, workspace, mixer, effects, utility-panel, Project, Program Monitor, and Timeline bindings in their working context.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/page.tsx
index 1e431cfc..e01fa60a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-premiere-pro";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
new file mode 100644
index 00000000..f2b1f1b0
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
@@ -0,0 +1 @@
+Premiere Rush keeps project, clip, timeline, preview, and media-browser commands in separate contexts. This reference preserves those focus boundaries and the few commands that apply only while editing title text.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/page.tsx
index 3702ea07..7058d0af 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-premiere-rush";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
new file mode 100644
index 00000000..e2b0bd84
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
@@ -0,0 +1 @@
+Substance 3D Painter combines editable application shortcuts with fixed mouse and layer-stack controls. This reference separates tools, viewport navigation, painting gestures, masks, layers, and project commands so each chord keeps its working context.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/page.tsx
index 4cd0c2bc..59d8e473 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-substance-3d-painter";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
new file mode 100644
index 00000000..8f883de9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
@@ -0,0 +1 @@
+Adobe XD assigns commands across design, vector editing, layout, prototype preview, and shared-spec contexts. This reference keeps platform-only exports, window controls, and preview recording explicit instead of inventing Windows equivalents.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/page.tsx
index 85992a82..9e2c2325 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/adobe-xd";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
new file mode 100644
index 00000000..dc126465
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
@@ -0,0 +1 @@
+Affinity Designer 2 assigns tools by Persona and combines them with document, view, text, drawing-modifier, and layer controls. Tool letters can be tapped to keep a tool active or held for temporary use before returning to the previous tool.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/page.tsx
index 6d1e35ed..ee34d0aa 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/affinity-designer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
new file mode 100644
index 00000000..414f85d2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
@@ -0,0 +1 @@
+Affinity Photo 2 changes tool letters with the active Persona while keeping common document, view, brush, and layer commands available throughout the desktop app. This reference labels each Persona so overlapping keys remain understandable.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/page.tsx
index 3479cd6b..cf6e1124 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/affinity-photo";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
new file mode 100644
index 00000000..abe0ccae
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
@@ -0,0 +1 @@
+Aider's interactive terminal prompt supports editing, history navigation, interruption, multiline input, and external-editor handoff. Its default Emacs bindings and optional vi command mode are documented separately so the active input mode is always clear.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/aider/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/aider/page.tsx
index 1cf05325..af9fd290 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/aider/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/aider/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/aider";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
new file mode 100644
index 00000000..51a664bd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
@@ -0,0 +1 @@
+Airtable's documented shortcuts cover base navigation, view controls, cell editing, record movement, and the Gallery, Kanban, Gantt, and expanded-record surfaces. The reference keeps context-specific commands with the view where Airtable says they work.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/airtable/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/airtable/page.tsx
index 99ca6e4c..1d9d941a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/airtable/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/airtable/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/airtable";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
new file mode 100644
index 00000000..c91ea8fd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
@@ -0,0 +1 @@
+Alfred's default hotkeys cover launching and dismissing the search window, acting on results, browsing files, managing the File Buffer, using Clipboard History, and controlling the Music Mini Player. Powerpack requirements are stated where they apply.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/alfred/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/alfred/page.tsx
index 82511abc..dce1e960 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/alfred/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/alfred/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/alfred";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
new file mode 100644
index 00000000..5cf099c1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
@@ -0,0 +1 @@
+Amplitude's chart-creation shortcuts open event and property controls, refresh or save analysis, copy and organize charts, and operate hovered selector rows. Every binding here stays within the chart builder context documented by Amplitude.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/amplitude/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/amplitude/page.tsx
index a2498014..0693575b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/amplitude/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/amplitude/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/amplitude";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
new file mode 100644
index 00000000..c0f44bc6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
@@ -0,0 +1 @@
+Android Studio's default keymap covers tool windows, search and navigation, visual layout tools, code generation and editing, builds, debugging, refactoring, and version control. Windows and Linux share one documented column, while macOS has its own combinations.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/android-studio/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/android-studio/page.tsx
index a95f3f88..dbc3fd40 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/android-studio/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/android-studio/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/android-studio";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
new file mode 100644
index 00000000..381ba1bd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
@@ -0,0 +1 @@
+AnyDesk reserves one Windows hotkey family for controlling an active remote session. Every command begins with Control+Alt+Shift, which keeps local session controls distinct from keystrokes sent to the remote device.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/anydesk/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/anydesk/page.tsx
index ee1f2a8c..7a22c870 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/anydesk/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/anydesk/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/anydesk";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
new file mode 100644
index 00000000..96a5fe1d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
@@ -0,0 +1 @@
+Apple Music uses different desktop keymaps on Windows and macOS. This reference keeps platform-only playlist, library, window, and access-key commands visible instead of applying a blanket Control-to-Command conversion.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-music/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/apple-music/page.tsx
index 1d6ecff6..436d2b64 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/apple-music/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-music/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/apple-music";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
new file mode 100644
index 00000000..aa803591
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
@@ -0,0 +1 @@
+Notes on Mac provides shortcuts for the main window, note formatting, lists, shared-note navigation, and table editing. Table keys depend on whether the insertion point is inside a cell, so those commands remain in their own group.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-notes/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/page.tsx
index b4749fa8..032c3ce8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/apple-notes/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/apple-notes";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
new file mode 100644
index 00000000..0092dc2c
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
@@ -0,0 +1 @@
+Arc organizes browsing around tabs, Spaces, a sidebar, and Split View. This reference preserves the different Windows and macOS navigation chords, including macOS-only Little Arc and alternate history keys.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/arc-browser/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/page.tsx
index b20efdbc..21989867 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/arc-browser/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/arc-browser";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
new file mode 100644
index 00000000..bb502422
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
@@ -0,0 +1 @@
+Asana combines Inbox keys, task actions, Tab-key chords, selection controls, and native desktop-window shortcuts. The list-view field-navigation command is different: Asana explicitly documents it as two Right Arrow presses.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/asana/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/asana/page.tsx
index 0d073503..8966c3f6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/asana/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/asana/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/asana";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
new file mode 100644
index 00000000..1431c9d5
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
@@ -0,0 +1 @@
+Audacity's Standard shortcut set covers projects, audio editing, selections, timeline views, playback, recording, looping, track mute controls, and effect reuse. The extended Full set remains separate because it is not enabled by default.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/audacity/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/audacity/page.tsx
index 8abe4bab..4bf73838 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/audacity/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/audacity/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/audacity";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
new file mode 100644
index 00000000..521c4c7e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
@@ -0,0 +1 @@
+AutoCAD's default CUIx keymap controls drawings, palettes, selection and editing, drafting aids, viewports, layouts, and 3D subobject filters. This record follows the Windows shortcut table published for AutoCAD 2026.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autocad/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/autocad/page.tsx
index 1fbe21f7..a87e6f8d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autocad/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autocad/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/autocad";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
new file mode 100644
index 00000000..a28464b9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
@@ -0,0 +1 @@
+Maya's default hotkeys cover transform tools, scene files, object display, animation playback, snapping, component selection, editing, panel views, and polygon modeling. Mouse-only camera and marking-menu gestures are kept out of the keyboard tables.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/page.tsx
index b6864ead..e748467d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/autodesk-maya";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
new file mode 100644
index 00000000..a0d1091f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
@@ -0,0 +1 @@
+Revit uses short letter sequences for modeling, annotation, view, and systems commands. The tables retain Autodesk's alternative sequences and reserved Ctrl combinations where the 2026 default list publishes them.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/page.tsx
index 23f5111e..354ddcf0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/autodesk-revit";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
new file mode 100644
index 00000000..20827467
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
@@ -0,0 +1 @@
+Axure RP 11's keymap covers files, canvas movement, widget insertion and editing, vector operations, sitemap management, prototype tools, panes, preview, and publishing. Single-key canvas commands remain visible as documented alternatives.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/axure-rp/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/page.tsx
index 23d97f9d..4cd8e8c6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/axure-rp/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/axure-rp";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
new file mode 100644
index 00000000..91b574f0
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
@@ -0,0 +1 @@
+Azure DevOps web shortcuts change with the active service and page. Sequential navigation keys work only when focus is outside an input control, so this reference separates global navigation, Repos, work items, Boards, Test Plans, and Wiki commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/azure-devops/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/page.tsx
index 9aa73c5a..f5ee3e92 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/azure-devops/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/azure-devops";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
new file mode 100644
index 00000000..22ffbced
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
@@ -0,0 +1 @@
+Balsamiq Wireframes combines direct-selection keys, drawing letters, and context-sensitive editing commands. Browser and operating-system shortcuts can take precedence in the web editor, so this reference keeps Balsamiq's published platform limits visible.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/page.tsx
index 544c3353..a4a1de7f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/balsamiq-wireframes";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
new file mode 100644
index 00000000..c2cd76af
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
@@ -0,0 +1 @@
+Basecamp 5 uses Shift-letter navigation throughout the web app, plus a small set of project and page commands. Hold Shift outside a text field to reveal available keycaps; inside a text field, press Shift twice to activate hotkey mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/basecamp/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/basecamp/page.tsx
index a92a2df3..efe497ca 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/basecamp/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/basecamp/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/basecamp";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
new file mode 100644
index 00000000..677375e8
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
@@ -0,0 +1 @@
+Bear for Mac has native commands for Markdown-style formatting, note structure, tables, navigation, and windows. Many bindings depend on whether focus is in the editor, note list, sidebar, or a table cell, so they are grouped by working context.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bear/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/bear/page.tsx
index 102780c9..901115a2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bear/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bear/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/bear";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
new file mode 100644
index 00000000..c69a5341
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
@@ -0,0 +1 @@
+Bitbucket Cloud's documented keyboard shortcuts cover site search, navigation panels, repository file filtering, and the core pull-request review tabs and actions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bitbucket/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/page.tsx
index bb25f059..2c4f3113 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bitbucket/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/bitbucket";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
new file mode 100644
index 00000000..8d80464e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
@@ -0,0 +1 @@
+Blender's common default keymap covers file work, properties, selections, editor panels, 3D Viewport modes, animation keys, and Python data-path tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/blender/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/blender/page.tsx
index 22e68d58..88814938 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/blender/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/blender/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/blender";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
new file mode 100644
index 00000000..6ec110b6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
@@ -0,0 +1 @@
+Bluebeam Revu's published Windows shortcuts cover markup creation and arrangement, measurement, PDF viewing, editing, page operations, panels, and document navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/page.tsx
index d5f60e69..1accd7a5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/bluebeam-revu";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
new file mode 100644
index 00000000..f3b61e46
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
@@ -0,0 +1 @@
+Brave keeps the useful browser controls close to the keyboard: move across tabs, jump to the address bar, search a page, or open browser tools without leaving the current window.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/brave/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/brave/page.tsx
index a740de5e..ae9acd28 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/brave/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/brave/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/brave";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
new file mode 100644
index 00000000..702e153b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
@@ -0,0 +1 @@
+Buffer's web shortcuts open its reference and command bar, jump among product areas, start new work, schedule posts, build threads, and navigate Community conversations.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/buffer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/buffer/page.tsx
index 59bf04bd..8fff66e3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/buffer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/buffer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/buffer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
new file mode 100644
index 00000000..3b80b5b0
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
@@ -0,0 +1 @@
+Canva's editor uses shortcuts for creating elements, arranging and resizing selections, formatting text, changing page views, and handling comments. Desktop-app window and tab commands are separate from shortcuts that act inside a design.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/canva/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/canva/page.tsx
index 5dc4ed79..754d0ccb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/canva/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/canva/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/canva";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
new file mode 100644
index 00000000..299c5227
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
@@ -0,0 +1 @@
+Chrome's official list covers the browser habits that happen dozens of times a day: manage tabs, move through history, search the current page, reach browser tools, and work in the address bar without leaving the keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/chrome/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/chrome/page.tsx
index 1aecedd8..27565be8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/chrome/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/chrome/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/chrome";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
new file mode 100644
index 00000000..08d3fba4
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
@@ -0,0 +1 @@
+Cinema 4D's default shortcuts cover animation, project files, managers, the viewport, display modes, modeling and selection tools, rendering, and sculpt controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/page.tsx
index 69d2b533..66713895 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/cinema-4d";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
new file mode 100644
index 00000000..be0d1dd9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
@@ -0,0 +1 @@
+Claude Code spends most of its time waiting for a decision, running a tool, or holding a prompt. These official interactive-mode shortcuts cover interrupts, rewinds, mode changes, multiline input, terminal-style editing, and transcript navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/claude-code/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/claude-code/page.tsx
index 00b05d85..6f21757c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/claude-code/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/claude-code/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/claude-code";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
new file mode 100644
index 00000000..ff6a1fdb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
@@ -0,0 +1 @@
+ClickUp's official shortcut set covers workspace navigation, task creation, text editing, Chat, Inbox triage, views, SyncUps, and desktop-wide capture commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clickup/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/clickup/page.tsx
index d771fdcb..331674ea 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clickup/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clickup/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/clickup";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
new file mode 100644
index 00000000..c671befa
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
@@ -0,0 +1 @@
+Clip Studio Paint assigns defaults to file, edit, layer, selection, canvas, and ruler commands. The defaults can be customized, so this reference describes the initial shortcut set rather than a user's edited configuration.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/page.tsx
index 733bd20b..67dbda73 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/clip-studio-paint";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
new file mode 100644
index 00000000..e4f8b43d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
@@ -0,0 +1 @@
+Clockify's web Time Tracker uses single keys when no field is being edited. The native Mac app has a separate set of Command shortcuts that work while its window has focus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clockify/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/clockify/page.tsx
index 672e3bb7..57a11b03 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clockify/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clockify/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/clockify";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
new file mode 100644
index 00000000..9f8f206a
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
@@ -0,0 +1 @@
+Coda combines document navigation, rich-text formatting, insert triggers, and table movement. Several keys change behavior with focus, so page, paragraph, and table commands are separated here.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/coda/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/coda/page.tsx
index 22048895..40ede5da 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/coda/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/coda/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/coda";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
new file mode 100644
index 00000000..919a8b73
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
@@ -0,0 +1 @@
+Codex CLI gives you a terminal UI around a running coding task. The current keymap covers steering, prompt editing, transcript navigation, reasoning effort, approvals, and the list pickers that appear around a session.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/codex/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/codex/page.tsx
index be94f4a0..076c84c7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/codex/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/codex/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/codex";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
new file mode 100644
index 00000000..2fd38ef2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
@@ -0,0 +1 @@
+Confluence Cloud has separate command sets for site navigation, pages and live docs, editor formatting, tables, Markdown input, and whiteboards. General shortcuts can be disabled in the in-product shortcut dialog.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/confluence/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/confluence/page.tsx
index 2f07bc2b..c789bc79 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/confluence/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/confluence/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/confluence";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
new file mode 100644
index 00000000..37956ec2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
@@ -0,0 +1 @@
+Craft separates document navigation, task entry, block editing, formatting, organization, and tabs. Several commands are available only in the Mac app, so those bindings are kept platform-specific.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/craft/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/craft/page.tsx
index dd69439b..a93bcbff 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/craft/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/craft/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/craft";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
new file mode 100644
index 00000000..fde36571
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
@@ -0,0 +1 @@
+Cubase Pro's current default key command reference covers project files, editing, transport, windows, and media. The platform-neutral commands are paired with the documented Windows and macOS modifier conventions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cubase/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/cubase/page.tsx
index 9cff935e..a217e8d0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cubase/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cubase/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/cubase";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
new file mode 100644
index 00000000..badb4a7e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
@@ -0,0 +1 @@
+Cursor puts the editor and an AI workspace side by side. Its official reference covers chat, inline edit, code context, autocomplete, terminal prompts, model controls, and the familiar editor navigation keys around them.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cursor/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/cursor/page.tsx
index 0269ca3a..c92a8c68 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cursor/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cursor/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/cursor";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
new file mode 100644
index 00000000..7e9aa1d6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
@@ -0,0 +1 @@
+The Fusion page uses a small set of transport and playhead commands for moving through a composition. The focused Fusion timeline or viewer determines where a command applies.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/page.tsx
index a4f29d70..c422faa5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/davinci-resolve-fusion-page";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
new file mode 100644
index 00000000..4fe7991b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
@@ -0,0 +1 @@
+These DaVinci Resolve commands cover playback, timeline navigation, timeline zoom, and the blade and clip-enable tools. Focus matters because Resolve has page- and panel-specific commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/page.tsx
index 8465acc3..8362d028 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/davinci-resolve";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
new file mode 100644
index 00000000..0e69119e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
@@ -0,0 +1 @@
+DBeaver groups shortcuts by connections, result sets, editors, search, windows, files, and debugging. Focused view and the active key scheme affect which command receives a key.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/dbeaver/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/page.tsx
index c70af45b..211e04a7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/dbeaver/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/dbeaver";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
new file mode 100644
index 00000000..bf92bb6e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
@@ -0,0 +1 @@
+DeepL's desktop shortcuts send selected text from any application to DeepL for translation or writing improvement. Translation uses a repeated C sequence; the keys are not pressed as one simultaneous chord.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/deepl/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/deepl/page.tsx
index b5618293..1d9152cb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/deepl/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/deepl/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/deepl";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
new file mode 100644
index 00000000..55f4ddba
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
@@ -0,0 +1 @@
+Descript's documented shortcuts cover tool selection, the action bar, transcript correction, timeline visibility, and scene creation. The editor's in-app shortcut panel contains additional commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/descript/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/descript/page.tsx
index 62c5bdd8..96c16ece 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/descript/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/descript/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/descript";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
new file mode 100644
index 00000000..1cc67e4f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
@@ -0,0 +1 @@
+Discord's browser and desktop shortcuts cover settings, search, messages, channels, servers, voice controls, and keyboard navigation. Custom keybinds are desktop-only and are not included as defaults.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/discord/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/discord/page.tsx
index f912aa65..386efaaf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/discord/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/discord/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/discord";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
new file mode 100644
index 00000000..50b9747b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
@@ -0,0 +1 @@
+The diagrams.net editor has keyboard commands for document work, canvas views, selection, shapes, labels, styling, and tables, plus modifier-and-pointer gestures for precise diagram construction. Focus and the selected object determine which command runs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/page.tsx
index 99cfa301..d5f3f218 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/draw-io-diagrams-net";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
new file mode 100644
index 00000000..fe90257f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
@@ -0,0 +1 @@
+Eclipse shortcuts cover quick access, code navigation, editing, search, debugging, and workbench navigation. The active context, installed plug-ins, scheme, locale, and operating system can change the active binding.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/eclipse/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/eclipse/page.tsx
index 1369b340..144401d7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/eclipse/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/eclipse/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/eclipse";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
new file mode 100644
index 00000000..b1e2fca2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
@@ -0,0 +1 @@
+GNU Emacs uses Control and Meta key notation for movement, editing, files, buffers, windows, search, help, and keyboard macros. Prefix commands are shown in press order rather than as one chord.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/emacs/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/emacs/page.tsx
index 00f4d14b..d2f4fbfd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/emacs/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/emacs/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/emacs";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
new file mode 100644
index 00000000..09f3763d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
@@ -0,0 +1 @@
+Evernote publishes separate Mac and Windows shortcuts for global capture, notes, navigation, views, editing, formatting, and its AI assistant.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/evernote/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/evernote/page.tsx
index c94ddb05..e7c12d40 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/evernote/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/evernote/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/evernote";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
new file mode 100644
index 00000000..4573b095
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
@@ -0,0 +1 @@
+Excalidraw's official shortcut map covers file actions, clipboard and layer operations, canvas modes, zoom, selection, and tool locking. Most commands use Ctrl on Windows and Linux or Command on macOS.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excalidraw/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/page.tsx
index be7cddee..5269fdd2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/excalidraw/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/excalidraw";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
new file mode 100644
index 00000000..d3a23102
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
@@ -0,0 +1 @@
+Excel shortcuts are easiest to use when they follow the job in front of you: move through a grid, edit a cell, format a selection, work with data, and reach the ribbon or formula bar. This reference covers current desktop defaults for Windows and Mac.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excel/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/excel/page.tsx
index 476e8769..25f6cb6c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/excel/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/excel/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/excel";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
new file mode 100644
index 00000000..8d17d676
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
@@ -0,0 +1 @@
+Fantastical's Mac and Windows shortcut pages cover search, event and task creation, date navigation, item movement, and app controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fantastical/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/fantastical/page.tsx
index 7db62629..3bc4f8bc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fantastical/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fantastical/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/fantastical";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
new file mode 100644
index 00000000..9a06796d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
@@ -0,0 +1 @@
+FigJam's official help pages document shortcuts for selection and ordering, text, connectors, drawing, comments, tables, and board tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figjam/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/figjam/page.tsx
index 46f2fea4..b0decb77 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/figjam/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/figjam/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/figjam";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
new file mode 100644
index 00000000..bcb073e1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
@@ -0,0 +1 @@
+Figma work is mostly selection and repetition. These shortcuts get you from tool choice to shape editing to layer and canvas control without breaking the design flow.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figma/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/figma/page.tsx
index 8eb4fbaf..ed049c24 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/figma/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/figma/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/figma";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
new file mode 100644
index 00000000..f5664d55
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
@@ -0,0 +1 @@
+FileZilla's official wiki lists shortcuts for panes, transfers, bookmarks, searches, queues, tabs, and local or remote file navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/filezilla/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/filezilla/page.tsx
index dd2d466f..7319729a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/filezilla/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/filezilla/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/filezilla";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
new file mode 100644
index 00000000..57273678
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
@@ -0,0 +1 @@
+Final Cut Pro's Mac guide documents shortcuts for application control, editing, clip placement, timeline navigation, selection, and playback organization.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/page.tsx
index 57ba81c8..8fe1c88b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/final-cut-pro";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
new file mode 100644
index 00000000..33bccba9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
@@ -0,0 +1 @@
+Firefox's official reference spans browsing, editing, tabs, search, bookmarks, developer tools, PDFs, and media. This table keeps those contexts together so the shortcut still makes sense when the page is no longer just a page.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/firefox/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/firefox/page.tsx
index 35997c3f..be460214 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/firefox/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/firefox/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/firefox";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
new file mode 100644
index 00000000..a7f1de32
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
@@ -0,0 +1 @@
+FL Studio groups shortcuts by global commands, files, patterns, the Channel Rack, transport, windows, the Mixer, the Playlist, the Piano roll, and the Browser.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fl-studio/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/page.tsx
index ea91df39..8eaafd4c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fl-studio/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/fl-studio";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
new file mode 100644
index 00000000..5056fa79
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
@@ -0,0 +1 @@
+Framer's official shortcut table covers agents, arranging, editing, layout, preview, projects, selection, tools, typography, vector editing, views, and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/framer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/framer/page.tsx
index 85b99f79..1f98d0cd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/framer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/framer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/framer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
new file mode 100644
index 00000000..877e46fd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
@@ -0,0 +1 @@
+Freshdesk splits its shortcut map by screen. These entries cover global navigation, ticket lists, selected tickets, and the ticket editor so support agents can move through a queue and reply without leaving the keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/freshdesk/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/page.tsx
index 1312b4fc..7d80e1cf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/freshdesk/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/freshdesk";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
new file mode 100644
index 00000000..46360a7b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
@@ -0,0 +1 @@
+Front shortcuts keep conversations moving through selection, reply, assignment, tagging, and archive actions. The reference below uses Front's own shortcut set, including the commands that are useful while a conversation or composer has focus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/front/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/front/page.tsx
index 8e481bfb..141488b0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/front/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/front/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/front";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
new file mode 100644
index 00000000..6e1d59ee
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
@@ -0,0 +1 @@
+Fusion 360 puts common modeling, sketching, view, and document commands on the keyboard. This reference keeps the commands that are useful across a normal design session and leaves pointer gestures outside the shortcut list.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fusion-360/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/page.tsx
index 82cf990e..b1d11e5f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fusion-360/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/fusion-360";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
new file mode 100644
index 00000000..170809ba
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
@@ -0,0 +1 @@
+Ghostty's defaults are about arranging terminal work. Split the surface, move between tabs, copy and paste, search scrollback, change the view, and reload configuration while keeping the shell session alive.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ghostty/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/ghostty/page.tsx
index ca242c02..41f964f1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ghostty/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ghostty/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/ghostty";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
new file mode 100644
index 00000000..c3b895c5
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
@@ -0,0 +1 @@
+GIMP's official quick reference groups shortcuts by toolbox, image files, dialogs, and view controls. These entries cover the commands used most often when selecting, painting, editing layers, and exporting an image.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gimp/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/gimp/page.tsx
index 433ce933..d5e21cb4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gimp/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gimp/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/gimp";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
new file mode 100644
index 00000000..2aebe1da
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
@@ -0,0 +1 @@
+GitHub Copilot's documented keys live inside the host IDE. These entries use GitHub's current Visual Studio Code reference for inline suggestions and the separate pane, with the same suggestion controls also documented for JetBrains IDEs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-copilot/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/page.tsx
index bfb24154..b86d8c49 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github-copilot/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/github-copilot";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
new file mode 100644
index 00000000..7777f1fd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
@@ -0,0 +1 @@
+GitHub Desktop's shortcuts cover repository setup, branch work, commit flow, and the views that developers use while reviewing changes. Mac and Windows bindings come directly from GitHub's current desktop reference.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-desktop/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/page.tsx
index 5c4e282d..08df8dd6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github-desktop/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/github-desktop";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
new file mode 100644
index 00000000..3830c93e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
@@ -0,0 +1 @@
+GitHub's keyboard layer changes with the page you are on. These groups cover site navigation, repository sections, issue and pull request triage, comment editing, code browsing, and notifications.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/github/page.tsx
index 593196eb..e1a0ee96 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/github";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
new file mode 100644
index 00000000..8e4576b6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
@@ -0,0 +1 @@
+GitKraken's desktop shortcuts cover the work that repeats in every repository: fetch, stage, commit, move through history, compare changes, and switch between open tabs. The same reference covers Windows, macOS, and Linux.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitkraken/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/page.tsx
index 5cb77415..da8d0c1c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gitkraken/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/gitkraken";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
new file mode 100644
index 00000000..575bfdc5
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
@@ -0,0 +1 @@
+GitLab's web shortcuts move between projects, issues, merge requests, and the editor. This set follows the current GitLab.com and self-managed reference, including the sequential G routes that make project navigation fast.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitlab/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/gitlab/page.tsx
index 7df58e67..523c6e38 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gitlab/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitlab/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/gitlab";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
new file mode 100644
index 00000000..03335d7b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
@@ -0,0 +1 @@
+Gmail becomes much faster once a conversation stays selected. This reference covers the complete documented keyboard layer for inbox triage, composing, reading threads, jumping between views, selecting conversations, formatting, and opening Gmail's menus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gmail/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/gmail/page.tsx
index d2493542..2fe76e02 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gmail/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gmail/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/gmail";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
new file mode 100644
index 00000000..8e458fe7
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
@@ -0,0 +1 @@
+GNOME's Super-key shortcuts connect the desktop shell to the work inside its windows. This reference covers the current official shell defaults for Activities, windows, workspaces, monitors, notifications, screenshots, recording, and common text editing.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gnome/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/gnome/page.tsx
index 34ae405d..1437d247 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gnome/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gnome/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/gnome";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
new file mode 100644
index 00000000..0344dcba
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
@@ -0,0 +1 @@
+Godot's editor shortcuts move between workspaces, scenes, panels, and the 2D canvas. This record follows the default key mapping in the current Godot 4.6 manual and keeps tool, scene, and run commands together.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/godot-engine/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/page.tsx
index 17437ac4..660cdc2d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/godot-engine/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/godot-engine";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
new file mode 100644
index 00000000..6be6535e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
@@ -0,0 +1 @@
+Goodnotes shortcuts cover notebooks and tabs, editing, page navigation, drawing tools, and text formatting. This desktop set follows the current Goodnotes reference for macOS and Windows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/goodnotes/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/page.tsx
index 66da7fd5..ab005b45 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/goodnotes/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/goodnotes";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
new file mode 100644
index 00000000..4ecd188f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
@@ -0,0 +1 @@
+Google Docs shortcuts handle editing, formatting, navigation, comments, and document commands in the browser. The entries below use Google's current Windows and macOS help tables rather than generic browser shortcuts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-docs/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-docs/page.tsx
index 2783a5c2..f1a85f69 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-docs/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-docs/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-docs";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
new file mode 100644
index 00000000..0ae23f1a
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
@@ -0,0 +1 @@
+Google Drive's web shortcuts cover navigation panels, item selection, file actions, creation, and preview controls. The record follows Google's current desktop help page for Windows and macOS.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-drive/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-drive/page.tsx
index aaf65d2e..f0c4893b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-drive/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-drive/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-drive";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
new file mode 100644
index 00000000..ff671228
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
@@ -0,0 +1 @@
+Google Forms shortcuts help you move through a form, insert questions and media, format text, and manage grading. The bindings below come from Google's current PC and Mac shortcut reference.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-forms/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-forms/page.tsx
index 4a63f90d..4cb9d247 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-forms/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-forms/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-forms";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
new file mode 100644
index 00000000..c8a065e1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
@@ -0,0 +1 @@
+Google's current Gemini keyboard reference is for Gemini in Chrome. It documents opening the side panel, switching between the tab and Gemini, and entering selection mode on Windows and Mac.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-gemini/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/page.tsx
index 166fc26f..069e1dad 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-gemini/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-gemini";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
new file mode 100644
index 00000000..0982a050
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
@@ -0,0 +1 @@
+Google Meet's documented meeting shortcuts control the camera, microphone, captions, presentation, participants, chat, and layout. They work while a Meet call has focus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-meet/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-meet/page.tsx
index e9d39bf3..0b7c1ab8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-meet/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-meet/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-meet";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
new file mode 100644
index 00000000..44dc1da9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
@@ -0,0 +1 @@
+Google Sheets shortcuts cover selection, cell entry, formatting, sheet navigation, comments, menus, formulas, and accessibility. This reference keeps Google's PC bindings for Windows and Linux separate from its current Mac bindings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-sheets/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/page.tsx
index 2d27c0d5..9e383d1f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-sheets/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-sheets";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
new file mode 100644
index 00000000..e794fbeb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
@@ -0,0 +1 @@
+Google Slides shortcuts cover slide creation, editing, filmstrip movement, presentation controls, and text formatting. The entries below use Google's current Windows and Mac help tables.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-slides/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/google-slides/page.tsx
index 6af42575..e4487002 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-slides/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-slides/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/google-slides";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
new file mode 100644
index 00000000..c72c76c4
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
@@ -0,0 +1 @@
+Grammarly's current desktop accessibility reference documents keyboard navigation for the assistant and sidebar. These entries cover opening and closing the desktop surfaces and moving through their controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/grammarly/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/grammarly/page.tsx
index c99c5e24..3846b729 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/grammarly/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/grammarly/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/grammarly";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
new file mode 100644
index 00000000..135699ce
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
@@ -0,0 +1 @@
+Harvest's Windows app shortcuts cover timer creation, the timesheet, favorites, day navigation, and editing or deleting a selected entry. The source gives these as the app's current Windows defaults.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/harvest/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/harvest/page.tsx
index eec21f8f..a5a5270c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/harvest/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/harvest/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/harvest";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
new file mode 100644
index 00000000..9cfb0575
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
@@ -0,0 +1 @@
+HTTPie Desktop's shortcuts cover tabs, the request editor, search, and the library. They keep a request session moving while the URL, code editor, or response panel has focus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/httpie/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/httpie/page.tsx
index e55728cb..1a9013d8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/httpie/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/httpie/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/httpie";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
new file mode 100644
index 00000000..920bcbc3
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
@@ -0,0 +1 @@
+iA Writer's Mac shortcuts cover files, search, Markdown structure, formatting, preview, and export. They follow the current iA Writer reference so a writer can stay in the editor from first draft to final output.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ia-writer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/page.tsx
index 9883cd10..d1f89102 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ia-writer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/ia-writer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
new file mode 100644
index 00000000..60f22529
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
@@ -0,0 +1 @@
+Apple's Messages shortcuts cover conversation filters, search, replies, Tapbacks, message editing, and conversation details. This record is for the current macOS Messages app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/imessage/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/imessage/page.tsx
index ccfde209..553a5bac 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/imessage/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/imessage/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/imessage";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
new file mode 100644
index 00000000..513b4d4f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
@@ -0,0 +1 @@
+Inkscape's official key reference covers tools, files, object editing, z-order, and canvas views. These entries focus on the commands that recur while drawing and preparing a vector document.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/inkscape/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/inkscape/page.tsx
index 473c3e8d..4a578430 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/inkscape/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/inkscape/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/inkscape";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
new file mode 100644
index 00000000..14f33dbb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
@@ -0,0 +1 @@
+Insomnia's desktop shortcuts cover request editing, sending, environments, history, plugins, and workspace organization. The entries below follow Kong's current Windows and macOS shortcut reference.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/insomnia/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/insomnia/page.tsx
index 43871324..24c0a3e2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/insomnia/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/insomnia/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/insomnia";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
new file mode 100644
index 00000000..585919bd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
@@ -0,0 +1 @@
+IntelliJ IDEA's default keymaps cover search, editing, coding assistance, navigation, debugging, and refactoring. This record keeps the high-use commands from JetBrains' current Windows and macOS keymap references.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/page.tsx
index b8309551..baebcd61 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/intellij-idea";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
new file mode 100644
index 00000000..aa561692
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
@@ -0,0 +1 @@
+Intercom's Inbox shortcuts cover conversation actions, inbox navigation, and the reply composer. The current Command-K help article also lists direct keys for the actions agents use most often.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intercom/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/intercom/page.tsx
index be675aa2..0cc5cedf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/intercom/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/intercom/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/intercom";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
new file mode 100644
index 00000000..8e4ada08
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
@@ -0,0 +1 @@
+iTerm2's shortcuts are about keeping several terminal jobs visible at once. Work across panes and tabs, search scrollback, recover paste history, mark useful output, broadcast input, and open the less obvious terminal tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/iterm2/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/iterm2/page.tsx
index 3bafb709..ec4924d1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/iterm2/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/iterm2/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/iterm2";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
new file mode 100644
index 00000000..e67bd330
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
@@ -0,0 +1 @@
+Jira Cloud's current shortcut reference covers the actions available from issue views and boards, including creating, opening, assigning, commenting, and moving through work items.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jira/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/jira/page.tsx
index 6d2eea08..60d2b225 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/jira/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/jira/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/jira";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
new file mode 100644
index 00000000..f1dc9a84
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
@@ -0,0 +1 @@
+Joplin's terminal client uses short commands, navigation keys, and typed key sequences to work with notes, todos, notebooks, and the built-in console.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/joplin/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/joplin/page.tsx
index 10cef280..09fdc0d2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/joplin/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/joplin/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/joplin";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
new file mode 100644
index 00000000..3ccafc41
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
@@ -0,0 +1 @@
+Jupyter Notebook keeps the notebook itself in the browser, so its most useful keys switch between editing and command mode, run cells, search, and control the kernel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/page.tsx
index 44db0076..ebeaeda9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/jupyter-notebook";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-app-page.tsx b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-app-page.tsx
index 27434cb2..39818ecc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-app-page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-app-page.tsx
@@ -1,10 +1,11 @@
 import { getPublishedDirectoryPage, getRequiredDirectoryPage } from "@/lib/directory-pages";
 import { AppShell } from "@/app/ui/site/app-shell";
+import type { ReactNode } from "react";
 import type { AppShortcuts } from "@/lib/shortcuts/types";
 import { KeyboardShortcutsSidebar } from "@/app/ui/directories/keyboard-shortcuts-sidebar";
 import { KeyboardShortcutsReference } from "./keyboard-shortcuts-reference";
 
-export async function KeyboardShortcutsAppPage({ app }: { app: AppShortcuts }) {
+export async function KeyboardShortcutsAppPage({ app, intro }: { app: AppShortcuts; intro: ReactNode }) {
   const [directoryPage, parentPage] = await Promise.all([
     getRequiredDirectoryPage(`keyboard-shortcuts/${app.slug}`),
     getPublishedDirectoryPage("keyboard-shortcuts"),
@@ -17,7 +18,7 @@ export async function KeyboardShortcutsAppPage({ app }: { app: AppShortcuts }) {
       sidebar={<KeyboardShortcutsSidebar activeSlug={app.slug} groups={app.groups} />}
       sidebarLabel="Shortcut pages"
     >
-      <KeyboardShortcutsReference app={app} directoryPage={directoryPage} iconKey={iconKey} />
+      <KeyboardShortcutsReference app={app} directoryPage={directoryPage} iconKey={iconKey} intro={intro} />
     </AppShell>
   );
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-reference.tsx b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-reference.tsx
index 3e54b1e4..9db828ab 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-reference.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-reference.tsx
@@ -1,9 +1,8 @@
 import type { Stack127DirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { Fragment } from "react";
+import { Fragment, type ReactNode } from "react";
 import { groupedBindings, keycapParts } from "@/lib/shortcuts/presentation";
 import Link from "next/link";
 import { PageHeader } from "@/app/ui/site/page-header";
@@ -55,8 +54,11 @@ function ShortcutRow({ shortcut, platforms }: { shortcut: Shortcut; platforms: A
   );
 }
 
-/** `iconKey` is the page's own card icon key, or the keyboard shortcuts directory's when it has none. */
-export function KeyboardShortcutsReference({ app, directoryPage, iconKey }: { app: AppShortcuts; directoryPage: Stack127DirectoryPage; iconKey: string | null }) {
+/**
+ * `intro` is the app page's own `content/intro.mdx`. `iconKey` is the page's own card icon key,
+ * or the keyboard shortcuts directory's when it has none.
+ */
+export function KeyboardShortcutsReference({ app, directoryPage, iconKey, intro }: { app: AppShortcuts; directoryPage: Stack127DirectoryPage; iconKey: string | null; intro: ReactNode }) {
   return (
     <PageCanvas className={styles.page} flow>
       <PageHeader>
@@ -65,7 +67,7 @@ export function KeyboardShortcutsReference({ app, directoryPage, iconKey }: { ap
           <DirectoryPageTitle title={directoryPage.title} />
         </h1>
         <PageMeta updatedAt={directoryPage.updated_at} />
-        <ContentMarkdown markdown={directoryPage.intro_markdown} />
+        {intro}
         <small>
           {app.platforms.map((platform) => platformLabels[platform]).join(", ")} · {shortcutCount(app)} shortcuts
         </small>
@@ -99,7 +101,8 @@ export function KeyboardShortcutsReference({ app, directoryPage, iconKey }: { ap
       ))}
 
       <section className={styles.nextStep} aria-labelledby="print-title">
-        <DirectoryPageContent page={directoryPage} section="print" components={{ h2: ({ children }) => <h2 id="print-title">{children}</h2> }} />
+        <h2 id="print-title">Print the shortcuts you use</h2>
+        <p><Link href={`/shortcuts-cheatsheet-generator?apps=${app.slug}`}>Make a printable {app.name} sheet</Link></p>
       </section>
     </PageCanvas>
   );
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
new file mode 100644
index 00000000..4819f478
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
@@ -0,0 +1 @@
+Keynote's Mac shortcuts cover presentation files, slide navigation, text and object editing, tables, comments, and the live presentation controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keynote/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/keynote/page.tsx
index b7238d5f..af4af7ec 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/keynote/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/keynote/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/keynote";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
new file mode 100644
index 00000000..a956f728
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
@@ -0,0 +1 @@
+Krita's default menu, selection, layer, canvas, brush, and text-editor shortcuts keep drawing work close to the keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/krita/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/krita/page.tsx
index 81bac208..ae64c87d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/krita/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/krita/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/krita";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
new file mode 100644
index 00000000..ec8c1ef8
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
@@ -0,0 +1 @@
+Writer's default shortcuts cover document navigation, styles, tables, text selection, and the keyboard-first editing commands used across LibreOffice.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/page.tsx
index 6d7c90fd..5a249ee2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/libreoffice-writer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
new file mode 100644
index 00000000..bc1f94f2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
@@ -0,0 +1 @@
+Linear's keyboard map links issue triage, search, navigation, views, and the rich-text editor. Chords use the same letter-first pattern as Linear's own documentation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linear/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/linear/page.tsx
index bccbe09a..6e26dcbf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linear/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linear/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/linear";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
new file mode 100644
index 00000000..531afb44
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
@@ -0,0 +1 @@
+LinkedIn's desktop feed shortcuts move between posts and notifications, open the main destinations, and expose a quick reference modal.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linkedin/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/linkedin/page.tsx
index 9bd4183e..8b017caf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linkedin/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linkedin/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/linkedin";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
new file mode 100644
index 00000000..48005b94
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
@@ -0,0 +1 @@
+KDE Plasma's documented defaults cover window switching, workspaces, activities, the desktop, and the global actions that stay available above individual apps.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/page.tsx
index 451b374c..1b77908c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/linux-kde-plasma";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
new file mode 100644
index 00000000..fad52b78
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
@@ -0,0 +1 @@
+Logic Pro's key commands cover transport, editing, track and region work, window focus, and the main production views. The most useful commands are grouped by the job they perform.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logic-pro/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/page.tsx
index aed5680a..b9c7fbb8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/logic-pro/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/logic-pro";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
new file mode 100644
index 00000000..3a76ad12
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
@@ -0,0 +1 @@
+Logseq's default keymap covers block editing, navigation, search, page movement, and the left and right sidebars. Sequences are shown in the order they are typed.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logseq/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/logseq/page.tsx
index 8fb0e2cb..3f205a96 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/logseq/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/logseq/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/logseq";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
new file mode 100644
index 00000000..46a73ecf
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
@@ -0,0 +1 @@
+Looker's official shortcut map changes with the current location: dashboards, Looks, Explores, and the LookML IDE each have their own commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/looker/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/looker/page.tsx
index 92c9bd52..32845bb0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/looker/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/looker/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/looker";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
new file mode 100644
index 00000000..2a2ce290
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
@@ -0,0 +1 @@
+Loom's desktop recorder, Chrome extension, and video player each have a small set of documented controls. This reference keeps those contexts separate.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/loom/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/loom/page.tsx
index 569c2313..cbdac85d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/loom/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/loom/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/loom";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
new file mode 100644
index 00000000..a709651f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
@@ -0,0 +1 @@
+Finder's Mac shortcuts cover file actions, common folders, tabs, search, and the bars that shape a Finder window. Context changes with the selected item and the front Finder view.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-finder/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/page.tsx
index 287e056d..67161e6d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos-finder/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/macos-finder";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
new file mode 100644
index 00000000..1c7d1e52
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
@@ -0,0 +1 @@
+Spotlight shortcuts open the search panel, move through results, narrow the result type, and send a selected item to its owning app or Finder.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/page.tsx
index 30db61b2..fb6762f3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/macos-spotlight";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
new file mode 100644
index 00000000..abbf3c80
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
@@ -0,0 +1 @@
+macOS shortcuts are the layer underneath almost every app. Start with clipboard and window control, then use Mission Control, screenshots, Finder, text movement, and system actions when the desktop gets busy.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/macos/page.tsx
index 52287b0e..999d7142 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/macos";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
new file mode 100644
index 00000000..1eb4e5bb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
@@ -0,0 +1 @@
+Mastodon's web shortcuts search, open, and act on posts, move through columns, and use G-prefixed sequences to reach common views.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mastodon/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/mastodon/page.tsx
index a274c75b..647578e3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mastodon/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mastodon/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/mastodon";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
new file mode 100644
index 00000000..d3f147a3
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
@@ -0,0 +1 @@
+MATLAB's Editor shortcuts cover files, navigation, search, code editing, sections, running, folding, and desktop focus. Platform-specific columns are kept separate where MathWorks changes the modifier.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/matlab/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/matlab/page.tsx
index 78e83e06..99896196 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/matlab/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/matlab/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/matlab";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
new file mode 100644
index 00000000..8d83bebc
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
@@ -0,0 +1 @@
+Mattermost shortcuts cover channel navigation, search, message editing, formatting, file uploads, calls, and desktop tab management.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mattermost/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/mattermost/page.tsx
index b13a935c..cad94803 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mattermost/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mattermost/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/mattermost";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
new file mode 100644
index 00000000..8fc015ee
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
@@ -0,0 +1 @@
+Microsoft Edge shortcuts cover tabs, windows, navigation, search, downloads, developer tools, and page display on Windows and macOS.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/page.tsx
index 6fbfa3b8..ea57708a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-edge";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
new file mode 100644
index 00000000..7e6ece76
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
@@ -0,0 +1 @@
+OneDrive's Windows and web shortcuts cover file selection, navigation, sharing, details, list refreshes, and keyboard access to common file actions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/page.tsx
index 5f1d4884..159330c9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-onedrive";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
new file mode 100644
index 00000000..d8838f4c
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
@@ -0,0 +1 @@
+OneNote's Windows and Mac desktop shortcuts cover notes, notebooks, search, synchronization, page movement, and the common editing commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/page.tsx
index 2c2be47f..adc88d22 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-onenote";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
new file mode 100644
index 00000000..cb987b81
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
@@ -0,0 +1 @@
+Outlook's Windows shortcuts differ between the new Outlook app and classic Outlook. The groups below keep their mail, calendar, and message commands distinct.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/page.tsx
index dcb720b7..c79547db 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-outlook";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
new file mode 100644
index 00000000..d411323b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
@@ -0,0 +1 @@
+PowerPoint's keyboard map separates Windows authoring commands from the presentation controls shared by Windows and Mac. Use the ribbon key tips for commands that do not have a dedicated chord.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/page.tsx
index 9298bd54..13960723 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-powerpoint";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
new file mode 100644
index 00000000..7ff204e3
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
@@ -0,0 +1 @@
+PowerToys shortcuts start with the Shortcut Guide, PowerToys Run, Always On Top, Color Picker, FancyZones, and Workspaces. The utility bindings are global while PowerToys is running.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/page.tsx
index b9e2a493..31953ae2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-powertoys";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
new file mode 100644
index 00000000..bfbc31f4
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
@@ -0,0 +1 @@
+Teams shortcuts cover search, chats, settings, pane focus, messaging, and meeting controls across the Windows and macOS desktop and web clients.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/page.tsx
index e3e129e2..f5e4bdd9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-teams";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
new file mode 100644
index 00000000..ab2c89b0
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
@@ -0,0 +1 @@
+Word's desktop shortcut map covers editing, navigation, formatting, review, fields, and document views on Windows and macOS.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/page.tsx
index 5b7f3e76..515ef147 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/microsoft-word";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
new file mode 100644
index 00000000..e31890fb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
@@ -0,0 +1 @@
+Milanote puts boards, notes, images, and tables on one canvas. This reference keeps board movement, text formatting, drawing, and desktop navigation separate so a shortcut is tied to the thing it changes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/milanote/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/milanote/page.tsx
index 7111c278..d9697b7b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/milanote/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/milanote/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/milanote";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
new file mode 100644
index 00000000..b3977613
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
@@ -0,0 +1 @@
+Miro's board shortcuts cover tools, object editing, canvas movement, and keyboard-only navigation. The reference separates single-key board tools from modifier shortcuts so accessibility settings and desktop-app commands stay visible.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/miro/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/miro/page.tsx
index 33b69948..5693aadf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/miro/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/miro/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/miro";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
new file mode 100644
index 00000000..ea8322f2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
@@ -0,0 +1 @@
+monday.com's shortcuts split between system navigation and board work. This page keeps cell editing, board movement, range selection, and account-level search in the same order as the current support reference.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/monday-com/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/monday-com/page.tsx
index 61049b3e..2f819e90 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/monday-com/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/monday-com/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/monday-com";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
new file mode 100644
index 00000000..f3a4e8ca
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
@@ -0,0 +1 @@
+Thunderbird changes its shortcut set with the active pane, so a key can select text while composing and messages while browsing a folder. This reference groups the documented mail, search, navigation, composing, address book, and calendar defaults without hiding those context changes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/page.tsx
index 000c77b2..2c0529c3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/mozilla-thunderbird";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
new file mode 100644
index 00000000..00d7ce17
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
@@ -0,0 +1 @@
+Neovim keeps Vim's modal editing model and adds built-in behavior around it. This reference covers the core motions and operators plus the LSP, commenting, diagnostic, and terminal-mode defaults that distinguish a current Neovim session from a plugin-specific setup.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/neovim/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/neovim/page.tsx
index 415e7116..cb172fc5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/neovim/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/neovim/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/neovim";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
new file mode 100644
index 00000000..eb303ef9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
@@ -0,0 +1 @@
+Netflix's computer player uses a short set of playback controls for pausing, seeking, volume, fullscreen mode, mute, and intro skipping. This reference keeps the player actions together and calls out the Windows app exceptions published by Netflix.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/netflix/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/netflix/page.tsx
index e4f51706..53cd0f8c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/netflix/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/netflix/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/netflix";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
new file mode 100644
index 00000000..db44876a
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
@@ -0,0 +1 @@
+Notability's Mac shortcuts cover note creation, page movement, audio playback, search, formatting, recording, and the library. Toolbox and color shortcuts use the current positions in Notability's configurable controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notability/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/notability/page.tsx
index a4768671..b246d6a3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notability/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notability/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/notability";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
new file mode 100644
index 00000000..fc4637b8
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
@@ -0,0 +1 @@
+Notepad++ keeps file, search, view, and editor commands in its Shortcut Mapper. This reference lists the stable default bindings documented in the official manual and calls out that users can remap the command or Scintilla layers.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/page.tsx
index 88948457..ff77892a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/notepad-plus-plus";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
new file mode 100644
index 00000000..e9ffff1a
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
@@ -0,0 +1 @@
+Notion combines app shortcuts, block editing, Markdown-style input, slash commands, and database actions. This reference keeps those layers together so a long page stays quick to build and navigate.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notion/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/notion/page.tsx
index 68449815..f2bebab1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notion/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notion/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/notion";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
new file mode 100644
index 00000000..e51fbd33
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
@@ -0,0 +1 @@
+Numbers on Mac uses familiar editing keys alongside spreadsheet-specific commands for sheets, tables, formulas, objects, and comments. This reference keeps the app-level commands separate from cell navigation and text formatting so the same key is easier to locate.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/numbers/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/numbers/page.tsx
index 9621a6a4..1f34f7a8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/numbers/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/numbers/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/numbers";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
new file mode 100644
index 00000000..40a66da4
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
@@ -0,0 +1 @@
+OBS Studio's documented defaults focus on editing sources and moving around the preview. This reference keeps the general commands, source-list actions, transforms, and preview controls separate so a key is read in the right OBS context.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obs-studio/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/page.tsx
index 7e1c2bd7..c92d8522 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/obs-studio/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/obs-studio";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
new file mode 100644
index 00000000..f6648893
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
@@ -0,0 +1 @@
+Obsidian separates system editing shortcuts from customizable command hotkeys. This reference covers the documented editing and navigation defaults across Windows, Linux, and macOS, while leaving plugin and user-assigned commands to Obsidian's Hotkeys settings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obsidian/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/obsidian/page.tsx
index b501a743..b542ff93 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/obsidian/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/obsidian/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/obsidian";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
new file mode 100644
index 00000000..c083ae63
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
@@ -0,0 +1 @@
+OmniFocus on Mac provides shortcuts for quick entry, perspectives, item editing, review, notes, and window management. This reference uses the official OmniFocus 4 command list and leaves iPad, iPhone, and web-only bindings out of the macOS page.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/omnifocus/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/page.tsx
index 260ca658..04fdc002 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/omnifocus/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/omnifocus";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
new file mode 100644
index 00000000..00ab33e1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
@@ -0,0 +1 @@
+OpenCode exposes a large, remappable TUI keymap. This page covers the current default leader chords, session and model controls, message navigation, prompt editing, dialogs, and the desktop prompt layer.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opencode/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/opencode/page.tsx
index c694f51e..b069ea02 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/opencode/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/opencode/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/opencode";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
new file mode 100644
index 00000000..724023e7
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
@@ -0,0 +1 @@
+Opera's documented browser shortcuts cover commands, page search, tabs, navigation, and display controls. Opera also lets users customize most browser shortcuts in Settings, so this page keeps the published defaults and calls out the configurable layer.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opera/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/opera/page.tsx
index 0678db9c..c9e79a3d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/opera/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/opera/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/opera";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
new file mode 100644
index 00000000..1c65ada6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
@@ -0,0 +1 @@
+VirtualBox reserves a host key to release keyboard and mouse ownership from a virtual machine and to send special combinations to the guest. This reference keeps host-key actions separate from guest shortcuts, because the guest operating system still owns its own normal keymap.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/page.tsx
index c04d5615..3242ac79 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/oracle-virtualbox";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
new file mode 100644
index 00000000..9eee7a78
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
@@ -0,0 +1 @@
+Otter's published shortcuts cover search, audio playback, and transcript editing. The key map stays focused on the commands Otter documents for its web workspace and leaves account or browser shortcuts out.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/otter-ai/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/page.tsx
index 2fe3bd13..1cf3627a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/otter-ai/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/otter-ai";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
new file mode 100644
index 00000000..70c67756
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
@@ -0,0 +1 @@
+Pages on Mac combines document editing with page-layout objects, tables, comments, and style controls. This reference groups the commands people use while writing, searching, formatting, and arranging a document, with Apple-specific object and table actions kept visible.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pages/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/pages/page.tsx
index 7ecdbeec..c9e32499 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pages/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pages/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/pages";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
new file mode 100644
index 00000000..8c5c8aec
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
@@ -0,0 +1 @@
+Paint.NET combines canvas navigation with image zoom, selection controls, tool windows, and keyboard access to its drawing tools. Its official list also documents repeated key presses for tool groups, so those bindings stay explicit instead of being collapsed into one generic tool shortcut.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/paint-net/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/paint-net/page.tsx
index 8188c7d4..a7c10b72 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/paint-net/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/paint-net/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/paint-net";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
new file mode 100644
index 00000000..7035d39b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
@@ -0,0 +1 @@
+Penpot's workspace shortcuts cover alignment, object editing, zoom, layers, selection, and prototyping. This reference keeps Windows and Linux together where the official table does and shows macOS symbols as their equivalent key combinations.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/penpot/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/penpot/page.tsx
index a066ca6e..60394a3b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/penpot/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/penpot/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/penpot";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
new file mode 100644
index 00000000..c8283ba1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
@@ -0,0 +1 @@
+Pi's keyboard model separates the prompt you are writing from the agent work already running. This reference covers the current editor, queue, session, model, thinking, transcript, tree, and application defaults.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/page.tsx
index d6a97be2..73669b9a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/pi-coding-agent";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
new file mode 100644
index 00000000..786c7f16
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
@@ -0,0 +1 @@
+Power BI Desktop documents shortcuts for report visuals, tables, matrices, panes, canvas zoom, slicers, selection, DAX, data entry, and model relationships. This page focuses on the Windows desktop report experience and keeps context-specific keys in the group where they apply.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/power-bi/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/power-bi/page.tsx
index 704565fc..2baa136a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/power-bi/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/power-bi/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/power-bi";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
new file mode 100644
index 00000000..b4de350b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
@@ -0,0 +1 @@
+PowerShell's interactive keyboard layer comes from PSReadLine. This reference covers its Windows, Emacs, and Vi modes across cursor movement, line editing, history, completion, selection, and multiline input.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/powershell/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/powershell/page.tsx
index 7a05932d..6a82f222 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/powershell/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/powershell/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/powershell";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
new file mode 100644
index 00000000..02e1b878
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
@@ -0,0 +1 @@
+Studio One's official key command sheet covers transport, editing, events, tracks, the browser, console views, markers, zoom, and file commands. This reference keeps the PC commands and their documented Mac modifier substitutions together.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/page.tsx
index daf0a4d4..bc638f69 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/presonus-studio-one";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
new file mode 100644
index 00000000..f7a209fe
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
@@ -0,0 +1 @@
+Prezi Present uses familiar editing commands alongside canvas navigation and object transformation controls. This reference covers the first-party shortcuts for selecting, arranging, moving through a presentation, and changing the canvas view.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/prezi/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/prezi/page.tsx
index fac56853..d8b56ff1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/prezi/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/prezi/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/prezi";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
new file mode 100644
index 00000000..b4745093
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
@@ -0,0 +1 @@
+Avid's Pro Tools Shortcuts Guide covers search, shortcut focus, playback, recording, edit tools, selection, nudging, clip gain, MIDI editing, and core menus. This reference keeps the Mac and Windows columns explicit and preserves feature-scope notes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pro-tools/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/page.tsx
index 10b43f90..5f45f255 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pro-tools/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/pro-tools";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
new file mode 100644
index 00000000..140ebf49
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
@@ -0,0 +1 @@
+ProtoPie's official shortcut list covers Studio files, editing tools, objects, arrangement, interactions, canvas navigation, panels, and preview windows. The record keeps the Windows and macOS columns side by side and excludes pointer-only gestures.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/protopie/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/protopie/page.tsx
index 671e68c6..60f4e01f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/protopie/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/protopie/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/protopie";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
new file mode 100644
index 00000000..dc68d349
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
@@ -0,0 +1 @@
+PyCharm's keymap reference groups the actions developers reach for while searching, editing, navigating, building, and debugging Python projects. This page keeps those actions together and shows the Windows, Linux, and macOS modifier differences.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pycharm/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/pycharm/page.tsx
index 5f719b55..5e69f91f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pycharm/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pycharm/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/pycharm";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
new file mode 100644
index 00000000..147921a8
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
@@ -0,0 +1 @@
+QuickBooks Online documents shortcuts for date fields, forms, dropdowns, transactions, registers, payroll, and the browser window. This reference keeps browser-specific save variants as alternatives instead of treating them as universal commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/page.tsx
index cbd810f4..5d209a67 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/quickbooks-online";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
new file mode 100644
index 00000000..7a7773a1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
@@ -0,0 +1 @@
+Raycast is a keyboard-first launcher with search, action panels, forms, AI chat, and configurable hotkeys. This reference separates built-in commands from settings and text editing so configurable global shortcuts are not mistaken for fixed app bindings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/raycast/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/raycast/page.tsx
index acd0811c..cc84e278 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/raycast/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/raycast/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/raycast";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
new file mode 100644
index 00000000..16e585f2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
@@ -0,0 +1 @@
+Reddit's current desktop web hotkeys move through posts and comments, perform voting and saving actions, and control media playback. This page keeps navigation, actions, and media separate so the single-letter bindings are easy to scan.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/reddit/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/reddit/page.tsx
index 2a3205dd..207a6bc3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/reddit/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/reddit/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/reddit";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
new file mode 100644
index 00000000..07ad95ac
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
@@ -0,0 +1 @@
+Riverside's editor shortcuts cover transcript selection, timeline playback, recording splits, comments, scenes, and clipboard actions. This reference keeps the editor scope clear because the separate Studio shortcut list is a different workflow.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/page.tsx
index c7e06a07..f07d2bc1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/riverside-fm";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
new file mode 100644
index 00000000..7c7e8aeb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
@@ -0,0 +1 @@
+Rocket.Chat's documented defaults cover global search, read-state management, and the message composer. This reference keeps the composer-specific keys separate because they only apply while the empty or active composer has focus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/page.tsx
index da88ca2a..bf615b29 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/rocket-chat";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
new file mode 100644
index 00000000..b58d7ebd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
@@ -0,0 +1 @@
+RStudio's current Posit guide publishes defaults for the command palette, console, source editor, completions, panes, help, builds, debugging, plots, version control, sessions, terminals, and menus. This reference keeps Windows, Linux, and macOS differences explicit.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rstudio/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/rstudio/page.tsx
index 726eaf47..57c1bab9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/rstudio/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/rstudio/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/rstudio";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
new file mode 100644
index 00000000..4e1dd179
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
@@ -0,0 +1 @@
+Safari's Mac User Guide lists keyboard commands for scrolling, webpage fields, tabs, history, downloads, reading lists, bookmarks, zoom, and windows. This reference keeps keyboard actions separate from the guide's pointer gestures.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/safari/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/safari/page.tsx
index 5824d657..27f9b9e7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/safari/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/safari/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/safari";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
new file mode 100644
index 00000000..29460637
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
@@ -0,0 +1 @@
+Salesforce Lightning Experience publishes global, navigation, composer, and console shortcuts. This reference keeps the standard Lightning actions separate from the extra workspace-tab controls available in Lightning console apps.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/salesforce/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/salesforce/page.tsx
index ec2e522b..c44f6548 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/salesforce/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/salesforce/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/salesforce";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
new file mode 100644
index 00000000..259b93b9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
@@ -0,0 +1 @@
+Scrivener's current manuals include an exhaustive menu appendix with file, edit, document, format, navigate, project, and window commands. This reference records the stable desktop defaults that writers use for projects, documents, text editing, search, and compilation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/scrivener/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/scrivener/page.tsx
index a750ed97..9cb904c4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/scrivener/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/scrivener/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/scrivener";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
new file mode 100644
index 00000000..a291c446
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
@@ -0,0 +1 @@
+Signal Desktop keyboard shortcuts move through conversations, search messages, format drafts, manage media, and control calls. This reference keeps the published Mac and Windows/Linux differences visible.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/signal/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/signal/page.tsx
index 6c5a412e..8c9747f9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/signal/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/signal/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/signal";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
new file mode 100644
index 00000000..edf446b2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
@@ -0,0 +1 @@
+Simplenote's official help page lists desktop shortcuts for creating and searching notes, checklists, focus mode, Markdown preview, and font size. The platform-specific table is preserved here.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/simplenote/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/simplenote/page.tsx
index 72f531fd..71437afa 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/simplenote/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/simplenote/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/simplenote";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
new file mode 100644
index 00000000..c82c7f1d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
@@ -0,0 +1 @@
+Sketch's Mac app shortcut reference covers documents, canvas navigation, comments, layers, styling, and export. This page keeps the current US English Mac defaults separate from Sketch web shortcuts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketch/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/sketch/page.tsx
index f7f2961b..a876e962 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sketch/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketch/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/sketch";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
new file mode 100644
index 00000000..94bb1575
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
@@ -0,0 +1 @@
+SketchUp's current default shortcut table covers the direct tool keys used for selection, drawing, modeling, and camera control. These entries apply to the Windows and Mac desktop defaults.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketchup/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/sketchup/page.tsx
index 9c156fd5..5741d666 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sketchup/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketchup/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/sketchup";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
new file mode 100644
index 00000000..4d759494
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
@@ -0,0 +1 @@
+Slack's shortcut map spans the desktop shell, conversations, workspaces, tabs, messages, huddles, and canvas editing. This page keeps those contexts together and calls out desktop-only or keyboard-layout-sensitive bindings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/slack/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/slack/page.tsx
index 48af7777..a9a37fd5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/slack/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/slack/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/slack";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
new file mode 100644
index 00000000..9079f53b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
@@ -0,0 +1 @@
+Smartsheet's official keyboard shortcut table covers sheet editing, search, hierarchy, formatting, row selection, date entry, and dashboard focus. Windows and Mac mappings are shown separately where they differ.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/smartsheet/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/page.tsx
index 3eebe7df..ffd6d76a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/smartsheet/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/smartsheet";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
new file mode 100644
index 00000000..75e210f6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
@@ -0,0 +1 @@
+SOLIDWORKS Design Help publishes selected Windows shortcuts for assemblies, copying, display, selection, sketching, and the shortcut bar. The record focuses on stable key commands rather than mouse gestures.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/solidworks/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/solidworks/page.tsx
index 491550f2..ae901989 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/solidworks/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/solidworks/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/solidworks";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
new file mode 100644
index 00000000..14216277
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
@@ -0,0 +1 @@
+Spark Mail's desktop shortcut reference groups email triage, navigation, composing, formatting, calendar, and team actions. This record uses the published Mac and Windows desktop presets.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spark-mail/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/page.tsx
index d0a18262..7dc4767e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/spark-mail/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/spark-mail";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
new file mode 100644
index 00000000..d533d062
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
@@ -0,0 +1 @@
+Spotify's current desktop support page lists shortcuts for search, playback, library navigation, sidebars, and queue actions. The table below keeps its Mac and Windows differences explicit.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spotify/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/spotify/page.tsx
index 49b791a5..ef138337 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/spotify/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/spotify/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/spotify";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
new file mode 100644
index 00000000..f3a7a16b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
@@ -0,0 +1 @@
+Squarespace's official guide covers site navigation, Fluid Engine block editing, text formatting, and Acuity actions. These entries describe the current Mac and Windows editing shortcuts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/squarespace/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/squarespace/page.tsx
index e09a125a..5eeaafa1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/squarespace/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/squarespace/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/squarespace";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
new file mode 100644
index 00000000..cb9dfa50
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
@@ -0,0 +1 @@
+Sublime Text's current community documentation publishes separate Windows/Linux and macOS tables for editing, navigation, builds, search, tabs, folding, and bookmarks.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sublime-text/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/page.tsx
index 6e8d1063..eb7dbf24 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sublime-text/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/sublime-text";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
new file mode 100644
index 00000000..b53db147
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
@@ -0,0 +1 @@
+Superhuman's official shortcut guide covers inbox triage, search, composing, formatting, navigation, and tabs. This reference pairs the desktop modifier differences while keeping single-key actions readable.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/superhuman/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/superhuman/page.tsx
index a852fedf..df3dddd9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/superhuman/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/superhuman/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/superhuman";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
new file mode 100644
index 00000000..142b57bd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
@@ -0,0 +1 @@
+Tableau's official shortcut reference covers Desktop workbooks, authoring, data, dashboards, marks, and worksheet navigation. This curated set keeps the most-used Windows and Mac defaults together.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableau/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/tableau/page.tsx
index 4e970ed2..06d32996 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tableau/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableau/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/tableau";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
new file mode 100644
index 00000000..ec4ae9a9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
@@ -0,0 +1 @@
+TablePlus's official shortcut documentation covers connections, workspaces, SQL editing, panes, query execution, and table data. Windows entries use the documented Control replacement for Command.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableplus/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/tableplus/page.tsx
index ed0b1582..7cab7bcf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tableplus/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableplus/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/tableplus";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
new file mode 100644
index 00000000..813aed66
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
@@ -0,0 +1 @@
+Tally's official keyboard shortcut guide covers form editing, block movement, formatting, command menus, and Markdown-style input. The shared web shortcuts are paired across Windows, macOS, and Linux.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tally-forms/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/page.tsx
index b6bbfec0..ecc75f85 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tally-forms/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/tally-forms";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
new file mode 100644
index 00000000..5f8f9f3f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
@@ -0,0 +1 @@
+Telegram Desktop publishes its default shortcut actions in the open-source desktop implementation and exposes them in Chat Settings. This reference focuses on chat, folder, window, and message navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/telegram/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/telegram/page.tsx
index 90208224..39a303c2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/telegram/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/telegram/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/telegram";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
new file mode 100644
index 00000000..c57457ed
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
@@ -0,0 +1 @@
+Things 3's official Mac shortcut reference covers task creation, scheduling, navigation, Markdown styling, search, and list organization. iPad and iPhone shortcuts are outside this Mac record.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/things-3/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/things-3/page.tsx
index a1a8f153..60d70c77 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/things-3/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/things-3/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/things-3";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
new file mode 100644
index 00000000..6e38dc06
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
@@ -0,0 +1 @@
+tmux's default prefix map controls sessions, windows, panes, copy mode, and terminal layout without leaving a shell. The entries use tmux's default Ctrl-B prefix and preserve the distinction between a prefix chord and the command key that follows it.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tmux/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/tmux/page.tsx
index 3c9cc635..579181ec 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tmux/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tmux/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/tmux";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
new file mode 100644
index 00000000..7bc10d40
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
@@ -0,0 +1 @@
+Todoist's current reference covers general app navigation, quick add, global desktop controls, task editing, projects, sorting, upcoming view, calendar layout, and multi-window workflows. This map keeps web and desktop commands together while showing platform-specific bindings explicitly.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/todoist/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/todoist/page.tsx
index 07a8d80b..dbbdb2e8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/todoist/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/todoist/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/todoist";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
new file mode 100644
index 00000000..1e8a4066
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
@@ -0,0 +1 @@
+Typora's official shortcut table covers file operations, Markdown editing, headings, lists, formatting, search, views, and document navigation. The Windows and Linux defaults are paired, while macOS command and option variants stay explicit.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/typora/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/typora/page.tsx
index d7efc682..70f4a938 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/typora/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/typora/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/typora";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
new file mode 100644
index 00000000..df81f293
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
@@ -0,0 +1 @@
+Ulysses' official Mac reference covers sheets and groups, library navigation, search, editor markup, tables, previews, appearance, and export. The app's iPad and iPhone hardware-keyboard maps are separate, so this record stays Mac-only.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ulysses/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/ulysses/page.tsx
index bc37397d..7588b0e8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ulysses/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ulysses/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/ulysses";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
new file mode 100644
index 00000000..51438656
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
@@ -0,0 +1 @@
+Vim is a language of motions, operators, and modes rather than a list of isolated hotkeys. This reference covers the normal, insert, visual, search, window, and command-line paths that make the official quick reference useful at the keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vim/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/vim/page.tsx
index 2e60a652..8dd267eb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vim/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vim/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/vim";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
new file mode 100644
index 00000000..4a77b778
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
@@ -0,0 +1 @@
+Visual Studio's General profile includes distinct defaults for building, debugging, editing, files, projects, refactoring, views, and document windows. This Windows reference keeps the common commands and their context notes readable instead of flattening every context-specific command into one list.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/visual-studio/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/page.tsx
index 70fc1503..0dbd784d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/visual-studio/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/visual-studio";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
new file mode 100644
index 00000000..aab0133d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
@@ -0,0 +1 @@
+VMware Workstation's default hot-key combinations release input, control full-screen guests, switch virtual machines, and manage Unity mode. This reference covers the host shortcuts documented for Workstation Pro on Windows and Linux.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/page.tsx
index 5b2d9359..30f931fc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/vmware-workstation";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
new file mode 100644
index 00000000..d84ffb28
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
@@ -0,0 +1 @@
+VS Code's default shortcuts cover the whole coding loop: edit and navigate code, search and refactor, manage files and panels, run tasks, debug, and use the built-in chat tools. This reference follows Microsoft's current common default list for a standard US keyboard layout.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vscode/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/vscode/page.tsx
index 6bbb6c3c..046708b6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vscode/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vscode/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/vscode";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
new file mode 100644
index 00000000..37d81fe2
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
@@ -0,0 +1 @@
+Warp's official shortcut reference covers panes, blocks, terminal input, command search, tabs, navigation, and font controls across macOS, Windows, and Linux. The map preserves Warp's platform-specific defaults, including Emacs-style input bindings shared by the terminal editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/warp/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/warp/page.tsx
index 949df68c..472dbf24 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/warp/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/warp/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/warp";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
new file mode 100644
index 00000000..6e301298
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
@@ -0,0 +1 @@
+Webflow's current designer reference covers canvas editing, breakpoints, panels, classes, interactions, element movement, and publishing. Webflow documents Command and Option on Mac with Control and Alt equivalents on Windows, which this map keeps explicit.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webflow/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/webflow/page.tsx
index ca2177be..c05b6ffb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/webflow/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/webflow/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/webflow";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
new file mode 100644
index 00000000..5d6a6d09
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
@@ -0,0 +1 @@
+WebStorm's default keymap covers search, code completion, editing, navigation, refactoring, files, tabs, debugging, and version control. The reference uses the standard Windows/Linux and macOS keymaps and keeps two-stroke commands labeled as sequences.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webstorm/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/webstorm/page.tsx
index 992a8525..be14bd3a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/webstorm/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/webstorm/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/webstorm";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
new file mode 100644
index 00000000..2c13999d
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
@@ -0,0 +1 @@
+Whimsical publishes separate current shortcut tables for its Windows and Mac apps. This reference covers workspace navigation, boards, diagrams, mind maps, and notes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/whimsical/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/whimsical/page.tsx
index 34fe091f..d8aae547 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/whimsical/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/whimsical/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/whimsical";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
new file mode 100644
index 00000000..b7684765
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
@@ -0,0 +1 @@
+Microsoft publishes a dedicated File Explorer section in its current Windows keyboard shortcut reference. This map covers navigation, tabs, search, panes, and file actions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/page.tsx
index af187678..392dad02 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/windows-file-explorer";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
new file mode 100644
index 00000000..bc6ec02f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
@@ -0,0 +1 @@
+Microsoft documents shortcuts for opening the Snipping Tool capture overlays and for working inside the Snipping Tool editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/page.tsx
index 9762c9ff..3129da35 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/windows-snipping-tool";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
new file mode 100644
index 00000000..6e5e9eef
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
@@ -0,0 +1 @@
+Windows Terminal is a workspace for several shells, so its important keys manage the container around the prompt. Open tabs, split panes, search scrollback, copy and paste, zoom, and reach the command palette.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/page.tsx
index f8c468ee..3d01477e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/windows-terminal";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
new file mode 100644
index 00000000..1fd116cf
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
@@ -0,0 +1 @@
+Windows shortcuts span the desktop, text fields, File Explorer, virtual desktops, the taskbar, and the command prompt. This page gathers Microsoft's current Windows 10 and Windows 11 defaults so the same key can be understood in the context where it actually works.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/windows/page.tsx
index 3d751347..769bf351 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/windows";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
new file mode 100644
index 00000000..d50be4f1
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
@@ -0,0 +1 @@
+WinMerge publishes separate shortcut sections for folder comparison, file comparison, merge mode, search, bookmarks, and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/winmerge/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/winmerge/page.tsx
index ba954d52..8a0f5e08 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/winmerge/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/winmerge/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/winmerge";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
new file mode 100644
index 00000000..9f02e27c
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
@@ -0,0 +1 @@
+Wireshark's current User's Guide documents keyboard navigation, packet search, marking, references, capture controls, and display actions for its desktop application.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wireshark/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wireshark/page.tsx
index eb672cbb..66b1fd4d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wireshark/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wireshark/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wireshark";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
new file mode 100644
index 00000000..1d22fb3b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
@@ -0,0 +1 @@
+Wix publishes keyboard shortcuts for the Wix Editor, including object editing, panels, page controls, and text formatting.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wix/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wix/page.tsx
index f36a00d3..4134f6b2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wix/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wix/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wix";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
new file mode 100644
index 00000000..a30b07bd
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
@@ -0,0 +1 @@
+Filmora publishes complete Windows and Mac shortcut tables for file actions, editing, timeline navigation, markers, playback, and export.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/page.tsx
index 0214072f..a180044c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wondershare-filmora";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
new file mode 100644
index 00000000..870ac7a9
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
@@ -0,0 +1 @@
+WordPress publishes keyboard references for the Block Editor, Classic Editor, comments, and Site Editor. This map keeps those admin editing surfaces together and does not claim shortcuts for every plugin screen.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/page.tsx
index d66ab8bd..dddd2efe 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wordpress-admin";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
new file mode 100644
index 00000000..f5e0fcdc
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
@@ -0,0 +1 @@
+WPS publishes product-specific shortcut tables for Writer, Spreadsheets, Presentation, and the Mac app. This reference keeps the Windows document tools separate from the Mac commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wps-office/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wps-office/page.tsx
index e79f0624..e174ddb9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wps-office/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wps-office/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wps-office";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
new file mode 100644
index 00000000..ce9bbccb
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
@@ -0,0 +1 @@
+Wrike publishes shortcuts for task creation, search, comments, text formatting, table views, and Gantt chart navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wrike/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/wrike/page.tsx
index ad13d3e1..7ff2f195 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wrike/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wrike/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/wrike";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
new file mode 100644
index 00000000..cf6083d7
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
@@ -0,0 +1 @@
+X publishes keyboard shortcuts for posts, timeline navigation, search, direct messages, profile areas, and other common actions on x.com.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/x-twitter/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/page.tsx
index 01e029c0..d77f1b19 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/x-twitter/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/x-twitter";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
new file mode 100644
index 00000000..ff4eb39b
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
@@ -0,0 +1 @@
+YouTrack Cloud publishes keyboard tables for issue lists, single issues, rich text, and whiteboards. This reference keeps those contexts separate.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtrack/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/youtrack/page.tsx
index e89acb36..a5da1ac9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/youtrack/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtrack/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/youtrack";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
new file mode 100644
index 00000000..f86af674
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
@@ -0,0 +1 @@
+YouTube publishes desktop player shortcuts for playback, seeking, captions, chapters, speed, volume, search, and playlist navigation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtube/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/youtube/page.tsx
index 38e4007a..fa286a06 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/youtube/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtube/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/youtube";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
new file mode 100644
index 00000000..cb4b8be3
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
@@ -0,0 +1 @@
+Maxon publishes ZBrush's default keyboard shortcuts by category, including project files, palettes, sculpting controls, masking, subtools, and rendering.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zbrush/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zbrush/page.tsx
index fd7d3807..d7518eb4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zbrush/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zbrush/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zbrush";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
new file mode 100644
index 00000000..0be02e25
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
@@ -0,0 +1 @@
+Zed's default keymap is built around moving quickly through an editor, workspace, terminal, and agent panel. This reference covers the current built-in defaults across macOS, Linux, and Windows, including the context-sensitive keys that are most useful in daily work.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zed/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zed/page.tsx
index fc87bc0d..9ae5304c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zed/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zed/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zed";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
new file mode 100644
index 00000000..a43b8020
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
@@ -0,0 +1 @@
+Zen Browser publishes a current desktop shortcut reference for compact mode, workspaces, split views, tabs, navigation, search, pages, and developer tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zen-browser/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/page.tsx
index dc6ad9ac..2b2f210c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zen-browser/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zen-browser";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
new file mode 100644
index 00000000..c1feae9c
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
@@ -0,0 +1 @@
+Zendesk publishes an Agent Workspace keyboard cheat sheet for navigation, ticket actions, status changes, and composing replies or internal notes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zendesk/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zendesk/page.tsx
index 58cf9663..775dbb52 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zendesk/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zendesk/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zendesk";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
new file mode 100644
index 00000000..f42f7cde
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
@@ -0,0 +1 @@
+Zeplin publishes separate Mac and Windows app shortcuts for projects, styleguides, screens, sections, tags, layers, and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zeplin/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zeplin/page.tsx
index 9233fdb4..c75a0654 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zeplin/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zeplin/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zeplin";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
new file mode 100644
index 00000000..abe7ca4f
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
@@ -0,0 +1 @@
+Zoom publishes current desktop shortcuts for meetings, chat, calls, product navigation, and accessibility controls across Windows, macOS, and Linux.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zoom/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zoom/page.tsx
index d3b15619..a78ca4e9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zoom/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zoom/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zoom";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
new file mode 100644
index 00000000..45af913e
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
@@ -0,0 +1 @@
+Zulip publishes a current Web and Desktop keyboard reference for streams, topics, direct messages, search, composing, and message actions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zulip/page.tsx b/app/(site)/(directories)/keyboard-shortcuts/zulip/page.tsx
index 6fdbd15f..f7832388 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zulip/page.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zulip/page.tsx
@@ -1,6 +1,7 @@
 import app from "@/lib/shortcuts/apps/zulip";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
new file mode 100644
index 00000000..82bd6aa8
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
@@ -0,0 +1 @@
+Compare fees for selling apps, games, software, code and datasets. Choose a section to compare platforms that sell the same kind of product.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
new file mode 100644
index 00000000..391a4ecc
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
@@ -0,0 +1 @@
+Compare marketplaces for design assets, fonts, templates, 3D files, photos and video. Each section keeps commissions, royalties and other charges in their stated units.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
new file mode 100644
index 00000000..9d369c36
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
@@ -0,0 +1 @@
+Compare platforms for memberships, fan subscriptions, video, tips, freelance work and crowdfunding. Choose a section to check the fees for your source of income.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
new file mode 100644
index 00000000..6f439e7d
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
@@ -0,0 +1 @@
+Compare platforms for selling downloads, videos, AI creations and merchandise. Check plan costs, transaction charges and payment fees in each section.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/index.ts b/app/(site)/(directories)/platform-fees/[section]/content/index.ts
new file mode 100644
index 00000000..101d4007
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/index.ts
@@ -0,0 +1,21 @@
+import type { MDXContent } from "mdx/types";
+import AppsAndSoftwareIntro from "./apps-and-software/intro.mdx";
+import CreativeAssetsIntro from "./creative-assets/intro.mdx";
+import CreatorsAndCommunitiesIntro from "./creators-and-communities/intro.mdx";
+import DigitalProductsAndStoresIntro from "./digital-products-and-stores/intro.mdx";
+import MusicAndAudioIntro from "./music-and-audio/intro.mdx";
+import PaymentsIntro from "./payments/intro.mdx";
+import TeachingAndCoursesIntro from "./teaching-and-courses/intro.mdx";
+import WritingAndBooksIntro from "./writing-and-books/intro.mdx";
+
+/** Each fee category's own words, keyed by its slug. Add an entry when a category is added. */
+export const feeCategoryContent: Record<string, { Intro: MDXContent; Article?: MDXContent }> = {
+  "apps-and-software": { Intro: AppsAndSoftwareIntro },
+  "creative-assets": { Intro: CreativeAssetsIntro },
+  "creators-and-communities": { Intro: CreatorsAndCommunitiesIntro },
+  "digital-products-and-stores": { Intro: DigitalProductsAndStoresIntro },
+  "music-and-audio": { Intro: MusicAndAudioIntro },
+  "payments": { Intro: PaymentsIntro },
+  "teaching-and-courses": { Intro: TeachingAndCoursesIntro },
+  "writing-and-books": { Intro: WritingAndBooksIntro },
+};
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
new file mode 100644
index 00000000..0fc7cc51
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
@@ -0,0 +1 @@
+Compare platforms for stock audio, beats, music distribution and podcasts. Check whether a rate is a commission, a royalty share or a distribution charge.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
new file mode 100644
index 00000000..405c2d51
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
@@ -0,0 +1 @@
+Compare software checkout services and payment processors. Keep platform charges, processing fees and merchant of record services separate when choosing how to accept payments.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
new file mode 100644
index 00000000..c9cd4544
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
@@ -0,0 +1 @@
+Compare course platforms, tutoring marketplaces, teaching resources, event tickets and coaching services. Check commissions, plan costs and payment charges.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
new file mode 100644
index 00000000..096dc28a
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
@@ -0,0 +1 @@
+Compare platforms for books, audiobooks, fiction and paid newsletters. Check royalties, distribution costs and subscription charges within each section.
diff --git a/app/(site)/(directories)/platform-fees/[section]/page.tsx b/app/(site)/(directories)/platform-fees/[section]/page.tsx
index ef209025..e3b554ad 100644
--- a/app/(site)/(directories)/platform-fees/[section]/page.tsx
+++ b/app/(site)/(directories)/platform-fees/[section]/page.tsx
@@ -9,6 +9,7 @@ import { FeeShell, FeeSourceList, SectionIcon } from '../components';
 import { FeeSources } from '../sources';
 import { FeeCard } from '../fee-card';
 import styles from '../page.module.css';
+import { feeCategoryContent } from './content';
 
 const dateFormat = new Intl.DateTimeFormat('en-GB', {
   day: 'numeric', month: 'short', year: 'numeric', timeZone: 'UTC',
@@ -24,6 +25,8 @@ export default async function FeeCategoryPage({ params }: { params: Promise<{ se
   const group = getFeeGroup(slug);
   if (!group) notFound();
   const directoryPage = await getRequiredDirectoryPage(`platform-fees/${slug}`);
+  const content = feeCategoryContent[slug];
+  if (!content) throw new Error(`Published fee category has no content: ${slug}`);
   // A failed load must surface as an error, never as a cacheable page.
   const directory = await getFeeDirectory();
   const sections = directory.sections.filter(section => section.group_name === group.name);
@@ -49,8 +52,11 @@ export default async function FeeCategoryPage({ params }: { params: Promise<{ se
     };
   });
 
+  const { Intro, Article } = content;
   return <FeeShell
     directoryPage={directoryPage}
+    intro={<Intro />}
+    article={Article ? <Article /> : undefined}
     group={group}
     anchors={blocks.map(block => ({
       href: block.href,
diff --git a/app/(site)/(directories)/platform-fees/components.tsx b/app/(site)/(directories)/platform-fees/components.tsx
index 2d66089a..b6780c69 100644
--- a/app/(site)/(directories)/platform-fees/components.tsx
+++ b/app/(site)/(directories)/platform-fees/components.tsx
@@ -1,8 +1,7 @@
 import type { Stack127DirectoryPage } from "@/lib/directory-pages";
 import { directoryTitleParts } from "@/lib/directory-page-content";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import Link from 'next/link';
 import type { ReactNode } from 'react';
 import {
@@ -40,8 +39,11 @@ export function SectionIcon({ icon, size = 22 }: { icon: FeeSection['icon']; siz
   return <Icon aria-hidden="true" size={size} />;
 }
 
-export function FeeShell({ directoryPage, children, overview = false, group, anchors = [] }: {
+/** `intro` and `article` are the page's own MDX content. */
+export function FeeShell({ directoryPage, intro, article, children, overview = false, group, anchors = [] }: {
   directoryPage: Stack127DirectoryPage;
+  intro: ReactNode;
+  article?: ReactNode;
   children: ReactNode;
   overview?: boolean;
   group?: FeeGroup;
@@ -67,12 +69,12 @@ export function FeeShell({ directoryPage, children, overview = false, group, anc
           {!overview && <Link href="/platform-fees" className={styles.back}>Platform fees</Link>}
           <h1>{group ? <PageTitleIcon><SectionIcon icon={group.icon} /></PageTitleIcon> : <DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />}{' '}<DirectoryPageTitle title={directoryPage.title} /></h1>
           <PageMeta updatedAt={directoryPage.updated_at} />
-          <ContentMarkdown markdown={directoryPage.intro_markdown} />
+          {intro}
         </PageHeader>
       </EntryHero>
       <PageCanvas flow className={styles.content}>
         {children}
-        {directoryPage.content_markdown && <div className={`${proseClassName} ${proseFlowClassName} ${styles.prose}`}><DirectoryPageContent page={directoryPage} /></div>}
+        {article ? <div className={`${proseClassName} ${proseFlowClassName} ${styles.prose}`}>{article}</div> : null}
       </PageCanvas>
     </AppShell>
   </FeeSearch>;
diff --git a/app/(site)/(directories)/platform-fees/content/intro.mdx b/app/(site)/(directories)/platform-fees/content/intro.mdx
new file mode 100644
index 00000000..5ff4f02e
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/content/intro.mdx
@@ -0,0 +1 @@
+Choose what you sell, then compare fees and start costs. Each category has sections for different products and services. Open a card for other rates and official sources.
diff --git a/app/(site)/(directories)/platform-fees/page.tsx b/app/(site)/(directories)/platform-fees/page.tsx
index fa81e927..82639353 100644
--- a/app/(site)/(directories)/platform-fees/page.tsx
+++ b/app/(site)/(directories)/platform-fees/page.tsx
@@ -5,6 +5,7 @@ import { FeeFilters, FeeHubResults } from './filters';
 import { CategoryTile, FeeShell } from './components';
 import styles from './page.module.css';
 import { RegistryStructuredData } from '@/lib/registry-layout';
+import Intro from './content/intro.mdx';
 
 export default async function PlatformFeesPage() {
   const directoryPage = await getRequiredDirectoryPage('platform-fees');
@@ -24,7 +25,7 @@ export default async function PlatformFeesPage() {
 
   return <>
     <RegistryStructuredData path="/platform-fees" />
-    <FeeShell directoryPage={directoryPage} overview>
+    <FeeShell directoryPage={directoryPage} intro={<Intro />} overview>
     <FeeFilters />
     <FeeHubResults items={items}>
       <p className={styles.count}>{feeGroups.length} categories · {directory.sections.length} sections · {directory.entries.length} listings</p>

From ea48657399eb90a78cde4e9fe0978696ff93205a Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Fri, 9 Oct 2026 22:50:12 +0530
Subject: [PATCH 02/25] Rewrite the DNS lookup, domain age, RAID, and MRR pages
 in MDX

The first page of each tool family, written as if new. Titles and search
text go to development separately.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(dns)/dns-lookup/content/article.mdx      | 77 +++++++++++++++++++
 .../(dns)/dns-lookup/content/intro.mdx        |  3 +
 .../(dns)/dns-lookup/content/usage.mdx        | 28 +++++++
 app/(site)/(tools)/(dns)/dns-lookup/page.tsx  | 11 ++-
 .../(domain)/domain-age/content/article.mdx   | 43 +++++++++++
 .../(domain)/domain-age/content/intro.mdx     |  1 +
 .../(domain)/domain-age/content/usage.mdx     | 13 ++++
 .../(tools)/(domain)/domain-age/page.tsx      | 11 ++-
 .../(saas)/mrr-calculator/content/article.mdx | 47 +++++++++++
 .../(saas)/mrr-calculator/content/intro.mdx   |  3 +
 .../(saas)/mrr-calculator/content/usage.mdx   | 23 ++++++
 .../(tools)/(saas)/mrr-calculator/page.tsx    | 12 ++-
 .../raid-calculator/content/article.mdx       | 71 +++++++++++++++++
 .../raid-calculator/content/intro.mdx         |  3 +
 .../raid-calculator/content/usage.mdx         | 19 +++++
 .../(storage)/raid-calculator/page.tsx        | 12 ++-
 16 files changed, 367 insertions(+), 10 deletions(-)
 create mode 100644 app/(site)/(tools)/(dns)/dns-lookup/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-lookup/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-lookup/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-age/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-age/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-age/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raid-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raid-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raid-calculator/content/usage.mdx

diff --git a/app/(site)/(tools)/(dns)/dns-lookup/content/article.mdx b/app/(site)/(tools)/(dns)/dns-lookup/content/article.mdx
new file mode 100644
index 00000000..bbac7970
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-lookup/content/article.mdx
@@ -0,0 +1,77 @@
+## Why does a DNS lookup still show the old record?
+
+Usually because a resolver still has the old answer cached. Each resolver keeps a copy until its TTL runs out, and resolvers fetch at different times, so some show the new value while others still show the old one.
+
+Look up the same name and type with `Authoritative nameserver`:
+
+- If it shows the new value, the change is saved. Public resolvers pick it up as their cached copies expire.
+- If it still shows the old value, the change isn't live. Check that you edited the DNS provider this domain actually uses. The [nameserver checker](/nameserver-checker) shows which one that is.
+
+Lowering a TTL now doesn't shorten copies already cached. A record that didn't exist can be cached as missing too, so a new TXT record may take a while to show. [RFC 2308](https://www.rfc-editor.org/rfc/rfc2308.html) calls this negative caching.
+
+The lookup runs from stack127's server, not your computer. Your router, VPN, or office network may use a different resolver and see another answer. Some providers also return different addresses by location. To compare many public resolvers at once, use the [DNS change checker](/dns-change-checker).
+
+## Which DNS record type should I look up?
+
+Pick the type that matches the job. One name can hold several types at once without them replacing each other.
+
+| Type | What it holds |
+| --- | --- |
+| A | The IPv4 address for the name. |
+| AAAA | The IPv6 address. Check it too when a site works on one network but not another. |
+| CNAME | An alias to another name. The address comes from the target. |
+| MX | The servers that receive email. A lower number means higher priority. |
+| NS | The nameservers for the zone. To check they match the domain's registration, use the [nameserver checker](/nameserver-checker). |
+| TXT | Text for domain verification and email policies such as SPF and DMARC. |
+| CAA | Which certificate authorities may issue certificates. The [CAA checker](/caa-checker) tests the full policy. |
+| SOA | The zone's serial number and timers. The [SOA checker](/soa-checker) compares it across nameservers. |
+| SRV | The host and port for a service. Look up the service name, such as `_sip._tcp.example.com`. |
+| DS and DNSKEY | DNSSEC keys. Their presence doesn't prove DNSSEC works. |
+| PTR | The hostname published for an IP address. |
+
+[Cloudflare's record type reference](https://developers.cloudflare.com/dns/manage-dns-records/reference/dns-record-types/) explains each type in more depth.
+
+## How do I check email DNS records?
+
+Each email record lives at a set name, and most are TXT records. A TXT lookup at `example.com` won't show the ones under `_dmarc` or `_domainkey`.
+
+- Incoming mail: MX at the domain after the `@`, such as `example.com`.
+- SPF: TXT at `example.com`, starting `v=spf1`.
+- DMARC: TXT at `_dmarc.example.com`, starting `v=DMARC1`.
+- DKIM: TXT at `selector._domainkey.example.com`, using the selector your mail provider gives you. Some providers use a CNAME there instead.
+
+Compare the name and the full value with your provider's instructions.
+
+`0 .` as the only MX record means the domain accepts no email. [RFC 7505](https://www.rfc-editor.org/rfc/rfc7505.html) calls this a null MX.
+
+This tool shows the records. It doesn't check that the SPF, DKIM, or DMARC policy is valid, or that mail gets delivered.
+
+## What do NXDOMAIN, SERVFAIL, and an empty result mean?
+
+An empty result means the name exists but has no record of that type. The response code tells that apart from a lookup that failed.
+
+| You see | What it means |
+| --- | --- |
+| Records | DNS answered. Compare the values with what you expected. |
+| `No A record returned.` | The name has no record of that type. Check the spelling and any alias first. |
+| NXDOMAIN | The name, or an alias target, doesn't exist. Check spelling and subdomains. |
+| SERVFAIL | The resolver couldn't finish the lookup. A nameserver may be down, or DNSSEC may be failing. |
+| REFUSED | The server declined to answer. Try another resolver. |
+| `did not answer within the lookup timeout` | stack127 got no reply in time. That says nothing about whether the name exists. |
+
+The codes are defined in [RFC 1035](https://www.rfc-editor.org/rfc/rfc1035.html#section-4.1.1). To see where a lookup stops, use [DNS trace](/dns-trace).
+
+## Does this lookup check DNSSEC?
+
+No. The `DNSSEC authentication` line only repeats a flag from the resolver's reply, so `Not authenticated` doesn't mean DNSSEC is broken. A DS or DNSKEY record in the results doesn't prove DNSSEC works either.
+
+To check whether a domain is signed and validates, use the [DNSSEC checker](/dnssec-checker).
+
+## What happens to the names I look up?
+
+- stack127 sends the name to the resolver you picked. For `Authoritative nameserver`, it asks Cloudflare which nameserver to use, then asks that server.
+- Addresses in the result go to Team Cymru's DNS service for the network details.
+- Your browser loads the site's icon straight from that site.
+- stack127 doesn't keep a history of your lookups, and analytics leave out the names you check.
+
+Look up public names only, not private hostnames you don't want leaving your network.
diff --git a/app/(site)/(tools)/(dns)/dns-lookup/content/intro.mdx b/app/(site)/(tools)/(dns)/dns-lookup/content/intro.mdx
new file mode 100644
index 00000000..adb0a650
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-lookup/content/intro.mdx
@@ -0,0 +1,3 @@
+Enter a domain or hostname to see the DNS records it returns right now, such as A, MX, TXT, and CNAME. Pick a public resolver to see the answer it gives its users, or the authoritative nameserver to see what the domain publishes.
+
+For reverse DNS, choose PTR and enter an IP address.
diff --git a/app/(site)/(tools)/(dns)/dns-lookup/content/usage.mdx b/app/(site)/(tools)/(dns)/dns-lookup/content/usage.mdx
new file mode 100644
index 00000000..ec1aed38
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-lookup/content/usage.mdx
@@ -0,0 +1,28 @@
+## What to enter
+
+Look up the exact name that has the problem. `example.com` and `www.example.com` are separate names and can point to different servers. If you paste a URL, the tool keeps the hostname and drops the rest.
+
+`All` checks 11 record types at that one name. It doesn't find subdomains or list every record in the domain. Some records live under their own names, such as `_dmarc.example.com`, so look those up directly.
+
+| Resolver | What you see | Use it when |
+| --- | --- | --- |
+| A public resolver, such as Cloudflare or Google Public DNS | The answer that resolver gives its users, often a cached copy | You want to see what people using that resolver get |
+| Authoritative nameserver | What one of the domain's own nameservers publishes now | You just changed a record and want to see if it saved |
+
+## How to read the result
+
+Each record type gets its own block, and each record is listed under the name it belongs to. If your name is an alias (a CNAME) for another name, the records belong to the target, and a line above them shows the path.
+
+TTL is how long a record may be kept in a cache. `Resolver TTL` is the time left on that resolver's copy, so it's often lower than the domain's setting. `Authoritative TTL` is the value the domain sets.
+
+Addresses show the network that announces them, from [Team Cymru's IP to ASN data](https://www.team-cymru.com/ip-asn-mapping). That's the hosting or CDN network. It doesn't tell you where the server sits or who owns the site.
+
+`No MX record returned` is normal for a name that doesn't use that type. It's a problem only when you expected one.
+
+<Example title="www.github.com, A record, Cloudflare">
+
+The result says `www.github.com` points to `github.com`. The address is listed under `Records for github.com`, on Microsoft's network, AS8075. So `www.github.com` has no address of its own. It uses the one for `github.com`.
+
+Checked on 9 October 2026. GitHub may give you a different address.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/dns-lookup/page.tsx b/app/(site)/(tools)/(dns)/dns-lookup/page.tsx
index fbad009c..1208db37 100644
--- a/app/(site)/(tools)/(dns)/dns-lookup/page.tsx
+++ b/app/(site)/(tools)/(dns)/dns-lookup/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Search } from "lucide-react";
 import { DnsLookupFromUrl } from "./dns-lookup-from-url";
 import styles from "./dns-lookup-content.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DnsLookupPage() {
   const toolPage = await getRequiredToolPage("dns-lookup");
@@ -14,13 +17,17 @@ export default async function DnsLookupPage() {
       <PageCanvas as="main" className="dns-lookup-main">
         <ToolPageHeader
           icon={<Search strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DnsLookupFromUrl />
 
         <div className={styles.guide}>
-          <ToolPageMarkdown toolPage={toolPage} />
+          <ToolPageArticle>
+            <Usage />
+            <Article />
+          </ToolPageArticle>
         </div>
       </PageCanvas>
     </ToolPageShell>
diff --git a/app/(site)/(tools)/(domain)/domain-age/content/article.mdx b/app/(site)/(tools)/(domain)/domain-age/content/article.mdx
new file mode 100644
index 00000000..f8bb3b76
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-age/content/article.mdx
@@ -0,0 +1,43 @@
+## Is domain age the same as website age?
+
+No. Domain age dates the registration of the name, not the website on it or the person who owns it now. Someone can buy a 20-year-old domain today and open a new shop on it tomorrow.
+
+So use the age to test a specific claim, not as a trust score. If a shop says it has used this address for ten years but the registration began last month, ask about the gap. A business can also be older than its domain if it moved to a new name.
+
+To see what was on the site over the years, open the [Wayback Machine](https://web.archive.org/) and compare captures from different years. A parked page or an unrelated business tells a different story from years of the same shop. A first capture shows a page existed by then, not when it launched, and [the archive has gaps](https://help.archive.org/help/using-the-wayback-machine/).
+
+## Does domain age reset after renewal, transfer, or expiry?
+
+Only deletion followed by a new registration resets it. Renewal, a move to another registrar (the company you buy the domain through), and even a change of owner keep the same registration going.
+
+| What happens | Effect on the age |
+| --- | --- |
+| The owner renews it | No reset. The expiry date moves forward. |
+| It moves to another registrar | No reset. The record may show a transfer date, but not whether the owner changed. |
+| The expiry date passes | No reset. The owner can often still renew, or the registrar may pass the name to someone new. |
+| It's deleted, then registered again | The age may start from the new registration. Earlier history may be missing. |
+
+These are separate operations in the [registry protocol, RFC 5731](https://www.rfc-editor.org/rfc/rfc5731.html). [ICANN's renewal and expiry FAQ](https://www.icann.org/resources/pages/domain-name-renewal-expiration-faqs-2018-12-07-en) explains what happens after a name expires. To follow an expiry date, use the [domain expiry checker](/domain-expiry).
+
+## Does domain age matter for SEO?
+
+This checker can't tell you. It doesn't look at search traffic, links from other sites, past content, or penalties, so the age isn't an SEO score.
+
+Before paying extra for an old domain, look at its past sites in the archive and at the sites that link to it. Google's spam policies name [expired domain abuse](https://developers.google.com/search/docs/essentials/spam-policies#expired-domains): buying an expired name and using it mainly to manipulate rankings with content that offers little value. Buying an old domain isn't abuse by itself.
+
+## Why is the age missing, or different on another site?
+
+The age is missing when the registry publishes no registration date, or when the domain ending has no public lookup service the checker can use. Neither means the name is new or free to register. `Could not check` means the registry didn't answer or limited requests, so try again in a few minutes.
+
+If another site shows a different age, compare the dates, not the big numbers. This checker counts from a re-registration date when there is one, and rounds the age. The `Fetched` line says when the record was read. A record marked cached is a saved answer up to 24 hours old.
+
+The lookup goes from stack127 to the registry. The website itself isn't contacted. For the rest of the record, such as the registrar, statuses, and nameservers, use the [domain registration lookup](/domain-lookup).
+
+## What do the dates in the result mean?
+
+<Terms>
+<Term name="First registered">The original registration date. It shows when the registry also publishes a later re-registration date.</Term>
+<Term name="Last changed">When the registration record last changed. It doesn't say what changed, and it isn't when the website was edited.</Term>
+<Term name="Registry expiry">When the current paid term ends, as the registry reports it. It isn't a deletion date.</Term>
+<Term name="Registry data">When the registry last updated the database it answered from.</Term>
+</Terms>
diff --git a/app/(site)/(tools)/(domain)/domain-age/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-age/content/intro.mdx
new file mode 100644
index 00000000..bda6524e
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-age/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name or paste a web address to see when the domain was registered and how old it is. The date comes from the public record kept by the domain's registry, such as Verisign for `.com`.
diff --git a/app/(site)/(tools)/(domain)/domain-age/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-age/content/usage.mdx
new file mode 100644
index 00000000..cab31a3a
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-age/content/usage.mdx
@@ -0,0 +1,13 @@
+## How to read the result
+
+The large number is the time since the current registration began, rounded to years and months. Use the date under it when the exact day matters.
+
+If you paste a full address, the checker looks up the registered domain. `https://shop.example.com/products` checks `example.com`, because a subdomain has no registration of its own.
+
+Some registries publish a re-registration date. When they do, the age counts from that later date, and the timeline still shows the first registration. The record doesn't say why the name was registered again or whether the owner changed.
+
+<Example title="google.com, checked in October 2026">
+
+Registered 15 September 1997. The age shows 29 years, 1 month. The timeline adds the last change to the record and the registry expiry date.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-age/page.tsx b/app/(site)/(tools)/(domain)/domain-age/page.tsx
index 8350c711..6e744d1b 100644
--- a/app/(site)/(tools)/(domain)/domain-age/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-age/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { CalendarClock } from "lucide-react";
 import { DomainAgeFromUrl } from "./domain-age-from-url";
 import styles from "./domain-age-content.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainAgePage() {
   const toolPage = await getRequiredToolPage("domain-age");
@@ -14,13 +17,17 @@ export default async function DomainAgePage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<CalendarClock strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainAgeFromUrl />
 
         <div className={styles.guide}>
-          <ToolPageMarkdown toolPage={toolPage} />
+          <ToolPageArticle>
+            <Usage />
+            <Article />
+          </ToolPageArticle>
         </div>
       </PageCanvas>
     </ToolPageShell>
diff --git a/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
new file mode 100644
index 00000000..1ecfb0d5
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
@@ -0,0 +1,47 @@
+## How do you calculate MRR?
+
+Divide each plan's price by the months in its billing term, multiply by its active subscriptions, and add up the plans.
+
+<Formula title="MRR">
+
+MRR = sum of (active subscriptions × price per term ÷ months in term)
+
+Months in term: monthly 1, quarterly 3, every six months 6, annually 12
+
+</Formula>
+
+[ChartMogul](https://chartmogul.com/saas-metrics/mrr/) and [Chargebee](https://www.chargebee.com/docs/billing/2.0/reports-and-analytics/monthly-recurring-revenue) both spread a longer plan across its months, so a $1,200 yearly plan adds $100 to MRR. Counting the whole $1,200 in the month it's paid is the mistake ChartMogul warns about.
+
+## What counts toward MRR?
+
+Recurring subscription charges count. One-time charges don't.
+
+| Charge | In MRR? |
+| --- | --- |
+| Plan price after recurring discounts | Yes |
+| Recurring add-ons | Yes. Add them to the price, or give them their own row if only some subscriptions have them. |
+| Setup fees and other one-time charges | No |
+| Tax | No |
+| Free trials | No, until they start paying |
+| Cancelled or expired subscriptions | No |
+| Past-due subscriptions, and ones set to cancel at the end of the term | Your call. Billing tools differ. |
+
+[ChartMogul's MRR report](https://help.chartmogul.com/article/154-chart-monthly-recurring-revenue-mrr) counts past-due subscriptions. [Chargebee](https://www.chargebee.com/docs/billing/2.0/reports-and-analytics/monthly-recurring-revenue) counts subscriptions set not to renew, and keeps ones with a failed payment until its retries end. Pick one rule and use it every month, so your months compare. A different rule is also the usual reason a total here doesn't match your billing dashboard.
+
+## Is MRR the same as cash or revenue?
+
+No. MRR is a monthly rate, not money received or revenue in your books. In the example, the Pro yearly customers pay $5,700 once a year but add $475.00 to MRR every month. [Chargebee's MRR guide](https://www.chargebee.com/docs/billing/2.0/reports-and-analytics/monthly-recurring-revenue) draws the same line between MRR, payments received, and accounting revenue.
+
+## What's the difference between MRR and ARR?
+
+ARR on this page is MRR × 12, the annualized run rate. It shows a year at today's rate. It isn't a forecast or money you're owed.
+
+ARR can also mean annual recurring revenue, which [ChartMogul](https://chartmogul.com/saas-metrics/arr/) says counts only contracts of 12 months or longer. Check which one a report means before you compare.
+
+## What doesn't MRR show?
+
+MRR is a snapshot of today. It doesn't show how it changed, who left, or what an average account pays.
+
+- The [MRR waterfall calculator](/mrr-waterfall-calculator) walks from starting to ending MRR through new, expansion, contraction, and churned revenue.
+- The [ARPU and ARPA calculator](/arpu-arpa-calculator) divides MRR by your paying accounts.
+- The [SaaS metrics calculator](/saas-metrics-calculator) shows one month's growth and retention.
diff --git a/app/(site)/(tools)/(saas)/mrr-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/mrr-calculator/content/intro.mdx
new file mode 100644
index 00000000..dd4a928f
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator turns plans billed monthly, quarterly, every six months, or yearly into one monthly recurring revenue (MRR) figure.
+
+Have the number of active subscriptions on each plan and what one subscription pays for its billing term. You get total MRR, the annual run rate, and each plan's share.
diff --git a/app/(site)/(tools)/(saas)/mrr-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/mrr-calculator/content/usage.mdx
new file mode 100644
index 00000000..fcf3ee13
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-calculator/content/usage.mdx
@@ -0,0 +1,23 @@
+## What to enter
+
+Add one row for each price and billing term. If some customers on a plan pay a different price, give them their own row.
+
+Count subscriptions, not customers. A customer with two subscriptions counts as two. For per-seat pricing, use what the whole subscription pays.
+
+The price is what one subscription pays for the whole term, after recurring discounts and before tax. A $190 yearly plan goes in as `190` with `Annually`, not as $15.83 a month.
+
+Enter every price in one currency. The currency menu only changes the symbol, so convert other currencies first.
+
+## How to read the result
+
+<Example title="Three plans on different billing terms">
+
+- Starter: 120 subscriptions × $19 a month = $2,280.00
+- Pro yearly: 30 subscriptions × $190 a year ÷ 12 = $475.00
+- Team: 8 subscriptions × $147 a quarter ÷ 3 = $392.00
+
+MRR is $3,147.00. Annualized ARR is $37,764.00.
+
+</Example>
+
+Check the monthly contribution column first. A plan 12 times too high usually has a yearly price with `Monthly` picked. One 12 times too low usually has a monthly price with `Annually` picked.
diff --git a/app/(site)/(tools)/(saas)/mrr-calculator/page.tsx b/app/(site)/(tools)/(saas)/mrr-calculator/page.tsx
index 73949dab..5f7f22bc 100644
--- a/app/(site)/(tools)/(saas)/mrr-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/mrr-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { CalendarDays } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { MrrCalculator } from "./mrr-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function MrrCalculatorPage() {
   const toolPage = await getRequiredToolPage("mrr-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <MrrCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/raid-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/raid-calculator/content/article.mdx
new file mode 100644
index 00000000..cf6abc44
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raid-calculator/content/article.mdx
@@ -0,0 +1,71 @@
+## How much usable space does each RAID level give?
+
+With equal drives, usable space is a whole number of drives. N is the number of drives, S is the size of the smallest one, and G is the number of groups.
+
+| Level | Min. drives | Usable space | Drives that can fail |
+| --- | --- | --- | --- |
+| RAID 0 | 2 | N × S | None |
+| RAID 1 | 2 | S | N - 1 |
+| RAID 5 | 3 | (N - 1) × S | 1 |
+| RAID 6 | 4 | (N - 2) × S | 2 |
+| RAID 10 | 4, even | N ÷ 2 × S | 1, or one per pair |
+| RAID 50 | 6 | (N - G) × S | 1, or one per group |
+| RAID 60 | 8 | (N - 2G) × S | 2, or two per group |
+| Linear or JBOD | 1 | All drives added up | None |
+
+## What is the RAID write penalty?
+
+It's the number of disk operations one small write causes. To change one small block in RAID 5, the array reads the old data and parity, then writes both.
+
+| Level | Disk operations per small write |
+| --- | --- |
+| RAID 0, Linear, JBOD | 1 |
+| RAID 1 | 1 per drive |
+| RAID 10 | 2 |
+| RAID 5 and RAID 50 | 4 |
+| RAID 6 and RAID 60 | 6 |
+
+It explains why parity layouts are slower at small random writes. It isn't a speed measurement, because caches and full-stripe writes change real performance. [Dell's RAID reference](https://www.dell.com/support/manuals/en-us/unity-880f/unity_p_pool_config/drive-iops-by-raid-type?guid=guid-b32204b2-a11b-4f25-b086-e8c135df04f1&lang=en-us) lists the same counts.
+
+## Can you mix drive sizes in RAID?
+
+Yes, but every drive in a group gives only as much space as the smallest drive in that group. A mirror of a 4 TB and an 8 TB drive holds 4 TB. Linear and JBOD are the exception: they join drives end to end, so every drive counts in full, with no redundancy.
+
+If you want mixed drives with redundancy and little waste, look at Synology SHR in the [SHR calculator](/shr-calculator) or Unraid in the [Unraid calculator](/unraid-calculator). Linux md RAID 0 can also use part of the extra space on larger drives. This calculator doesn't model that.
+
+## Does drive order matter in RAID 10?
+
+Yes. Each mirror pair is limited by its smaller drive, so pairing drives of the same size keeps the most space. The same four drives give different results:
+
+| Order entered | Mirror pairs | Usable | Size mismatch |
+| --- | --- | --- | --- |
+| 4, 4, 8, 8 TB | 4 + 4 and 8 + 8 | 10.91 TiB (12 TB) | 0 |
+| 4, 8, 4, 8 TB | 4 + 8 and 4 + 8 | 7.28 TiB (8 TB) | 7.28 TiB |
+
+RAID 50 and RAID 60 work the same way inside each group.
+
+## How many drives can fail in RAID 10, 50, or 60?
+
+Any one drive can fail in RAID 10 and RAID 50, and any two in RAID 60. More can fail only if they land in different groups.
+
+An eight-drive RAID 10 survives four failed drives if each comes from a different mirror pair. It doesn't survive losing both drives of one pair. In RAID 50 and 60, losing one whole group loses the array.
+
+## Why does my array show less space than the calculator?
+
+Drives are sold in TB, but most computers count in TiB. A TB is 1,000,000,000,000 bytes and a TiB is 1,099,511,627,776 bytes, so a 4 TB drive is 3.64 TiB. Windows shows TiB values but labels them TB, as [Seagate explains](https://www.seagate.com/support/kb/why-does-my-hard-drive-report-less-capacity-than-indicated-on-the-drives-label-172191en/). macOS counts in TB, like the label, according to [Apple](https://support.apple.com/en-us/102119).
+
+The result is also the size of the array before anything is on it. Partitions, the filesystem, reserved space, and snapshots take more. A NAS also keeps a system partition on every drive.
+
+## Should you use RAID 5 or RAID 6?
+
+The difference shows when a drive fails. RAID 5 has no protection left while it rebuilds, so a second failure loses the array. RAID 6 can still lose one more drive.
+
+A rebuild reads every remaining drive, so larger drives take longer to rebuild. The [rebuild calculator](/rebuild-calculator) estimates how long your array would stay exposed.
+
+## Is RAID a backup?
+
+No. RAID keeps the array running when a drive fails. It doesn't protect you from deleted files, ransomware, theft, fire, or a fault that corrupts the whole array. Keep a separate copy and test that it restores. The [3-2-1 backup calculator](/backup-321-calculator) helps you size one.
+
+## What should you check before building the array?
+
+Check that your controller or operating system supports the layout. Some vendors use JBOD to mean separate disks, not one combined volume. ZFS RAIDZ uses different math, so use the [ZFS capacity calculator](/zfs-capacity-calculator) for a ZFS pool, or the [storage layout advisor](/storage-layout-advisor) to compare layouts for your drives and the failures you need to survive.
diff --git a/app/(site)/(tools)/(storage)/raid-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/raid-calculator/content/intro.mdx
new file mode 100644
index 00000000..ebaf505b
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raid-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Pick a RAID level and add your drives to see how much space you can use, how much goes to redundancy, and how many drives can fail.
+
+Have the size of each drive, as printed on its label. Mixed sizes are fine. The result shows how much space they waste.
diff --git a/app/(site)/(tools)/(storage)/raid-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/raid-calculator/content/usage.mdx
new file mode 100644
index 00000000..03f2b8e0
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raid-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+For RAID 10, 50, and 60, enter the drives in the order you'll group them. In RAID 10, drives 1 and 2 form the first mirror pair, drives 3 and 4 the second, and so on. RAID 50 and 60 fill each group the same way, so put drives of the same size next to each other.
+
+The address bar keeps your drive list, so you can bookmark or share the result.
+
+## How to read the result
+
+Theoretical usable capacity is the space the array gives you before a filesystem goes on it. It shows in TiB. Switch to TB to compare it with drive labels.
+
+The bar splits the raw space of all drives into usable space, redundancy, and size mismatch. Redundancy is the mirror copies or parity that let the array survive a failed drive. Size mismatch is space above the smallest drive in a group, which the array can't use.
+
+Failure tolerance first says how many drives can fail, whichever ones they are. For RAID 10, 50, and 60, it then gives a higher number that holds only when the failed drives sit in different groups.
+
+<Example title="Four drives of 4, 4, 8, and 8 TB in RAID 5">
+
+Usable capacity is 10.91 TiB, which is 12 TB. Redundancy takes 3.64 TiB. Size mismatch takes 7.28 TiB, because RAID 5 uses only 4 TB of each 8 TB drive. Any one drive can fail.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/raid-calculator/page.tsx b/app/(site)/(tools)/(storage)/raid-calculator/page.tsx
index 6ce16a4f..8c10b518 100644
--- a/app/(site)/(tools)/(storage)/raid-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/raid-calculator/page.tsx
@@ -1,10 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
-import styles from "@/app/(site)/(tools)/(storage)/storage-tools.module.css";
 import { RaidCalculatorFromUrl } from "./raid-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function RaidCalculatorPage() {
   const toolPage = await getRequiredToolPage("raid-calculator");
@@ -14,12 +16,16 @@ export default async function RaidCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <RaidCalculatorFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 204b07632a262c0af89eff9e8bd951b5ceca65f5 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Fri, 9 Oct 2026 22:58:39 +0530
Subject: [PATCH 03/25] Rewrite the chmod calculator page in MDX

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../chmod-calculator/content/article.mdx      | 89 +++++++++++++++++++
 .../chmod-calculator/content/intro.mdx        |  3 +
 .../chmod-calculator/content/usage.mdx        | 17 ++++
 app/(site)/(tools)/chmod-calculator/page.tsx  | 11 ++-
 4 files changed, 118 insertions(+), 2 deletions(-)
 create mode 100644 app/(site)/(tools)/chmod-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/chmod-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/chmod-calculator/content/usage.mdx

diff --git a/app/(site)/(tools)/chmod-calculator/content/article.mdx b/app/(site)/(tools)/chmod-calculator/content/article.mdx
new file mode 100644
index 00000000..c82d21e8
--- /dev/null
+++ b/app/(site)/(tools)/chmod-calculator/content/article.mdx
@@ -0,0 +1,89 @@
+## How do chmod numbers work?
+
+Each digit adds up three values: read is 4, write is 2, and execute is 1. The three digits are for the owner, the group, and everyone else, in that order.
+
+<Formula title="One permission digit">
+
+read (4) + write (2) + execute (1)
+
+</Formula>
+
+| Digit | Letters | Permissions |
+| --- | --- | --- |
+| 7 | `rwx` | Read, write, and execute |
+| 6 | `rw-` | Read and write |
+| 5 | `r-x` | Read and execute |
+| 4 | `r--` | Read only |
+| 3 | `-wx` | Write and execute |
+| 2 | `-w-` | Write only |
+| 1 | `--x` | Execute only |
+| 0 | `---` | Nothing |
+
+So `755` gives the owner everything and lets the group and others read and execute. A fourth digit in front adds the special bits, covered below. The [GNU chmod manual](https://man7.org/linux/man-pages/man1/chmod.1.html) defines these values.
+
+## What do 644, 755, 600, and 777 mean?
+
+These are the modes you'll see most. They're common patterns, not rules. Give a file the fewest permissions that still let its program work.
+
+- `644` (`rw-r--r--`): ordinary files and web pages. You edit, everyone reads.
+- `755` (`rwxr-xr-x`): directories, scripts, and programs. You edit, everyone reads and runs.
+- `640` (`rw-r-----`): config files a service's group must read. Others get nothing.
+- `600` (`rw-------`): private keys and password files. Only you.
+- `700` (`rwx------`): private directories such as `~/.ssh`. Only you.
+- `777` (`rwxrwxrwx`): rarely right. Anyone on the system can change it.
+
+Some programs check this for you. [ssh ignores a private key](https://man7.org/linux/man-pages/man1/ssh.1.html) that other users can access.
+
+## Why do directories need execute permission?
+
+On a directory, execute means you can enter it and reach the files inside by name. Read only lets you list the names.
+
+| Permission | On a file | On a directory |
+| --- | --- | --- |
+| Read | Read the contents | List the names inside |
+| Write | Change the contents | Add, delete, or rename entries, with execute also set |
+| Execute | Run it as a program | Enter it and open entries by name |
+
+This is why one mode for a whole folder tree goes wrong. `chmod -R 644` leaves directories without execute, so no one but root can open the files inside. `chmod -R 755` makes every file executable.
+
+GNU chmod's capital `X` handles mixed trees: `a+X` adds execute only to directories and to files that someone could already execute. See [conditional executability](https://www.gnu.org/software/coreutils/manual/html_node/Conditional-Executability.html).
+
+Deleting a file depends on the directory's write permission, not the file's. A read-only file can still be deleted from a folder you can write to.
+
+## What do s, S, t, and T mean in permissions?
+
+They mark the special bits, which sit in the first of the four digits. Each letter takes the place of an `x`: setuid in the owner's spot, setgid in the group's, and sticky in others'.
+
+| Special bit (first digit) | Letters | What it does |
+| --- | --- | --- |
+| Setuid (4) | `s`/`S` | A program runs with its owner's user ID |
+| Setgid (2) | `s`/`S` | A program runs with its group's ID. On a directory, new files get the directory's group. |
+| Sticky (1) | `t`/`T` | On a directory, only a file's owner, the directory's owner, or root can delete or rename it |
+
+Lowercase means the execute bit is also set. Uppercase means it isn't. So `4640` shows as `rwSr-----`: setuid is on, but the owner can't execute. The [GNU ls manual](https://www.gnu.org/software/coreutils/manual/html_node/What-information-is-listed.html) lists these letters.
+
+You'll see two of these on real systems. `/tmp` is usually `1777` (`rwxrwxrwt`), so anyone can write there but can't delete other people's files. A shared folder set to `2775` keeps every new file in the folder's group. The [Linux inode manual](https://man7.org/linux/man-pages/man7/inode.7.html) describes both.
+
+<Warning title="0755 doesn't clear setgid on a directory">
+
+GNU chmod keeps a directory's setuid and setgid bits when you give it a four-digit mode like `0755`. To clear them, use `00755` or `chmod g-s`. See [setuid and setgid on directories](https://www.gnu.org/software/coreutils/manual/html_node/Directory-Setuid-and-Setgid.html).
+
+</Warning>
+
+## Why can't I access a file when the permissions look right?
+
+The mode is only one part of access. These also decide it:
+
+| What else counts | What to check |
+| --- | --- |
+| Owner and group | The owner digit applies only to the user who owns the file. Compare the owner in `ls -l` with the user your program runs as. |
+| Parent directories | You need execute on every directory in the path, not just the last one. |
+| ACLs | A `+` after the letters in `ls -l` means extra rules for named users or groups. `getfacl` shows them. See the [Linux ACL manual](https://man7.org/linux/man-pages/man5/acl.5.html). |
+| Mount options | A filesystem mounted read-only blocks writes, and one mounted `noexec` blocks running programs, whatever the mode says. |
+| Containers | In an unprivileged container, files owned by an unmapped user show up as `nobody` (ID 65534). The [LXC ID mapping checker](/lxc-idmap-checker) checks those mappings. |
+
+## Is umask the same as chmod?
+
+No. Umask removes permissions when a file is created. `chmod` sets them on a file that already exists.
+
+The usual umask is `022`. A program that creates a file with `666` gets `644`, and a directory created with `777` gets `755`. Changing the umask doesn't touch existing files. See the [Linux umask manual](https://man7.org/linux/man-pages/man2/umask.2.html).
diff --git a/app/(site)/(tools)/chmod-calculator/content/intro.mdx b/app/(site)/(tools)/chmod-calculator/content/intro.mdx
new file mode 100644
index 00000000..0ffe6f2c
--- /dev/null
+++ b/app/(site)/(tools)/chmod-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Type a chmod number such as `755`, or tick the permissions you want, to see the matching `rwx` letters and a `chmod` command.
+
+Nothing here touches your files. The command uses a placeholder path for you to replace.
diff --git a/app/(site)/(tools)/chmod-calculator/content/usage.mdx b/app/(site)/(tools)/chmod-calculator/content/usage.mdx
new file mode 100644
index 00000000..e5e7179b
--- /dev/null
+++ b/app/(site)/(tools)/chmod-calculator/content/usage.mdx
@@ -0,0 +1,17 @@
+## How to read the result
+
+The mode always shows four digits. The first one holds the special bits, so `755` shows as `0755`. For a file, both mean the same thing.
+
+The nine letters match what `ls -l` prints after its first character. That first character is the file type, such as `-` for a file or `d` for a directory.
+
+The field takes numbers only. To turn letters such as `rwxr-x---` into a number, tick the matching boxes.
+
+<Example title="A config file only you and your group can read">
+
+You want to edit the file, let your group read it, and keep everyone else out. Tick owner read and write, and group read.
+
+The result is `0640`, shown as `rw-r-----`. Owner is 6 (4 + 2), group is 4, and others is 0.
+
+</Example>
+
+Before you run the command, check the real target with `ls -ld path/to/file`. It shows the type, owner, group, and current permissions.
diff --git a/app/(site)/(tools)/chmod-calculator/page.tsx b/app/(site)/(tools)/chmod-calculator/page.tsx
index 656198d0..4341d340 100644
--- a/app/(site)/(tools)/chmod-calculator/page.tsx
+++ b/app/(site)/(tools)/chmod-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Terminal } from "lucide-react";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { ChmodCalculator } from "./chmod-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ChmodCalculatorPage() {
   const toolPage = await getRequiredToolPage("chmod-calculator");
@@ -12,10 +15,14 @@ export default async function ChmodCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Terminal strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <ChmodCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 57538e8868acd8a5126041e4403a12813d9c89e6 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 00:46:28 +0530
Subject: [PATCH 04/25] Move 19 rewritten tool pages to MDX with the same words

The KDP tools, the KENP and print size calculators, and four SaaS
calculators. Their visible text and search tags match production.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../content/article.mdx                       | 112 ++++++++++++++++++
 .../content/intro.mdx                         |   5 +
 .../content/usage.mdx                         |  25 ++++
 .../(saas)/break-even-mrr-calculator/page.tsx |  12 +-
 .../content/article.mdx                       |  98 +++++++++++++++
 .../content/intro.mdx                         |   3 +
 .../content/usage.mdx                         |  38 ++++++
 .../page.tsx                                  |  12 +-
 .../content/article.mdx                       |  96 +++++++++++++++
 .../content/intro.mdx                         |   3 +
 .../content/usage.mdx                         |  25 ++++
 .../page.tsx                                  |  12 +-
 .../ltv-cac-calculator/content/article.mdx    | 105 ++++++++++++++++
 .../ltv-cac-calculator/content/intro.mdx      |   3 +
 .../ltv-cac-calculator/content/usage.mdx      |  29 +++++
 .../(saas)/ltv-cac-calculator/page.tsx        |  12 +-
 .../content/article.mdx                       |  32 +++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  28 +++++
 .../kdp-backend-keywords-builder/page.tsx     |  12 +-
 .../content/article.mdx                       |  35 ++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  23 ++++
 .../kdp-book-description-formatter/page.tsx   |  12 +-
 .../content/article.mdx                       |  58 +++++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  19 +++
 .../kdp-book-setup-calculator/page.tsx        |  12 +-
 .../content/article.mdx                       |  27 +++++
 .../kdp-book-title-analyzer/content/intro.mdx |   1 +
 .../kdp-book-title-analyzer/content/usage.mdx |  30 +++++
 .../(tools)/kdp-book-title-analyzer/page.tsx  |  12 +-
 .../content/article.mdx                       |  37 ++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  25 ++++
 .../kdp-break-even-acos-calculator/page.tsx   |  12 +-
 .../kdp-image-dpi-checker/content/article.mdx |  45 +++++++
 .../kdp-image-dpi-checker/content/intro.mdx   |   1 +
 .../kdp-image-dpi-checker/content/usage.mdx   |  27 +++++
 .../(tools)/kdp-image-dpi-checker/page.tsx    |  12 +-
 .../kdp-metadata-checker/content/article.mdx  |  31 +++++
 .../kdp-metadata-checker/content/intro.mdx    |   1 +
 .../kdp-metadata-checker/content/usage.mdx    |  26 ++++
 .../(tools)/kdp-metadata-checker/page.tsx     |  12 +-
 .../content/article.mdx                       |  58 +++++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  22 ++++
 .../page.tsx                                  |  12 +-
 .../content/article.mdx                       |  45 +++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  20 ++++
 .../(tools)/kdp-page-count-estimator/page.tsx |  12 +-
 .../content/article.mdx                       |  42 +++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  18 +++
 .../kdp-payment-date-calculator/page.tsx      |  12 +-
 .../content/article.mdx                       |  39 ++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  20 ++++
 .../kdp-pdf-preflight-checker/page.tsx        |  12 +-
 .../content/article.mdx                       |  49 ++++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  26 ++++
 .../kdp-price-profit-calculator/page.tsx      |  12 +-
 .../content/article.mdx                       |  51 ++++++++
 .../kdp-royalty-calculator/content/intro.mdx  |   1 +
 .../kdp-royalty-calculator/content/usage.mdx  |  23 ++++
 .../(tools)/kdp-royalty-calculator/page.tsx   |  12 +-
 .../content/article.mdx                       |  48 ++++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  17 +++
 .../page.tsx                                  |  12 +-
 .../content/article.mdx                       |  42 +++++++
 .../content/intro.mdx                         |   1 +
 .../content/usage.mdx                         |  12 ++
 .../pixels-to-print-size-calculator/page.tsx  |  12 +-
 76 files changed, 1703 insertions(+), 57 deletions(-)
 create mode 100644 app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/ltv-cac-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/ltv-cac-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/ltv-cac-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-backend-keywords-builder/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-backend-keywords-builder/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-backend-keywords-builder/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-description-formatter/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-description-formatter/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-description-formatter/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-setup-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-setup-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-setup-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-title-analyzer/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-title-analyzer/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-book-title-analyzer/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-break-even-acos-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-break-even-acos-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-break-even-acos-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-image-dpi-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-image-dpi-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-image-dpi-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-metadata-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-metadata-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-metadata-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-minimum-list-price-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-minimum-list-price-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-minimum-list-price-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-page-count-estimator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-page-count-estimator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-page-count-estimator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-payment-date-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-payment-date-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-payment-date-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-pdf-preflight-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-pdf-preflight-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-pdf-preflight-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-price-profit-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-price-profit-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-price-profit-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kdp-royalty-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kdp-royalty-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kdp-royalty-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/pixels-to-print-size-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/pixels-to-print-size-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/pixels-to-print-size-calculator/content/usage.mdx

diff --git a/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/article.mdx
new file mode 100644
index 00000000..e7ba0ca6
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/article.mdx
@@ -0,0 +1,112 @@
+## How is break-even MRR calculated?
+
+Break-even MRR is your fixed monthly cost divided by the share of each revenue dollar left after variable costs. The account count divides the same fixed cost by what one account contributes, then rounds up to a whole account.
+
+Contribution is monthly ARPA minus the variable cost of one account. ARPA means average revenue per account. The contribution ratio is contribution divided by ARPA.
+
+<Formula title="Per account">
+
+Break-even MRR = fixed costs ÷ contribution ratio
+
+Accounts = fixed costs ÷ contribution per account, rounded up
+
+</Formula>
+
+The [SBA's break-even guidance](https://legacy.sba.gov/business-guide/plan-your-business/calculate-your-startup-costs/break-even-point) uses the same division. You can't sell part of an account, so the count rounds up. The revenue figure rounds up to the next cent, so it never falls short.
+
+<Example title="$25,000 fixed, $49 a month, $8 variable cost">
+
+Contribution is $41.00 per account. The ratio shows 83.67%, which is $41 ÷ $49 rounded to a hundredth of a percent. The math uses the exact ratio.
+
+$25,000 × $49 ÷ $41 comes to $29,878.048..., so break-even MRR is $29,878.05.
+
+$25,000 ÷ $41 is 609.76 accounts, so you need 610. Those accounts bring $29,890.00 of MRR, which leaves $10.00 after fixed costs.
+
+</Example>
+
+$29,878.05 is the smallest monthly revenue that covers the costs. $29,890.00 is what 610 whole accounts bring in. The page shows both.
+
+## Which costs are fixed, and which grow?
+
+Fixed costs stay put as the account count changes. Variable costs grow with accounts or with revenue. The SBA guidance says to split a cost that has both parts, and to turn a yearly bill into a monthly amount.
+
+| Cost | Where it goes |
+| --- | --- |
+| Rent, salaries, and software you pay with no new accounts | Fixed, per month or per year |
+| A hosting minimum you pay even with no usage | Fixed |
+| Hosting or support that rises with accounts or usage | Variable, per account |
+| Payment fees that are a percent of revenue | Variable, as a share of MRR |
+| Your own pay, when this result should cover it | Fixed |
+| A bill with a fixed part and a growing part | Split it. Don't enter the same dollars twice. |
+
+A yearly line of $100 shows $8.33 a month, because $100 ÷ 12 doesn't land on a whole cent. The math keeps the exact twelfth.
+
+[Stripe's gross margin guide](https://stripe.com/resources/more/saas-gross-margin-explained-what-it-is-and-why-it-is-important) puts hosting, support, and payment processing in the cost to serve. Some of that cost is fixed, and some of it grows. If your gross margin already subtracts a fixed hosting minimum or a support salary, don't use that whole margin as the variable share. Enter the fixed part on a fixed line and only the growing part as variable.
+
+A steady sales payroll can sit on a fixed line when you want the result to cover it. Ad spend that grows with each new customer is the cost of winning customers, and this page leaves it out. Use the [CAC payback calculator](/cac-payback-calculator) for that.
+
+## Should your own pay be included?
+
+Include it when you want the revenue that covers your pay and the other fixed costs. Leave it off when you want the other bills only. The breakdown shows the lines you included.
+
+<Warning title="The result stops at zero profit">
+
+Break-even MRR covers the costs on your list and nothing more. It doesn't add a profit goal, a tax reserve, or a cost you left off. This calculator doesn't ask for a target profit.
+
+</Warning>
+
+## What if variable costs are a share of MRR?
+
+Use `Share of MRR` when the variable cost is a percent of recurring revenue. Break-even MRR is then fixed monthly cost divided by the share you keep.
+
+<Formula title="Share of MRR">
+
+Break-even MRR = fixed costs ÷ (1 - variable share)
+
+</Formula>
+
+$4,500 of fixed costs and a 20% variable share leave 80 cents of each revenue dollar, so break-even MRR is $5,625.00. Leave ARPA blank and the revenue answer is still complete, but there's no account count.
+
+Add an ARPA of $29 and contribution is $23.20 per account. You need 194 accounts. Those bring $5,626.00, which leaves $0.80 after fixed costs.
+
+The share stops at 100%, so this mode can't show an account that loses money. Use `Per account` with a variable cost above ARPA for that case.
+
+## What does current MRR change?
+
+Current MRR shows where today's recurring revenue sits against break-even. It doesn't change break-even MRR.
+
+Take $1,000 of fixed costs, $50 of ARPA, and $10 of variable cost. Contribution is $40.00 and break-even MRR is $1,250.00. 25 accounts bring exactly $1,250.00, so the two revenue figures match here.
+
+| Current MRR | Monthly result now | Gap | More accounts at $50 |
+| --- | --- | --- | --- |
+| $500 | -$600.00 | MRR still needed: $750.00 | 15 |
+| $5,000 | $3,000.00 | Above break-even by $3,750.00 | 0 |
+
+At $500 of current MRR, variable costs leave $400.00, which is $600.00 short of the $1,000 fixed cost. Each extra account adds $40.00, so 15 accounts close that $600.00 gap.
+
+When the main result isn't a dollar amount, `Monthly result now` still shows. The revenue gap and the extra accounts stay blank.
+
+## When is there no break-even point?
+
+There's no break-even point when each account contributes nothing or loses money. More accounts can't close a fixed-cost gap then.
+
+| Contribution | Fixed costs | Main result |
+| --- | --- | --- |
+| Positive | Above 0 | The dollar amount |
+| Positive | 0 | `$0.00`. Any paying account adds profit. |
+| Zero | Above 0 | `No break-even point`. More accounts never cover the fixed costs. |
+| Negative | Above 0 | `No break-even point`. More accounts widen the gap. |
+| Zero | 0 | `Breaks even at any MRR` |
+| Negative | 0 | `Only at $0 MRR`. Each added account loses money. |
+
+ARPA of $29 and a variable cost of $29, with $4,500 fixed, leaves $0.00 per account, so more accounts never cover that $4,500. A variable cost of $30 loses $1.00 per account, so more accounts widen the gap. At a current MRR of $2,900, monthly result now is -$4,600.00.
+
+## Is break-even MRR cash, or a date?
+
+Neither. It is the monthly rate of recurring revenue that covers this cost list. [ChartMogul's MRR definition](https://chartmogul.com/saas-metrics/mrr/) spreads each subscription across its billing interval and leaves one-time charges out, so MRR is not the cash you collect this month.
+
+[Stripe's guide to subscription revenue recognition](https://stripe.com/gb/resources/more/revenue-recognition-for-subscription-based-businesses-explained) also counts revenue as the service is delivered. A customer can pay for a year up front and still add one twelfth to MRR. This page doesn't predict the month you'll reach break-even, and it isn't an income statement.
+
+One ARPA is an average, and several plans can drift from it. The SBA notes that one average can misstate a mix of products. Use a weighted average, or run the calculator once per plan.
+
+Next, the [CAC payback calculator](/cac-payback-calculator) shows how many months of gross profit repay the cost of one new customer. Build that cost in the [customer acquisition cost calculator](/customer-acquisition-cost-calculator) when it needs its own lines. The [customer lifetime value calculator](/customer-lifetime-value-calculator) and the [LTV:CAC calculator](/ltv-cac-calculator) compare what a customer is worth with what they cost. The [SaaS metrics calculator](/saas-metrics-calculator) gives the wider picture for one month.
diff --git a/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/intro.mdx
new file mode 100644
index 00000000..caa843b6
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/intro.mdx
@@ -0,0 +1,5 @@
+This calculator shows the monthly recurring revenue that covers your fixed costs after variable costs, and how many paying accounts that takes.
+
+List the costs that stay the same as you add accounts. Have the monthly revenue per account, and either a variable cost per account or a percent of revenue.
+
+Add your current recurring revenue if you want the gap from today.
diff --git a/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/usage.mdx
new file mode 100644
index 00000000..b675ca59
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/content/usage.mdx
@@ -0,0 +1,25 @@
+## What to enter
+
+Fixed costs stay the same when you add a paying account. Use one line per cost, up to 20. A name is optional. A blank name shows as Fixed cost 1, Fixed cost 2, and so on in the breakdown.
+
+A monthly line is what you pay each month. A yearly line is the bill for the whole year, and the breakdown divides it by 12.
+
+Add your own pay only when this answer should cover it. Leave it off when you want the other bills only.
+
+Split a bill that has a minimum plus usage. The minimum is fixed. The part that grows with accounts or revenue is variable. Don't type the whole bill in both places.
+
+`Per account` is a dollar cost for each paying account, such as usage-based hosting or a per-seat tool. It can be higher than the revenue from that account. `Share of MRR` is a percent of recurring revenue, from 0 to 100, such as a payment fee. Only the field for the method you picked counts.
+
+Monthly ARPA is average revenue per account for one month. With `Per account`, ARPA must be above 0. With `Share of MRR`, it's optional. A blank ARPA means the account count is unknown, not that revenue is zero.
+
+Current MRR is optional. Use the recurring monthly amount, and count a yearly plan as one twelfth. Leave it blank if you don't know it. Type 0 only when today's recurring revenue really is zero.
+
+Type digits with up to two decimals. A `$`, comma, or `%` sign is rejected. Currency changes the symbol only.
+
+## How to read the result
+
+The main result is the smallest monthly recurring revenue that covers your fixed costs after variable costs.
+
+`Paying accounts needed` rounds up to a whole account. `MRR at N accounts` is the revenue those accounts bring in, which can be a little higher than the main result. `Left after fixed costs` is what those accounts leave after variable and fixed costs.
+
+`Monthly result now` shows after you enter current MRR. It is that revenue after variable costs, minus fixed costs. A minus sign is a shortfall on this cost list. Cash in the bank can differ.
diff --git a/app/(site)/(tools)/(saas)/break-even-mrr-calculator/page.tsx b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/page.tsx
index 6347f298..b5486400 100644
--- a/app/(site)/(tools)/(saas)/break-even-mrr-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/break-even-mrr-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { Scale } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { BreakEvenMrrCalculator } from "./break-even-mrr-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function BreakEvenMrrCalculatorPage() {
   const toolPage = await getRequiredToolPage("break-even-mrr-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Scale strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Scale strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <BreakEvenMrrCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/article.mdx
new file mode 100644
index 00000000..43ff8ad4
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/article.mdx
@@ -0,0 +1,98 @@
+## How is customer acquisition cost calculated?
+
+Customer acquisition cost (CAC) is the acquisition spending you counted, divided by the new paying customers you counted. The calculator keeps three versions apart because each answers a different question.
+
+<Formula title="Three versions of CAC">
+
+Cash CAC = cash acquisition costs ÷ new paying customers.
+
+CAC with founder time = (cash costs + your hours × your hourly value) ÷ the same customers.
+
+Paid media CAC = paid media ÷ paid-sourced customers.
+
+</Formula>
+
+The cash figure is the main result. [Stripe's guide to CAC in SaaS](https://stripe.com/resources/more/cac-in-saas) uses the same basic formula: total sales and marketing costs divided by new customers acquired.
+
+## Which costs belong in CAC?
+
+Count the costs you spent to win new customers. The fields give each kind of cost a place. They aren't a full list of accounts you must fill in.
+
+| Field | What belongs there |
+| --- | --- |
+| Paid media | Ads and sponsored placements. |
+| Sales and marketing pay | Salary and commission for people who work on winning customers full time. |
+| Agencies and freelancers | Outside help hired to win customers. |
+| Tools, content, and events | Software, content, sponsorships, and events used to win customers. |
+| Shared costs | A cost that only partly wins customers, such as a mixed role, rent, or general software. |
+| Founder time | Your unpaid hours, priced at a rate you choose. This row isn't cash. |
+
+Stripe's guide says to leave out customer support, infrastructure, and research and development (R&D), and to count only costs tied directly to winning new users. They stay out of CAC, but they don't all go to the same place:
+
+- Costs to serve paying customers, such as hosting, support, and payment fees, lower your gross margin. They go into the margin you enter on the [customer lifetime value calculator](/customer-lifetime-value-calculator).
+- Costs to build the product, such as engineers and designers working on new features, are usually operating costs. They belong in neither CAC nor gross margin. They are part of the fixed monthly costs on the [break-even MRR calculator](/break-even-mrr-calculator), which finds the revenue that covers them.
+
+Count each cost once. If a person or tool does several jobs, put only the acquisition part here, through shared costs. Don't also count that same part in gross margin.
+
+A blank row is left out. A row with 0 is counted and adds nothing.
+
+## How do you split a cost that only partly wins customers?
+
+Turn on shared costs and pick a split you can explain.
+
+- `Fixed share` uses the percent you type. A 12.5% share of $4,000 adds $500.00.
+- `Hours` uses acquisition hours divided by total hours. A $9,000 shared cost with 120 acquisition hours out of 400 adds $2,700.00.
+- `Headcount` works the same way with people. A part-time person can be 0.5. Total headcount has to be above 0, and the acquisition part can't be higher than the total.
+
+The line under the allocated amount repeats the split you entered. The calculator can't check that your hours, people, or percent are right.
+
+## Should you count your own unpaid time?
+
+Count it as a second figure when you want to know what the work would cost if you paid for it. Cash CAC stays the same either way, so you can still compare it with a team that pays for the same work.
+
+In the example above, cash CAC is $75.00. Add 40 unpaid hours at $75.00 an hour and founder time is $3,000.00. CAC with founder time is $225.00, and cash CAC is still $75.00.
+
+The hourly value is your choice. It could be what you'd pay someone else, or what you earn elsewhere. The calculator doesn't suggest one.
+
+## Why is paid media CAC a different number?
+
+It uses a different cost and a different customer count. Cash CAC divides every counted cost by every new paying customer. Paid media CAC divides only the paid-media field by the customers you credit to paid media.
+
+<Example title="Ads, pay, and tools">
+
+Paid media is $5,000, sales and marketing pay is $3,000, and tools are $2,000. That's $10,000 over 100 new paying customers, so cash CAC is $100.00. If 40 of those customers came from paid media, paid media CAC is $5,000 ÷ 40 = $125.00.
+
+</Example>
+
+The two numbers aren't meant to match. The $125.00 is ad spend per ad-sourced customer. It leaves out the pay, tools, and agencies that also helped win them. If paid-sourced customers is 0, cash CAC still works, and the paid-media line says there is no paid media CAC.
+
+## What if spend and new customers fall in different months?
+
+The timing choice says what you paired. It can't fix a long sales cycle for you.
+
+<Warning title="Same period doesn't mean the costs won these customers">
+
+If a sale takes longer than your period, some of this period's spend may win customers you haven't signed yet. Some of this period's customers may have come from earlier spend. Stripe's guide makes the same point. Choose `Matched to these customers` only after you've assigned the costs yourself. The calculator doesn't move spend between periods or check your matching.
+
+</Warning>
+
+Both choices give the same number for the same inputs. Check the timing line under the result before you compare two calculations.
+
+## What if there were no new paying customers?
+
+The result says `No new customers`. The spend still shows, but there's no cost per customer, because the calculator won't divide by zero.
+
+$5,000 of paid media and 0 customers means $5,000.00 was spent and there's no CAC. Ten customers with paid media typed as 0 is different. That cash CAC is $0.00.
+
+## What CAC doesn't tell you
+
+There's no single good CAC to aim for. Stripe's guide says there's no universal CAC benchmark across SaaS. This page doesn't score your result or tell you to spend less.
+
+It isn't the figure your accountant uses either. US accounting rules under ASC 340-40 decide when some costs of winning a contract, such as a commission paid only when a contract is signed, are spread over time. The [FASB memo on costs to obtain a contract](https://storage.fasb.org/REVREC_TRG_Memo_23_Costs_to_Obtain_a_Contract.pdf) covers that question. It doesn't define the fields on this page.
+
+CAC isn't lifetime value, a payback period, or cash collected from customers. For those:
+
+- [Customer lifetime value calculator](/customer-lifetime-value-calculator): the gross profit one customer may bring in.
+- [LTV to CAC calculator](/ltv-cac-calculator): lifetime value compared with this cost.
+- [CAC payback calculator](/cac-payback-calculator): the month a group of customers earns the cost back, counting the ones who leave.
+- [SaaS metrics calculator](/saas-metrics-calculator): a quick monthly snapshot with one spend figure and one new-customer count.
diff --git a/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/intro.mdx
new file mode 100644
index 00000000..a1025c3b
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+See what one new paying customer cost you in cash. You can add a second figure that prices your own unpaid hours, and a third for the customers who came from paid ads.
+
+Have your acquisition costs and your count of first-time paying customers for one period, such as last quarter.
diff --git a/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/usage.mdx
new file mode 100644
index 00000000..45a5bb69
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/content/usage.mdx
@@ -0,0 +1,38 @@
+## What to enter
+
+Use one period you can explain, such as last quarter. The currency menu changes the symbol only. It doesn't convert amounts.
+
+Put each cash cost in one field:
+
+- Paid media is ads and sponsored placements.
+- Sales and marketing pay is salaries and commission for people who work on winning customers full time.
+- Agencies and freelancers is outside help hired for that work.
+- Tools, content, and events is software, content, sponsorships, and events used to win customers.
+
+Leave a field blank to leave that cost out. The result then says `Not counted`, which is different from `$0.00`. Type 0 when the cost really was zero. Fill in at least one cost.
+
+A mixed role, rent, or general software goes in shared costs. Turn on `Include shared costs` and split the total by a percent, by hours, or by people. The split is your own estimate.
+
+Your unpaid hours never change the cash figure. Turn on `Include founder time`, then enter your hours and what one hour is worth to you. There is no suggested rate, and 0 is allowed.
+
+`New paying customers` means people who paid you for the first time in this period. Leave out trials, sign-ups, and renewals.
+
+`Paid-sourced customers` is optional. It's how many of those new customers you credit to paid media, so it can't be higher than new paying customers. If you fill it in, fill in paid media too, even if that's 0.
+
+`The same period` divides this period's costs by this period's new customers. `Matched to these customers` means you've already worked out which costs won this group. The math is the same for both. The choice only changes the label, and the calculator doesn't check your matching.
+
+`Compare a second scenario` adds a second set of the same fields, so you can test another channel, period, or split. The result says how much more or less the second cash cost per customer is. The table shows the same gap for founder time and paid media.
+
+Blank is not zero. Type digits with up to two decimal places, and no minus sign, `$`, or comma.
+
+## How to read the result
+
+The top line is the cash cost per new paying customer. A second line appears when founder time is on. A third appears when you entered paid-sourced customers. It divides paid media by that smaller count.
+
+The table shows each cost and its share per customer. Each row is rounded on its own, so the rows may not add up to the total by a cent. A note under the table says when that happens.
+
+<Example title="$1,200 of ads and $300 of tools">
+
+Twenty people paid for the first time. Cash costs are $1,500.00, so the cash cost per customer is $75.00. Pay and agencies were left blank, so those rows say `Not counted`.
+
+</Example>
diff --git a/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/page.tsx b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/page.tsx
index 761b5cfd..29d880d5 100644
--- a/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/customer-acquisition-cost-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { UserPlus } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { CustomerAcquisitionCostCalculator } from "./customer-acquisition-cost-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function CustomerAcquisitionCostCalculatorPage() {
   const toolPage = await getRequiredToolPage("customer-acquisition-cost-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<UserPlus strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<UserPlus strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <CustomerAcquisitionCostCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/article.mdx
new file mode 100644
index 00000000..60e334a1
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/article.mdx
@@ -0,0 +1,96 @@
+## How is customer lifetime value calculated?
+
+Lifetime gross profit is one period's gross profit divided by the customer churn rate. ARPA, margin, and churn all use the period you chose.
+
+<Formula title="Lifetime gross profit">
+
+Gross profit per period = ARPA × gross margin.
+
+Lifetime gross profit = gross profit per period ÷ customer churn.
+
+Model lifetime = 1 ÷ customer churn.
+
+</Formula>
+
+This is a simple model with a constant rate. Each customer pays the first period in full. After that, the same share of the customers still paying leaves every period. So the expected gross profit per starting customer shrinks a little each period, and the totals add up toward the lifetime figure. Churn has to be above zero for the lifetime figure to exist.
+
+At 100% churn, everyone leaves after the first period. With $50 of monthly ARPA and an 80% margin, lifetime gross profit is $40.00 and model lifetime is 1.0 month.
+
+[ChartMogul's LTV guide](https://chartmogul.com/saas-metrics/ltv/) gives this gross-profit formula and calls lifetime value a forward-looking estimate, not a record of past payments. ChartMogul's own in-app LTV chart is different. Its [help page](https://help.chartmogul.com/article/208-chart-customer-lifetime-value-ltv) says it divides average revenue by a six-month trailing average of churn and leaves margin out. So a number from that chart won't match this page.
+
+## How is revenue LTV different from gross-profit LTV?
+
+Revenue LTV uses the same churn but keeps serving costs in. In the example above, revenue LTV is $50 ÷ 3% = $1,666.67. Lifetime gross profit uses 80% of the $50, so it's $1,333.33.
+
+Gross profit is the main result because it's what a customer leaves after serving costs, to pay for everything else. [Stripe's customer lifetime value guide](https://stripe.com/resources/more/customer-lifetime-value) notes that a customer who pays more can be worth less if the margin is thin. Stripe's guide shows several formulas. This page uses only the gross-profit formula above.
+
+## Can you mix monthly revenue with yearly churn?
+
+No. Both numbers have to cover the same period, and a monthly churn rate times 12 isn't the yearly rate.
+
+If 5% of the customers still paying leave each month, about 54% of the starting group are still paying after 12 months. About 46% have left, not 60%. The calculator won't convert between the two. If you need a yearly rate, work it out from your own data before you type it.
+
+| What you measured | Don't enter | Enter |
+| --- | --- | --- |
+| $50 per customer each month, and 5% leaving each month | Yearly churn of 60% | `Per month`, ARPA `50`, churn `5` |
+| Revenue per customer for a year, and the share who left that year | The yearly share divided by 12 | `Per year`, with the yearly revenue and the yearly churn |
+
+Revenue does add up across months. Twelve payments of $50 are $600 a year. You can enter `50` per month or `600` per year, as long as churn is for the same period.
+
+A yearly example: $24,000 of yearly ARPA, a 75% margin, and 20% yearly churn give $18,000.00 of gross profit a year and $90,000.00 of lifetime gross profit. Model lifetime is 5.0 years. Year 1 brings in $18,000.00, which is 20.0% of the lifetime total.
+
+## What does model lifetime mean?
+
+It's 1 ÷ churn, in the period you chose. At 3% a month, model lifetime is 33.3 months. That's the average number of paid periods this model implies. It isn't how long your customers have actually stayed, and it doesn't promise that a new customer will stay 33.3 months.
+
+## What if customer churn is zero?
+
+The result says `Not estimable`. If no one ever leaves, this model has no end, so there's no finite lifetime total. The result doesn't show $0, and it doesn't claim customers stay forever.
+
+The checkpoint table still fills in, because 1, 2, 3, and 5 years are finite. Each period adds one full period of gross profit. With $40.00 a month and 0% churn, month 12 is $480.00, month 24 is $960.00, month 36 is $1,440.00, and month 60 is $2,400.00. The share of LTV says `n/a`, because there's no lifetime total to take a share of.
+
+## How much of the estimate arrives in the first few years?
+
+The checkpoint table answers this for the churn you entered. The rows are fixed reading points, not a forecast from your data or a suggested contract length.
+
+For $50 a month, 80% margin, and 3% monthly churn:
+
+| By the end of | Gross profit | Share of LTV |
+| --- | --- | --- |
+| Month 12 | $408.21 | 30.6% |
+| Month 24 | $691.44 | 51.9% |
+| Month 36 | $887.96 | 66.6% |
+| Month 60 | $1,118.92 | 83.9% |
+
+So about 16% of the $1,333.33 is expected after year 5.
+
+<Warning title="Low churn puts most of the value in later years">
+
+Drop churn to 0.5% a month and the same $40.00 a month becomes $8,000.00 of lifetime gross profit, with a model lifetime of 200.0 months. By month 60 only $2,077.91 has arrived, 26.0% of the total. The result then says less than half arrives in the first 5 years. Most of that $8,000.00 depends on churn staying that low for many more years.
+
+</Warning>
+
+## What if gross margin is zero or negative?
+
+Both are allowed. A negative margin means each customer loses you money.
+
+A margin of `-20` on $50 of monthly ARPA is a loss of $10.00 a month. At 5% monthly churn, lifetime gross profit is a loss of $200.00, and month 12 shows a loss of $91.93. Revenue LTV is still $1,000.00, because it ignores serving costs.
+
+A margin of 0 gives $0.00 of lifetime gross profit and $0.00 at every checkpoint.
+
+## Is my LTV good or bad?
+
+The calculator doesn't grade it. There's no single healthy LTV, because it only means something next to what a customer costs to win. Compare it with your acquisition cost on the [LTV to CAC calculator](/ltv-cac-calculator).
+
+## What this estimate doesn't measure
+
+It doesn't read your customer data or report what past customers actually paid. It keeps ARPA, margin, and churn constant. It leaves out upgrades, downgrades, price changes, refunds, and the lower value of money that arrives later. Real groups of customers often cancel faster in the first months than a steady rate suggests.
+
+Formula estimates can miss by a lot. In its [2026 SaaS LTV report](https://chartmogul.com/reports/saas-ltv-report/), ChartMogul checked its revenue formula against what customers actually paid. It used 35,512 groups of customers from 3,331 company accounts, each group starting in a quarter from early 2020 to late 2024, with revenue tracked through June 2026. Over the first 12 months, 28.3% of the groups earned more than 50% above or below the formula's prediction. That test used ChartMogul's revenue formula, not this page's gross-profit model. Read the result as a scenario, not money you're sure to collect.
+
+Next steps:
+
+- [Customer acquisition cost calculator](/customer-acquisition-cost-calculator): what winning one customer cost.
+- [LTV to CAC calculator](/ltv-cac-calculator): lifetime gross profit compared with that cost.
+- [CAC payback calculator](/cac-payback-calculator): the month a group earns its cost back while customers leave.
+- [SaaS metrics calculator](/saas-metrics-calculator): a simpler lifetime estimate inside a one-month snapshot.
diff --git a/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/intro.mdx
new file mode 100644
index 00000000..9b5b5985
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Estimate the gross profit one paying customer brings in over their life, if price, margin, and customer churn stay the same.
+
+Have average revenue per customer, gross margin, and customer churn, all for the same period: a month or a year. The calculator won't turn monthly figures into yearly ones.
diff --git a/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/usage.mdx
new file mode 100644
index 00000000..b3e81d9a
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/content/usage.mdx
@@ -0,0 +1,25 @@
+## What to enter
+
+Choose `Per month` or `Per year` first. Then enter all three numbers for that period. Switching later renames the fields but keeps the numbers you typed, so retype them if they were for the other period.
+
+ARPA (average revenue per account) is what one paying customer pays you in that period, before the cost of serving them. It isn't your whole company's revenue.
+
+Gross margin is the share of that revenue left after hosting, support, payment fees, and other costs to serve. Type `-20` if serving a customer costs more than they pay. The range is -100 to 100, and the `%` sign is already shown.
+
+Customer churn is the share of paying customers who leave during the period. Use customer churn, not revenue churn, which also moves with upgrades and downgrades. Type 0 if no paying customer left. That's allowed and has its own result.
+
+The currency menu changes the symbol only. It doesn't convert amounts.
+
+`Compare a second scenario` lets you try a different price, margin, or churn. The result says how much more or less lifetime gross profit the second scenario has, when both have a finite estimate.
+
+Blank is not zero. Type digits with up to two decimal places. Don't type `$`, `%`, or commas. Only gross margin accepts a minus sign.
+
+## How to read the result
+
+The top line is lifetime gross profit per customer. The first table shows how much of it has arrived by the end of years 1, 2, 3, and 5 if churn holds. The second table shows how the estimate is built, including model lifetime and revenue before serving costs.
+
+<Example title="$50 a month, 80% margin, 3% monthly churn">
+
+Gross profit is $40.00 a month. Lifetime gross profit is $40.00 ÷ 3% = $1,333.33. Revenue before serving costs is $1,666.67. Model lifetime is 33.3 months.
+
+</Example>
diff --git a/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/page.tsx b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/page.tsx
index d6f9d1b8..dcf848f9 100644
--- a/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/customer-lifetime-value-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { Layers } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { CustomerLifetimeValueCalculator } from "./customer-lifetime-value-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function CustomerLifetimeValueCalculatorPage() {
   const toolPage = await getRequiredToolPage("customer-lifetime-value-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Layers strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Layers strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <CustomerLifetimeValueCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/article.mdx
new file mode 100644
index 00000000..69d73516
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/article.mdx
@@ -0,0 +1,105 @@
+## How is LTV to CAC calculated?
+
+The ratio is lifetime gross profit divided by customer acquisition cost. [ChartMogul's LTV guide](https://chartmogul.com/saas-metrics/ltv/) defines it the same way. Payback is a separate number that measures time.
+
+<Formula title="The ratio and the payback months">
+
+LTV:CAC = lifetime gross profit ÷ CAC.
+
+Payback months, monthly inputs = CAC ÷ monthly gross profit.
+
+Payback months, yearly inputs = CAC ÷ (yearly gross profit ÷ 12).
+
+</Formula>
+
+The yearly version assumes gross profit arrives evenly through the year. A big upfront payment, a late invoice, or a refund changes when cash arrives, but not this number. Payback here counts months of gross profit, not the date the money reaches your bank.
+
+If you entered LTV directly, you get the ratio only. Without a monthly gross profit, there's no payback to work out.
+
+## Is a 3:1 LTV to CAC ratio good?
+
+You'll often hear that it is, but the calculator doesn't grade your ratio. [Stripe's CAC guide](https://stripe.com/resources/more/cac-in-saas) says SaaS businesses generally aim for 3:1. It calls 1:1 breaking even and 4:1 or more highly efficient, possibly underinvesting in growth. ChartMogul's guide says to aim for LTV of at least three times CAC. These are rules of thumb. The same Stripe guide says there's no universal CAC benchmark across SaaS.
+
+This calculator doesn't color the result or tell you to spend more or less. The ratio can't see your cash on hand, how fast gross profit comes back, or whether both numbers describe the same customers.
+
+## How is payback different from the ratio?
+
+Payback uses the cost and one period of gross profit. Churn isn't part of it. The ratio does use churn, because lifetime gross profit does. So churn can move the ratio a lot without changing payback.
+
+With $50 of monthly ARPA, an 80% margin, and a $400 CAC, monthly gross profit is $40.00, so payback is 10.0 months at any churn:
+
+| Monthly customer churn | Lifetime gross profit | Ratio | Payback |
+| --- | --- | --- | --- |
+| 3% | $1,333.33 | 3.33:1 | 10.0 months |
+| 0.5% | $8,000.00 | 20.00:1 | 10.0 months |
+| 0% | Not estimable | Not estimable | 10.0 months |
+
+The 20.00:1 ratio still takes 10.0 months of gross profit to cover $400. A high ratio here means customers stay longer in the model. It doesn't mean the money comes back faster.
+
+Straight-line payback also ignores customers who leave before the cost is covered. The [CAC payback calculator](/cac-payback-calculator) counts them and finds the month a group of customers actually covers its cost, or shows that it never does.
+
+## When does the model say the cost never comes back?
+
+When lifetime gross profit is equal to or less than CAC. In this model, a group's gross profit keeps adding up but never quite reaches the lifetime total while any customers are still paying. So the lifetime total has to be above the cost, not equal to it.
+
+Take $50 of monthly ARPA, an 80% margin, and 5% monthly churn. Lifetime gross profit is $800.00. A CAC of $800.00 gives a ratio of 1.00:1 and a payback of 20.0 months. The result also says `At this churn, a group of new customers never earns back CAC.` Both show at once, because the 20.0 months ignore customers who leave and the warning counts them.
+
+There's one exception. At 100% churn, every customer pays one period and leaves, so the full amount arrives at once and equal is enough. With the same $50 and 80% margin, lifetime gross profit is $40.00. A CAC of $40.00 gives 1.00:1, a payback of 1.0 month, and no warning. A CAC of $40.01 brings the warning back.
+
+The warning comes from the model, not from customers you've tracked. It doesn't appear when there's no ratio.
+
+## Why does the CAC choice change the label?
+
+So you can't mistake a partial cost for the full one. `All acquisition costs` labels the result `LTV:CAC`. `Paid media only` labels it `LTV to paid media CAC` and adds that pay, tools, agencies, and other acquisition costs are left out.
+
+<Warning title="Paid media alone makes customers look cheaper">
+
+The same $1,333.33 against a $150 paid-media cost is 8.89:1, with payback of 3.8 months. Lifetime value didn't change. The cost shrank because pay, tools, and agencies were left out. Don't read 8.89:1 as the full cost of winning those customers.
+
+</Warning>
+
+Stripe's guide builds CAC from all sales and marketing costs, not ad spend alone. If your lifetime value covers every new customer, compare it with the cost of winning all of them. If you use the paid-media cost, keep the narrower label.
+
+## When is there no ratio?
+
+The result shows a short phrase instead of a ratio. Payback can still have an answer, because it needs different inputs.
+
+| What you entered | The ratio says | Payback says |
+| --- | --- | --- |
+| CAC of exactly 0 | `No CAC to compare` | No payback line. The result says there's nothing to divide by. |
+| Churn of 0, CAC above 0, margin above 0 | `Not estimable` | The straight-line months. |
+| Negative margin, CAC above 0 | `LTV below zero` | Never, because each customer loses money. |
+| Margin of 0, CAC above 0 | `0.00:1` | Never, because gross profit per customer is $0.00. |
+| Your own LTV, CAC above 0 | The ratio | No payback line. |
+
+<Note title="A zero cost is checked first">
+
+If CAC is exactly 0, the result says `No CAC to compare`, even when churn is also 0 or the margin is negative. A small cost that shows as `Under $0.01` is still above zero, so the ratio is still calculated.
+
+</Note>
+
+If churn is 0 and the margin is 0 or negative, the ratio is `Not estimable` and payback is never.
+
+## What has to match on both sides?
+
+The ratio divides one amount by another, so both must describe the same customers in the same way.
+
+- The same customer unit. Don't divide a company account's yearly value by a per-user monthly cost.
+- The same currency. Convert before you type.
+- The same group. Lifetime value for all new customers divided by the ad cost of only some of them makes ads look cheaper than they are.
+- The same period, when you build LTV. Don't mix monthly ARPA with yearly churn.
+- The same cost scope. If you change `CAC includes`, check the new label before comparing with another scenario.
+
+A company-wide ratio can hide a channel that doesn't cover its cost. Put that channel in the second scenario with its own value and cost. The result then says whether its ratio is higher, lower, or the same, and whether payback is sooner, later, or the same. Those comparisons appear only when both scenarios have a number.
+
+## What this comparison doesn't decide
+
+It doesn't tell you to spend more because the ratio is high, or less because it's low. It doesn't know your cash, your capacity, or which costs you left out.
+
+Related tools:
+
+- [Customer acquisition cost calculator](/customer-acquisition-cost-calculator): build CAC from ads, pay, tools, agencies, shared costs, and your own time.
+- [Customer lifetime value calculator](/customer-lifetime-value-calculator): see how much of the lifetime estimate arrives by year 5.
+- [CAC payback calculator](/cac-payback-calculator): find the month a shrinking group covers its cost.
+- [Break-even MRR calculator](/break-even-mrr-calculator): the monthly recurring revenue that covers your running costs.
+- [SaaS metrics calculator](/saas-metrics-calculator): a quick snapshot of one month.
diff --git a/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/intro.mdx
new file mode 100644
index 00000000..5b529bca
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Compare the gross profit you expect from a customer with what it cost to win them. If you build lifetime value from price, margin, and churn, you also see how many months of gross profit it takes to cover that cost.
+
+Have both numbers for the same customers, and know whether your cost covers all acquisition spending or paid ads only.
diff --git a/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/usage.mdx
new file mode 100644
index 00000000..1cfc074c
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/ltv-cac-calculator/content/usage.mdx
@@ -0,0 +1,29 @@
+## What to enter
+
+Choose how to get lifetime value (LTV):
+
+- `ARPA, margin, and churn` builds it for you. ARPA is average revenue per customer. Pick `Per month` or `Per year`, and enter revenue and churn for that same period. Switching doesn't convert what you typed. The [customer lifetime value calculator](/customer-lifetime-value-calculator) explains this estimate, including why monthly churn times 12 isn't yearly churn.
+- `Enter LTV` takes a lifetime gross profit you already have, not lifetime revenue. This choice has no payback line, because a single total doesn't say how much gross profit arrives each month.
+
+Choose how to get customer acquisition cost (CAC):
+
+- `Enter CAC` takes a cost per customer you already worked out.
+- `From spend and new customers` divides acquisition spend by new paying customers. The count must be at least 1. For a period with no new customers, use the [customer acquisition cost calculator](/customer-acquisition-cost-calculator).
+
+`CAC includes` has no default, so you have to pick one. `All acquisition costs` means ads, sales and marketing pay, tools, and agencies. `Paid media only` means ad spend alone. The result's label follows your choice.
+
+Use the same customers and the same currency on both sides. The currency menu changes the symbol only. A value in euros divided by a cost in dollars still gives a ratio, but it's wrong.
+
+`Compare a second scenario` puts two channels, plans, or cost choices side by side. Each scenario has its own value and cost.
+
+Blank is not zero. Type digits with up to two decimal places. Only gross margin accepts a minus sign. Don't type `$` or commas.
+
+## How to read the result
+
+The top line is the ratio, or a short reason there isn't one. When you built LTV from ARPA, margin, and churn, the next line is payback in months of gross profit. A warning line appears only when this churn model says a group of new customers never earns the cost back.
+
+<Example title="$50 a month, 80% margin, 3% monthly churn, $400 CAC">
+
+With `All acquisition costs` chosen, gross profit is $40.00 a month and lifetime gross profit is $1,333.33. The ratio is $1,333.33 ÷ $400.00 = 3.33:1. Payback is $400.00 ÷ $40.00 = 10.0 months. There's no warning, because $1,333.33 is more than $400.00.
+
+</Example>
diff --git a/app/(site)/(tools)/(saas)/ltv-cac-calculator/page.tsx b/app/(site)/(tools)/(saas)/ltv-cac-calculator/page.tsx
index e8919f1c..c0fd49d5 100644
--- a/app/(site)/(tools)/(saas)/ltv-cac-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/ltv-cac-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ChartColumn } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { LtvCacCalculator } from "./ltv-cac-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function LtvCacCalculatorPage() {
   const toolPage = await getRequiredToolPage("ltv-cac-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<ChartColumn strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<ChartColumn strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <LtvCacCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-backend-keywords-builder/content/article.mdx b/app/(site)/(tools)/kdp-backend-keywords-builder/content/article.mdx
new file mode 100644
index 00000000..718177ed
--- /dev/null
+++ b/app/(site)/(tools)/kdp-backend-keywords-builder/content/article.mdx
@@ -0,0 +1,32 @@
+## How does the builder fill the seven fields?
+
+It takes your phrases in order and puts each in the first field with room, counting one space between phrases. A short phrase lower on your list can still land in field 1. It doesn't score, reorder, or reword anything. To change a field, edit your list and build again.
+
+## What does KDP say about keywords?
+
+KDP allows up to seven keywords or short phrases. Its [keyword guidance](https://kdp.amazon.com/en_US/help/topic/G201298500) and [metadata guidelines](https://kdp.amazon.com/en_US/help/topic/G201097560) suggest phrases of about two to three words, in the order people search: "military science fiction", not "fiction science military". KDP also suggests looking at what Amazon's search box suggests as you type.
+
+KDP asks you to leave out:
+
+- Words already in your title, other book details, or categories.
+- Quality claims like "best novel ever" and time-sensitive words like "new" or "on sale".
+- Words that fit most books, like "book".
+- Misspellings, and variants that differ only in spacing, punctuation, capitals, or plurals.
+- Other authors' names, or brands you aren't allowed to use.
+- Amazon program names like Kindle Unlimited, quotation marks, and HTML.
+
+The builder catches duplicates with the same word sequence after lowercasing, replacing punctuation with spaces, and collapsing repeated spaces. Joined and separated forms such as `80GB` and `80 GB` aren't treated as duplicates. It also checks overlap with the details you enter, quotation marks, HTML, and a few program and promotional words. It doesn't catch plurals, misspellings, other authors' names, or phrases that don't fit your book.
+
+## Is each KDP keyword field 50 characters?
+
+KDP's help doesn't give a number. It says to watch the limit shown in the text field. Many guides say 50, so the builder starts there. Set the cap to what your form shows.
+
+## Should a word appear in only one field?
+
+KDP's cited help pages don't state a separate one-use-per-word rule. The builder points out repeats so you can review how you use the space.
+
+## What the builder doesn't do
+
+It doesn't suggest phrases, search Amazon, measure demand, or predict ranking or sales. It can't tell if you're allowed to use a name or brand.
+
+Next, check the whole listing with the [KDP metadata checker](/kdp-metadata-checker). To see whether your title already uses your main phrases, try the [KDP book title analyzer](/kdp-book-title-analyzer).
diff --git a/app/(site)/(tools)/kdp-backend-keywords-builder/content/intro.mdx b/app/(site)/(tools)/kdp-backend-keywords-builder/content/intro.mdx
new file mode 100644
index 00000000..897b8495
--- /dev/null
+++ b/app/(site)/(tools)/kdp-backend-keywords-builder/content/intro.mdx
@@ -0,0 +1 @@
+Paste your keyword phrases, one per line, and get seven KDP keyword fields ready to copy. The builder removes duplicates and keeps every phrase whole. It doesn't suggest keywords, so bring your own list with the most important phrases first.
diff --git a/app/(site)/(tools)/kdp-backend-keywords-builder/content/usage.mdx b/app/(site)/(tools)/kdp-backend-keywords-builder/content/usage.mdx
new file mode 100644
index 00000000..532fbc1b
--- /dev/null
+++ b/app/(site)/(tools)/kdp-backend-keywords-builder/content/usage.mdx
@@ -0,0 +1,28 @@
+## What to enter
+
+- Candidate phrases. One phrase per line, most important first. Use up to 100 nonblank lines, with no phrase over 200 characters. Order decides which field a phrase goes in. A comma stays part of its phrase.
+- Planning cap. The most characters per field, from 10 to 200. It starts at 50. KDP doesn't publish a number, so match the limit your KDP form shows.
+- Title, subtitle, and category labels. Optional. The builder flags phrases whose words longer than two characters already appear in your title, subtitle, or category labels. They don't change placement.
+
+## How to read the result
+
+The first line says how many phrases were placed. Each field shows its text, its length against your cap, and a copy button. Below the fields:
+
+| Section | What it means |
+| --- | --- |
+| Omitted duplicate phrases | Same word sequence as an earlier line after lowercasing, replacing punctuation with spaces, and collapsing repeated spaces. |
+| Needs edit | A line with no letters or numbers. |
+| Not placed | Longer than your cap, or no field had room. Phrases are never cut. A cleaned phrase over 200 characters stops the whole submission. |
+| KDP guidance signals | Quotation marks, HTML, or words like `free`, `bestseller`, or `Kindle Unlimited`. |
+| Local organization prompts | A phrase of one word or more than three, a word longer than two characters, excluding common words such as `the`, repeated across placed phrases, or a phrase your title or categories already cover. |
+
+<Example title="Six lines, cap of 50">
+
+Lines: `cozy cat mystery`, `small town secrets`, `amateur sleuth`, `Cozy, cat mystery`, `women sleuths`, `cat lover gifts for mystery readers`.
+
+- Field 1: `cozy cat mystery small town secrets amateur sleuth`, 50 of 50.
+- Field 2: `women sleuths cat lover gifts for mystery readers`, 49 of 50.
+- Line 4 is left out because it repeats line 1.
+- Prompts: line 6 has six words, and `cat` and `mystery` appear in two phrases.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-backend-keywords-builder/page.tsx b/app/(site)/(tools)/kdp-backend-keywords-builder/page.tsx
index 59eecdb3..1643742e 100644
--- a/app/(site)/(tools)/kdp-backend-keywords-builder/page.tsx
+++ b/app/(site)/(tools)/kdp-backend-keywords-builder/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Tags } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpBackendKeywordsBuilder } from "./kdp-backend-keywords-builder";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpBackendKeywordsBuilderPage() {
   const toolPage = await getRequiredToolPage("kdp-backend-keywords-builder");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Tags strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Tags strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpBackendKeywordsBuilder />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-book-description-formatter/content/article.mdx b/app/(site)/(tools)/kdp-book-description-formatter/content/article.mdx
new file mode 100644
index 00000000..c4e98e88
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-description-formatter/content/article.mdx
@@ -0,0 +1,35 @@
+## Which HTML tags does KDP allow in a description?
+
+KDP's [description guidance](https://kdp.amazon.com/en_US/help/topic/G201189630) lists these, and the formatter keeps only these:
+
+| Tag | Does |
+| --- | --- |
+| `<p>` | Paragraph |
+| `<br>` | Line break |
+| `<b>` | Bold |
+| `<i>`, `<em>` | Italic |
+| `<u>` | Underline |
+| `<h4>`, `<h5>`, `<h6>` | Heading |
+| `<ul>`, `<ol>`, `<li>` | Bulleted or numbered list |
+
+`<h1>`, `<h2>`, and `<h3>` aren't supported.
+
+## What happens to bold and unsupported headings?
+
+The formatter converts `<strong>` to `<b>` and `<h1>` to `<h3>` to `<h4>`. It keeps the bold and heading boundaries and lists each conversion under What changed. Other unsupported wrappers lose their tags but keep their text.
+
+## Does KDP's 4,000-character limit include HTML?
+
+Yes. Every tag counts. A bulleted list of 10 items adds 99 characters of tags before any text. Some characters cost extra too: `&` becomes `&amp;`, five characters, and `<` becomes `&lt;`, four.
+
+The formatter counts Unicode characters. KDP doesn't say how it counts emoji or accented letters, so check KDP's own counter after you paste. Above 4,000, the formatter tells you how far over you are and holds back the copy button.
+
+## Does formatting check what the description says?
+
+No. It only cleans the HTML. KDP's [metadata guidelines](https://kdp.amazon.com/en_US/help/topic/G201097560) also rule out contact details and links, reviews and quotes, requests for reviews, ads, time-limited offers, and spoilers. Paste your result into the [KDP metadata checker](/kdp-metadata-checker), which flags links, email addresses, review requests, and promotional words.
+
+## What if KDP still shows an error?
+
+If KDP says the description has invisible characters, they likely came from copying out of a document. The formatter removes zero-width spaces, U+200B, word joiners, U+2060, and byte order marks, U+FEFF. It records these changes and rejects output with no visible text. It preserves other Unicode formatting characters, so cleanup may not fix every hidden-character error. KDP's [troubleshooting page](https://kdp.amazon.com/en_US/help/topic/GC4VASCGNQP6LQ7L) suggests typing the description in by hand or checking the source for unsupported HTML.
+
+After you save, look at the description on your KDP listing. Your text stays in your browser and isn't sent to a formatting service.
diff --git a/app/(site)/(tools)/kdp-book-description-formatter/content/intro.mdx b/app/(site)/(tools)/kdp-book-description-formatter/content/intro.mdx
new file mode 100644
index 00000000..95cf6a8f
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-description-formatter/content/intro.mdx
@@ -0,0 +1 @@
+Paste your book description as plain text or HTML and get clean HTML that uses only the tags KDP supports. You see what changed, the count against KDP's 4,000-character limit, and a preview. Then copy the HTML into KDP.
diff --git a/app/(site)/(tools)/kdp-book-description-formatter/content/usage.mdx b/app/(site)/(tools)/kdp-book-description-formatter/content/usage.mdx
new file mode 100644
index 00000000..c58ce1e3
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-description-formatter/content/usage.mdx
@@ -0,0 +1,23 @@
+## Plain text or HTML source?
+
+| Input format | Use it for | What happens |
+| --- | --- | --- |
+| Plain text | Text you typed or copied | A blank line starts a new paragraph. A single line break becomes `<br>`. Characters like `<` and `&` stay visible. Extra spaces are trimmed. |
+| HTML source | Text that already has tags | KDP's tags stay. `<strong>` becomes `<b>`, and `<h1>` to `<h3>` become `<h4>`. Attributes like `class` and `style` go. Other tags go but their text stays. Scripts, images, embedded media, and comments are dropped. |
+
+## How to read the result
+
+- Generated HTML. What you paste into KDP. You can copy it at 4,000 characters or fewer.
+- Local character counts. The HTML, the visible text, and the difference, called source overhead. That's what the tags and escaped characters add.
+- What changed. Each kind of cleanup, like tags removed or spaces trimmed.
+- Approximate preview. A rough look at the layout. Amazon's page can differ.
+
+Unclosed or mismatched formatting tags stop formatting. Scripts and other dropped-content blocks are discarded instead. Fix formatting tags and format again.
+
+<Example title="Bold that stays">
+
+HTML source `<p>Grow <strong>fresh herbs</strong> &amp; greens.</p>` becomes `<p>Grow <b>fresh herbs</b> &amp; greens.</p>`. That's 44 characters, 26 visible.
+
+KDP doesn't support `<strong>`, so the formatter converts it to `<b>` and records the change. The bold stays.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-book-description-formatter/page.tsx b/app/(site)/(tools)/kdp-book-description-formatter/page.tsx
index 047443d2..fd0b524f 100644
--- a/app/(site)/(tools)/kdp-book-description-formatter/page.tsx
+++ b/app/(site)/(tools)/kdp-book-description-formatter/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileText } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpBookDescriptionFormatter } from "./kdp-book-description-formatter";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpBookDescriptionFormatterPage() {
   const toolPage = await getRequiredToolPage("kdp-book-description-formatter");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileText strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileText strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpBookDescriptionFormatter />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-book-setup-calculator/content/article.mdx b/app/(site)/(tools)/kdp-book-setup-calculator/content/article.mdx
new file mode 100644
index 00000000..454064b5
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-setup-calculator/content/article.mdx
@@ -0,0 +1,58 @@
+## How is KDP cover size calculated?
+
+A paperback cover is the back, spine, and front side by side, plus 0.125 in of bleed on each outer edge. Bleed is extra image that gets trimmed off, so no white line shows at the edge.
+
+<Formula title="Paperback cover size">
+
+Spine: `page count × paper thickness`
+
+Width: `0.125 + trim width + spine + trim width + 0.125`
+
+Height: `0.125 + trim height + 0.125`
+
+</Formula>
+
+| Ink and paper | Thickness per page |
+| --- | --- |
+| Black and white on white, or standard color | 0.002252 in |
+| Black and white on cream | 0.0025 in |
+| Premium color | 0.002347 in |
+| Black and white on groundwood | 0.00235 in |
+
+KDP's [paperback cover guide](https://kdp.amazon.com/en_US/help/topic/G201953020) lists the white, cream, and color multipliers. Its [paperback submission guidelines](https://kdp.amazon.com/en_US/help/topic/G201857950) list groundwood.
+
+Use at least 80 effective pages for spine text. KDP's guide has conflicting wording about 79 pages, and [Cover Creator](https://kdp.amazon.com/en_US/help/topic/G201113520) requires 80.
+
+## What margins does KDP require?
+
+The inside margin, next to the spine, grows with page count so text doesn't disappear into the binding.
+
+| Pages | Inside margin |
+| --- | --- |
+| 24 to 150 | 0.375 in |
+| 151 to 300 | 0.5 in |
+| 301 to 500 | 0.625 in |
+| 501 to 700 | 0.75 in |
+| 701 to 828 | 0.875 in |
+
+Outside, top, and bottom margins are 0.25 in, or 0.375 in with bleed. These are the least KDP allows in its [paperback submission guidelines](https://kdp.amazon.com/en_US/help/topic/G201857950), not a design recommendation.
+
+One page can move you into the next band. A 300-page book needs a 0.5 in inside margin, but 301 pages rounds up to 302 and needs 0.625 in.
+
+## What does interior bleed change?
+
+Each page gets 0.125 in wider and 0.25 in taller, so a 6 × 9 in book needs 6.125 × 9.25 in pages. Width grows on the outside edge only, because the bound edge isn't trimmed. See KDP's [bleed and trim guide](https://kdp.amazon.com/en_US/help/topic/GVBQ3CMEQW3W2VL6).
+
+## Why is the hardcover size an estimate?
+
+KDP documents the parts of a hardcover cover, a 0.51 in wrap around the board and a 0.4 in hinge beside the spine, but not one formula for the full size. It sends you to its cover calculator instead. See KDP's [hardcover cover guide](https://kdp.amazon.com/en_US/help/topic/GDTKFJPNQCBTMRV6).
+
+This calculator adds the wrap and hinge to both sides and uses paperback paper thickness for the spine. For a 300-page 6 × 9 in hardcover with black ink on white paper, that's about 14.4956 × 10.02 in. Get the final size from [KDP's cover calculator](https://kdp.amazon.com/cover-calculator) before you design.
+
+## What doesn't this calculator check?
+
+It uses KDP's US print specs, rechecked on October 4, 2026, and runs in your browser. It doesn't read your files or decide whether KDP will accept your book. Next steps:
+
+- Check your exported PDF with the [KDP PDF preflight checker](/kdp-pdf-preflight-checker).
+- Check that your images are sharp enough with the [KDP image DPI checker](/kdp-image-dpi-checker).
+- Set your price with the [KDP royalty calculator](/kdp-royalty-calculator).
diff --git a/app/(site)/(tools)/kdp-book-setup-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-book-setup-calculator/content/intro.mdx
new file mode 100644
index 00000000..f00e702a
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-setup-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Get the full cover size, spine width, page size, and minimum margins for a KDP paperback or hardcover, in inches, millimeters, and pixels. Have your trim size, ink, paper, and final page count ready. No final page count yet? Use the [KDP page count estimator](/kdp-page-count-estimator) first.
diff --git a/app/(site)/(tools)/kdp-book-setup-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-book-setup-calculator/content/usage.mdx
new file mode 100644
index 00000000..6f550e38
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-setup-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+- Page count. Use your final interior file's page count, blank pages included. Odd counts round up to the next even number, and that number sets the margins, spine, and page range check.
+- Interior has bleed. Tick it only if something in your interior, like a photo or background color, runs off the page edge. The cover always has bleed either way.
+- DPI. Changes only the pixel column. Use 300 for KDP.
+- Reading direction. Right to left swaps the back and front panels. It doesn't check whether KDP prints your language that way.
+
+## How to read the result
+
+- **Cover file** is the full size of your cover PDF. It's exact for a paperback and an estimate for a hardcover.
+- **Margins** are the smallest KDP allows for this setup.
+- **Page range** says whether the even page count fits KDP's range for this trim, ink, and paper. Outside it, you still get dimensions, but KDP won't print that setup.
+- **Copy setup receipt** copies the key numbers as text, ready to send to a cover designer.
+
+<Example title="A 300-page 6 × 9 in paperback">
+
+Black and white on white paper, no interior bleed. The spine is 300 × 0.002252 = 0.6756 in. The cover is 0.125 + 6 + 0.6756 + 6 + 0.125 = 12.9256 in wide and 9 + 0.25 = 9.25 in tall, or 3878 × 2775 pixels at 300 DPI. The inside margin is 0.5 in, and the other margins are 0.25 in.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-book-setup-calculator/page.tsx b/app/(site)/(tools)/kdp-book-setup-calculator/page.tsx
index 56870dd0..238be7d7 100644
--- a/app/(site)/(tools)/kdp-book-setup-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-book-setup-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Ruler } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpBookSetupCalculator } from "./kdp-book-setup-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpBookSetupCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-book-setup-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Ruler strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Ruler strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpBookSetupCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-book-title-analyzer/content/article.mdx b/app/(site)/(tools)/kdp-book-title-analyzer/content/article.mdx
new file mode 100644
index 00000000..8a8f6290
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-title-analyzer/content/article.mdx
@@ -0,0 +1,27 @@
+## How does the analyzer match words?
+
+It matches exact words, ignoring capitals and punctuation. It doesn't know synonyms, plurals, or word endings, so `balcony` doesn't match `balconies` and `grow` doesn't match `growing`. A target phrase matches only when its words appear together, in order, in one field.
+
+## How long can a KDP title and subtitle be?
+
+Keep them under 200 characters together. At exactly 200, KDP's own pages disagree. The [metadata guidelines](https://kdp.amazon.com/en_US/help/topic/G201097560) say "fewer than 200 characters", and the [titles and editions page](https://kdp.amazon.com/en_US/help/topic/GW7J4WEKBVU25YEC) says "200 characters or less".
+
+The analyzer warns at 200 and flags anything over it. The [KDP metadata checker](/kdp-metadata-checker) follows the stricter rule and flags 200 too.
+
+<Note title="Counts can differ from KDP's">
+
+The analyzer counts every character, including spaces and punctuation, plus one for the gap between title and subtitle. KDP doesn't say how it counts emoji or accented letters. Aim for 199 or fewer.
+
+</Note>
+
+## What can't you put in a KDP title?
+
+KDP's [titles and editions page](https://kdp.amazon.com/en_US/help/topic/GW7J4WEKBVU25YEC) rules out repeated generic keywords like "notebook" or "gifts", others' titles, names, or trademarks without permission, sales rank claims like "bestselling", promotional words like "free", placeholder text like "n/a", a title that's only punctuation, and HTML.
+
+Your title must also match your cover and be the same across paperback, hardcover, and eBook. The analyzer checks only for HTML and a title with no letters or numbers. The metadata checker also flags promotional words.
+
+## Will a keyword in my title help my book rank?
+
+No one can promise that. KDP says it [can't guarantee top search placement](https://kdp.amazon.com/en_US/help/topic/GATLM5TG2NFRXQ89), and that order depends on things like past sales, availability, time listed, and popularity. The analyzer shows which words your title uses. It can't predict clicks, rank, or sales.
+
+Put the phrases that didn't fit your title into the [KDP backend keywords builder](/kdp-backend-keywords-builder), then check the whole listing with the [KDP metadata checker](/kdp-metadata-checker).
diff --git a/app/(site)/(tools)/kdp-book-title-analyzer/content/intro.mdx b/app/(site)/(tools)/kdp-book-title-analyzer/content/intro.mdx
new file mode 100644
index 00000000..374a227a
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-title-analyzer/content/intro.mdx
@@ -0,0 +1 @@
+See which words from your book's topic, your reader, and your target phrases appear in your title and subtitle. You also get the length against KDP's 200-character limit plus adjacent repeated words and two-word phrases shared by your title and subtitle. There's no score. Have a sentence about what your book covers ready.
diff --git a/app/(site)/(tools)/kdp-book-title-analyzer/content/usage.mdx b/app/(site)/(tools)/kdp-book-title-analyzer/content/usage.mdx
new file mode 100644
index 00000000..a0834f16
--- /dev/null
+++ b/app/(site)/(tools)/kdp-book-title-analyzer/content/usage.mdx
@@ -0,0 +1,30 @@
+## What to enter
+
+Only the title is required. Add any of these to compare your title against:
+
+- Book topic. A sentence on what the book covers.
+- Intended reader. Who it's for, like `apartment gardeners`.
+- Target phrases. Up to three, one per line, with at most 80 characters each.
+
+Without those details, you still get counts, repetition prompts, and the supported title-rule checks.
+
+## How to read the result
+
+| Result | What it means |
+| --- | --- |
+| Found in title or subtitle | Topic or reader words your title uses. Small words like "the" are skipped. |
+| Only in supplied context | Topic or reader words it doesn't use. That's a cue to reread, not a word you must add. |
+| Target phrase matches | Title, Subtitle, Both fields, or Not found. |
+| Local counts | Words and characters per field, and the combined count out of 200. |
+| Prompts | A word repeated twice in a row, a two-word phrase in both fields, HTML, a title with no letters or numbers, or 200 or more characters. |
+
+<Example title="Balcony Herbs">
+
+Title `Balcony Herbs`, subtitle `Growing Food in Small Spaces`, topic `Grow herbs on apartment balconies and small patios`, reader `Apartment gardeners`, target phrases `balcony herbs` and `urban gardening`.
+
+- Topic words found: `herbs`, `small`. Only in the topic: `grow`, `apartment`, `balconies`, `patios`.
+- Reader words found: none.
+- `balcony herbs` is in the title. `urban gardening` isn't found.
+- 42 of 200 characters, no prompts.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-book-title-analyzer/page.tsx b/app/(site)/(tools)/kdp-book-title-analyzer/page.tsx
index 522955c7..be9399ca 100644
--- a/app/(site)/(tools)/kdp-book-title-analyzer/page.tsx
+++ b/app/(site)/(tools)/kdp-book-title-analyzer/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { BookSearch } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpBookTitleAnalyzer } from "./kdp-book-title-analyzer";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpBookTitleAnalyzerPage() {
   const toolPage = await getRequiredToolPage("kdp-book-title-analyzer");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<BookSearch strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<BookSearch strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpBookTitleAnalyzer />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-break-even-acos-calculator/content/article.mdx b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/article.mdx
new file mode 100644
index 00000000..4f0f600f
--- /dev/null
+++ b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/article.mdx
@@ -0,0 +1,37 @@
+## How do I work out my maximum CPC for book ads?
+
+Subtract the profit you want from your royalty, then multiply by your purchase rate.
+
+<Formula title="Maximum CPC">
+
+`(royalty per sale - amount you want to keep) × purchase rate`
+
+</Formula>
+
+The purchase rate goes in as a decimal here, so 10% is 0.10. The calculator rounds down to the cent, so the maximum never goes past your target. If your CPC is above it, you need a lower CPC, a higher purchase rate, or a lower target.
+
+## Is ACoS the same as profit?
+
+No. Amazon Ads [defines ACoS](https://advertising.amazon.com/library/guides/acos-advertising-cost-of-sales) as ad spend ÷ ad sales × 100. Ad sales are what customers paid. Your profit comes from your royalty, which is only part of that.
+
+A 20% ACoS can be fine for one book and a loss for another. It depends on how much of the price you keep. That's why this calculator starts from your royalty, and shows ACoS only when you enter a sales value.
+
+With a target of $0.00, the ACoS ceiling is your break-even ACoS: royalty ÷ sales value. The [KDP royalty calculator](/kdp-royalty-calculator) shows the same figure, using your list price as the sales value.
+
+## Why does the result say my target can't be met?
+
+There are three cases, and each has a different fix.
+
+| What you see | What it means | What to try |
+| --- | --- | --- |
+| No positive CPC at 0% purchases | With no sales from clicks, any click cost is a loss. | Enter the purchase rate you expect, even a low one. |
+| Target exceeds royalty | You want to keep more than KDP pays you, even with free clicks. If the target equals your royalty, the maximum CPC is $0.00. | Lower the target, or raise your price. |
+| Minimum purchase rate: Above 100%, unattainable | The CPC you entered is too high for any purchase rate. The maximum CPC above it still shows what would work. | Lower the CPC or the target. |
+
+A blank required box or a number like `1,00` or `10%` gives a field error. The optional sales-value box can stay blank. Fix it and check again.
+
+## Which numbers should I use from my ads report?
+
+For a past campaign, use its average CPC, purchases, and sales from your Amazon Ads report. Amazon counts a purchase as coming from an ad within a set time window, so your purchase rate follows its rules. See Amazon Ads' [metric guide](https://advertising.amazon.com/en-us/library/guides/basics-of-success-understanding-amazon-advertising) and [purchase rate definition](https://advertising.amazon.com/help/GLPHMX59DC5WSSQW).
+
+The calculator doesn't connect to your ads account. It also leaves out money an ad can bring in later, like sales of the next book in a series, Kindle Unlimited page reads, or extra sales that don't come through ads. It also leaves out taxes and refunds. If your book is in Kindle Unlimited, estimate those reads with the [Kindle Unlimited KENP earnings calculator](/kindle-unlimited-kenp-earnings-calculator). For more on running ads for a book, see Amazon's [Sponsored Products guide for authors](https://advertising.amazon.com/library/guides/authors-guide-to-sponsored-products).
diff --git a/app/(site)/(tools)/kdp-break-even-acos-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/intro.mdx
new file mode 100644
index 00000000..7a30bbdc
--- /dev/null
+++ b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Find the highest average cost per click (CPC) your Amazon book ads can pay and still leave the profit you want from each sale. Have your royalty per sale ready, plus a purchase rate and CPC from your ads report or your best guess.
diff --git a/app/(site)/(tools)/kdp-break-even-acos-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/usage.mdx
new file mode 100644
index 00000000..c7602e0a
--- /dev/null
+++ b/app/(site)/(tools)/kdp-break-even-acos-calculator/content/usage.mdx
@@ -0,0 +1,25 @@
+## What to enter
+
+| Box | What goes in it |
+| --- | --- |
+| Net royalty per sale | What KDP pays you for one copy, before ads. Get it from the [KDP royalty calculator](/kdp-royalty-calculator). To cover other per-copy costs too, subtract them first. |
+| Desired amount left per sale | What you want to keep from each ad sale after paying for clicks. `$0.00` means break even. |
+| Assumed purchase rate | Purchases ÷ clicks, as a percent. Type `10` for 10%, without the % sign. |
+| CPC to check | Your average cost per click: ad spend ÷ clicks. Enter average CPC, not your base bid. Amazon can raise the base bid through dynamic bidding and bid adjustments. |
+| Ad-attributed sales value per purchase | Optional. It turns on ACoS. Enter ad-attributed sales divided by ad-attributed purchases for the same campaign and date range. Use sales value, not royalty. |
+
+Use your own ads report for a campaign that's already running. For a new campaign, the purchase rate is a guess, so treat the result as one too.
+
+## How to read the result
+
+- Maximum CPC. The highest average CPC that leaves your target, rounded down to the cent.
+- Meets target or Misses target. The verdict for the CPC you entered.
+- Modeled amount left per attributed sale. What you keep after click costs.
+- Minimum purchase rate at entered CPC. How often clicks must turn into sales for that CPC to work.
+- Modeled click cost per attributed sale. CPC ÷ purchase rate. On average, that's what you pay in clicks to make one sale.
+
+<Example title="A $4.39 royalty and a $1.00 target">
+
+At a 10% purchase rate, you can spend $3.39 on clicks per sale. That's a maximum CPC of $0.33. At a $0.30 CPC, ten clicks cost $3.00, leaving $1.39, so it meets the target. That CPC needs at least an 8.85% purchase rate. With a $14.99 sales value, your ACoS is 20.0%, under the 22.6% ceiling for your target.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-break-even-acos-calculator/page.tsx b/app/(site)/(tools)/kdp-break-even-acos-calculator/page.tsx
index 957131fa..9e496184 100644
--- a/app/(site)/(tools)/kdp-break-even-acos-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-break-even-acos-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Gauge } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpBreakEvenAcosCalculator } from "./kdp-break-even-acos-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpBreakEvenAcosCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-break-even-acos-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Gauge strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Gauge strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpBreakEvenAcosCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-image-dpi-checker/content/article.mdx b/app/(site)/(tools)/kdp-image-dpi-checker/content/article.mdx
new file mode 100644
index 00000000..9048c486
--- /dev/null
+++ b/app/(site)/(tools)/kdp-image-dpi-checker/content/article.mdx
@@ -0,0 +1,45 @@
+## How is effective DPI calculated?
+
+Divide the image's pixels by the inches it fills, once for each side. The lower answer is the effective DPI.
+
+<Formula title="Effective DPI">
+
+`pixel width ÷ printed width in inches`
+
+`pixel height ÷ printed height in inches`
+
+Use the lower of the two.
+
+</Formula>
+
+KDP's [image guide](https://kdp.amazon.com/en_US/help/topic/G202169030) uses the same math. Centimeters and millimeters are converted to inches first. To convert pixel sizes without a file, use the [pixels to print size calculator](/pixels-to-print-size-calculator).
+
+## What DPI does KDP need for print?
+
+KDP asks for at least 300 DPI and calls anything under 200 DPI low resolution.
+
+| Effective DPI | What the checker says |
+| --- | --- |
+| 300 or more | Meets the 300 DPI target |
+| 200 to just under 300 | Below the target |
+| Under 200 | Low resolution |
+
+The 300 DPI minimum and a suggested 600 DPI maximum are in KDP's [paperback submission guidelines](https://kdp.amazon.com/en_US/help/topic/G201857950). The 200 DPI line is in its [image guide](https://kdp.amazon.com/en_US/help/topic/G202169030). Above 600 DPI, the checker adds a note that the file may be larger than it needs to be. It's not an error.
+
+## Why does my image say 72 DPI?
+
+That's a tag stored in the file, not a measure of detail. It doesn't change the pixels, so a 1,200 × 1,800 image tagged 72 DPI is still 300 DPI at 4 × 6 in. Changing the tag to 300 doesn't add detail either.
+
+Some files have no tag or store two that disagree. The checker shows them as they are and doesn't need them. Strictly, image resolution is PPI, pixels per inch. This page says DPI to match KDP.
+
+## What size should I enter for a cover?
+
+Enter the size of the whole cover the image fills, including the back, spine, and bleed. Get it from the [KDP book setup calculator](/kdp-book-setup-calculator). Entering only the front cover's size makes the resolution look higher than it is.
+
+## What if my image is below 300 DPI?
+
+Print it smaller, within the maximum size the checker shows, or find a larger original. Enlarging the image in an editor adds pixels but not detail. KDP's [formatting fixes guide](https://kdp.amazon.com/en_US/help/topic/G201834260) says to insert images at their original size, because enlarging them lowers resolution.
+
+## What doesn't this checker cover?
+
+It checks one source image. Your layout software can scale or compress it on export, so check the finished PDF too with the [KDP PDF preflight checker](/kdp-pdf-preflight-checker). It also doesn't check eBook covers, color, or sharpness, and it can't tell whether KDP will accept your book. Review the book in KDP's previewer and a proof copy before you publish.
diff --git a/app/(site)/(tools)/kdp-image-dpi-checker/content/intro.mdx b/app/(site)/(tools)/kdp-image-dpi-checker/content/intro.mdx
new file mode 100644
index 00000000..29d9b265
--- /dev/null
+++ b/app/(site)/(tools)/kdp-image-dpi-checker/content/intro.mdx
@@ -0,0 +1 @@
+Find out if a photo, illustration, or cover image has enough pixels to print sharply at the size it'll fill in your KDP paperback or hardcover. Have the JPEG or PNG file and its printed size. The image is read in your browser and isn't uploaded.
diff --git a/app/(site)/(tools)/kdp-image-dpi-checker/content/usage.mdx b/app/(site)/(tools)/kdp-image-dpi-checker/content/usage.mdx
new file mode 100644
index 00000000..04f51e6b
--- /dev/null
+++ b/app/(site)/(tools)/kdp-image-dpi-checker/content/usage.mdx
@@ -0,0 +1,27 @@
+## What to enter
+
+- Image file. One JPEG or PNG, up to 25 MiB, 20,000 pixels per side, and 40 million pixels in total. To check a crop, export the cropped image first and choose that file.
+- Print size. The width or height of the space the image fills on the printed page, which may be smaller than the page. With **Keep proportions** on, the other side fills in. For an image that runs off the page edge, include the bleed.
+- **No size yet?** Leave both boxes blank to see the largest size the image prints at 300 DPI.
+
+Use a dot for decimals, like `4.5`. Turn off Keep proportions only to test a stretched image. You'll then need both sides.
+
+## How to read the result
+
+- **Effective resolution** is the image's DPI at the size you entered. If the two sides differ, the lower one counts.
+- **Maximum size at 300 DPI** is the largest the whole image prints and still meets KDP's 300 DPI. A `~` means the number is rounded.
+- **Stored density** is the DPI tag saved in the file. It doesn't affect the result.
+
+<Example title="One 1,200 × 1,800 pixel image at three sizes">
+
+The same file gives three different results, because only the printed size changes.
+
+</Example>
+
+| Printed size | Effective DPI | Result |
+| --- | --- | --- |
+| 4 × 6 in | 300 | Meets the 300 DPI target |
+| 6 × 9 in | 200 | Below the target |
+| 8 × 12 in | 150 | Low resolution |
+
+Stretched to 4 × 8 in, the same image is 300 DPI across but 225 DPI down, so the result is 225 DPI.
diff --git a/app/(site)/(tools)/kdp-image-dpi-checker/page.tsx b/app/(site)/(tools)/kdp-image-dpi-checker/page.tsx
index bb88854e..43ebdb96 100644
--- a/app/(site)/(tools)/kdp-image-dpi-checker/page.tsx
+++ b/app/(site)/(tools)/kdp-image-dpi-checker/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Image as ImageIcon } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpImageDpiChecker } from "./kdp-image-dpi-checker";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpImageDpiCheckerPage() {
   const toolPage = await getRequiredToolPage("kdp-image-dpi-checker");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<ImageIcon strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<ImageIcon strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpImageDpiChecker />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-metadata-checker/content/article.mdx b/app/(site)/(tools)/kdp-metadata-checker/content/article.mdx
new file mode 100644
index 00000000..015148b1
--- /dev/null
+++ b/app/(site)/(tools)/kdp-metadata-checker/content/article.mdx
@@ -0,0 +1,31 @@
+## What does the KDP metadata checker look for?
+
+It checks each field against KDP's published limits, then points out wording KDP's [metadata guidelines](https://kdp.amazon.com/en_US/help/topic/G201097560) ask you to leave out.
+
+| Field | Documented checks | Review prompts |
+| --- | --- | --- |
+| Title and subtitle | Empty title, HTML tags, 200 or more characters together | Links, email addresses, phone numbers, prices, review requests, promotional words |
+| Description | Empty, over 4,000 characters, unsupported or unfinished tags, attributes like `style`, tags not closed or not matching | The same, plus emoji |
+| Keywords | HTML tags | The same, plus over 50 characters, a repeated keyword, or all words longer than two characters already appearing in the title or subtitle |
+
+The promotional words it looks for are `buy now`, `free`, `sale`, `discount`, `bestseller`, `best seller`, `#1`, `limited time`, and `available now`. The checker matches words, not meaning, so *Free Range Hens* gets a prompt too.
+
+## How does the checker count characters?
+
+It counts every character, including tags and spaces. The description limit is 4,000 with tags, per KDP's [description guidance](https://kdp.amazon.com/en_US/help/topic/G201189630). The title and subtitle must be fewer than 200 together. The checker adds one character for the gap between them. KDP's pages disagree at exactly 200. The [KDP book title analyzer](/kdp-book-title-analyzer) explains.
+
+The 50-character keyword prompt is a stack127 reminder. KDP doesn't publish a keyword limit and says to [watch the limit in the field](https://kdp.amazon.com/en_US/help/topic/G201298500).
+
+KDP doesn't say how it counts emoji or accented letters, so confirm the numbers in KDP's form.
+
+## What can't the checker tell you?
+
+<Warning title="A clean result isn't KDP approval">
+
+The checker can't tell if your text is true, matches your cover, uses a trademark without permission, gives away spoilers, or quotes reviews. KDP says [most book details can't be changed](https://kdp.amazon.com/en_US/help/topic/G202105800) after you publish, so read them over yourself too.
+
+</Warning>
+
+It checks words, not files. For your book files, use the [KDP PDF preflight checker](/kdp-pdf-preflight-checker) and the [KDP image DPI checker](/kdp-image-dpi-checker). If KDP shows a description error after you paste, see its [troubleshooting page](https://kdp.amazon.com/en_US/help/topic/GC4VASCGNQP6LQ7L).
+
+Everything runs in your browser. Your text isn't sent, saved, or passed to an AI writer.
diff --git a/app/(site)/(tools)/kdp-metadata-checker/content/intro.mdx b/app/(site)/(tools)/kdp-metadata-checker/content/intro.mdx
new file mode 100644
index 00000000..16ac1d1d
--- /dev/null
+++ b/app/(site)/(tools)/kdp-metadata-checker/content/intro.mdx
@@ -0,0 +1 @@
+Paste your book's title, subtitle, description, and keywords to catch problems before you enter them in KDP. The checker flags unsupported or unfinished HTML tags, unclosed elements, and mismatched closing tags. It also checks length limits and wording KDP's rules ask you to avoid. If your description has formatting, have its HTML source ready, not just the text you see.
diff --git a/app/(site)/(tools)/kdp-metadata-checker/content/usage.mdx b/app/(site)/(tools)/kdp-metadata-checker/content/usage.mdx
new file mode 100644
index 00000000..3125db98
--- /dev/null
+++ b/app/(site)/(tools)/kdp-metadata-checker/content/usage.mdx
@@ -0,0 +1,26 @@
+## What to enter
+
+- Description. Paste the HTML source if it has bold, lists, or headings. KDP counts the tags, so the visible text alone gives too low a count. No HTML yet? Use the [KDP book description formatter](/kdp-book-description-formatter).
+- Keywords. Enter each field as you'll type it in KDP. Leave unused boxes empty. To turn a phrase list into seven fields, use the [KDP backend keywords builder](/kdp-backend-keywords-builder).
+
+## How to read the result
+
+Each possible issue has a label:
+
+- Documented check. A required-field, length, or formatting problem to fix. The checker also uses this label for its local input-size guards.
+- Review prompt. It matches a pattern worth a second look. It may be fine.
+
+You also get character counts and a rough preview of the description. The visible count and preview decode common named references, such as `&amp;`, and numeric references. The source count keeps the original HTML. Unrecognized references stay as typed. Copy description source copies what you entered, without fixes. If you edit after checking, the result is marked out of date until you check again.
+
+<Example title="Four possible issues">
+
+Title `Balcony Herbs`, subtitle `Growing Food in Small Spaces`. Description `<p>Grow fresh herbs on a <strong>small balcony</strong>.</p><p>Please leave a review!</p>`. Keywords `balcony herbs`, `container herb garden`, and `Container herb-garden`.
+
+- Documented check: KDP doesn't support `<strong>`. Use `<b>`.
+- Review prompt: a review request in the description.
+- Review prompt: keyword 1 only repeats title words.
+- Review prompt: keyword 3 repeats keyword 2. Capitals and hyphens don't make it new.
+
+The description is 89 of 4,000 characters, 58 of them visible.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-metadata-checker/page.tsx b/app/(site)/(tools)/kdp-metadata-checker/page.tsx
index dabed74d..032d6ac1 100644
--- a/app/(site)/(tools)/kdp-metadata-checker/page.tsx
+++ b/app/(site)/(tools)/kdp-metadata-checker/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Tags } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpMetadataChecker } from "./kdp-metadata-checker";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpMetadataCheckerPage() {
   const toolPage = await getRequiredToolPage("kdp-metadata-checker");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Tags strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Tags strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpMetadataChecker />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/article.mdx b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/article.mdx
new file mode 100644
index 00000000..20b951cf
--- /dev/null
+++ b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/article.mdx
@@ -0,0 +1,58 @@
+## How does KDP set the minimum price for a print book?
+
+The minimum is the lowest price where your share of the list price covers printing. KDP divides the printing cost by the royalty rate that applies at that price.
+
+<Formula title="Minimum print list price">
+
+`printing cost ÷ royalty rate at that price`
+
+</Formula>
+
+On Amazon.com the rate is 50% up to $9.98 and 60% from $9.99. The [KDP royalty calculator](/kdp-royalty-calculator) explains how printing cost and royalty work. KDP's rules are on its [paperback printing cost](https://kdp.amazon.com/en_US/help/topic/G201834340) and [hardcover printing cost](https://kdp.amazon.com/en_US/help/topic/GHT976ZKSKUXBB6H) pages.
+
+| Pages | Paperback cost | Paperback minimum | Hardcover cost | Hardcover minimum |
+| ---: | ---: | ---: | ---: | ---: |
+| 100 | $2.30 | $4.60 | $6.80 | $11.34 |
+| 200 | $3.40 | $6.80 | $8.05 | $13.42 |
+| 300 | $4.60 | $9.20 | $9.25 | $15.42 |
+| 400 | $5.80 | $9.99 | $10.45 | $17.42 |
+| 500 | $7.00 | $11.67 | $11.65 | $19.42 |
+
+All rows are 6 × 9 in, black ink, white paper, Amazon.com. Hardcovers start at 75 pages.
+
+## Why is my minimum price $9.99?
+
+Because no price below $9.99 covers your printing cost. It happens when the printing cost is between $5.00 and $5.99.
+
+Take the 400-page paperback above. Its $5.80 cost ÷ 60% gives $9.67. But $9.67 is in the 50% band, and 50% of any price up to $9.98 is less than $5.80. The first price that covers it is $9.99, where you earn $0.19. Dividing by 60% alone gives a price KDP won't accept.
+
+## What's the lowest price for a Kindle eBook?
+
+It depends on the royalty option, and at 35% on file size. These are KDP's [eBook price ranges](https://kdp.amazon.com/en_US/help/topic/G200634560) for Amazon.com.
+
+| Royalty option | File size | Lowest price | Highest price |
+| --- | --- | ---: | ---: |
+| 35% | Under 3 MB | $0.99 | $200.00 |
+| 35% | 3 MB to under 10 MB | $1.99 | $200.00 |
+| 35% | 10 MB or more | $2.99 | $200.00 |
+| 70% | Any size | $2.99 | $12.99 |
+
+KDP raised the 70% top price from $9.99 to $12.99 on July 7, 2026. Its help page doesn't say exactly how it counts a megabyte at the 3 MB and 10 MB lines. If your file is close to one, check the price in KDP.
+
+At 70%, KDP also takes a delivery cost of $0.15 per MB before paying you. See KDP's [eBook royalty rules](https://kdp.amazon.com/en_US/help/topic/G200634500).
+
+## Why does a large eBook show a negative royalty at 70%?
+
+Because the delivery cost can be higher than the price. A 20 MB file costs $3.00 to deliver, so at $2.99 the formula gives -$0.01. Enter a goal of `0` and the calculator returns $3.00 instead.
+
+This isn't a prediction that KDP will charge you. It means 70% earns nothing at that price. A large file at a low price may earn more at 35%. Compare both in the [KDP royalty calculator](/kdp-royalty-calculator).
+
+## What doesn't this calculator check?
+
+<Note title="About this estimate">
+
+It covers Amazon.com sales in US dollars through standard KDP distribution, using KDP rules checked on September 28, 2026. It doesn't cover other marketplaces, Expanded Distribution, taxes, price matching, or promotions. It can't confirm that your eBook qualifies for 70%. KDP pays 35% for books that are mostly public domain content, and for eBooks priced less than 20% below your print edition on Amazon.
+
+</Note>
+
+Check your price in KDP's pricing screen before you publish. For print, KDP's own [Printing Costs and Royalty Calculator](https://kdp.amazon.com/en_US/royalty-calculator) is a good cross-check. To compare a paperback with a hardcover at one price, use the [KDP price and profit calculator](/kdp-price-profit-calculator).
diff --git a/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/intro.mdx
new file mode 100644
index 00000000..ee30dbc2
--- /dev/null
+++ b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Find the lowest price KDP lets you set on Amazon.com for a paperback, hardcover, or Kindle eBook, in US dollars. Add a royalty goal to find the lowest price that earns at least that much per copy. For print, have your trim size, paper, and page count ready. For an eBook, have its file size.
diff --git a/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/usage.mdx
new file mode 100644
index 00000000..8c5c5c42
--- /dev/null
+++ b/app/(site)/(tools)/kdp-minimum-list-price-calculator/content/usage.mdx
@@ -0,0 +1,22 @@
+## What to enter
+
+- Printed pages. Use your final interior file's page count. Odd counts round up to the next even number. No final file yet? Use the [KDP page count estimator](/kdp-page-count-estimator).
+- eBook file size. In MB, up to three decimals. At 35%, it sets the lowest price. At 70%, it doesn't.
+- Desired royalty per copy. Leave it blank to get KDP's minimum. Enter an amount to get the lowest price that earns at least that much. Enter `0` for the lowest price that doesn't lose money, which matters for large eBooks at 70%.
+
+## How to read the result
+
+| Result | What it means |
+| --- | --- |
+| KDP minimum list price | The lowest price KDP accepts. For print, you earn little or nothing here. |
+| Lowest price for your royalty goal | Shown instead when you enter a goal, with how far it sits above the KDP minimum. |
+| Estimated royalty per sale | What you earn at that price, before your own costs. |
+| Printing cost or delivery deduction | What KDP takes off first. The 35% eBook option has none. |
+
+If you see **No price meets this royalty goal**, no price in the allowed range earns that much. The result shows the most you can earn in that range. Lower the goal, change the print setup, or switch the eBook option. At 70%, a 5 MB eBook earns at most $8.57, at $12.99.
+
+<Example title="A $1.39 goal for a 300-page paperback">
+
+A 6 × 9 in black and white paperback on white paper costs $4.60 to print. KDP's minimum is $9.20, where you earn $0.00. A $1.39 goal returns $9.99, $0.79 above the minimum, because the rate rises from 50% to 60% at that price.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-minimum-list-price-calculator/page.tsx b/app/(site)/(tools)/kdp-minimum-list-price-calculator/page.tsx
index 65561c7b..16fc7f1b 100644
--- a/app/(site)/(tools)/kdp-minimum-list-price-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-minimum-list-price-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Tag } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpMinimumListPriceCalculator } from "./kdp-minimum-list-price-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpMinimumListPriceCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-minimum-list-price-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Tag strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Tag strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpMinimumListPriceCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-page-count-estimator/content/article.mdx b/app/(site)/(tools)/kdp-page-count-estimator/content/article.mdx
new file mode 100644
index 00000000..efde1e84
--- /dev/null
+++ b/app/(site)/(tools)/kdp-page-count-estimator/content/article.mdx
@@ -0,0 +1,45 @@
+## How does the estimator turn words into pages?
+
+It works out how much text fits on one page, then divides your word count by it. KDP doesn't publish a formula for this, so these are stack127's own assumptions.
+
+<Formula title="Words per page">
+
+Text area: `trim size - margins`
+
+Characters per line: `text width ÷ (font size ÷ 72 × font width factor)`
+
+Lines per page: `text height ÷ (font size ÷ 72 × line spacing)`
+
+Words per page: `characters per line × lines per page ÷ 5`, then 80% to 120% of that for the range
+
+</Formula>
+
+Characters per line and lines per page round down, with a minimum of one. The lower words-per-page estimate rounds down and the upper estimate rounds up.
+
+The font width factor is 0.5 for serif, 0.52 for sans, and 0.6 for monospaced. Pages from text are `words ÷ words per page`, rounded up. Then the added pages go on top.
+
+## Why might my real book have more pages?
+
+The model assumes full lines and pages, with five character slots per word and no separate slot for spaces. Its upper words-per-page estimate is 20% above that nominal capacity. The range isn't calibrated against typeset manuscripts and can underestimate your page count. Real layouts use more space:
+
+- Short paragraphs and dialogue leave the end of many lines empty.
+- Headings, scene breaks, and block quotes take extra space.
+- Chapters that start on a right-hand page can add a blank page each.
+- Images placed between paragraphs take space the word count doesn't show.
+- Your actual font may be wider or narrower than its class.
+
+So use the range to compare layouts, not as a final number. Once your book is typeset, the exported PDF's page count is the real one.
+
+## What are KDP's page count limits?
+
+Paperbacks need at least 24 pages, or 72 in standard color. The most is 828 pages, or fewer for some trims, inks, and papers. Hardcovers need 75 to 550 pages. The estimator warns below 24 and above 828, but it doesn't check hardcover limits or your ink and paper. See KDP's [paperback submission guidelines](https://kdp.amazon.com/en_US/help/topic/G201857950) and [hardcover specs](https://kdp.amazon.com/en_US/help/topic/GVBQ3CMEQW3W2VL6).
+
+## What does page count change?
+
+Page count sets your spine width, your minimum inside margin, and your printing cost. A few extra pages can move you into a wider margin band.
+
+- See your spine, cover size, and margins in the [KDP book setup calculator](/kdp-book-setup-calculator).
+- See what you earn per sale in the [KDP royalty calculator](/kdp-royalty-calculator).
+- Find the lowest price KDP allows in the [KDP minimum list price calculator](/kdp-minimum-list-price-calculator).
+
+When your PDF is ready, check its size and page count with the [KDP PDF preflight checker](/kdp-pdf-preflight-checker).
diff --git a/app/(site)/(tools)/kdp-page-count-estimator/content/intro.mdx b/app/(site)/(tools)/kdp-page-count-estimator/content/intro.mdx
new file mode 100644
index 00000000..056184b7
--- /dev/null
+++ b/app/(site)/(tools)/kdp-page-count-estimator/content/intro.mdx
@@ -0,0 +1 @@
+Turn your word count into an estimated page range for a KDP print book, before it's typeset. Have your word count, your planned trim size, and roughly how many chapters you have. The model assumes dense text and can underestimate your final page count.
diff --git a/app/(site)/(tools)/kdp-page-count-estimator/content/usage.mdx b/app/(site)/(tools)/kdp-page-count-estimator/content/usage.mdx
new file mode 100644
index 00000000..d941e970
--- /dev/null
+++ b/app/(site)/(tools)/kdp-page-count-estimator/content/usage.mdx
@@ -0,0 +1,20 @@
+## What to enter
+
+- Word count. The body text only. Front and back matter have their own boxes.
+- Font. Serif, sans, and monospaced are width classes, not specific fonts. Pick the one closest to your body text.
+- Margins. Set the margins you plan to use. If the inside margin is smaller than KDP's minimum for the estimated page count, you get a warning, but your margin isn't changed.
+- Chapter starts. With a positive word count, the estimator adds one page per chapter for space lost around chapter breaks. Right-hand chapter starts can add more.
+- Image pages. Pages that hold only an image.
+- Front and back matter. Pages like the title page, copyright, contents, acknowledgments, and about the author.
+
+## How to read the result
+
+The main result is a page range, with each end rounded up to an even number, the same way KDP counts print pages. Below it you'll see how many pages come from body text and how many you added.
+
+The typography model shows the words per page, text area, characters per line, and lines per page behind the estimate. The KDP guidance list shows the minimum inside margin for every page band the range touches.
+
+<Example title="A 50,000-word novel at 6 × 9 in">
+
+Serif at 11 pt with 1.15 line spacing, a 0.5 in inside margin, 0.375 in outside, and 0.75 in top and bottom. That leaves a 5.125 × 7.5 in text area with 67 characters per line and 42 lines, or 450 to 676 words per page. The body text needs 74 to 112 pages. Adding 20 chapter starts, 4 front matter pages, and 2 back matter pages gives 100 to 138 pages. This is the current model's output, not a calibrated prediction for a typeset novel. It assumes dense text and can underestimate the final count.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-page-count-estimator/page.tsx b/app/(site)/(tools)/kdp-page-count-estimator/page.tsx
index 04305c6e..fbdd5a9e 100644
--- a/app/(site)/(tools)/kdp-page-count-estimator/page.tsx
+++ b/app/(site)/(tools)/kdp-page-count-estimator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { BookOpen } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpPageCountEstimator } from "./kdp-page-count-estimator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpPageCountEstimatorPage() {
   const toolPage = await getRequiredToolPage("kdp-page-count-estimator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<BookOpen strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<BookOpen strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpPageCountEstimator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-payment-date-calculator/content/article.mdx b/app/(site)/(tools)/kdp-payment-date-calculator/content/article.mdx
new file mode 100644
index 00000000..79feb2e1
--- /dev/null
+++ b/app/(site)/(tools)/kdp-payment-date-calculator/content/article.mdx
@@ -0,0 +1,42 @@
+## How is the KDP payment month worked out?
+
+KDP pays royalties every month, about 60 days after the end of the month the sale was reported. For Expanded Distribution it's about 90 days. That's KDP's [payment timing rule](https://kdp.amazon.com/en_US/help/topic/GK2MKZUL6U3SFBPZ).
+
+<Formula title="Payment month">
+
+Standard: `reported month + 2 months`
+
+Expanded Distribution: `reported month + 3 months`
+
+</Formula>
+
+KDP's own example: January royalties are paid by the end of March. KDP doesn't publish an exact day, so the result is a month, not a date.
+
+## What if my balance is below the payment threshold?
+
+Then KDP holds it and pays later than the estimate. Direct deposit has no threshold. Checks and wire transfers do, and [each marketplace has a separate balance](https://kdp.amazon.com/en_US/help/topic/G201207800). Its threshold depends on the payment method and currency, after applicable tax withholding.
+
+### Selected marketplace thresholds
+
+| Marketplace | Check or wire threshold |
+| --- | --- |
+| Amazon.com | $100 USD |
+| Amazon.co.uk | £100 |
+| Amazon.de | €100 |
+
+KDP carries the balance forward. For standard royalties, payment is due about 60 days after the end of the month the accumulated balance meets the threshold. The calculator doesn't know your balance, so it can't tell you when that will be. With direct deposit, a bank's own minimum can still apply after currency conversion or tax withholding.
+
+## How long does payment delivery take?
+
+From the payment date, direct deposit takes 1 to 5 business days, or 7 to 10 for banks in India. A wire takes 5 to 10 days, and a check can take up to 30 days to reach your mailing address. The result lists these with your estimate.
+
+## My KDP payment hasn't arrived. What should I check?
+
+Start with your [Payment Report](https://kdp.amazon.com/en_US/help/topic/G201436840). Find the sales period and look at two fields:
+
+- Payment status. Paid or Failed.
+- Payment date. The day Amazon sent the money. It can be days before it shows in your account.
+
+If a wire payment says Paid and the delivery time has passed, KDP suggests [asking your bank](https://kdp.amazon.com/en_US/help/topic/G4EQZQ73RYEX8RQQ). If there's no payment for that period, check your balance against the threshold above.
+
+To estimate what a sale earns, use the [KDP royalty calculator](/kdp-royalty-calculator). For Kindle Unlimited page reads, use the [KENP earnings calculator](/kindle-unlimited-kenp-earnings-calculator).
diff --git a/app/(site)/(tools)/kdp-payment-date-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-payment-date-calculator/content/intro.mdx
new file mode 100644
index 00000000..e6941f0f
--- /dev/null
+++ b/app/(site)/(tools)/kdp-payment-date-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Enter the month your royalties were reported to see the month KDP should pay them. KDP pays about 60 days after that month ends, or 90 days for Expanded Distribution, usually near the end of the month. Have your KDP royalty report open.
diff --git a/app/(site)/(tools)/kdp-payment-date-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-payment-date-calculator/content/usage.mdx
new file mode 100644
index 00000000..88d2450e
--- /dev/null
+++ b/app/(site)/(tools)/kdp-payment-date-calculator/content/usage.mdx
@@ -0,0 +1,18 @@
+## What to enter
+
+- Reported earnings month. The month from your KDP royalty report, written as `YYYY-MM`, like `2026-01` for January 2026. Use the month the sale was reported, not the day a reader bought the book.
+- Distribution. Pick Standard unless the royalties came through Expanded Distribution. A paperback can earn through both, so the format alone doesn't tell you.
+
+## How to read the result
+
+The result is the month KDP should send the payment, usually toward the end of it. Below it you'll see the payment threshold rules and how long each payment method takes to reach you, counted from the payment date.
+
+The tool uses KDP's current schedule for any year from 2007 to 2100. For a past month, it doesn't confirm that you were paid or that a payment is late.
+
+<Example title="One month, two schedules">
+
+Your January 2026 report has royalties from both channels, so estimate each one separately. Standard royalties should be paid in March 2026, and Expanded Distribution royalties in April 2026.
+
+Late-year months roll into the next year. November 2026 royalties should be paid in January 2027, or February 2027 for Expanded Distribution.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-payment-date-calculator/page.tsx b/app/(site)/(tools)/kdp-payment-date-calculator/page.tsx
index ada55c01..276a385f 100644
--- a/app/(site)/(tools)/kdp-payment-date-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-payment-date-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { CalendarClock } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpPaymentDateCalculator } from "./kdp-payment-date-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpPaymentDateCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-payment-date-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CalendarClock strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CalendarClock strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpPaymentDateCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-pdf-preflight-checker/content/article.mdx b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/article.mdx
new file mode 100644
index 00000000..f4474e92
--- /dev/null
+++ b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/article.mdx
@@ -0,0 +1,39 @@
+## What does the checker look at?
+
+It reads the PDF's own measurements and compares them with the setup you picked.
+
+| Check | Flagged when |
+| --- | --- |
+| Page size | A page differs from the expected size by more than 0.02 in. |
+| Bleed | You picked bleed, but a page is only the trim size. |
+| Mixed sizes | A page's width or height differs from the first measurable page by more than 0.02 in. |
+| Page count | An interior has an odd count, or a count outside KDP's range for that setup. A cover has more than one page. |
+| Spine | The inferred spine differs from the expected spine by more than 0.02 in. |
+| Fonts | A font isn't embedded, or the checker can't tell. KDP needs [all fonts embedded](https://kdp.amazon.com/en_US/help/topic/G201857950). |
+| Images | A placed image is below 300 DPI or above 600 DPI, or can't be measured. |
+| File | It isn't a PDF, is password-protected, can't be read, has a page with no measurable drawing or text operators, or is missing its end marker. |
+
+## What size should my PDF be?
+
+An interior without bleed is the trim size. With bleed, it's 0.125 in wider and 0.25 in taller, so a 6 × 9 in book becomes 6.125 × 9.25 in. A paperback cover is the back, spine, and front plus bleed. Get both sizes, and the reasons behind them, from the [KDP book setup calculator](/kdp-book-setup-calculator).
+
+## What do Unknown and Not declared mean?
+
+Unknown means the checker couldn't measure something, so it's neither a pass nor a fail. Check that item yourself.
+
+Not declared means the PDF doesn't set its own trim or bleed box. PDF readers then use the page size instead. That's common and isn't a problem by itself.
+
+## How do I fix a possible issue?
+
+Fix it in your layout software, export a new PDF, and check again.
+
+- Wrong page size. Change the page size in your layout document, not only in the export settings.
+- Fonts not embedded. Turn on font embedding when you export. KDP explains how in its [formatting fixes guide](https://kdp.amazon.com/en_US/help/topic/G201834260).
+- Low-resolution images. Check each image file with the [KDP image DPI checker](/kdp-image-dpi-checker), then replace it or place it smaller.
+- Odd page count. KDP rounds up to an even count by adding a blank page. Add one yourself if you want to control where it goes.
+
+## What can't the checker tell you?
+
+It can't see your pages, so it doesn't check margins, text near the edge, the gutter, colors, or the barcode area. It also can't tell whether you have a license for a font. "No measurable issues found" means only that these checks passed.
+
+Before you publish, review the book in KDP's Print Previewer and order a proof copy. Only KDP's own review decides whether the book is accepted. Rules checked on October 4, 2026.
diff --git a/app/(site)/(tools)/kdp-pdf-preflight-checker/content/intro.mdx b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/intro.mdx
new file mode 100644
index 00000000..9ba22361
--- /dev/null
+++ b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/intro.mdx
@@ -0,0 +1 @@
+Check your interior or paperback cover PDF against your KDP trim size, bleed, and page count before you upload it. The file is read in your browser and isn't uploaded. Have your final PDF and the trim size, ink, and paper you picked in KDP.
diff --git a/app/(site)/(tools)/kdp-pdf-preflight-checker/content/usage.mdx b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/usage.mdx
new file mode 100644
index 00000000..40514a1b
--- /dev/null
+++ b/app/(site)/(tools)/kdp-pdf-preflight-checker/content/usage.mdx
@@ -0,0 +1,20 @@
+## What to enter
+
+- PDF file. The exact file you'll upload, up to 650 MB, which is KDP's limit.
+- Check scope. Pick Interior PDF for the book's pages, or Paperback cover for the one-page cover file. Hardcover covers aren't supported. Use the template from [KDP's cover calculator](https://kdp.amazon.com/cover-calculator) for those.
+- Interior bleed. Pick With bleed only if something in your interior runs off the page edge. Not sure? See [what bleed changes](/kdp-book-setup-calculator).
+- Book page count. For a cover, enter your interior's page count, not the cover file's one page. An odd count rounds up to the next even number before the spine is worked out, the same as KDP does. The report shows the rounded count and warns when the book setup falls outside KDP's page range.
+
+## How to read the report
+
+The report starts with the number of possible issues, or "No measurable issues found." Each issue names the page or setting it's about.
+
+The page table compares each page's size with the size it should be. A page counts as a match if it's within 0.02 in. That margin is stack127's own allowance for rounding, not a KDP rule.
+
+The diagnostics list covers fonts, images, page boxes, encryption, and file size. Copy report and Download report export the findings and a short summary as text. The page table and full diagnostics stay on screen. They don't fix the PDF.
+
+<Example title="A 25-page 6 × 9 in interior with two problems">
+
+Page 4 was exported at 6.125 × 9.25 in, and the body font isn't embedded. The report lists 4 possible issues: page 4's size, mixed page sizes, an odd page count of 25, and 1 font not embedded.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-pdf-preflight-checker/page.tsx b/app/(site)/(tools)/kdp-pdf-preflight-checker/page.tsx
index d72bb013..0c97ca6b 100644
--- a/app/(site)/(tools)/kdp-pdf-preflight-checker/page.tsx
+++ b/app/(site)/(tools)/kdp-pdf-preflight-checker/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileSearch } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpPdfPreflightChecker } from "./kdp-pdf-preflight-checker";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpPdfPreflightCheckerPage() {
   const toolPage = await getRequiredToolPage("kdp-pdf-preflight-checker");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileSearch strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileSearch strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpPdfPreflightChecker />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-price-profit-calculator/content/article.mdx b/app/(site)/(tools)/kdp-price-profit-calculator/content/article.mdx
new file mode 100644
index 00000000..97288f98
--- /dev/null
+++ b/app/(site)/(tools)/kdp-price-profit-calculator/content/article.mdx
@@ -0,0 +1,49 @@
+## How does trim size change printing cost?
+
+A large trim costs more per page. KDP counts a book as large trim if it's wider than 6.12 in or taller than 9 in. For a black ink paperback on Amazon.com, that's $0.017 a page instead of $0.012. See KDP's [paperback printing cost](https://kdp.amazon.com/en_US/help/topic/G201834340) page.
+
+But a bigger page also means fewer pages. Here's the same book at $14.99:
+
+| Option | Pages | Printing cost | Royalty per sale |
+| --- | ---: | ---: | ---: |
+| 6 × 9 in | 300 | $4.60 | $4.39 |
+| 7 × 10 in, same page count | 300 | $6.10 | $2.89 |
+| 7 × 10 in, if it fits in 240 pages | 240 | $5.08 | $3.91 |
+
+Entering the same page count for both trims makes the larger trim look worse than it is. Use each layout's real count. KDP sets the final count from the file you upload. See its [paperback submission guidelines](https://kdp.amazon.com/en_US/help/topic/G201857950).
+
+## Is a hardcover worth it?
+
+A hardcover costs more to print, so it needs a higher price to match the paperback's royalty. A 300-page 6 × 9 in hardcover costs $9.25 to print, against $4.60 for the paperback. Its minimum price is $15.42, so at $14.99 it can't be sold at all.
+
+To earn the paperback's $7.39 at $19.99, the hardcover needs $27.73. You can find a price like that with the royalty goal in the [KDP minimum list price calculator](/kdp-minimum-list-price-calculator). Whether readers will pay it is something no calculator can tell you.
+
+For how the royalty itself is worked out, see the [KDP royalty calculator](/kdp-royalty-calculator).
+
+## What does estimated profit include?
+
+Only what you enter.
+
+<Formula title="Estimated profit per option">
+
+`planned copies × (royalty per sale - other cost per sale) - one-time cost`
+
+</Formula>
+
+Profit can be negative. In the example above, a $250.00 one-time cost for the hardcover would make its profit -$76.00.
+
+<Note title="What this number can't tell you">
+
+It doesn't predict sales. It leaves out costs you don't enter, taxes, and refunds. Each option is a different edition of the same book, so don't add their profits together.
+
+</Note>
+
+## What doesn't this calculator cover?
+
+It covers paperback and hardcover sales on Amazon.com in US dollars, using KDP rules checked on September 28, 2026. It doesn't cover:
+
+- Kindle eBooks. Use the [KDP royalty calculator](/kdp-royalty-calculator).
+- Expanded Distribution, which pays 40% rather than the standard Amazon rate of 50% or 60%, and has a different paperback minimum price.
+- Other marketplaces, price matching, or promotions.
+
+Before you set a price, check the finished edition in KDP's [Printing Costs and Royalty Calculator](https://kdp.amazon.com/en_US/royalty-calculator) and pricing screen.
diff --git a/app/(site)/(tools)/kdp-price-profit-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-price-profit-calculator/content/intro.mdx
new file mode 100644
index 00000000..0231842f
--- /dev/null
+++ b/app/(site)/(tools)/kdp-price-profit-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Compare two or three print editions of the same book at one Amazon.com price, in US dollars. Each option shows its printing cost, KDP minimum price, and royalty per sale. Add your own costs and a planned number of sales to estimate profit.
diff --git a/app/(site)/(tools)/kdp-price-profit-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-price-profit-calculator/content/usage.mdx
new file mode 100644
index 00000000..9720dbf9
--- /dev/null
+++ b/app/(site)/(tools)/kdp-price-profit-calculator/content/usage.mdx
@@ -0,0 +1,26 @@
+## What to enter
+
+- Shared list price. One price for every option, so the differences come only from the print setup.
+- Printed pages. Give each option its own count. A bigger trim fits more words on a page, so the same book has fewer pages. Odd counts round up to the next even number. To estimate a count for a new trim, use the [KDP page count estimator](/kdp-page-count-estimator).
+- Include my costs. Optional. Turn it on to see profit.
+  - Planned copies sold per option. The same number for every option.
+  - Other cost per sale. Costs per copy outside KDP. Don't include printing. KDP already takes it out of your royalty.
+  - One-time cost. Costs you pay once for that edition, like a cover or formatting.
+  - Enter `0` for a cost that doesn't apply. A blank box stops the comparison.
+
+## How to read the result
+
+The first line says how many options meet KDP's minimum at your price. An option below its minimum still shows its printing cost and minimum price, but no royalty or profit. Raise the shared price or change that option's setup.
+
+<Example title="Paperback or hardcover at $19.99">
+
+Both options are 300 pages, 6 × 9 in, black ink on white paper. The profit row assumes 100 copies, $1.00 other cost per sale, and $100.00 one-time cost for each.
+
+| | Paperback | Hardcover |
+| --- | ---: | ---: |
+| Printing cost | $4.60 | $9.25 |
+| KDP minimum price | $9.20 | $15.42 |
+| Royalty per sale | $7.39 | $2.74 |
+| Estimated profit | $539.00 | $74.00 |
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-price-profit-calculator/page.tsx b/app/(site)/(tools)/kdp-price-profit-calculator/page.tsx
index e1a36258..97c494db 100644
--- a/app/(site)/(tools)/kdp-price-profit-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-price-profit-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { BookOpenCheck } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpPriceProfitCalculator } from "./kdp-price-profit-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpPriceProfitCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-price-profit-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<BookOpenCheck strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<BookOpenCheck strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpPriceProfitCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kdp-royalty-calculator/content/article.mdx b/app/(site)/(tools)/kdp-royalty-calculator/content/article.mdx
new file mode 100644
index 00000000..4f938091
--- /dev/null
+++ b/app/(site)/(tools)/kdp-royalty-calculator/content/article.mdx
@@ -0,0 +1,51 @@
+## How is KDP royalty calculated?
+
+KDP pays you a share of the list price, minus what it costs to print or deliver the book.
+
+<Formula title="KDP royalty per sale">
+
+Print book: `rate × list price - printing cost`
+
+eBook at 70%: `70% × (list price - delivery cost)`
+
+eBook at 35%: `35% × list price`
+
+</Formula>
+
+| Format | List price | Rate |
+| --- | --- | --- |
+| Paperback or hardcover | Up to $9.98 | 50% |
+| Paperback or hardcover | $9.99 to $250 | 60% |
+| eBook | $2.99 to $12.99 | 70%, if you choose it |
+| eBook | Up to $200 | 35% |
+
+Printing cost is a fixed fee plus a cost per page, set by trim size, ink, and paper. Some short books pay one flat fee instead. See KDP's [paperback](https://kdp.amazon.com/en_US/help/topic/G201834340) and [hardcover](https://kdp.amazon.com/en_US/help/topic/GHT976ZKSKUXBB6H) printing costs, and its [paperback](https://kdp.amazon.com/en_US/help/topic/G201834330) and [hardcover](https://kdp.amazon.com/en_US/help/topic/G77F3WPD3KQLJTFS) royalty rules.
+
+eBook delivery costs $0.15 per MB, at least $0.01, and applies only at 70%. KDP rounds the file size up to the next KB. See KDP's [eBook royalty rules](https://kdp.amazon.com/en_US/help/topic/G200634500). Larger files also need a higher lowest price. The [KDP minimum list price calculator](/kdp-minimum-list-price-calculator) lists the price bands.
+
+## Why does one cent change my paperback royalty by a dollar?
+
+The print rate jumps from 50% to 60% at $9.99. For the 300-page paperback above, $9.98 earns $0.39 and $9.99 earns $1.39. If your price is just under $9.99, check that extra cent.
+
+## When does 35% pay more than 70%?
+
+It happens above $12.99 and with large files at low prices.
+
+- A 5 MB eBook earns $8.57 at $12.99. At $13.00 it drops to 35% and earns $4.55. You'd need $24.48 to earn $8.57 again.
+- A 20 MB eBook costs $3.00 to deliver. At $2.99 it earns -$0.01 at 70%, but $1.05 at 35%.
+
+## Is royalty the same as profit?
+
+No. Royalty comes before your own costs, like editing, cover design, ads, and your time. To compare paperback and hardcover editions and add your costs, use the [KDP price and profit calculator](/kdp-price-profit-calculator).
+
+## What doesn't this calculator cover?
+
+Results are estimates for Amazon.com in US dollars, using KDP rules checked on September 16, 2026. It doesn't cover:
+
+- Other Amazon stores, currencies, or Expanded Distribution.
+- Taxes, refunds, promotions, or price matching.
+- Kindle Unlimited page reads. Use the [Kindle Unlimited KENP earnings calculator](/kindle-unlimited-kenp-earnings-calculator).
+- Other 70% rules. KDP pays 35% for books that are mostly public domain content, and for eBooks priced less than 20% below your print edition on Amazon.
+- Whether KDP will accept your book.
+
+It runs in your browser and doesn't touch your Amazon account. Confirm your price in KDP before you publish.
diff --git a/app/(site)/(tools)/kdp-royalty-calculator/content/intro.mdx b/app/(site)/(tools)/kdp-royalty-calculator/content/intro.mdx
new file mode 100644
index 00000000..9c0170cd
--- /dev/null
+++ b/app/(site)/(tools)/kdp-royalty-calculator/content/intro.mdx
@@ -0,0 +1 @@
+See what you earn from one sale of your paperback, hardcover, or Kindle eBook on Amazon.com, in US dollars. For a print book, have your trim size, page count, ink, and paper ready. For an eBook, have your file size.
diff --git a/app/(site)/(tools)/kdp-royalty-calculator/content/usage.mdx b/app/(site)/(tools)/kdp-royalty-calculator/content/usage.mdx
new file mode 100644
index 00000000..2449e053
--- /dev/null
+++ b/app/(site)/(tools)/kdp-royalty-calculator/content/usage.mdx
@@ -0,0 +1,23 @@
+## What to enter
+
+- Page count. Use your final interior file's page count, blank pages included. Odd counts round up to the next even number. No final file yet? Use the [KDP page count estimator](/kdp-page-count-estimator).
+- eBook file size. KDP measures the file itself, so its size can differ from your upload. Your upload's size is a fair first guess.
+- Royalty option. 70% works only from $2.99 to $12.99. Outside that range, the calculator uses 35% and tells you.
+- Monthly income target. Optional. It shows how many sales a month you'd need.
+
+## How to read the result
+
+| Result | What it means |
+| --- | --- |
+| Royalty per sale | What Amazon pays you for one copy. |
+| Minimum list price | The lowest price KDP lets you set. For print, you earn little or nothing at this price. For an eBook, this shows the 35% file-size minimum, even when you select 70%. Prices below $2.99 use 35%. |
+| Royalty margin | Your royalty as a share of the price. |
+| Break-even ad spend | The most you can spend on ads per sale before the sale earns nothing. To turn it into a click bid, use the [KDP book ads bid calculator](/kdp-break-even-acos-calculator). |
+| Break-even ACoS | That limit as a share of the price. ACoS is ad spend divided by ad sales. |
+| Price table | Nearby prices, including where the rate changes. These aren't price suggestions. |
+
+<Example title="A 300-page paperback at $14.99">
+
+A 6 × 9 in black and white paperback on white paper costs $1.00 + 300 × $0.012 = $4.60 to print. At $14.99 the rate is 60%, so you earn $8.99 - $4.60 = $4.39 per sale. A $500 monthly target needs 114 sales.
+
+</Example>
diff --git a/app/(site)/(tools)/kdp-royalty-calculator/page.tsx b/app/(site)/(tools)/kdp-royalty-calculator/page.tsx
index 285b6e5e..26991044 100644
--- a/app/(site)/(tools)/kdp-royalty-calculator/page.tsx
+++ b/app/(site)/(tools)/kdp-royalty-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { CircleDollarSign } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KdpRoyaltyCalculator } from "./kdp-royalty-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KdpRoyaltyCalculatorPage() {
   const toolPage = await getRequiredToolPage("kdp-royalty-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KdpRoyaltyCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/article.mdx b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/article.mdx
new file mode 100644
index 00000000..0d2b3e65
--- /dev/null
+++ b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/article.mdx
@@ -0,0 +1,48 @@
+## How does Kindle Unlimited pay for page reads?
+
+KDP pays a set amount for each page read, called the KENP rate. It sets the rate each month from the KDP Select Global Fund and the pages read in each marketplace.
+
+<Formula title="Kindle Unlimited royalty">
+
+`KENP Read × KENP rate`
+
+The rate itself: `the marketplace's fund ÷ total KENP read there that month`
+
+</Formula>
+
+So the rate changes every month and differs between marketplaces. KDP pays only for pages a customer reads the first time. Rereading the same pages doesn't earn again. See KDP's [Kindle Unlimited royalty guide](https://kdp.amazon.com/en_US/help/topic/G201541130).
+
+## What's the difference between KENPC and KENP Read?
+
+KENPC is your book's length. KENP Read is how many pages people read.
+
+| Term | What it is | Where to find it |
+| --- | --- | --- |
+| KENPC | Your book's page count, measured by KDP with standard font and spacing | Your Bookshelf, on the book's Promote and Advertise page |
+| KENP Read | Pages customers read that month | KDP Reports |
+
+One full read of a book is worth about its KENPC × the rate. A book with a KENPC of 300, at 0.00458 USD per page, earns 1.37 USD per full read.
+
+<Note title="The 3,000-page limit">
+
+KDP pays for up to 3,000 pages per book per customer. Your monthly total can be much higher, because it adds up many customers. Enter the total from your report as it is. The calculator can't see single customers, so it doesn't apply the limit.
+
+</Note>
+
+## Why doesn't my estimate match what KDP paid?
+
+A few things can make them differ:
+
+- **The numbers weren't final.** KENP totals can change until near the 15th of the next month.
+- **The rate wasn't that month's.** A rate from another month or store gives a different answer.
+- **Currency.** If KDP pays you in another currency, the exchange rate at payment time changes the amount.
+
+For a past month, KDP's [Prior Months' Royalties report](https://kdp.amazon.com/en_US/help/topic/GVTTXHKHVPAPBEDQ) shows what your book actually earned.
+
+## What doesn't this calculator include?
+
+- Ordinary eBook and print sales. Use the [KDP royalty calculator](/kdp-royalty-calculator).
+- [KDP Select bonuses](https://kdp.amazon.com/en_US/help/topic/G201623400), taxes, or currency conversion.
+- Future reads. It doesn't predict how many pages people will read.
+
+To see when KDP will pay a month's royalties, use the [KDP payment date calculator](/kdp-payment-date-calculator).
diff --git a/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/intro.mdx b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/intro.mdx
new file mode 100644
index 00000000..677346a0
--- /dev/null
+++ b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/intro.mdx
@@ -0,0 +1 @@
+Estimate what one month of Kindle Unlimited page reads earns for one book in KDP Select. Have the month's KENP Read from your KDP reports and a per-page rate for the same month and marketplace. The calculator doesn't look up rates, so you enter one.
diff --git a/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/usage.mdx b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/usage.mdx
new file mode 100644
index 00000000..abb27647
--- /dev/null
+++ b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/content/usage.mdx
@@ -0,0 +1,17 @@
+## What to enter
+
+- Earnings month and marketplace. The month and store you're estimating, like `2026-08` and `Amazon.com`. Reads and rate must both be for this month and store.
+- KENP Read. This book's page-read total for the month in [KDP Reports](https://kdp.amazon.com/en_US/help/topic/GVTTXHKHVPAPBEDQ). Type digits only, like `60000`, not `60,000`. Don't use the book's KENPC or print page count.
+- Currency code. Three letters that match the rate, like `USD` or `JPY`. The calculator doesn't convert currencies.
+- Rate per KENP. What KDP paid per page read that month. KDP announces each month's fund near the 15th of the next month, and its [Royalties Estimator](https://kdp.amazon.com/en_US/help/topic/G6BZ4M9PVJ8YSCW8) uses the latest rate. Up to eight decimals.
+- Rate basis. Pick **Rate I entered from KDP for this month** only if the rate is KDP's for that month. If you borrowed another month's rate or are testing one, pick **My planning assumption**. It labels the result. The calculator can't check the rate.
+
+## How to read the result
+
+The result is KENP Read × your rate, rounded once to the currency's smallest unit: cents for USD, whole yen for JPY. A positive estimate that rounds to zero shows 'Less than' the currency's smallest unit, such as `Less than 0.01 USD`. Zero reads with a valid rate show `0.00 USD`. A blank rate gives no result, because the amount is unknown, not zero.
+
+<Example title="60,000 pages read">
+
+At a rate of 0.00458 USD per page: 60,000 × 0.00458 = 274.80 USD. This rate is only an example, not a current KDP rate.
+
+</Example>
diff --git a/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/page.tsx b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/page.tsx
index e2856efb..e67afb3b 100644
--- a/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/page.tsx
+++ b/app/(site)/(tools)/kindle-unlimited-kenp-earnings-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { BookOpenText } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { KindleUnlimitedKenpEarningsCalculator } from "./kindle-unlimited-kenp-earnings-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function KindleUnlimitedKenpEarningsCalculatorPage() {
   const toolPage = await getRequiredToolPage("kindle-unlimited-kenp-earnings-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<BookOpenText strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<BookOpenText strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <KindleUnlimitedKenpEarningsCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/pixels-to-print-size-calculator/content/article.mdx b/app/(site)/(tools)/pixels-to-print-size-calculator/content/article.mdx
new file mode 100644
index 00000000..41b10e0e
--- /dev/null
+++ b/app/(site)/(tools)/pixels-to-print-size-calculator/content/article.mdx
@@ -0,0 +1,42 @@
+## How do you convert pixels to inches?
+
+Divide the pixels by the PPI. For metric, multiply the inches by 2.54 for centimeters or 25.4 for millimeters. One inch is exactly 2.54 cm, as [NIST defines](https://www.nist.gov/pml/special-publication-811/nist-guide-si-appendix-b-conversion-factors/nist-guide-si-appendix-b8).
+
+<Formula title="Print size">
+
+`inches = pixels ÷ PPI`
+
+`centimeters = inches × 2.54`
+
+</Formula>
+
+[Adobe's guide to print resolution](https://helpx.adobe.com/photoshop/desktop/crop-resize-transform/resize-adjust-resolution/printed-image-resolution.html) explains the same relationship.
+
+## How many pixels do I need for a full page?
+
+Multiply the page size by 300. For common KDP trim sizes:
+
+| Trim size | Pixels at 300 PPI | With interior bleed |
+| --- | --- | --- |
+| 5 × 8 in | 1500 × 2400 | 1538 × 2475 |
+| 5.5 × 8.5 in | 1650 × 2550 | 1688 × 2625 |
+| 6 × 9 in | 1800 × 2700 | 1838 × 2775 |
+| 8.5 × 11 in | 2550 × 3300 | 2588 × 3375 |
+
+Bleed adds 0.125 in to the width and 0.25 in to the height. For other trims and for full covers, use the [KDP book setup calculator](/kdp-book-setup-calculator).
+
+## Is PPI the same as DPI?
+
+Not quite. PPI is how many image pixels fill an inch of paper. DPI is how many ink dots a printer puts down per inch. Print guides, KDP included, often say DPI when they mean image PPI, so treat a "300 DPI" request as 300 PPI here.
+
+## What PPI should I use?
+
+Use the number your printer or publisher gives you. KDP asks for at least 300 for images in print books, in its [formatting fixes guide](https://kdp.amazon.com/en_US/help/topic/G201834260). Large prints seen from farther away can use less, as [Adobe explains](https://helpx.adobe.com/photoshop/desktop/crop-resize-transform/resize-adjust-resolution/resolution-specs-for-printing-images.html).
+
+## Does changing the PPI change my image?
+
+In this calculator, changing PPI changes only the calculated print size. In an image editor, turn off Resample to change PPI without changing the pixels. See [Adobe's guide to print size and resolution](https://helpx.adobe.com/photoshop/desktop/crop-resize-transform/resize-adjust-resolution/change-print-dimensions-and-resolution.html).
+
+## What can't this calculator tell you?
+
+It works from the numbers you type and doesn't open the image. It can't tell you whether the image will look sharp. To check a real file at the size it fills in a KDP book, use the [KDP image DPI checker](/kdp-image-dpi-checker).
diff --git a/app/(site)/(tools)/pixels-to-print-size-calculator/content/intro.mdx b/app/(site)/(tools)/pixels-to-print-size-calculator/content/intro.mdx
new file mode 100644
index 00000000..10c692fd
--- /dev/null
+++ b/app/(site)/(tools)/pixels-to-print-size-calculator/content/intro.mdx
@@ -0,0 +1 @@
+See how big an image prints in inches, centimeters, and millimeters at the resolution your print job needs. Have the image's width and height in pixels, from your image editor or the file's properties.
diff --git a/app/(site)/(tools)/pixels-to-print-size-calculator/content/usage.mdx b/app/(site)/(tools)/pixels-to-print-size-calculator/content/usage.mdx
new file mode 100644
index 00000000..10697caf
--- /dev/null
+++ b/app/(site)/(tools)/pixels-to-print-size-calculator/content/usage.mdx
@@ -0,0 +1,12 @@
+## What to enter
+
+- Pixel width and height. Whole numbers from 1 to 1,000,000, without commas. The gray numbers in empty boxes are examples, not your image's size.
+- Print resolution (PPI). Starts at 300, the minimum KDP asks for in print books. Change it if your printer asks for something else. You can use up to three decimals.
+
+The result is the whole image's width × height in all three units, rounded to four decimals. Compare it with the space you have in your layout.
+
+<Example title="A 3,600 × 2,400 pixel photo">
+
+At 300 PPI it prints at 12 × 8 in, or 30.48 × 20.32 cm. At 150 PPI the same file prints at 24 × 16 in.
+
+</Example>
diff --git a/app/(site)/(tools)/pixels-to-print-size-calculator/page.tsx b/app/(site)/(tools)/pixels-to-print-size-calculator/page.tsx
index 58a344b1..a88e565c 100644
--- a/app/(site)/(tools)/pixels-to-print-size-calculator/page.tsx
+++ b/app/(site)/(tools)/pixels-to-print-size-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { Ruler } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { PixelsToPrintSizeCalculator } from "./pixels-to-print-size-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function PixelsToPrintSizeCalculatorPage() {
   const toolPage = await getRequiredToolPage("pixels-to-print-size-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Ruler strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Ruler strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <PixelsToPrintSizeCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 1c6a8d62b74660f9abf25ad85d8d4f530388712f Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 00:46:52 +0530
Subject: [PATCH 05/25] Mark the content pass in progress in the plan

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 dev-space/charts-and-content-in-code-plan.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/dev-space/charts-and-content-in-code-plan.md b/dev-space/charts-and-content-in-code-plan.md
index 622ab308..8385bd93 100644
--- a/dev-space/charts-and-content-in-code-plan.md
+++ b/dev-space/charts-and-content-in-code-plan.md
@@ -15,7 +15,7 @@ Work through the steps in order. Step 0 and Part 1 ship together in pull request
 | 2a | Content design doc | Opus | #36 | Shipped in `ce282243` |
 | 2b | Pilot: MDX setup, export script, two pages | Claude Opus worker, Sol for the script, Sol review | #36 | Shipped in `ce282243`: `/cac-payback-calculator` and `/epp-status-codes` |
 | 2c | Docs and skills for content in code | Opus | #36 | Shipped in `ce282243` |
-| 2d | Content pass: rewrite and move every published tool, directory, child, and catalog page | Claude Opus thread in its own worktree, Sol for scripts and review | One PR at the end | Not started |
+| 2d | Content pass: rewrite and move every published tool, directory, child, and catalog page | Claude Opus thread in its own worktree, Sol for scripts and review | One PR at the end | In progress on `content/page-rewrite`: route side done, 19 move-only tools moved, tool family pilots done |
 | 2e | Cleanup and retire database content columns | Sol | Final PR | Not started |
 | 3 | Production release | Coordinator | Release | Not started |
 

From 972944386774855756df527f81cea614efe97a02 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:31 +0530
Subject: [PATCH 06/25] Keep page words, titles, and search fields when record
 scripts run

The MDX check covers every content folder depth. Shortcut and ad network
syncs only insert missing page rows, and generated shortcut routes pass
each app's own intro. Hardware and Zigbee previews no longer overwrite
search fields, and their undocumented --refresh is retired.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 scripts/ad-networks/sync-page-copy.mjs        |  4 +-
 scripts/keyboard-shortcuts/sync-pages.mjs     | 14 +++-
 scripts/stack127/content/check-mdx.mjs        |  6 +-
 scripts/stack127/directory-pages/lib.mjs      | 61 +++++++++-----
 .../stack127/preview-hardware-directories.mjs |  5 +-
 scripts/zigbee-devices/preview-local-page.mjs |  6 +-
 stack127_docs/directory-pages.md              | 14 ++--
 tests/stack127/directory-pages.test.mjs       |  6 +-
 tests/stack127/directory-previews.test.mjs    | 79 ++++++++++++++----
 .../stack127/keyboard-shortcuts-sync.test.mjs | 82 +++++++++++++++++++
 tests/stack127/page-content.test.mjs          |  6 ++
 11 files changed, 225 insertions(+), 58 deletions(-)
 create mode 100644 tests/stack127/keyboard-shortcuts-sync.test.mjs

diff --git a/scripts/ad-networks/sync-page-copy.mjs b/scripts/ad-networks/sync-page-copy.mjs
index 8e2c13d5..343cb367 100644
--- a/scripts/ad-networks/sync-page-copy.mjs
+++ b/scripts/ad-networks/sync-page-copy.mjs
@@ -1,5 +1,5 @@
 import { parseArgs, runMutation, printResult } from '../stack127/tool-pages/lib.mjs';
-import { adNetworkPageCopy, upsertDirectoryPage } from '../stack127/directory-pages/lib.mjs';
+import { adNetworkPageCopy, insertDirectoryPageIfMissing } from '../stack127/directory-pages/lib.mjs';
 
 printResult(await runMutation(parseArgs(), async client => {
   const networks = (await client.query(`select network.name,network.slug,network.summary
@@ -7,6 +7,6 @@ printResult(await runMutation(parseArgs(), async client => {
       on page.slug='ad-networks/' || network.slug and page.page_family='directory'
     order by network.slug`)).rows;
   let changed = 0;
-  for (const network of networks) changed += await upsertDirectoryPage(client, adNetworkPageCopy(network));
+  for (const network of networks) changed += await insertDirectoryPageIfMissing(client, adNetworkPageCopy(network));
   return { pages: networks.length, changed };
 }));
diff --git a/scripts/keyboard-shortcuts/sync-pages.mjs b/scripts/keyboard-shortcuts/sync-pages.mjs
index 545fd2b7..24fe508b 100644
--- a/scripts/keyboard-shortcuts/sync-pages.mjs
+++ b/scripts/keyboard-shortcuts/sync-pages.mjs
@@ -4,7 +4,7 @@ import path from "node:path";
 import { pathToFileURL } from "node:url";
 
 import { parseArgs, runMutation, printResult } from "../stack127/tool-pages/lib.mjs";
-import { keyboardShortcutPageCopy, upsertDirectoryPage } from "../stack127/directory-pages/lib.mjs";
+import { keyboardShortcutPageCopy, insertDirectoryPageIfMissing } from "../stack127/directory-pages/lib.mjs";
 
 const root = path.resolve(import.meta.dirname, "../..");
 const appRoot = path.join(root, "lib/shortcuts/apps");
@@ -26,9 +26,10 @@ function writeGenerated(file, content) {
 function generatedRoute(slug) {
   return `import app from "@/lib/shortcuts/apps/${slug}";
 import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
 
 export default function KeyboardShortcutsPage() {
-  return <KeyboardShortcutsAppPage app={app} />;
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
 }
 `;
 }
@@ -38,6 +39,13 @@ const slugs = readdirSync(appRoot)
   .map((name) => name.slice(0, -3))
   .sort();
 
+const missingIntros = slugs.filter(slug => !existsSync(path.join(routeRoot, slug, "content/intro.mdx")));
+if (missingIntros.length) {
+  throw new Error(`Keyboard shortcut apps need their own intro before syncing:\n${missingIntros
+    .map(slug => `${slug}: ${path.relative(root, path.join(routeRoot, slug, "content/intro.mdx"))}`)
+    .join("\n")}`);
+}
+
 const apps = [];
 for (const slug of slugs) {
   const module = await import(pathToFileURL(path.join(appRoot, `${slug}.ts`)).href);
@@ -126,7 +134,7 @@ if (process.argv.includes("--apply")) {
     let changed = 0;
     let recordChanges = 0;
     for (const app of apps) {
-      changed += await upsertDirectoryPage(client,keyboardShortcutPageCopy(app));
+      changed += await insertDirectoryPageIfMissing(client,keyboardShortcutPageCopy(app));
       const result = await client.query('select public.stack127_sync_directory_records($1,$2::jsonb) changed',
         [`keyboard-shortcuts/${app.slug}`,JSON.stringify(app)]);
       if (result.rows[0].changed) recordChanges++;
diff --git a/scripts/stack127/content/check-mdx.mjs b/scripts/stack127/content/check-mdx.mjs
index 5bfb6cfe..8f850131 100644
--- a/scripts/stack127/content/check-mdx.mjs
+++ b/scripts/stack127/content/check-mdx.mjs
@@ -83,11 +83,11 @@ export function checkMdx(markdown, file = 'content.mdx') {
 
 export async function findContentFiles(root = 'app') {
   const files = [];
-  async function walk(directory) {
+  async function walk(directory, inContent = path.basename(directory) === 'content') {
     for (const entry of await readdir(directory, { withFileTypes: true })) {
       const file = path.join(directory, entry.name);
-      if (entry.isDirectory()) await walk(file);
-      else if (entry.name.endsWith('.mdx') && path.basename(directory) === 'content') files.push(file);
+      if (entry.isDirectory()) await walk(file, inContent || entry.name === 'content');
+      else if (entry.name.endsWith('.mdx') && inContent) files.push(file);
     }
   }
   await walk(root);
diff --git a/scripts/stack127/directory-pages/lib.mjs b/scripts/stack127/directory-pages/lib.mjs
index 214763d9..1f54d509 100644
--- a/scripts/stack127/directory-pages/lib.mjs
+++ b/scripts/stack127/directory-pages/lib.mjs
@@ -1,3 +1,17 @@
+export async function insertDirectoryPageIfMissing(client, row) {
+  const result = await client.query(`
+    insert into public.stack127_directory_pages
+      (page_id,title,intro_markdown,content_markdown,card_name,card_description)
+    select page.id,$2,$3,$4,coalesce($5,page.label),coalesce($6,page.meta_description)
+    from public.stack127_pages page
+    where page.slug=$1 and page.page_family='directory'
+    on conflict (page_id) do nothing
+    returning page_id
+  `, [row.slug, row.title, row.intro_markdown, row.content_markdown ?? null,
+    row.card_name ?? null, row.card_description ?? null]);
+  return result.rowCount;
+}
+
 export async function upsertDirectoryPage(client, row) {
   const result = await client.query(`
     insert into public.stack127_directory_pages
@@ -21,8 +35,8 @@ export async function upsertDirectoryPage(client, row) {
   return result.rowCount;
 }
 
-export async function previewDirectoryPages(pool, pages, { remove = false, refresh = false, matchesRemoval } = {}) {
-  if (remove && refresh) throw new Error('Choose --remove or --refresh');
+export async function previewDirectoryPages(pool, pages, { remove = false, refresh = false, dryRun = false, matchesRemoval } = {}) {
+  if (refresh) throw new Error('--refresh is retired; edit reviewed development fields with scripts/stack127/directory-pages/update-content.mjs');
   const client = await pool.connect();
   try {
     await client.query('begin');
@@ -36,30 +50,37 @@ export async function previewDirectoryPages(pool, pages, { remove = false, refre
     for (const page of pages) {
       const row = bySlug.get(page.slug);
       if (row && row.page_family !== 'directory') throw new Error(`Wrong page family for ${page.slug}; refusing to change it`);
-      if (remove) {
-        if (row && matchesRemoval && !matchesRemoval(row)) throw new Error(`Refusing to remove ${page.slug}: its metadata does not match the preview contract`);
-      } else {
-        if (!row?.has_directory_copy) throw new Error(`Directory page copy is missing for ${page.slug}; refusing to publish or refresh it`);
-        if (!refresh && row.is_published) throw new Error(`A published registry row already exists for ${page.slug}; refusing to overwrite it`);
+      if (remove && row && matchesRemoval && !matchesRemoval(row)) {
+        throw new Error(`Refusing to remove ${page.slug}: its metadata does not match the preview contract`);
       }
     }
     for (const page of pages) {
-      const row = bySlug.get(page.slug);
+      let row = bySlug.get(page.slug);
       if (remove) {
         if (row && (row.is_published || row.published_at || row.updated_at)) await client.query(`update public.stack127_pages
           set is_published=false,published_at=null,updated_at=null where id=$1`, [row.id]);
-      } else {
-        if (row.label === page.label && row.meta_title === page.title && row.meta_description === page.description
-          && (refresh || row.is_published)) continue;
-        await client.query(`update public.stack127_pages set label=$2,meta_title=$3,meta_description=$4,
-          is_published=case when $5::boolean then is_published else true end,
-          published_at=case when $5::boolean then published_at else coalesce(published_at,now()) end,
-          updated_at=case when is_published or not $5::boolean then now() else null end
-          where id=$1`, [row.id, page.label, page.title, page.description, refresh]);
+        continue;
+      }
+      if (!row) {
+        await client.query(`insert into public.stack127_pages
+          (slug,page_family,label,meta_title,meta_description,is_published,page_type,sitemap_priority)
+          values($1,'directory',$2,$3,$4,false,$5,$6) on conflict(slug) do nothing`,
+          [page.slug, page.label, page.title, page.description, page.pageType ?? 'CollectionPage', page.priority ?? 0.5]);
+        row = (await client.query('select * from public.stack127_pages where slug=$1 for update', [page.slug])).rows[0];
+        if (row.page_family !== 'directory') throw new Error(`Wrong page family for ${page.slug}; refusing to change it`);
+        bySlug.set(page.slug, row);
+      }
+      if (!row.has_directory_copy) {
+        await insertDirectoryPageIfMissing(client, {
+          slug: page.slug, title: row.label, intro_markdown: row.meta_description, content_markdown: null,
+        });
       }
+      if (!row.is_published) await client.query(`update public.stack127_pages
+        set is_published=true,published_at=coalesce(published_at,now()),updated_at=now()
+        where id=$1 and not is_published`, [row.id]);
     }
-    await client.query('commit');
-    return rows.length;
+    await client.query(dryRun ? 'rollback' : 'commit');
+    return bySlug.size;
   } catch (error) {
     await client.query('rollback').catch(() => {});
     throw error;
@@ -72,8 +93,8 @@ export function keyboardShortcutPageCopy(app) {
   return {
     slug: `keyboard-shortcuts/${app.slug}`,
     title: `<mark>${app.name}</mark> keyboard shortcuts`,
-    intro_markdown: app.intro,
-    content_markdown: `<!-- section:print -->\n## Print the shortcuts you use\n\n[Make a printable ${app.name} sheet](/shortcuts-cheatsheet-generator?apps=${app.slug})`,
+    intro_markdown: `Find keyboard shortcuts for ${app.name}.`,
+    content_markdown: null,
   };
 }
 
diff --git a/scripts/stack127/preview-hardware-directories.mjs b/scripts/stack127/preview-hardware-directories.mjs
index 77efa9d2..997e5f76 100644
--- a/scripts/stack127/preview-hardware-directories.mjs
+++ b/scripts/stack127/preview-hardware-directories.mjs
@@ -33,11 +33,12 @@ function databaseUrl() {
 
 const remove = process.argv.includes("--remove");
 const refresh = process.argv.includes("--refresh");
+const dryRun = process.argv.includes("--dry-run");
 const pool = new pg.Pool({ connectionString: databaseUrl(), connectionTimeoutMillis: 15_000, idleTimeoutMillis: 10_000, max: 1, query_timeout: 15_000 });
 
 try {
-  const count = await previewDirectoryPages(pool, pages, { remove, refresh });
-  console.log(`${remove ? "Unpublished" : refresh ? "Refreshed metadata for" : "Published"} ${count} managed-development hardware directory preview rows.`);
+  const count = await previewDirectoryPages(pool, pages, { remove, refresh, dryRun });
+  console.log(`${dryRun ? "Would " : ""}${remove ? (dryRun ? "unpublish" : "Unpublished") : (dryRun ? "publish" : "Published")} ${count} managed-development hardware directory preview rows.${dryRun ? " Rolled back." : ""}`);
 } finally {
   await pool.end();
 }
diff --git a/scripts/zigbee-devices/preview-local-page.mjs b/scripts/zigbee-devices/preview-local-page.mjs
index 2e81f92f..99c19d1f 100644
--- a/scripts/zigbee-devices/preview-local-page.mjs
+++ b/scripts/zigbee-devices/preview-local-page.mjs
@@ -56,6 +56,8 @@ function matchesPreview(row) {
 }
 
 const remove = process.argv.includes("--remove");
+const refresh = process.argv.includes("--refresh");
+const dryRun = process.argv.includes("--dry-run");
 const pool = new pg.Pool({
   connectionString: requireManagedDevelopmentEnvironment(),
   connectionTimeoutMillis: 15_000,
@@ -65,8 +67,8 @@ const pool = new pg.Pool({
 });
 
 try {
-  await previewDirectoryPages(pool, [PREVIEW_ROW], { remove, matchesRemoval: matchesPreview });
-  console.log(`${remove ? "Unpublished" : "Published"} the managed-development Zigbee directory preview row.`);
+  await previewDirectoryPages(pool, [PREVIEW_ROW], { remove, refresh, dryRun, matchesRemoval: matchesPreview });
+  console.log(`${dryRun ? "Would " : ""}${remove ? (dryRun ? "unpublish" : "Unpublished") : (dryRun ? "publish" : "Published")} the managed-development Zigbee directory preview row.${dryRun ? " Rolled back." : ""}`);
 } finally {
   await pool.end();
 }
diff --git a/stack127_docs/directory-pages.md b/stack127_docs/directory-pages.md
index 4550f281..30145c82 100644
--- a/stack127_docs/directory-pages.md
+++ b/stack127_docs/directory-pages.md
@@ -29,13 +29,15 @@ Every published child page gets its own row, for example `/ad-networks/<slug>` o
 
 Every child page also gets its own words, written for that page: an intro at least, and sections when the page needs them. They live in MDX, as [page-content.md](page-content.md) describes. A child page with its own route folder, such as `/keyboard-shortcuts/figma`, keeps them in `content/` beside its `page.tsx`. Platform fee categories share `platform-fees/[section]/`, so each category has a folder under that route's `content/`, named for its slug.
 
-Record sync scripts own the records and the generated route files. They must not write over a child page's words, title, or search metadata. A script that generates child routes, such as the keyboard shortcuts sync, generates each `page.tsx` to pass the page's own `content/` files to the template. Write the title and search metadata with the directory writing skill, then publish them with `"source": "development"` in the manifest. See [page-publishing.md](page-publishing.md).
+Record sync scripts own the records and the generated route files. They leave existing page words, titles, search metadata, and cards alone. They may insert a starting database row when one is missing. The keyboard shortcuts sync requires every app's `content/intro.mdx` before writing any files, including in `--check` mode. It passes that intro to the template; the template renders the print link. Write the title and search metadata with the directory writing skill, then publish them with `"source": "development"` in the manifest. See [page-publishing.md](page-publishing.md).
 
-| Directory | Record script |
-| --- | --- |
-| Keyboard shortcuts | `scripts/keyboard-shortcuts/sync-pages.mjs` |
-| Ad networks | `scripts/ad-networks/sync-page-copy.mjs` |
-| Platform fees | `scripts/platform-fees/sync-development.mjs`, then `prepare-category-manifest.mjs` for the manifest |
+| Directory | Record script | Page fields |
+| --- | --- | --- |
+| Keyboard shortcuts | `scripts/keyboard-shortcuts/sync-pages.mjs` | `--apply` inserts missing child rows, then syncs app records and the hub snapshot. Existing page fields stay as written. |
+| Ad networks | `scripts/ad-networks/sync-page-copy.mjs` | Inserts missing child rows only. Existing page fields stay as written. |
+| Platform fees | `scripts/platform-fees/sync-development.mjs`, `sync-records.mjs`, then `prepare-category-manifest.mjs` | Syncs records and inserts missing page rows. The manifest takes reviewed page fields from development. |
+
+The managed-development hardware preview scripts, `scripts/stack127/preview-hardware-directories.mjs` and `scripts/zigbee-devices/preview-local-page.mjs`, insert starting rows only when missing. Existing titles, words, cards, and search fields stay as written. Normal runs publish drafts; published pages stay unchanged. `--remove` unpublishes without deleting rows. Zigbee removal still requires the original preview metadata. Add `--dry-run` to preview either operation and roll back. The old hardware `--refresh` flag overwrote search fields; both scripts now reject it. Use the single-page editor below for reviewed changes.
 
 ## Public dates
 
diff --git a/tests/stack127/directory-pages.test.mjs b/tests/stack127/directory-pages.test.mjs
index 5739b28d..8e927d5b 100644
--- a/tests/stack127/directory-pages.test.mjs
+++ b/tests/stack127/directory-pages.test.mjs
@@ -19,11 +19,11 @@ test('titles preserve their marked phrase and treat other HTML as text', () => {
   assert.deepEqual(directoryTitleParts('<script>alert(1)</script>'), [{ text: '<script>alert(1)</script>', marked: false }]);
 });
 
-test('generated child copy uses the record identity and current intro', () => {
+test('new child rows use record identity and keyboard rows leave the print section to the route', () => {
   const shortcut = keyboardShortcutPageCopy({ slug: 'demo', name: 'Demo', intro: 'Current record intro.' });
   assert.equal(shortcut.slug, 'keyboard-shortcuts/demo');
-  assert.equal(shortcut.intro_markdown, 'Current record intro.');
-  assert.match(shortcut.content_markdown, /apps=demo/);
+  assert.equal(shortcut.title, '<mark>Demo</mark> keyboard shortcuts');
+  assert.equal(shortcut.content_markdown, null);
   const network = adNetworkPageCopy({ slug: 'demo', name: 'Demo', summary: null });
   assert.equal(network.slug, 'ad-networks/demo');
   assert.match(network.intro_markdown, /verified Demo relationship/);
diff --git a/tests/stack127/directory-previews.test.mjs b/tests/stack127/directory-previews.test.mjs
index 3b437bae..d38b9c95 100644
--- a/tests/stack127/directory-previews.test.mjs
+++ b/tests/stack127/directory-previews.test.mjs
@@ -22,7 +22,7 @@ function database(slugs) {
   const copies = rows.map(row => ({
     page_id: row.id, title: `Edited <mark>${row.slug}</mark>`, intro_markdown: 'Edited intro.',
     content_markdown: 'Edited page content.', card_name: 'Edited card name',
-    card_description: 'Edited card description.', row_updated_at: '2026-10-02',
+    card_description: 'Edited card description.', card_icon_key: 'layers', card_art_key: 'catalog/test', row_updated_at: '2026-10-02',
   }));
   const state = { rows, copies, failUpdate: null };
   let snapshot;
@@ -46,15 +46,32 @@ function database(slugs) {
         state.copies = state.copies.filter(copy => !removedIds.includes(copy.page_id));
         return { rows: [] };
       }
+      if (query.startsWith('insert into public.stack127_pages')) {
+        if (state.rows.some(row => row.slug === args[0])) return { rows: [], rowCount: 0 };
+        const [slug, label, title, description, pageType, priority] = args;
+        state.rows.push({ id: Math.max(0, ...state.rows.map(row => row.id)) + 1,
+          slug, label, meta_title: title, meta_description: description, page_family: 'directory',
+          page_type: pageType, sitemap_priority: priority, is_published: false, published_at: null, updated_at: null });
+        return { rows: [], rowCount: 1 };
+      }
+      if (query.startsWith('insert into public.stack127_directory_pages')) {
+        const row = state.rows.find(row => row.slug === args[0] && row.page_family === 'directory');
+        if (!row || state.copies.some(copy => copy.page_id === row.id)) return { rows: [], rowCount: 0 };
+        state.copies.push({ page_id: row.id, title: args[1], intro_markdown: args[2], content_markdown: args[3],
+          card_name: args[4] ?? row.label, card_description: args[5] ?? row.meta_description, row_updated_at: 'now' });
+        return { rows: [{ page_id: row.id }], rowCount: 1 };
+      }
       if (query.startsWith('update')) {
         const row = state.rows.find(row => row.id === args[0]);
         if (row.slug === state.failUpdate) throw new Error('Preview update failed');
         if (query.includes('is_published=false')) {
           Object.assign(row, { is_published: false, published_at: null, updated_at: null });
-        } else {
+        } else if (query.includes('label=')) {
           const [, label, title, description, refresh] = args;
           Object.assign(row, { label, meta_title: title, meta_description: description });
           if (!refresh) Object.assign(row, { is_published: true, published_at: 'now', updated_at: 'now' });
+        } else {
+          Object.assign(row, { is_published: true, published_at: row.published_at ?? 'now', updated_at: 'now' });
         }
         return { rows: [] };
       }
@@ -88,6 +105,7 @@ for (const preview of cases) {
   test(`${preview.name} removal and republishing preserve edited copy, cards, timestamps, and IDs`, async () => {
     const { state, pool } = database(preview.slugs);
     const before = structuredClone(state.copies);
+    const searchBefore = state.rows.map(row => ({ label: row.label, title: row.meta_title, description: row.meta_description }));
     const ids = state.rows.map(row => row.id);
     await runScript(preview.script, ['--remove'], pool);
     assert.ok(state.rows.every(row => !row.is_published));
@@ -96,22 +114,58 @@ for (const preview of cases) {
     assert.ok(state.rows.every(row => row.is_published));
     assert.deepEqual(state.rows.map(row => row.id), ids);
     assert.deepEqual(state.copies, before);
+    assert.deepEqual(state.rows.map(row => ({ label: row.label, title: row.meta_title, description: row.meta_description })), searchBefore);
   });
 
-  test(`${preview.name} preview rejects missing copy without publishing any pages`, async () => {
+  test(`${preview.name} preview inserts only missing directory copy and preserves existing fields`, async () => {
     const { state, pool } = database(preview.slugs);
     state.rows.forEach(row => { row.is_published = false; });
     state.copies.pop();
+    const before = structuredClone(state.copies);
+    const searchBefore = state.rows.map(row => [row.label, row.meta_title, row.meta_description]);
+    await runScript(preview.script, [], pool);
+    assert.ok(state.rows.every(row => row.is_published));
+    assert.deepEqual(state.copies.slice(0, before.length), before);
+    assert.equal(state.copies.length, preview.slugs.length);
+    assert.deepEqual(state.rows.map(row => [row.label, row.meta_title, row.meta_description]), searchBefore);
+    const initialized = state.copies.at(-1);
+    assert.equal(initialized.intro_markdown, state.rows.at(-1).meta_description);
+    assert.equal(initialized.content_markdown, null);
+  });
+
+  test(`${preview.name} preview leaves published rows and their dates unchanged`, async () => {
+    const { state, pool } = database(preview.slugs);
     const before = structuredClone({ rows: state.rows, copies: state.copies });
-    await assert.rejects(runScript(preview.script, [], pool), /Directory page copy is missing/);
+    await runScript(preview.script, [], pool);
     assert.deepEqual({ rows: state.rows, copies: state.copies }, before);
   });
 
-  test(`${preview.name} preview refuses to overwrite published pages`, async () => {
+  test(`${preview.name} preview initializes missing registry and directory rows once`, async () => {
+    const { state, pool } = database([]);
+    await runScript(preview.script, [], pool);
+    assert.equal(state.rows.length, preview.slugs.length);
+    assert.equal(state.copies.length, preview.slugs.length);
+    assert.ok(state.rows.every(row => row.is_published && row.page_family === 'directory'));
+    const before = structuredClone({ rows: state.rows, copies: state.copies });
+    await runScript(preview.script, [], pool);
+    assert.deepEqual({ rows: state.rows, copies: state.copies }, before);
+  });
+
+  test(`${preview.name} dry runs roll back publication, removal, and missing-row insertion`, async () => {
+    for (const operation of ['publish', 'remove', 'insert']) {
+      const { state, pool } = database(operation === 'insert' ? [] : preview.slugs);
+      if (operation === 'publish') state.rows.forEach(row => { row.is_published = false; });
+      const before = structuredClone({ rows: state.rows, copies: state.copies });
+      await runScript(preview.script, ['--dry-run', ...(operation === 'remove' ? ['--remove'] : [])], pool);
+      assert.deepEqual({ rows: state.rows, copies: state.copies }, before);
+    }
+  });
+
+  test(`${preview.name} rejects the retired refresh flag without changing fields`, async () => {
     const { state, pool } = database(preview.slugs);
-    const before = structuredClone(state.rows);
-    await assert.rejects(runScript(preview.script, [], pool), /published registry row already exists/);
-    assert.deepEqual(state.rows, before);
+    const before = structuredClone({ rows: state.rows, copies: state.copies });
+    await assert.rejects(runScript(preview.script, ['--refresh'], pool), /--refresh is retired/);
+    assert.deepEqual({ rows: state.rows, copies: state.copies }, before);
   });
 
   test(`${preview.name} preview rejects another page family`, async () => {
@@ -136,15 +190,6 @@ test('hardware preview rolls back the entire batch when an update fails', async
   assert.deepEqual({ rows: state.rows, copies: state.copies }, before);
 });
 
-test('hardware metadata refresh preserves unpublished visibility and directory copy', async () => {
-  const { state, pool } = database(hardwareSlugs);
-  state.rows.forEach(row => { row.is_published = false; });
-  const before = structuredClone(state.copies);
-  await runScript(cases[0].script, ['--refresh'], pool);
-  assert.ok(state.rows.every(row => !row.is_published));
-  assert.deepEqual(state.copies, before);
-});
-
 test('Zigbee removal retains the preview metadata guard', async () => {
   const { state, pool } = database(['zigbee-devices']);
   state.rows[0].meta_title = 'Another page';
diff --git a/tests/stack127/keyboard-shortcuts-sync.test.mjs b/tests/stack127/keyboard-shortcuts-sync.test.mjs
new file mode 100644
index 00000000..feeadad2
--- /dev/null
+++ b/tests/stack127/keyboard-shortcuts-sync.test.mjs
@@ -0,0 +1,82 @@
+import assert from 'node:assert/strict';
+import { spawnSync } from 'node:child_process';
+import { cp, mkdir, mkdtemp, readFile, rm, symlink, writeFile } from 'node:fs/promises';
+import { tmpdir } from 'node:os';
+import path from 'node:path';
+import test from 'node:test';
+import { fileURLToPath } from 'node:url';
+
+const repo = fileURLToPath(new URL('../../', import.meta.url));
+const route = 'app/(site)/(directories)/keyboard-shortcuts';
+
+async function fixture(t) {
+  const root = await mkdtemp(path.join(tmpdir(), 'stack127-shortcut-sync-'));
+  t.after(() => rm(root, { recursive: true, force: true }));
+  for (const file of ['scripts/keyboard-shortcuts/sync-pages.mjs',
+    'scripts/stack127/directory-pages/lib.mjs', 'scripts/stack127/tool-pages/lib.mjs']) {
+    await mkdir(path.dirname(path.join(root, file)), { recursive: true });
+    await cp(path.join(repo, file), path.join(root, file));
+  }
+  await symlink(path.join(repo, 'node_modules'), path.join(root, 'node_modules'), 'dir');
+  await mkdir(path.join(root, 'lib/shortcuts/apps'), { recursive: true });
+  for (const slug of ['alpha', 'beta']) {
+    await writeFile(path.join(root, `lib/shortcuts/apps/${slug}.ts`),
+      `export default ${JSON.stringify({ slug, name: slug, category: 'Editor', platforms: ['linux'], groups: [] })};\n`);
+  }
+  return root;
+}
+
+function run(root, ...args) {
+  const result = spawnSync(process.execPath, ['--experimental-strip-types', 'scripts/keyboard-shortcuts/sync-pages.mjs', ...args],
+    { cwd: root, encoding: 'utf8', timeout: 15000 });
+  assert.ifError(result.error);
+  return result;
+}
+
+test('missing intros stop generation and checks before any files change, and name every app', async t => {
+  const root = await fixture(t);
+  const existing = path.join(root, route, 'alpha/page.tsx');
+  await mkdir(path.dirname(existing), { recursive: true });
+  await writeFile(existing, 'Existing route');
+  await writeFile(path.join(root, 'lib/shortcuts/catalog.generated.ts'), 'Existing catalog');
+  for (const args of [[], ['--check'], ['--apply', '--environment', 'development']]) {
+    const result = run(root, ...args);
+    assert.equal(result.status, 1, result.stderr);
+    for (const slug of ['alpha', 'beta']) assert.ok(result.stderr.includes(`${slug}: ${route}/${slug}/content/intro.mdx`));
+    assert.equal(await readFile(existing, 'utf8'), 'Existing route');
+    assert.equal(await readFile(path.join(root, 'lib/shortcuts/catalog.generated.ts'), 'utf8'), 'Existing catalog');
+    await assert.rejects(readFile(path.join(root, 'lib/shortcuts/loaders.generated.ts')), { code: 'ENOENT' });
+    await assert.rejects(readFile(path.join(root, route, 'beta/page.tsx')), { code: 'ENOENT' });
+  }
+});
+
+test('generated child routes pass their own MDX intro to the template and checks detect stale routes', async t => {
+  const root = await fixture(t);
+  for (const slug of ['alpha', 'beta']) {
+    const directory = path.join(root, route, slug, 'content');
+    await mkdir(directory, { recursive: true });
+    await writeFile(path.join(directory, 'intro.mdx'), 'Written intro.\n');
+  }
+  const generated = run(root);
+  assert.equal(generated.status, 0, generated.stderr);
+  for (const slug of ['alpha', 'beta']) {
+    assert.equal(await readFile(path.join(root, route, slug, 'page.tsx'), 'utf8'),
+      `import app from "@/lib/shortcuts/apps/${slug}";
+import { KeyboardShortcutsAppPage } from "../keyboard-shortcuts-app-page";
+import Intro from "./content/intro.mdx";
+
+export default function KeyboardShortcutsPage() {
+  return <KeyboardShortcutsAppPage app={app} intro={<Intro />} />;
+}
+`);
+    assert.equal(await readFile(path.join(root, route, slug, 'content/intro.mdx'), 'utf8'), 'Written intro.\n');
+  }
+  const checked = run(root, '--check');
+  assert.equal(checked.status, 0, checked.stderr);
+  const stale = path.join(root, route, 'alpha/page.tsx');
+  await writeFile(stale, 'Stale route');
+  const result = run(root, '--check');
+  assert.equal(result.status, 1, result.stderr);
+  assert.ok(result.stderr.includes(`${route}/alpha/page.tsx`), result.stderr);
+  assert.equal(await readFile(stale, 'utf8'), 'Stale route');
+});
diff --git a/tests/stack127/page-content.test.mjs b/tests/stack127/page-content.test.mjs
index a19ce859..567a23a0 100644
--- a/tests/stack127/page-content.test.mjs
+++ b/tests/stack127/page-content.test.mjs
@@ -214,6 +214,12 @@ test('scans only content MDX, passes empty trees, and reports the failing file',
     const file = path.join(root, 'route/content/article.mdx');
     await writeFile(file, 'Intro\n\n# Wrong');
     assert.match((await checkContentFiles(root))[0], new RegExp(`${file}:3:`));
+    await mkdir(path.join(root, 'route/content/category/details'), { recursive: true });
+    const nested = path.join(root, 'route/content/category/details/intro.mdx');
+    await writeFile(nested, 'Intro\n\n# Wrong');
+    const errors = await checkContentFiles(root);
+    assert.equal(errors.length, 2);
+    assert.ok(errors.some(error => error.startsWith(`${nested}:3:`)));
   } finally { await rm(root, { recursive: true, force: true }); }
 });
 

From c73e6190ff5b5d9e7548d65bea1950f3c92de838 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:48 +0530
Subject: [PATCH 07/25] Rewrite the six other DNS tool pages in MDX

CAA, DNS change, DNSSEC, DNS trace, nameserver, and SOA checkers. Each
covers its own check and links to /dns-lookup for shared basics.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(dns)/caa-checker/content/article.mdx     | 38 +++++++++++++++++++
 .../(dns)/caa-checker/content/intro.mdx       |  1 +
 .../(dns)/caa-checker/content/usage.mdx       | 20 ++++++++++
 app/(site)/(tools)/(dns)/caa-checker/page.tsx | 11 +++++-
 .../dns-change-checker/content/article.mdx    | 27 +++++++++++++
 .../dns-change-checker/content/intro.mdx      |  3 ++
 .../dns-change-checker/content/usage.mdx      | 28 ++++++++++++++
 .../(tools)/(dns)/dns-change-checker/page.tsx | 11 +++++-
 .../(dns)/dns-trace/content/article.mdx       | 29 ++++++++++++++
 .../(tools)/(dns)/dns-trace/content/intro.mdx |  1 +
 .../(tools)/(dns)/dns-trace/content/usage.mdx | 15 ++++++++
 app/(site)/(tools)/(dns)/dns-trace/page.tsx   | 11 +++++-
 .../(dns)/dnssec-checker/content/article.mdx  | 38 +++++++++++++++++++
 .../(dns)/dnssec-checker/content/intro.mdx    |  1 +
 .../(dns)/dnssec-checker/content/usage.mdx    | 18 +++++++++
 .../(tools)/(dns)/dnssec-checker/page.tsx     | 11 +++++-
 .../nameserver-checker/content/article.mdx    | 31 +++++++++++++++
 .../nameserver-checker/content/intro.mdx      |  1 +
 .../nameserver-checker/content/usage.mdx      | 15 ++++++++
 .../(tools)/(dns)/nameserver-checker/page.tsx | 11 +++++-
 .../(dns)/soa-checker/content/article.mdx     | 30 +++++++++++++++
 .../(dns)/soa-checker/content/intro.mdx       |  1 +
 .../(dns)/soa-checker/content/usage.mdx       | 15 ++++++++
 app/(site)/(tools)/(dns)/soa-checker/page.tsx | 11 +++++-
 24 files changed, 366 insertions(+), 12 deletions(-)
 create mode 100644 app/(site)/(tools)/(dns)/caa-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/caa-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/caa-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-change-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-change-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-change-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-trace/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-trace/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dns-trace/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dnssec-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dnssec-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/dnssec-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(dns)/nameserver-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/nameserver-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/nameserver-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(dns)/soa-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/(dns)/soa-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(dns)/soa-checker/content/usage.mdx

diff --git a/app/(site)/(tools)/(dns)/caa-checker/content/article.mdx b/app/(site)/(tools)/(dns)/caa-checker/content/article.mdx
new file mode 100644
index 00000000..fc03aedf
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/caa-checker/content/article.mdx
@@ -0,0 +1,38 @@
+## How does CAA find the policy for a name?
+
+It uses the closest name that has CAA records. The check starts at the exact hostname and moves up one level at a time. The first name with records holds the whole policy, and anything higher up is ignored.
+
+1. `www.shop.example.com` has no CAA records.
+2. `shop.example.com` has no CAA records.
+3. `example.com` has CAA records. This is the policy.
+
+If no name up to the top-level domain has CAA records, CAA doesn't restrict anyone.
+
+If a name is an alias (a CNAME), its target's CAA records count. The search doesn't climb the target's parent domains. It goes back to the parents of the name you entered. [RFC 8659](https://www.rfc-editor.org/rfc/rfc8659.html#section-3) defines this search.
+
+## What do issue, issuewild, and iodef mean?
+
+<Terms>
+<Term name="issue">Allows one certificate authority to issue normal certificates. With no `issuewild`, it covers wildcards too.</Term>
+<Term name="issuewild">Allows one certificate authority to issue wildcard certificates, such as `*.example.com`. When any `issuewild` exists, wildcards ignore `issue`.</Term>
+<Term name="iodef">An email or web address for reports about blocked requests. It doesn't allow or block anything.</Term>
+<Term name='issue ";"'>An empty value. On its own, it allows no certificate authority.</Term>
+<Term name="Flag 128">Marks a record as critical. A certificate authority that doesn't understand it must refuse to issue.</Term>
+</Terms>
+
+Several `issue` records add up, and each one allows one more certificate authority. A policy with only `issuewild` records leaves normal certificates unrestricted.
+
+Use the value your certificate authority publishes for CAA, such as `letsencrypt.org` for [Let's Encrypt](https://letsencrypt.org/docs/caa/) or `digicert.com` for [DigiCert](https://docs.digicert.com/en/certcentral/manage-certificates/dns-caa-resource-record-check.html).
+
+## Why was my certificate blocked by CAA?
+
+These are the usual causes:
+
+- A parent domain has CAA records you forgot, and your certificate authority isn't in them.
+- You listed one certificate authority, but your host or CDN gets certificates from another. Check its docs before you restrict issuance.
+- The certificate is a wildcard, and `issuewild` doesn't list your certificate authority.
+- The CAA lookup itself fails. The result then says the policy couldn't be determined. [DNS lookup](/dns-lookup) explains SERVFAIL and other errors, and the [DNSSEC checker](/dnssec-checker) finds broken signatures, one possible cause.
+
+Being allowed by CAA doesn't mean a certificate will be issued. The certificate authority still checks that you control the domain. This check reads the policy only and doesn't list certificates already issued.
+
+The check asks Cloudflare's public resolver from stack127's server. stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/caa-checker/content/intro.mdx b/app/(site)/(tools)/(dns)/caa-checker/content/intro.mdx
new file mode 100644
index 00000000..5cb7175a
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/caa-checker/content/intro.mdx
@@ -0,0 +1 @@
+Enter the hostname your certificate will cover to see which certificate authorities may issue for it. The check finds the CAA policy that applies, even when it's set on a parent domain, and answers separately for normal and wildcard certificates.
diff --git a/app/(site)/(tools)/(dns)/caa-checker/content/usage.mdx b/app/(site)/(tools)/(dns)/caa-checker/content/usage.mdx
new file mode 100644
index 00000000..6bb0783b
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/caa-checker/content/usage.mdx
@@ -0,0 +1,20 @@
+## How to read the result
+
+The result names the certificate authorities allowed for normal and for wildcard certificates. Each one appears as the domain it uses in CAA, such as `letsencrypt.org`.
+
+| You see | What it means |
+| --- | --- |
+| Names, then `may issue.` | Only those certificate authorities may issue. |
+| `CAA does not restrict this kind of certificate.` | CAA lets any certificate authority issue. |
+| `No certificate authority is allowed.` | The policy blocks every certificate authority. |
+| `Policy inherited from` a name | The records sit on a parent domain, not on the name you entered. |
+
+`Where the policy came from` lists each name the check asked, in order.
+
+<Example title="api.github.com">
+
+`api.github.com` has no CAA records of its own, so the check moves up to `github.com` and finds 7. For normal certificates, `digicert.com`, `globalsign.com`, `letsencrypt.org`, and `sectigo.com` may issue. Wildcard certificates leave out `globalsign.com`, because the `issuewild` records don't list it.
+
+Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/caa-checker/page.tsx b/app/(site)/(tools)/(dns)/caa-checker/page.tsx
index 010efd36..b97c0b9c 100644
--- a/app/(site)/(tools)/(dns)/caa-checker/page.tsx
+++ b/app/(site)/(tools)/(dns)/caa-checker/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { FileKey } from "lucide-react";
 import { CaaCheckerFromUrl } from "./caa-checker-from-url";
 import styles from "@/app/(site)/(tools)/(dns)/dns-diagnostics.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function CaaCheckerPage() {
   const toolPage = await getRequiredToolPage("caa-checker");
@@ -13,12 +16,16 @@ export default async function CaaCheckerPage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<FileKey strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <CaaCheckerFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(dns)/dns-change-checker/content/article.mdx b/app/(site)/(tools)/(dns)/dns-change-checker/content/article.mdx
new file mode 100644
index 00000000..391ccfa8
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-change-checker/content/article.mdx
@@ -0,0 +1,27 @@
+## How long does DNS propagation take?
+
+Up to the old record's TTL, counted from when your nameservers start serving the change. A resolver that cached the old record keeps it until that TTL runs out, then fetches the new one.
+
+<Example title="Old TTL of 3,600 seconds">
+
+You change an A record at 2:00 pm, and the nameservers serve it within a minute. A resolver that cached the old record at 1:59 pm can keep it until about 3:00 pm.
+
+</Example>
+
+Lowering the TTL after the change doesn't speed up copies already cached. A record that didn't exist before can be cached as missing. Resolvers then wait for the zone's negative cache time, which the [SOA checker](/soa-checker) shows. [DNS lookup](/dns-lookup) explains TTL and caching in more detail.
+
+## What if the nameservers don't agree?
+
+Sort that out first. Resolvers can fetch from any of them, so some keep getting the old answer. The provider may still be syncing, or one server may have stopped getting updates. The result links to the [SOA checker](/soa-checker), which shows whether one server has an older version of the zone.
+
+If no nameserver shows the new value, the change isn't live. Check that you edited the DNS provider this domain actually uses. The [nameserver checker](/nameserver-checker) shows which nameservers that is.
+
+## Can resolvers disagree without being out of date?
+
+Yes. Large sites and CDNs answer by location, so two resolvers can get different addresses and both be right. Some providers also rotate addresses on every reply. If a resolver still differs after its `Resolver TTL` has run out, the cause isn't an old copy.
+
+## Does this check propagation worldwide?
+
+No. It asks 7 public resolvers from stack127's server, not your computer. Your internet provider's resolver, your router, and your VPN aren't included, so they can show another answer.
+
+IPv6 nameserver addresses are skipped when the checker has no IPv6 route, and the result says so. stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/dns-change-checker/content/intro.mdx b/app/(site)/(tools)/(dns)/dns-change-checker/content/intro.mdx
new file mode 100644
index 00000000..85f8f782
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-change-checker/content/intro.mdx
@@ -0,0 +1,3 @@
+Enter the name and record type you changed to see if the change is live. The check asks each of the domain's nameservers, then 7 public resolvers, and shows which ones return the new answer.
+
+Add the value you expect, and the result shows which sources return it.
diff --git a/app/(site)/(tools)/(dns)/dns-change-checker/content/usage.mdx b/app/(site)/(tools)/(dns)/dns-change-checker/content/usage.mdx
new file mode 100644
index 00000000..259e9d99
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-change-checker/content/usage.mdx
@@ -0,0 +1,28 @@
+## What to enter as the expected answer
+
+Type the value the way DNS returns it. Capital letters and a final dot don't matter.
+
+| Type | Enter it like this |
+| --- | --- |
+| A or AAAA | `203.0.113.10` |
+| MX | `10 mail.example.com`, with the priority first |
+| TXT | `"v=spf1 -all"`, with the quotes |
+| CNAME | `target.example.net` |
+
+A TXT value without its quotes won't match anything.
+
+## How to read the result
+
+`Published by authoritative nameservers` is the source: what the domain's own servers hand out now. `Seen in public resolver caches` shows the copy each resolver gives its users.
+
+A resolver marked `Matches reference` returns the same records as the nameservers. `Different answer` means it returns something else. The comparison ignores record order. `Resolver TTL` is the seconds left on that resolver's copy.
+
+<Example title="example.com, A record">
+
+All 12 nameserver addresses return `104.20.23.154` and `172.66.147.243`. Six of 7 resolvers match. Yandex DNS returns `8.47.69.5` and `8.6.112.5` instead.
+
+Both sets are on Cloudflare's network, AS13335. An answer like this usually comes from the provider answering by location, not from an old copy.
+
+Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/dns-change-checker/page.tsx b/app/(site)/(tools)/(dns)/dns-change-checker/page.tsx
index 072cd982..008d99e9 100644
--- a/app/(site)/(tools)/(dns)/dns-change-checker/page.tsx
+++ b/app/(site)/(tools)/(dns)/dns-change-checker/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { RefreshCw } from "lucide-react";
 import { DnsChangeCheckerFromUrl } from "./dns-change-checker-from-url";
 import styles from "./dns-change-checker.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DnsChangeCheckerPage() {
   const toolPage = await getRequiredToolPage("dns-change-checker");
@@ -13,10 +16,14 @@ export default async function DnsChangeCheckerPage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<RefreshCw strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <DnsChangeCheckerFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(dns)/dns-trace/content/article.mdx b/app/(site)/(tools)/(dns)/dns-trace/content/article.mdx
new file mode 100644
index 00000000..c564bd2a
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-trace/content/article.mdx
@@ -0,0 +1,29 @@
+## How does a DNS trace work?
+
+It asks each server directly, starting at the root, instead of asking a resolver. A resolver does the same walk for you, but it keeps copies and may hand back a saved answer. The trace keeps no copies, so it shows what the servers publish right now.
+
+DNS is split into zones. The root servers know who runs `.com`, the `.com` servers know who runs `example.com`, and that domain's own nameservers hold its records.
+
+## Where can a trace stop, and what does it mean?
+
+| Where it stops | Usual cause |
+| --- | --- |
+| At the root | The top-level domain doesn't exist, or no root server could be reached. |
+| At the top-level domain | The domain isn't in the registry's zone. It may not be registered, may have expired, or may be on hold. |
+| Before the domain's nameservers | The referral named nameservers, but none had a reachable public address. |
+| At the domain's nameservers | Read the response. NXDOMAIN means the name doesn't exist. SERVFAIL, REFUSED, or no reply means the server isn't answering properly. |
+| After an alias | The alias target doesn't exist, can't be reached, or points back in a loop. |
+
+A name doesn't need every record type, so "returned no AAAA record" is often fine. [DNS lookup](/dns-lookup) explains each response code.
+
+## What is glue in a trace?
+
+Glue is a nameserver's address, sent along with a referral. The parent zone includes it when a nameserver's name sits inside the domain it serves, such as `ns1.example.com` for `example.com`. Without it, nobody could find that nameserver's address. The [nameserver checker](/nameserver-checker) tests whether the glue is right.
+
+## Should I use a trace or a lookup?
+
+Use [DNS lookup](/dns-lookup) to see the answer people get from resolvers. Use the trace when a lookup fails and you need to see where, or after you change nameservers at your registrar.
+
+The trace doesn't check DNSSEC signatures. The [DNSSEC checker](/dnssec-checker) does.
+
+The trace sends the name straight from stack127's server to the root, top-level domain, and domain nameservers. stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/dns-trace/content/intro.mdx b/app/(site)/(tools)/(dns)/dns-trace/content/intro.mdx
new file mode 100644
index 00000000..04edd883
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-trace/content/intro.mdx
@@ -0,0 +1 @@
+Enter a name and record type to follow the lookup from the root servers down to the answer, the way `dig +trace` does. Each step shows which server was asked and where it pointed next, so you can see where a lookup stops.
diff --git a/app/(site)/(tools)/(dns)/dns-trace/content/usage.mdx b/app/(site)/(tools)/(dns)/dns-trace/content/usage.mdx
new file mode 100644
index 00000000..57253fb0
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dns-trace/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the trace
+
+Each numbered step is one server the trace asked. A step either points to the nameservers for the next zone down, which is called a referral, or ends the trace. The last step gives the answer, says the name doesn't exist, says there's no record of that type, or shows an error.
+
+If a server doesn't answer, the trace tries up to 3 servers for that step and lists the failed tries.
+
+<Example title="www.github.com, A record">
+
+1. The root nameserver points to the nameservers for `.com`.
+2. The `.com` nameserver points to the nameservers for `github.com`. One of them is `ns-421.awsdns-52.com`.
+3. The nameserver for `github.com` answers. `www.github.com` is an alias for `github.com`, which is at `20.207.73.82`.
+
+Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/dns-trace/page.tsx b/app/(site)/(tools)/(dns)/dns-trace/page.tsx
index 4504b82a..484fc51a 100644
--- a/app/(site)/(tools)/(dns)/dns-trace/page.tsx
+++ b/app/(site)/(tools)/(dns)/dns-trace/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Route } from "lucide-react";
 import { DnsTraceFromUrl } from "./dns-trace-from-url";
 import styles from "./dns-trace.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DnsTracePage() {
   const toolPage = await getRequiredToolPage("dns-trace");
@@ -13,12 +16,16 @@ export default async function DnsTracePage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<Route strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DnsTraceFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(dns)/dnssec-checker/content/article.mdx b/app/(site)/(tools)/(dns)/dnssec-checker/content/article.mdx
new file mode 100644
index 00000000..2cc1ab66
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dnssec-checker/content/article.mdx
@@ -0,0 +1,38 @@
+## How does the DNSSEC chain of trust work?
+
+Each zone vouches for the one below it. Three record types do the work:
+
+| Record | Lives in | What it does |
+| --- | --- | --- |
+| DNSKEY | The zone | The zone's public keys. |
+| RRSIG | The zone | A signature over a set of records, made with one of those keys. |
+| DS | The parent zone | A fingerprint of the child zone's key. For your domain, you set it through your registrar. |
+
+Validation starts from the root's key, which resolvers already trust. It checks that each DS matches a DNSKEY one level down, that the keys are signed, and that the answer's RRSIG is valid. [RFC 4033](https://www.rfc-editor.org/rfc/rfc4033.html) describes the design.
+
+Having DS and DNSKEY records isn't enough. They have to match, and the signatures have to be valid.
+
+## How do I fix a Bogus result?
+
+Start with the first step marked `Failed`:
+
+- If the DS link fails, the DS record at your registrar doesn't match the zone's keys. This often happens after changing DNS provider or keys. Copy the current DS value from your DNS provider to your registrar, or delete the DS to turn DNSSEC off.
+- If a DNSKEY or answer step fails, a signature is bad or has expired. `Signature validity` shows when each one runs out. Your DNS provider usually signs the zone, so ask them.
+
+<Warning title="Changing DNS provider with DNSSEC on">
+
+Delete the DS record at your registrar first, and wait for its TTL to pass before you switch nameservers. For `.com`, that's a day. Otherwise the DS points at keys the new provider doesn't have, and the domain goes Bogus. Turn DNSSEC on again at the new provider afterwards.
+
+Some providers can move a signed zone without turning DNSSEC off, as in [Cloudflare's guide](https://developers.cloudflare.com/dns/dnssec/dnssec-active-migration/).
+
+</Warning>
+
+## Is an Insecure result a problem?
+
+No. It means DNSSEC isn't turned on for this name. Answers resolve normally, but they aren't protected against forged replies. Turning it on takes a setting at your DNS provider and a DS record at your registrar.
+
+## Where does the verdict come from?
+
+stack127 checks the signatures itself with the [Namefi DNSSEC Audit library](https://github.com/d3servelabs/dnssec-audit-ts), fetching records through Cloudflare's public resolver. The `Resolver AD` rows repeat the resolver's own flag for reference, and the verdict doesn't use them. That's also why the DNSSEC line in [DNS lookup](/dns-lookup) isn't a DNSSEC check.
+
+The check runs from stack127's server, and stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/dnssec-checker/content/intro.mdx b/app/(site)/(tools)/(dns)/dnssec-checker/content/intro.mdx
new file mode 100644
index 00000000..594e5cca
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dnssec-checker/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain and record type to check whether its DNSSEC signatures validate, link by link, from the DNS root down to that answer. The result is Secure, Insecure, Bogus, or Indeterminate, with the first step that fails.
diff --git a/app/(site)/(tools)/(dns)/dnssec-checker/content/usage.mdx b/app/(site)/(tools)/(dns)/dnssec-checker/content/usage.mdx
new file mode 100644
index 00000000..8b5e4b82
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/dnssec-checker/content/usage.mdx
@@ -0,0 +1,18 @@
+## What do Secure, Insecure, Bogus, and Indeterminate mean?
+
+| Result | What it means |
+| --- | --- |
+| Secure | The answer is signed, and every link checks out to the root. This includes a signed proof that a record or name doesn't exist. |
+| Insecure | The name isn't signed, and the chain proves that on purpose. Nothing is broken. |
+| Bogus | The name should be signed, but a link fails. Resolvers that check DNSSEC return SERVFAIL, so the name stops working for their users. |
+| Indeterminate | The check couldn't finish. Run it again before you change anything. |
+
+DNSSEC signs each answer, not the domain as a whole. Pick the record type that's failing, or A for a general check.
+
+<Example title="dnssec-failed.org, A record">
+
+The result is Bogus. The steps pass from the root through `org` and the DS record for `dnssec-failed.org`, then fail: no key in the zone matches the DS record its parent publishes. Cloudflare's resolver returns SERVFAIL for the A record, so its users can't reach the name.
+
+Comcast runs this domain as a DNSSEC test, broken on purpose. Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/dnssec-checker/page.tsx b/app/(site)/(tools)/(dns)/dnssec-checker/page.tsx
index 1b71d017..3f32e9af 100644
--- a/app/(site)/(tools)/(dns)/dnssec-checker/page.tsx
+++ b/app/(site)/(tools)/(dns)/dnssec-checker/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ShieldCheck } from "lucide-react";
 import { DnssecCheckerFromUrl } from "./dnssec-checker-from-url";
 import styles from "./dnssec-checker.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DnssecCheckerPage() {
   const toolPage = await getRequiredToolPage("dnssec-checker");
@@ -13,12 +16,16 @@ export default async function DnssecCheckerPage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<ShieldCheck strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DnssecCheckerFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(dns)/nameserver-checker/content/article.mdx b/app/(site)/(tools)/(dns)/nameserver-checker/content/article.mdx
new file mode 100644
index 00000000..5000e88c
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/nameserver-checker/content/article.mdx
@@ -0,0 +1,31 @@
+## What if the parent and the zone list different nameservers?
+
+Usually a provider move wasn't finished. A server was added or removed in one place but not the other. Resolvers can use either list, so some lookups work and others fail.
+
+Make the two lists match. Add every new nameserver at both your registrar and your DNS provider, and remove old ones from both. A mismatch doesn't fix itself over time.
+
+## When is glue required?
+
+Glue is a nameserver's address, published by the parent zone with the delegation. The `Glue rule` column says whether a server needs it:
+
+| Glue rule | When it applies |
+| --- | --- |
+| `Required` | The nameserver sits inside the domain it serves, such as `ns1.example.com` for `example.com`. Without glue, nobody can find its address. |
+| `Optional sibling` | The nameserver sits in another domain under the same parent, such as a `.com` nameserver for a `.com` domain. |
+| `Not required` | The nameserver is somewhere else, and normal lookups find its address. |
+
+If the glue doesn't match the nameserver's own A or AAAA records, the result flags it. Update the glue at your registrar.
+
+## What is a lame delegation?
+
+Usually, a nameserver that's listed but doesn't answer as the source for the zone. Definitions vary, and [RFC 9499](https://www.rfc-editor.org/rfc/rfc9499.html#section-7) lists the common ones. The result says such a server `did not claim authority`. Fix the zone on that server, or remove the server from both lists.
+
+## Why test both UDP and TCP?
+
+Most DNS queries use UDP. Large answers, such as signed records or long TXT records, switch to TCP. [RFC 7766](https://www.rfc-editor.org/rfc/rfc7766.html) requires nameservers to answer over TCP, so a server that only answers over UDP can fail on those.
+
+## Should nameservers be on different networks?
+
+Yes, so one outage can't take them all down. [RFC 2182](https://www.rfc-editor.org/rfc/rfc2182.html) recommends spreading them out. The result notes when every address is on one network, or when two names share one address.
+
+The checks run from stack127's server. IPv6 addresses are skipped when the checker has no IPv6 route, and the result says so. stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/nameserver-checker/content/intro.mdx b/app/(site)/(tools)/(dns)/nameserver-checker/content/intro.mdx
new file mode 100644
index 00000000..4a9c850f
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/nameserver-checker/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain to check that the registry and your DNS provider list the same nameservers, that glue addresses are right, and that each server answers. Use it after changing DNS provider, or when a domain stops resolving.
diff --git a/app/(site)/(tools)/(dns)/nameserver-checker/content/usage.mdx b/app/(site)/(tools)/(dns)/nameserver-checker/content/usage.mdx
new file mode 100644
index 00000000..998a7b1b
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/nameserver-checker/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the result
+
+The first line names the first problem found, or says the delegation checks out.
+
+In `Delegation, glue, and addresses`, `Parent` means the parent zone, such as `.com`, lists the nameserver. You set that list at your registrar. `Child` means the zone's own NS records list it. You set those at your DNS provider. Both columns should say `Yes` for every server.
+
+`Nameserver address checks` tests each address over UDP and TCP. `Authoritative SOA` means the server answered as the source for this zone.
+
+<Example title="github.com">
+
+GitHub uses 8 nameservers from two providers: 4 from NS1 and 4 from Amazon Route 53. The parent and the zone list the same 8, and every address answers over UDP and TCP. `ns-421.awsdns-52.com` comes with glue, because it sits under `.com` like `github.com`.
+
+Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/nameserver-checker/page.tsx b/app/(site)/(tools)/(dns)/nameserver-checker/page.tsx
index 4c7ca307..4268af2d 100644
--- a/app/(site)/(tools)/(dns)/nameserver-checker/page.tsx
+++ b/app/(site)/(tools)/(dns)/nameserver-checker/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Server } from "lucide-react";
 import { NameserverCheckerFromUrl } from "./nameserver-checker-from-url";
 import styles from "./nameserver-checker.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function NameserverCheckerPage() {
   const toolPage = await getRequiredToolPage("nameserver-checker");
@@ -13,10 +16,14 @@ export default async function NameserverCheckerPage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<Server strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <NameserverCheckerFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(dns)/soa-checker/content/article.mdx b/app/(site)/(tools)/(dns)/soa-checker/content/article.mdx
new file mode 100644
index 00000000..3328bf4c
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/soa-checker/content/article.mdx
@@ -0,0 +1,30 @@
+## What does the SOA serial number mean?
+
+It's the zone's version number, and it goes up with each change. Many zones use the date plus a counter, such as `2026100901`, as [RFC 1912](https://www.rfc-editor.org/rfc/rfc1912.html#section-2.2) suggests. Others count from 1 or use a timestamp.
+
+Serials wrap back to zero after 4,294,967,295, so a smaller number isn't always older. The checker compares them with [RFC 1982](https://www.rfc-editor.org/rfc/rfc1982.html) serial arithmetic, not as plain numbers.
+
+## What do the other SOA fields mean?
+
+| Field | What it means |
+| --- | --- |
+| Primary, MNAME | The zone's main nameserver, as the zone names it. |
+| Mailbox, RNAME | The zone contact's email, with the first dot standing for the @. |
+| Refresh | How often a secondary server checks the primary for changes. |
+| Retry | How long a secondary waits to try again after a failed check. |
+| Expire | How long a secondary keeps answering when it can't reach the primary. |
+| MINIMUM | One of the two values that set the negative cache time. |
+| SOA TTL | How long resolvers cache the SOA record itself. |
+| Negative cache | How long resolvers cache a missing name or record: the lower of the SOA TTL and MINIMUM. |
+
+All times are in seconds. Refresh, retry, and expire drive classic zone transfers. Many hosted DNS providers sync their servers another way, so these may not do anything there. The negative cache rule comes from [RFC 2308](https://www.rfc-editor.org/rfc/rfc2308.html).
+
+## Why do my nameservers show different serials?
+
+- A change is still syncing. Check again in a few minutes.
+- The domain uses two DNS providers, each with its own SOA. Compare the record you care about instead.
+- A secondary server stopped updating. It may not reach the primary, or may not be allowed to copy the zone. If its serial stays behind, fix the transfer or remove the server. The [nameserver checker](/nameserver-checker) shows which servers are listed.
+
+Matching serials don't prove that every record matches. To check one record across servers, use the [DNS change checker](/dns-change-checker).
+
+The check asks each nameserver directly from stack127's server. IPv6 addresses are skipped when the checker has no IPv6 route. stack127 doesn't keep the names you check.
diff --git a/app/(site)/(tools)/(dns)/soa-checker/content/intro.mdx b/app/(site)/(tools)/(dns)/soa-checker/content/intro.mdx
new file mode 100644
index 00000000..da2546c9
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/soa-checker/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain to compare the SOA record on each of its nameservers. A matching serial number usually means every server has the same version of the zone, and a different one can point to a server that's behind.
diff --git a/app/(site)/(tools)/(dns)/soa-checker/content/usage.mdx b/app/(site)/(tools)/(dns)/soa-checker/content/usage.mdx
new file mode 100644
index 00000000..7c950e52
--- /dev/null
+++ b/app/(site)/(tools)/(dns)/soa-checker/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the result
+
+The first line says whether the SOA records agree and, if not, which serial is newest. Servers that return the same values share one row. A server with a different value gets its own row.
+
+If the `Primary` and `Mailbox` values differ too, you're usually looking at two DNS providers. Each one writes its own SOA, so their serials can't be compared.
+
+<Example title="github.com">
+
+The 4 NS1 nameservers report serial 1,656,468,023, with primary `dns1.p08.nsone.net`. The 4 Amazon Route 53 nameservers report serial 1, with primary `ns-1707.awsdns-21.co.uk`.
+
+The checker calls 1,656,468,023 newest, but neither provider is behind. They each keep their own SOA.
+
+Checked on 9 October 2026.
+
+</Example>
diff --git a/app/(site)/(tools)/(dns)/soa-checker/page.tsx b/app/(site)/(tools)/(dns)/soa-checker/page.tsx
index 8ce92dee..1ca09501 100644
--- a/app/(site)/(tools)/(dns)/soa-checker/page.tsx
+++ b/app/(site)/(tools)/(dns)/soa-checker/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { FileClock } from "lucide-react";
 import { SoaCheckerFromUrl } from "./soa-checker-from-url";
 import styles from "./soa-checker.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function SoaCheckerPage() {
   const toolPage = await getRequiredToolPage("soa-checker");
@@ -13,10 +16,14 @@ export default async function SoaCheckerPage() {
       <PageCanvas as="main" className={styles.main}>
         <ToolPageHeader
           icon={<FileClock strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <SoaCheckerFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From b0df532a7662a47be1a19ffaf72f65e895fba578 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:49 +0530
Subject: [PATCH 08/25] Rewrite the nine other domain tool pages in MDX

The live availability pages named result labels the tools don't show,
and the transfer page called the 60-day rule a hard lock. Both are fixed.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../domain-availability/content/article.mdx   | 24 ++++++++++++
 .../domain-availability/content/intro.mdx     |  1 +
 .../domain-availability/content/usage.mdx     | 15 ++++++++
 .../(domain)/domain-availability/page.tsx     | 11 +++++-
 .../domain-expiry/content/article.mdx         | 33 +++++++++++++++++
 .../(domain)/domain-expiry/content/intro.mdx  |  1 +
 .../(domain)/domain-expiry/content/usage.mdx  | 11 ++++++
 .../(tools)/(domain)/domain-expiry/page.tsx   | 11 +++++-
 .../domain-lookup/content/article.mdx         | 25 +++++++++++++
 .../(domain)/domain-lookup/content/intro.mdx  |  1 +
 .../(domain)/domain-lookup/content/usage.mdx  | 19 ++++++++++
 .../(tools)/(domain)/domain-lookup/page.tsx   | 11 +++++-
 .../(domain)/domain-owner/content/article.mdx | 36 ++++++++++++++++++
 .../(domain)/domain-owner/content/intro.mdx   |  1 +
 .../(domain)/domain-owner/content/usage.mdx   | 15 ++++++++
 .../(tools)/(domain)/domain-owner/page.tsx    | 11 +++++-
 .../domain-registrar/content/article.mdx      | 37 +++++++++++++++++++
 .../domain-registrar/content/intro.mdx        |  1 +
 .../domain-registrar/content/usage.mdx        | 11 ++++++
 .../(domain)/domain-registrar/page.tsx        | 11 +++++-
 .../domain-report/content/article.mdx         | 31 ++++++++++++++++
 .../(domain)/domain-report/content/intro.mdx  |  1 +
 .../(domain)/domain-report/content/usage.mdx  | 19 ++++++++++
 .../(tools)/(domain)/domain-report/page.tsx   | 11 +++++-
 .../content/article.mdx                       | 15 ++++++++
 .../multi-tld-availability/content/intro.mdx  |  1 +
 .../multi-tld-availability/content/usage.mdx  | 16 ++++++++
 .../(domain)/multi-tld-availability/page.tsx  | 11 +++++-
 .../punycode-converter/content/article.mdx    | 27 ++++++++++++++
 .../punycode-converter/content/intro.mdx      |  1 +
 .../punycode-converter/content/usage.mdx      | 11 ++++++
 .../(domain)/punycode-converter/page.tsx      | 11 +++++-
 .../transfer-readiness/content/article.mdx    | 35 ++++++++++++++++++
 .../transfer-readiness/content/intro.mdx      |  1 +
 .../transfer-readiness/content/usage.mdx      | 18 +++++++++
 .../(domain)/transfer-readiness/page.tsx      | 11 +++++-
 36 files changed, 488 insertions(+), 18 deletions(-)
 create mode 100644 app/(site)/(tools)/(domain)/domain-availability/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-availability/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-availability/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-expiry/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-expiry/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-expiry/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-lookup/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-lookup/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-owner/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-owner/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-owner/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-registrar/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-registrar/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-registrar/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-report/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-report/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/domain-report/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/multi-tld-availability/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/multi-tld-availability/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/multi-tld-availability/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/punycode-converter/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/punycode-converter/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/punycode-converter/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
 create mode 100644 app/(site)/(tools)/(domain)/transfer-readiness/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(domain)/transfer-readiness/content/usage.mdx

diff --git a/app/(site)/(tools)/(domain)/domain-availability/content/article.mdx b/app/(site)/(tools)/(domain)/domain-availability/content/article.mdx
new file mode 100644
index 00000000..8ab2edc6
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-availability/content/article.mdx
@@ -0,0 +1,24 @@
+## If no registration is found, can I buy the domain?
+
+Not always. The registry has no record of the name, but a registrar may still refuse the sale or charge far more than usual.
+
+- Reserved: the registry holds the name back and won't sell it. Which names depends on the ending.
+- Premium: the registry prices the name well above the normal fee. The registration record never shows price.
+- Restricted: some endings only sell to eligible buyers, such as residents of a country or licensed businesses.
+- Just taken: someone may register the name between your check and your checkout.
+
+A registrar's search shows the price and whether you can buy it. Treat this result as a first filter.
+
+## Why not just visit the website to check?
+
+Because a site that doesn't load can still be registered. Many registered names have no website, or no nameservers at all, so the browser can't reach anything. The registry is the only place that knows whether a name is held. To see what DNS answers for a name, use the [DNS lookup](/dns-lookup).
+
+## Is it safe to check a domain name here?
+
+The name goes from stack127 to the registry. A registrar is only asked when the name is already registered, and then it's the one that holds it. Saved answers are stored by name, not linked to you. A `Registered` answer can be up to 24 hours old and a `No registration found` answer up to 1 hour old, so check the fetched time before you buy.
+
+## What if the name is already taken?
+
+Look at the expiry date and any status shown with it. A name past its expiry may come free, but the owner can often still renew or restore it. The [domain expiry checker](/domain-expiry) explains each stage. For the full record, use the [domain registration lookup](/domain-lookup).
+
+A registered name may be in use, saved for later, or for sale. This lookup can't tell you which, or the price.
diff --git a/app/(site)/(tools)/(domain)/domain-availability/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-availability/content/intro.mdx
new file mode 100644
index 00000000..425944cb
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-availability/content/intro.mdx
@@ -0,0 +1 @@
+Enter a full domain name, such as `example.com`, to ask its registry whether the name is registered. If no registration is found, check the price at a registrar before you plan around it.
diff --git a/app/(site)/(tools)/(domain)/domain-availability/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-availability/content/usage.mdx
new file mode 100644
index 00000000..0af374fb
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-availability/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the result
+
+| Result | What it means |
+| --- | --- |
+| `Registered` | Someone holds the name. The registrar, registration date, and expiry date appear when published. |
+| `No registration found` | The registry has no record of the name. It's promising, but you may still not be able to buy it. |
+| `Cannot determine` | The ending has no public lookup service, or the registry didn't answer. This says nothing about the name. |
+
+<Example title="quietlanternstudio, checked on 9 October 2026">
+
+`quietlanternstudio.com` is `Registered`, since 6 October 2025. `quietlanternstudio.io` shows `No registration found`.
+
+</Example>
+
+To try one name across several endings at once, use the [multi-TLD availability checker](/multi-tld-availability).
diff --git a/app/(site)/(tools)/(domain)/domain-availability/page.tsx b/app/(site)/(tools)/(domain)/domain-availability/page.tsx
index 12d4553f..571b650a 100644
--- a/app/(site)/(tools)/(domain)/domain-availability/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-availability/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { BadgeCheck } from "lucide-react";
 import { DomainAvailabilityFromUrl } from "./domain-availability-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainAvailabilityPage() {
   const toolPage = await getRequiredToolPage("domain-availability");
@@ -13,11 +16,15 @@ export default async function DomainAvailabilityPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<BadgeCheck strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainAvailabilityFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/domain-expiry/content/article.mdx b/app/(site)/(tools)/(domain)/domain-expiry/content/article.mdx
new file mode 100644
index 00000000..65c0776c
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-expiry/content/article.mdx
@@ -0,0 +1,33 @@
+## My domain expires soon. What should I check?
+
+Check your registrar account, not just this page. A public record can't see your payment or settings.
+
+1. Confirm the renewal date and that auto-renew is on.
+2. Check that the saved card hasn't expired.
+3. Make sure renewal emails reach an address you read. Registrars must send reminders for generic endings, according to [ICANN's renewal FAQ](https://www.icann.org/resources/pages/domain-name-renewal-expiration-faqs-2018-12-07-en).
+4. If you renewed and the date here hasn't moved, ask the registrar to confirm.
+
+A site that still loads isn't proof the renewal went through.
+
+## Why do the registry and registrar dates differ?
+
+The registry runs the ending and the registrar manages your account, and each can publish its own date. They drift apart when the registry renews the name automatically at the end of a term, before the registrar has decided to renew or delete it. The registry date is the one that decides when the domain is deleted.
+
+## What happens after a domain expires?
+
+The domain moves through stages, shown under the result with their usual length. What you can do changes at each one.
+
+| Stage | What you can do |
+| --- | --- |
+| Grace period | Renew with your registrar. Its terms set the price. The site and email may stop working. |
+| Redemption | Ask your registrar to restore it. Expect a higher fee. |
+| Pending delete | Nothing. It can't be restored and can't be registered yet. |
+| Released | Anyone can register it, first come, first served. |
+
+These stages are for generic endings such as `.com`. Country endings set their own rules, so check the registry for that ending in the [TLD directory](/tld-directory). The [EPP status codes](/epp-status-codes) page explains each status.
+
+## When can I register someone else's expired domain?
+
+No public record gives a guaranteed date. The owner can renew or restore the name until pending delete, and once it's released, someone else may register it seconds before you. Use the [domain availability checker](/domain-availability) to see whether a registration still exists.
+
+The lookup goes from stack127 to the registry and the registrar, not to the website. A registered result can be a saved answer up to 24 hours old, so a renewal you just paid may not show yet. This is a one-time check, not monitoring. For the rest of the record, use the [domain registration lookup](/domain-lookup).
diff --git a/app/(site)/(tools)/(domain)/domain-expiry/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-expiry/content/intro.mdx
new file mode 100644
index 00000000..d0529f95
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-expiry/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name to see when its current registration term ends, how long is left, and any expiry status the registry shows. The expiry date isn't the day someone else can register the name.
diff --git a/app/(site)/(tools)/(domain)/domain-expiry/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-expiry/content/usage.mdx
new file mode 100644
index 00000000..b393a55c
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-expiry/content/usage.mdx
@@ -0,0 +1,11 @@
+## How to read the result
+
+The countdown uses the registry's expiry date. When the registrar publishes a different date, both appear side by side. Check your registrar account before trusting either one.
+
+Once a domain has expired, the large result names its stage, such as `Redemption period`, from the status codes the registry returns. It doesn't guess the stage by counting days from the expiry date.
+
+<Example title="github.com, checked on 9 October 2026">
+
+Time until registry expiry: 2 years. The registry and registrar both show 9 October 2028.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-expiry/page.tsx b/app/(site)/(tools)/(domain)/domain-expiry/page.tsx
index 8e327fc3..d9659eb3 100644
--- a/app/(site)/(tools)/(domain)/domain-expiry/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-expiry/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { CalendarX } from "lucide-react";
 import { DomainExpiryFromUrl } from "./domain-expiry-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainExpiryPage() {
   const toolPage = await getRequiredToolPage("domain-expiry");
@@ -13,12 +16,16 @@ export default async function DomainExpiryPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<CalendarX strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainExpiryFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx b/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
new file mode 100644
index 00000000..90c77a74
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
@@ -0,0 +1,25 @@
+## What is the difference between RDAP and WHOIS?
+
+RDAP is the newer way to read public domain registration data, and it replaced WHOIS for generic endings such as `.com` and `.org`. Both read the same registry records. RDAP returns labeled fields and standard event dates, and can declare which data is withheld. WHOIS returns free text that differs by provider.
+
+Since 28 January 2025, ICANN no longer requires generic registries and registrars to run WHOIS, except for `.com`, `.name`, and `.post`. [ICANN's RDAP page](https://www.icann.org/rdap) explains the change. This lookup uses RDAP only.
+
+Country endings such as `.uk` or `.de` set their own rules. Some publish RDAP and some don't. When an ending has none, the result shows `Cannot determine`, which says nothing about whether the name is registered. Use the registry's own lookup, listed in the [TLD directory](/tld-directory).
+
+A WHOIS site can show different details because it reads WHOIS text or an older saved copy. Owner details are a separate question, covered in the [registrant lookup](/domain-owner).
+
+## Why are the registry and registrar shown separately?
+
+They are two different organizations, and each publishes part of the record. The registry runs the ending, such as Verisign for `.com`, and holds the core record: dates, statuses, and nameservers. The registrar is the company the owner registered through, and often holds the contacts.
+
+Their expiry dates can differ. The [domain expiry checker](/domain-expiry) explains why, and which one decides when the domain is deleted.
+
+If the registrar doesn't answer, the result keeps the registry's facts and says the registrar part is missing.
+
+## Does the last changed date mean the owner changed?
+
+No. `Record last changed` says the registration record changed, but not which field. `Registry database updated` is when the registry last refreshed its whole database, not this domain. These are [standard RDAP event names](https://www.rfc-editor.org/rfc/rfc9083.html#section-10.2.3), and neither is a history of past owners.
+
+## Where does the lookup go?
+
+Your lookup goes from stack127 to the registry and the registrar, not to the website. A registered result can be a saved answer up to 24 hours old, and the source line under the result shows when each part was fetched.
diff --git a/app/(site)/(tools)/(domain)/domain-lookup/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-lookup/content/intro.mdx
new file mode 100644
index 00000000..fa245b5b
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-lookup/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name or paste a web address to see its public registration record: the registrar, key dates, status codes, nameservers, and any published contacts. Each fact is labeled with the registry or registrar that published it.
diff --git a/app/(site)/(tools)/(domain)/domain-lookup/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-lookup/content/usage.mdx
new file mode 100644
index 00000000..8a940c14
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-lookup/content/usage.mdx
@@ -0,0 +1,19 @@
+## How to read the record
+
+Start with the question that brought you here. Each one points to a different part of the record.
+
+| Your question | Look at |
+| --- | --- |
+| Who do I transfer through or report abuse to? | Registrar |
+| When does it expire? | Dates, especially registry expiry |
+| Why won't it transfer? | Status codes |
+| Why doesn't the site load? | Status codes and nameservers |
+| Who owns it? | Contacts and redaction |
+
+The line under `Registered` names the status code with the most effect, such as one that blocks transfers or stops the domain from working. The [EPP status codes](/epp-status-codes) page explains every code and who can remove it. If the site doesn't load, the [domain report](/domain-report) checks the registration and live DNS together.
+
+<Example title="github.com, checked on 9 October 2026">
+
+Registered through MarkMonitor Inc. since 9 October 2007. `clientTransferProhibited` blocks transfers. Eight nameservers are listed, and the registrant shows the organization GitHub, Inc., with the name, email, and phone redacted.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-lookup/page.tsx b/app/(site)/(tools)/(domain)/domain-lookup/page.tsx
index 624ce198..c9a8c81e 100644
--- a/app/(site)/(tools)/(domain)/domain-lookup/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-lookup/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { FileSearch } from "lucide-react";
 import { DomainLookupFromUrl } from "./domain-lookup-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainLookupPage() {
   const toolPage = await getRequiredToolPage("domain-lookup");
@@ -13,11 +16,15 @@ export default async function DomainLookupPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<FileSearch strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainLookupFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/domain-owner/content/article.mdx b/app/(site)/(tools)/(domain)/domain-owner/content/article.mdx
new file mode 100644
index 00000000..e2b67afa
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-owner/content/article.mdx
@@ -0,0 +1,36 @@
+## Can you find out who owns a domain?
+
+Sometimes. Companies often appear by name, but most registrars hide the personal details of individuals to comply with privacy laws such as the GDPR. When the name is hidden, this lookup can't reveal it, but the routes below can still reach the owner.
+
+Even a published name only tells you who registered the domain. That can be a different person or company from whoever runs the website, especially on hosted platforms.
+
+## What does redacted for privacy mean?
+
+It means the registrar or registry withheld a field from the public record. Some providers say which fields and how, using the [RDAP redaction standard, RFC 9537](https://www.rfc-editor.org/rfc/rfc9537.html). When they don't, a missing field stays unknown.
+
+| Method | What happened to the field |
+| --- | --- |
+| Removed | It was taken out of the record. |
+| Emptied | It's still there, with a blank value. |
+| Replaced | Its value was swapped for a stand-in, often a contact form or relay address. A stand-in doesn't prove messages reach the owner. |
+
+## How do you contact a domain owner?
+
+Pick the route that matches your reason.
+
+1. To ask about the domain, use the contact form or relay email from the result. It reaches the owner without showing their address, but a reply isn't guaranteed.
+2. To report phishing, malware, or spam, write to the registrar's abuse address. Describe the incident and include evidence. The [registrar lookup](/domain-registrar) explains how abuse reports work.
+3. For a legal claim or an investigation on a generic ending such as `.com`, request the hidden data through [ICANN's Registration Data Request Service](https://www.icann.org/rdrs-en). The registrar decides whether to disclose it.
+4. For anything else that needs the data, a court order or a law enforcement request may apply.
+
+## What is the difference between a privacy and a proxy service?
+
+A privacy service replaces the owner's contact details, but the owner stays the registrant. A proxy service registers the domain in its own name and lets the customer use it. [ICANN explains the difference](https://www.icann.org/resources/pages/pp-services-2017-08-31-en).
+
+Both are different from redaction, where the registrar hides fields on its own. A company name such as "Domains By Proxy" in the record tells you which service is involved, not who's behind it.
+
+## Why do WHOIS sites show owner details this lookup doesn't?
+
+Some WHOIS sites keep copies of records from before the details were hidden, or from a previous owner. This lookup reads only the current record, so a name elsewhere may be out of date. The [domain registration lookup](/domain-lookup) explains how RDAP and WHOIS differ.
+
+The lookup goes from stack127 to the registry and the registrar, not to the website. A registered result can be a saved answer up to 24 hours old, so check the fetched time if the contact details just changed.
diff --git a/app/(site)/(tools)/(domain)/domain-owner/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-owner/content/intro.mdx
new file mode 100644
index 00000000..a60bab8d
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-owner/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name to see which owner details its public registration record shows, what was withheld, and how you can still reach the owner. Personal details are usually hidden, so the result often gives a contact form or abuse address instead of a name.
diff --git a/app/(site)/(tools)/(domain)/domain-owner/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-owner/content/usage.mdx
new file mode 100644
index 00000000..75c3b92a
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-owner/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the result
+
+| Result | What it means |
+| --- | --- |
+| `Published` | The record names a registrant, usually an organization. The name is as the owner gave it, not checked by anyone. |
+| `Not published` | No name was returned. A redaction table shows what was withheld, when the provider says. |
+| `Cannot determine` | The registry or registrar didn't answer, or the ending has no public lookup service. Try again before treating the name as hidden. |
+
+Under the result, `How to make contact` lists every contact route the record gives. The abuse address is only for reports of phishing, malware, or spam.
+
+<Example title="github.com, checked on 9 October 2026">
+
+`Published`: the registrant organization is GitHub, Inc. The name, street, email, and phone are redacted, and the record gives a MarkMonitor contact form instead.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-owner/page.tsx b/app/(site)/(tools)/(domain)/domain-owner/page.tsx
index 091d11fe..d502e584 100644
--- a/app/(site)/(tools)/(domain)/domain-owner/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-owner/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { UserSearch } from "lucide-react";
 import { DomainOwnerFromUrl } from "./domain-owner-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainOwnerPage() {
   const toolPage = await getRequiredToolPage("domain-owner");
@@ -13,12 +16,16 @@ export default async function DomainOwnerPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<UserSearch strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainOwnerFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/domain-registrar/content/article.mdx b/app/(site)/(tools)/(domain)/domain-registrar/content/article.mdx
new file mode 100644
index 00000000..a2ab1532
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-registrar/content/article.mdx
@@ -0,0 +1,37 @@
+## What is the difference between a registry, a registrar, and a reseller?
+
+The registry runs a domain ending, the registrar sells and manages names in it, and a reseller sells through a registrar. You deal with the last one in the chain.
+
+| Role | What it does | Example |
+| --- | --- | --- |
+| Registry | Runs one ending and keeps its records | Verisign runs `.com`, Nominet runs `.uk` |
+| Registrar | Registers names with the registry and manages them | MarkMonitor, Hostinger |
+| Reseller | Sells names through a registrar, often with hosting | A web host or agency |
+
+## Why is the registrar a company I've never heard of?
+
+Usually because you bought the domain through a reseller. Many hosting companies sell domains through wholesale registrars such as Tucows or PDR, so the registrar's name is on the record while your invoice shows the host. A registrar that was bought or renamed can also leave an unfamiliar name.
+
+To find who you actually pay, search your email for a renewal receipt. Billing and support go to that company. Transfers and account recovery often need the registrar too.
+
+## How do you report abuse to a registrar?
+
+Write to the abuse email from the result. Name the exact domain and say what you saw, when, and where, with evidence such as the full URL or the email headers. The registrar may not host the website, and a report doesn't guarantee it will suspend the domain.
+
+If an ICANN-accredited registrar ignores its duties, you can file an [ICANN compliance complaint](https://www.icann.org/compliance/complaint).
+
+## How do you get back into a domain someone else registered for you?
+
+Start with the registrar's or reseller's account recovery, and expect to prove the domain is yours. This often comes up when an agency, contractor, or former employee set it up. Have documents ready that link the domain to you or your business, such as invoices or the registrant details on file.
+
+This lookup gives you the right company to start with. No public record shows the account's username or email address.
+
+## Can you tell when a domain changed registrar?
+
+Sometimes. A few registries publish a transfer date, and the result shows it when they do. `Record last changed` isn't a transfer date, because renewals, nameserver edits, and contact changes all move it.
+
+## What is an IANA registrar ID?
+
+It's the fixed number IANA gives each accredited registrar, listed in the [IANA registrar ID registry](https://www.iana.org/assignments/registrar-ids/registrar-ids.xhtml). Registrar names are written in different ways across systems, but the number stays the same, so use it when matching records or filing a complaint.
+
+The lookup goes from stack127 to the registry and the registrar. A registered result can be a saved answer up to 24 hours old. Before a move, the [transfer readiness checker](/transfer-readiness) shows what's in the way.
diff --git a/app/(site)/(tools)/(domain)/domain-registrar/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-registrar/content/intro.mdx
new file mode 100644
index 00000000..54097a42
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-registrar/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name to find the registrar it's registered through, with its IANA ID and abuse contact. Use it to report abuse, to find where an old domain is held, or to see who to contact before a transfer.
diff --git a/app/(site)/(tools)/(domain)/domain-registrar/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-registrar/content/usage.mdx
new file mode 100644
index 00000000..bb16a743
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-registrar/content/usage.mdx
@@ -0,0 +1,11 @@
+## How to read the result
+
+The large name is the registrar the registry has on record. Under it, `Who does what` shows the chain from registry to registrar to any reseller. A reseller only appears when the record names one, so `Not published` doesn't mean there isn't one.
+
+The abuse email and phone are for reporting phishing, malware, or spam. They won't help with account access or billing.
+
+<Example title="github.com, checked on 9 October 2026">
+
+The registrar is MarkMonitor Inc., IANA ID 292. The abuse contact is abusecomplaints@markmonitor.com.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-registrar/page.tsx b/app/(site)/(tools)/(domain)/domain-registrar/page.tsx
index 344027a4..cf636ceb 100644
--- a/app/(site)/(tools)/(domain)/domain-registrar/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-registrar/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Building2 } from "lucide-react";
 import { DomainRegistrarFromUrl } from "./domain-registrar-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainRegistrarPage() {
   const toolPage = await getRequiredToolPage("domain-registrar");
@@ -13,12 +16,16 @@ export default async function DomainRegistrarPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<Building2 strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainRegistrarFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/domain-report/content/article.mdx b/app/(site)/(tools)/(domain)/domain-report/content/article.mdx
new file mode 100644
index 00000000..4342ba18
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-report/content/article.mdx
@@ -0,0 +1,31 @@
+## Why is my domain registered but not resolving?
+
+Usually a hold status or a nameserver problem. A `clientHold` or `serverHold` status tells the registry to stop publishing the domain, so nothing under it resolves while the registration stays valid. The report flags a hold under `Needs attention`. The [EPP status codes](/epp-status-codes) page says who can remove each one.
+
+If there's no hold, look at the nameserver chain. Missing nameservers, or ones that don't answer, also stop a domain from resolving. If DNS answers correctly and the site still fails, the problem is the web host, which this report doesn't test.
+
+## Why do nameservers differ between the registry and DNS?
+
+Usually a nameserver change was made in one place but not the other, often during a move to a new DNS host. Nameservers are listed in three places, and they should agree.
+
+1. `Registration record`: what you set through your registrar.
+2. `Parent referral`: what the parent zone, such as `.com`, tells visitors.
+3. `Child zone`: the NS records in your own zone.
+
+When they disagree, some visitors reach servers that aren't set up for the domain, and answers come and go. The [nameserver checker](/nameserver-checker) tests each server.
+
+## Does DNSSEC switched on mean it works?
+
+No. The registration record shows whether a DS record is published, which switches DNSSEC on. It doesn't show whether the signatures are valid.
+
+A domain with DNSSEC on and a broken chain stops resolving for everyone whose resolver checks signatures, and keeps working for everyone else. That's why the report asks for a decision and links to the [DNSSEC checker](/dnssec-checker), which validates the chain.
+
+## Why is there no score?
+
+There's no single right setup for every domain, so a score would invent one. A healthy domain can show findings, and a high score could hide a problem the score didn't check. Each finding shows its evidence instead.
+
+## What doesn't the report check?
+
+It doesn't test websites, certificates, or email delivery, and it's a one-time check with no alerts. For deeper DNS checks, use the [SOA checker](/soa-checker) for zone consistency or the [CAA checker](/caa-checker) for certificate rules.
+
+The report runs from stack127's server. DNS answers are live, but the registration part can be a saved answer up to 24 hours old, so the two timestamps can differ.
diff --git a/app/(site)/(tools)/(domain)/domain-report/content/intro.mdx b/app/(site)/(tools)/(domain)/domain-report/content/intro.mdx
new file mode 100644
index 00000000..d2f4ab48
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-report/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name to check its registration record and its live DNS in one report, and see where the two disagree. Use it when a domain is registered but something isn't working, or after moving DNS.
diff --git a/app/(site)/(tools)/(domain)/domain-report/content/usage.mdx b/app/(site)/(tools)/(domain)/domain-report/content/usage.mdx
new file mode 100644
index 00000000..621429fc
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/domain-report/content/usage.mdx
@@ -0,0 +1,19 @@
+## How to read the report
+
+Start with `Checks in this report`. A check that failed or was skipped stays unresolved. It doesn't count as a pass.
+
+Findings come in three groups.
+
+| Group | Examples |
+| --- | --- |
+| Needs attention | Nameservers differ, a hold status, expiry within 30 days |
+| Needs a decision | DNSSEC is switched on at the registry |
+| Context | Nameservers agree, DNSSEC is off |
+
+Each finding links to the tool that looks into it further. The nameserver chain shows the three places nameservers are listed, side by side.
+
+<Example title="github.com, checked on 9 October 2026">
+
+Both checks completed. Nothing needs attention. The registration record, parent referral, and child zone all list the same eight nameservers, and DNSSEC is off.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/domain-report/page.tsx b/app/(site)/(tools)/(domain)/domain-report/page.tsx
index 45591f0e..7fdce560 100644
--- a/app/(site)/(tools)/(domain)/domain-report/page.tsx
+++ b/app/(site)/(tools)/(domain)/domain-report/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ClipboardList } from "lucide-react";
 import { DomainReportFromUrl } from "./domain-report-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DomainReportPage() {
   const toolPage = await getRequiredToolPage("domain-report");
@@ -13,12 +16,16 @@ export default async function DomainReportPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<ClipboardList strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <DomainReportFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/multi-tld-availability/content/article.mdx b/app/(site)/(tools)/(domain)/multi-tld-availability/content/article.mdx
new file mode 100644
index 00000000..aa3d86bf
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/multi-tld-availability/content/article.mdx
@@ -0,0 +1,15 @@
+## Which endings should I check?
+
+Start with the endings your audience knows and that you're allowed to register. The preselected endings are a starting set that can all be checked, not a recommendation.
+
+For a local business, add your country's ending and read its rules, since some only sell to residents or local companies. For protecting a brand, check the endings people might confuse with yours. This check isn't trademark clearance.
+
+## Why is a free name sometimes not for sale?
+
+The registration record never shows price or who's allowed to buy. A name with no registration can still be reserved, premium-priced, or restricted. The [domain availability checker](/domain-availability) explains each case. Confirm the first-year and renewal price at a registrar before you choose.
+
+## Why is the check limited to twelve endings?
+
+Each ending is a separate request to a different registry, and registries limit how often one address can ask. Every visitor shares stack127's address, so a cap per check and per visitor keeps the tools working for everyone. If you hit a limit, the page says so.
+
+Each name goes from stack127 to its registry. Saved answers are stored by name, not linked to you. A `Registered` row can be up to 24 hours old and a `No registration found` row up to 1 hour old, and each row shows when it was fetched.
diff --git a/app/(site)/(tools)/(domain)/multi-tld-availability/content/intro.mdx b/app/(site)/(tools)/(domain)/multi-tld-availability/content/intro.mdx
new file mode 100644
index 00000000..b19574d4
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/multi-tld-availability/content/intro.mdx
@@ -0,0 +1 @@
+Enter a name without an ending, pick up to 12 endings, and see which ones are already registered. Each row shows its own registry's answer, so a check that failed never looks like a free name.
diff --git a/app/(site)/(tools)/(domain)/multi-tld-availability/content/usage.mdx b/app/(site)/(tools)/(domain)/multi-tld-availability/content/usage.mdx
new file mode 100644
index 00000000..009054f2
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/multi-tld-availability/content/usage.mdx
@@ -0,0 +1,16 @@
+## How to read the results
+
+The summary counts how many endings have no registration. Each row then shows one of four results.
+
+| Result | What it means |
+| --- | --- |
+| `No registration found` | The registry has no record of the name with that ending. |
+| `Registered` | Someone holds it. The registrar and expiry date show when published. |
+| `Cannot check` | The ending has no public lookup service. Use the registry's own search, listed in the [TLD directory](/tld-directory). |
+| `Check failed` | The registry didn't answer or limited requests. Try again in a few minutes. |
+
+<Example title="quietlanternstudio, checked on 9 October 2026">
+
+Across the 10 preselected endings, 9 of 10 have no registration. Only `quietlanternstudio.com` is `Registered`, through Tucows Domains Inc., with an expiry date of 6 October 2027.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/multi-tld-availability/page.tsx b/app/(site)/(tools)/(domain)/multi-tld-availability/page.tsx
index a362118d..47f1ad48 100644
--- a/app/(site)/(tools)/(domain)/multi-tld-availability/page.tsx
+++ b/app/(site)/(tools)/(domain)/multi-tld-availability/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Layers } from "lucide-react";
 import { MultiTldTool } from "./multi-tld-tool";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function MultiTldAvailabilityPage() {
   const toolPage = await getRequiredToolPage("multi-tld-availability");
@@ -12,12 +15,16 @@ export default async function MultiTldAvailabilityPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<Layers strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <MultiTldTool />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/punycode-converter/content/article.mdx b/app/(site)/(tools)/(domain)/punycode-converter/content/article.mdx
new file mode 100644
index 00000000..a092429f
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/punycode-converter/content/article.mdx
@@ -0,0 +1,27 @@
+## What is punycode?
+
+Punycode is the way a domain name with non-ASCII letters is written in plain ASCII, so DNS can handle it. Each encoded part starts with `xn--`. `münchen.de` and `xn--mnchen-3ya.de` are the same domain, written two ways.
+
+[RFC 3492](https://www.rfc-editor.org/rfc/rfc3492.html) defines the encoding, and [RFC 5890](https://www.rfc-editor.org/rfc/rfc5890.html) sets the rules for which names are valid. Not every Unicode string can be a domain name, so the result lists any rule a name breaks.
+
+## How do you spot a punycode phishing domain?
+
+Look for letters from another writing system that copy familiar ones. Latin `a` is U+0061, and Cyrillic `а` is U+0430. They look the same, but they make a different domain. This trick is called a homograph attack.
+
+Most lookalikes mix writing systems inside one part of the name, so the tool flags that and shows each character. A mixed name is a reason to look closer, not proof of fraud. A name written entirely in Cyrillic or Greek is normal where those languages are used.
+
+## What won't this catch?
+
+Lookalikes made only of ASCII letters. `paypaI.com` with a capital i, or `rn` standing in for `m`, use ordinary Latin letters, so no writing system check can flag them. No warning doesn't mean the name is safe.
+
+Your browser also decides when to show the readable form and when to show `xn--`. The rules differ between browsers and change over time. [Chromium's IDN display policy](https://chromium.googlesource.com/chromium/src/+/main/docs/idn.md) is one example.
+
+## Why is my converted domain name too long?
+
+Encoding makes non-ASCII names longer. `例え.jp` has 2 letters before the dot, but its encoded form `xn--r8jz45g` has 11. Each part has a 63-byte limit after encoding, and the whole name has a 253-byte limit. The label breakdown shows each part's encoded length.
+
+## Does punycode apply to the whole URL?
+
+No, only the domain name. The path and query use percent encoding, such as `%20` for a space. When you paste a full address, only its hostname changes.
+
+If a link looks suspicious, the [domain age checker](/domain-age) shows when the name was registered.
diff --git a/app/(site)/(tools)/(domain)/punycode-converter/content/intro.mdx b/app/(site)/(tools)/(domain)/punycode-converter/content/intro.mdx
new file mode 100644
index 00000000..f9d73553
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/punycode-converter/content/intro.mdx
@@ -0,0 +1 @@
+Paste a domain name or web address in either form, readable like `münchen.de` or encoded like `xn--mnchen-3ya.de`, to see both forms and every character in it. Conversion runs in your browser, and the domain isn't looked up.
diff --git a/app/(site)/(tools)/(domain)/punycode-converter/content/usage.mdx b/app/(site)/(tools)/(domain)/punycode-converter/content/usage.mdx
new file mode 100644
index 00000000..a7ec3713
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/punycode-converter/content/usage.mdx
@@ -0,0 +1,11 @@
+## How to read the result
+
+The label breakdown shows each part of the name between the dots, with its encoded length. One part can't be longer than 63 bytes.
+
+For a name with non-ASCII characters, the character table lists each one with its code point, Unicode name, and writing system. A line under the table says whether any part mixes writing systems, which is the usual sign of a lookalike.
+
+<Example title="аpple.com, with a Cyrillic first letter">
+
+The ASCII form is `xn--pple-43d.com`. The character table shows the first letter as U+0430 CYRILLIC SMALL LETTER A, and the result flags that the label mixes Cyrillic and Latin.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/punycode-converter/page.tsx b/app/(site)/(tools)/(domain)/punycode-converter/page.tsx
index 4dd129f1..170a5a65 100644
--- a/app/(site)/(tools)/(domain)/punycode-converter/page.tsx
+++ b/app/(site)/(tools)/(domain)/punycode-converter/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Languages } from "lucide-react";
 import { PunycodeTool } from "./punycode-tool";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function PunycodeConverterPage() {
   const toolPage = await getRequiredToolPage("punycode-converter");
@@ -12,12 +15,16 @@ export default async function PunycodeConverterPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<Languages strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <PunycodeTool />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx b/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
new file mode 100644
index 00000000..834d95d7
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
@@ -0,0 +1,35 @@
+## Which transfer locks can you remove?
+
+Only the one your registrar sets. The others need the registrar's help or time. The [EPP status codes](/epp-status-codes) page explains each code.
+
+| Status | Who can clear it |
+| --- | --- |
+| `clientTransferProhibited` | You, usually with a "transfer lock" switch in your registrar account. |
+| `serverTransferProhibited` | Only the registry. Ask your registrar why it's there. |
+| `pendingTransfer` | Nobody. Another transfer is already running, so wait for it to finish or cancel it with your registrar. |
+| `redemptionPeriod` or `pendingDelete` | The domain must be restored first, if restoring is still possible. |
+
+## Why can't I transfer a domain I registered or moved recently?
+
+Under ICANN's [Transfer Policy](https://www.icann.org/en/contracted-parties/accredited-registrars/transfer-policy-01-06-2016-en), the current registrar may refuse a transfer within 60 days of the registration or of the last transfer. The checker treats those 60 days as a block, so ask your registrar if you need an exception.
+
+Changing the registrant's name, organization, or email can also start a 60-day lock on generic endings. Registrars may let you opt out, but only before you make the change. Ask before editing contact details to prepare a transfer.
+
+The [ICANN Board adopted](https://www.icann.org/en/board-activities-and-meetings/materials/approved-resolutions-regular-meeting-of-the-icann-board-07-06-2026-en) shorter 30-day locks on 7 June 2026, and removed the registrant change lock. They don't apply until ICANN publishes a date, so the 60-day rules still hold.
+
+## How do I move a domain without the site or email going down?
+
+Sort out DNS before you start, because a transfer moves the registration, not your DNS, website, or email.
+
+1. Find out where your DNS is hosted. If it's at the old registrar, copy every record to the new DNS host and switch the nameservers before the transfer.
+2. If DNSSEC is on, set up signing at the new DNS host and update the DS record, or switch DNSSEC off first. A broken chain stops the domain from resolving for many visitors. The [DNSSEC checker](/dnssec-checker) tests the chain.
+3. Remove the registrar transfer lock and get the authorization code from the old registrar.
+4. Start the transfer at the new registrar and approve any confirmation email.
+
+Never paste the authorization code into a lookup tool or a public message. It's the key to the transfer.
+
+## Do country-code domains follow the same rules?
+
+No. ICANN's Transfer Policy only covers generic endings such as `.com`. Country endings such as `.uk` or `.de` have their own steps, codes, and waiting periods, and the result says when the 60-day checks don't apply. Find the registry's rules through the [TLD directory](/tld-directory).
+
+The lookup goes from stack127 to the registry and the registrar. A registered result can be a saved answer up to 24 hours old, so a lock you just removed may still show. To find your registrar's details, use the [registrar lookup](/domain-registrar).
diff --git a/app/(site)/(tools)/(domain)/transfer-readiness/content/intro.mdx b/app/(site)/(tools)/(domain)/transfer-readiness/content/intro.mdx
new file mode 100644
index 00000000..a8fa3403
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/transfer-readiness/content/intro.mdx
@@ -0,0 +1 @@
+Enter a domain name to see what its public record says could block a move to another registrar: transfer locks, a recent registration or transfer, and a close expiry date. Your registrar account can still hold blocks that no public record shows.
diff --git a/app/(site)/(tools)/(domain)/transfer-readiness/content/usage.mdx b/app/(site)/(tools)/(domain)/transfer-readiness/content/usage.mdx
new file mode 100644
index 00000000..60c7788c
--- /dev/null
+++ b/app/(site)/(tools)/(domain)/transfer-readiness/content/usage.mdx
@@ -0,0 +1,18 @@
+## How to read the result
+
+The first line counts the blockers it found and splits them into ones you can clear in your registrar account and ones that need waiting or the registrar's help. Each check below it shows one of four states.
+
+| State | What it means |
+| --- | --- |
+| Blocked | This stops a transfer right now. |
+| Risk | The transfer can go ahead, but plan for this first, such as DNSSEC or DNS hosted at the old registrar. |
+| Unknown | The public record doesn't say. Check in your account. |
+| Clear | Nothing in the public record blocks it. |
+
+`No public blocker was found` doesn't mean the transfer will go through. You still need the authorization code, account access, and the registrar's own steps.
+
+<Example title="github.com, checked on 9 October 2026">
+
+`github.com cannot be transferred now. One public blocker is visible: one you can clear in your account.` That blocker is the registrar transfer lock. Time since the last transfer is `Unknown`, because the registry published no transfer date, and `Where DNS is hosted` is a risk to plan for.
+
+</Example>
diff --git a/app/(site)/(tools)/(domain)/transfer-readiness/page.tsx b/app/(site)/(tools)/(domain)/transfer-readiness/page.tsx
index a735bbcb..1048e377 100644
--- a/app/(site)/(tools)/(domain)/transfer-readiness/page.tsx
+++ b/app/(site)/(tools)/(domain)/transfer-readiness/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ArrowLeftRight } from "lucide-react";
 import { TransferReadinessFromUrl } from "./transfer-readiness-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function TransferReadinessPage() {
   const toolPage = await getRequiredToolPage("transfer-readiness");
@@ -13,12 +16,16 @@ export default async function TransferReadinessPage() {
       <PageCanvas as="main" className="domain-tool-main">
         <ToolPageHeader
           icon={<ArrowLeftRight strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
 
         <TransferReadinessFromUrl />
 
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 61cfd4e696111fe61992fd8db07c2283c1f1d0bd Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:49 +0530
Subject: [PATCH 09/25] Rewrite the nine other SaaS calculator pages in MDX

Each shared idea now has one home page: ARR meanings, MRR movements,
the churn and retention comparison, gross margin, and ARPA.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../arpu-arpa-calculator/content/article.mdx  | 30 +++++++++++++
 .../arpu-arpa-calculator/content/intro.mdx    |  3 ++
 .../arpu-arpa-calculator/content/usage.mdx    | 23 ++++++++++
 .../(saas)/arpu-arpa-calculator/page.tsx      | 12 +++--
 .../(saas)/arr-calculator/content/article.mdx | 36 +++++++++++++++
 .../(saas)/arr-calculator/content/intro.mdx   |  3 ++
 .../(saas)/arr-calculator/content/usage.mdx   |  9 ++++
 .../(tools)/(saas)/arr-calculator/page.tsx    | 12 +++--
 .../content/article.mdx                       | 35 +++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 19 ++++++++
 .../(saas)/burn-multiple-calculator/page.tsx  | 12 +++--
 .../content/article.mdx                       | 35 +++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 15 +++++++
 .../(saas)/customer-churn-calculator/page.tsx | 12 +++--
 .../(saas)/mrr-calculator/content/article.mdx |  4 +-
 .../content/article.mdx                       | 43 ++++++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 19 ++++++++
 .../(saas)/mrr-waterfall-calculator/page.tsx  | 12 +++--
 .../content/article.mdx                       | 33 ++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 19 ++++++++
 .../net-revenue-retention-calculator/page.tsx | 12 +++--
 .../content/article.mdx                       | 39 ++++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 19 ++++++++
 .../(saas)/revenue-churn-calculator/page.tsx  | 12 +++--
 .../content/article.mdx                       | 44 +++++++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 19 ++++++++
 .../saas-gross-margin-calculator/page.tsx     | 12 +++--
 .../content/article.mdx                       | 30 +++++++++++++
 .../saas-metrics-calculator/content/intro.mdx |  3 ++
 .../saas-metrics-calculator/content/usage.mdx | 33 ++++++++++++++
 .../(saas)/saas-metrics-calculator/page.tsx   | 12 +++--
 37 files changed, 609 insertions(+), 30 deletions(-)
 create mode 100644 app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/arr-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/arr-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/arr-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/burn-multiple-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/burn-multiple-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-churn-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-churn-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/customer-churn-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/revenue-churn-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/revenue-churn-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/revenue-churn-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-metrics-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-metrics-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(saas)/saas-metrics-calculator/content/usage.mdx

diff --git a/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/article.mdx
new file mode 100644
index 00000000..1780db8d
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/article.mdx
@@ -0,0 +1,30 @@
+## How do you calculate ARPU and ARPA?
+
+Both divide revenue by a count. They differ in which revenue and which count.
+
+<Formula title="ARPU and ARPA">
+
+ARPU = net revenue in the period ÷ active users in the period
+
+ARPA = MRR at month end ÷ paying accounts at month end
+
+</Formula>
+
+[Stripe's ARPU guide](https://stripe.com/resources/more/what-is-average-revenue-per-user-why-it-matters-and-how-to-calculate-it) leaves the period, the revenue, and the meaning of "active" up to you. [ChartMogul's ARPA report](https://help.chartmogul.com/article/209-chart-average-revenue-per-account) divides MRR by paying subscribers and counts a customer with several subscriptions once.
+
+## What's the difference between ARPU and ARPA?
+
+ARPU counts people. ARPA counts paying accounts. One team account with 10 users paying $500 a month is one account at $500 of ARPA. Counted as users, that's $50 each.
+
+ARPU also counts people who don't pay, which pulls it down for apps with a free tier. ARPA counts only accounts that pay.
+
+## Can you divide quarterly ARPU by three to get monthly ARPU?
+
+Not exactly. Dividing by three still uses everyone active across the three months, which is at least as many as in any one month. So it usually comes out lower than a true monthly ARPU. Count active users for one month instead.
+
+## What does ARPA tell you next?
+
+ARPA is the starting point for most per-customer SaaS math.
+
+- The [customer lifetime value calculator](/customer-lifetime-value-calculator) turns ARPA, margin, and churn into gross profit per customer.
+- The [break-even MRR calculator](/break-even-mrr-calculator) uses it to count the paying accounts that cover your costs.
diff --git a/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/intro.mdx
new file mode 100644
index 00000000..610d0372
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator gives one of two averages: ARPU, revenue per active user over a period, or ARPA, monthly recurring revenue (MRR) per paying account at a month end.
+
+For ARPU, have net revenue and the number of active people for the same period. For ARPA, have month-end MRR and the number of paying accounts on that date.
diff --git a/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/usage.mdx
new file mode 100644
index 00000000..cdab01ef
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/content/usage.mdx
@@ -0,0 +1,23 @@
+## Which average should you pick?
+
+Pick by what you count: people or paying accounts.
+
+| | ARPU | ARPA |
+| --- | --- | --- |
+| Revenue | Net revenue over the whole period | MRR at the month end |
+| Count | Every active person, paying or not | Paying customer accounts |
+| Fits | Apps with free users, ads, or one-off purchases | Subscriptions billed per account or team |
+
+## What to enter
+
+For ARPU, decide what "active" means, such as signed in or made a purchase, and use the same rule every time. There's no standard definition. Count each person once across the whole period.
+
+For ARPA, use MRR, so a yearly plan counts as one twelfth of its price. The [MRR calculator](/mrr-calculator) works that out from your plans.
+
+<Example title="One quarter, one month end">
+
+ARPU: $75,000 of net revenue from April to June, and 5,000 active people in that time. ARPU is $15.00 for the quarter.
+
+ARPA: $12,000 of MRR at the end of April, and 120 paying accounts. ARPA is $100.00 a month.
+
+</Example>
diff --git a/app/(site)/(tools)/(saas)/arpu-arpa-calculator/page.tsx b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/page.tsx
index 5e1775b1..4707bee1 100644
--- a/app/(site)/(tools)/(saas)/arpu-arpa-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/arpu-arpa-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { UsersRound } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ArpuArpaCalculator } from "./arpu-arpa-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ArpuArpaCalculatorPage() {
   const toolPage = await getRequiredToolPage("arpu-arpa-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<UsersRound strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<UsersRound strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <ArpuArpaCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/arr-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/arr-calculator/content/article.mdx
new file mode 100644
index 00000000..221e5b9f
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arr-calculator/content/article.mdx
@@ -0,0 +1,36 @@
+## What does ARR mean?
+
+ARR means either annualized run rate or annual recurring revenue. Both use the same three letters, but they count different things. This calculator gives annualized run rate.
+
+| | Annualized run rate | Annual recurring revenue |
+| --- | --- | --- |
+| How it's worked out | MRR × 12 | Each contract's value ÷ its years, for contracts of 12 months or longer |
+| Counts monthly plans | Yes | No |
+| Fits | Businesses billing mostly monthly | Businesses billing mostly yearly or on multi-year contracts |
+
+[ChartMogul's ARR guide](https://chartmogul.com/saas-metrics/arr/) sets out both meanings and says most SaaS companies now mean run rate. If you bill both monthly and yearly, run rate is the one that counts everything.
+
+<Example title="Same business, two ARR figures">
+
+MRR is $10,000: $8,000 from monthly plans and $2,000 from yearly plans that pay $24,000 a year.
+
+- Annualized run rate: $10,000 × 12 = $120,000
+- Annual recurring revenue: $24,000, from the yearly plans only
+
+</Example>
+
+## Is ARR the revenue you'll make this year?
+
+No. ARR is today's monthly rate stretched over a year. It isn't cash collected, revenue already earned, or a forecast. New customers, upgrades, and cancellations change it next month.
+
+## Why doesn't a company's reported ARR match MRR × 12?
+
+Companies set their own ARR rules, and many explain them in their filings. [Vertex](https://www.sec.gov/Archives/edgar/data/1806837/000110465926090420/verx-20260630x10q.htm) uses MRR from the last month of the period × 12. [Bentley Systems](https://www.sec.gov/Archives/edgar/data/1031308/000103130824000008/a24q2exhibit992.htm) adds the yearly value of its recurring contracts to three months of usage-based subscription revenue, annualized.
+
+Before you compare two ARR figures, check which meaning each uses, what it includes, and the date it was taken.
+
+## How do you turn ARR into MRR?
+
+Divide annualized run rate by 12. $120,000 of ARR is $10,000 of MRR. This only works for run-rate ARR. Annual recurring revenue leaves out monthly plans, so dividing it by 12 understates MRR.
+
+To see how MRR moved over a month, use the [MRR waterfall calculator](/mrr-waterfall-calculator). To see how much cash each new dollar of ARR cost, use the [burn multiple calculator](/burn-multiple-calculator).
diff --git a/app/(site)/(tools)/(saas)/arr-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/arr-calculator/content/intro.mdx
new file mode 100644
index 00000000..fae72266
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arr-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator turns your monthly recurring revenue (MRR) into annualized ARR, which is MRR × 12.
+
+Have your current MRR total, with yearly and quarterly plans already counted as monthly amounts. If you only have plan prices and subscription counts, start with the [MRR calculator](/mrr-calculator).
diff --git a/app/(site)/(tools)/(saas)/arr-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/arr-calculator/content/usage.mdx
new file mode 100644
index 00000000..93f70664
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/arr-calculator/content/usage.mdx
@@ -0,0 +1,9 @@
+## What to enter
+
+Enter one month's recurring revenue, as of one date. A $1,200 yearly plan counts as $100, not $1,200. Leave out setup fees, tax, and other one-time charges.
+
+<Example title="$10,000 of MRR">
+
+$10,000 × 12 = $120,000.00 of annualized ARR.
+
+</Example>
diff --git a/app/(site)/(tools)/(saas)/arr-calculator/page.tsx b/app/(site)/(tools)/(saas)/arr-calculator/page.tsx
index 02677bb4..4e2f9070 100644
--- a/app/(site)/(tools)/(saas)/arr-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/arr-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { CalendarDays } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ArrCalculator } from "./arr-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ArrCalculatorPage() {
   const toolPage = await getRequiredToolPage("arr-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <ArrCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
new file mode 100644
index 00000000..216aefc9
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
@@ -0,0 +1,35 @@
+## How is burn multiple calculated?
+
+Divide net cash burn by net new ARR for the same period.
+
+<Formula title="Burn multiple">
+
+Burn multiple = net cash burn ÷ net new ARR
+
+</Formula>
+
+David Sacks of Craft Ventures [introduced the burn multiple](https://www.craftventures.com/articles/the-burn-multiple) to ask how much a startup burns to add each dollar of ARR. His example: a startup burned $2 million in a quarter while ARR grew $1 million, a burn multiple of 2.
+
+## What is a good burn multiple?
+
+Lower is better. These bands are the common rules of thumb for venture-backed startups.
+
+| Burn multiple | Read as |
+| --- | --- |
+| Under 1 | Exceptional |
+| 1 to 1.5 | Great |
+| 1.5 to 2 | Good |
+| 2 to 3 | Worth looking into |
+| Above 3 | A warning sign |
+
+[ChartMogul's burn multiple guide](https://chartmogul.com/saas-metrics/burn-multiple/) lists these bands. Craft Ventures calls its version rules of thumb for venture-stage startups, not targets for every business.
+
+## Why does my burn multiple jump around?
+
+Small ARR changes make big multiples. $12,000 of burn against $1,000 of net new ARR is 12×, even if the business is fine. A large deal, a lost customer, or a big payment near the edge of a period can swing it too. Longer periods smooth this out.
+
+Burn multiple also doesn't show that the spending caused the growth. It only compares the two numbers.
+
+## Where do the inputs come from?
+
+Net new ARR is usually the change in run-rate ARR, which counts monthly plans too. The [ARR calculator](/arr-calculator) explains the two meanings of ARR. To see which gains and losses made up the change, use the [MRR waterfall calculator](/mrr-waterfall-calculator).
diff --git a/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/intro.mdx
new file mode 100644
index 00000000..205331a1
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows your burn multiple: how much cash you burned for each dollar of annual recurring revenue (ARR) you added.
+
+Have one period's net cash burn and net new ARR, such as a quarter's burn and how much ARR grew that quarter.
diff --git a/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/usage.mdx
new file mode 100644
index 00000000..6a3b7774
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Net cash burn is the cash you spent running the business minus the cash customers paid you. Leave out money from investors and loans. If customers paid you more than you spent, enter a negative amount.
+
+Net new ARR is ARR at the end of the period minus ARR at the start. ARR is already a yearly rate, so don't annualize the change, and don't multiply a quarter's burn by four.
+
+If you track MRR, net new ARR is the change in MRR × 12. MRR going from $40,000 to $42,000 is $24,000 of net new ARR.
+
+## How to read the result
+
+<Example title="One quarter">
+
+You burned $36,000. ARR grew from $480,000 to $504,000, so net new ARR is $24,000.
+
+Burn multiple is 1.50×. You spent $1.50 of cash for each $1 of new ARR.
+
+</Example>
+
+If you didn't burn cash, or ARR didn't grow, there's no multiple to show. The result says which one happened.
diff --git a/app/(site)/(tools)/(saas)/burn-multiple-calculator/page.tsx b/app/(site)/(tools)/(saas)/burn-multiple-calculator/page.tsx
index 7b673588..c4e3cd85 100644
--- a/app/(site)/(tools)/(saas)/burn-multiple-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/burn-multiple-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { Coins } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { BurnMultipleCalculator } from "./burn-multiple-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function BurnMultipleCalculatorPage() {
   const toolPage = await getRequiredToolPage("burn-multiple-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Coins aria-hidden="true" strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Coins aria-hidden="true" strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <BurnMultipleCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/customer-churn-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/article.mdx
new file mode 100644
index 00000000..5f6d22de
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/article.mdx
@@ -0,0 +1,35 @@
+## How do you calculate customer churn rate?
+
+Divide the opening accounts you lost by the accounts you started with.
+
+<Formula title="Customer churn">
+
+Customer churn = lost opening accounts ÷ opening paying accounts × 100
+
+</Formula>
+
+If your report lists cancellations, don't count them straight in. [ChartMogul's churn report](https://help.chartmogul.com/article/203-chart-customer-churn-rate) takes the cancellations and removes customers who came back and customers who joined during the period. Its example: 100 customers at the start, 12 cancellations, one comeback, and one who joined that month, so churn is (12 - 2) ÷ 100 = 10%.
+
+## What is a good customer churn rate?
+
+There's no single good number. [ChartMogul's churn guide](https://chartmogul.com/saas-metrics/customer-churn/) says it varies by company stage, category, and price point. Early-stage companies and cheaper products usually churn more. Compare against your own past months first.
+
+## Can you turn monthly churn into yearly churn?
+
+Not by multiplying by 12. Each month's churn applies to the customers who are left, so it compounds.
+
+<Formula title="Yearly churn from a steady monthly rate">
+
+Yearly churn = 1 - (1 - monthly churn)^12
+
+</Formula>
+
+At 5% a month, you keep 95% each month. After 12 months, 0.95^12 is about 54% still paying, so yearly churn is about 46%, not 60%. This assumes the monthly rate holds all year.
+
+When you compare periods, use the same length and the same rules for who counts.
+
+## How is customer churn different from revenue churn?
+
+Customer churn counts accounts. Revenue churn counts dollars, so losing one big account hurts it more. The [revenue churn calculator](/revenue-churn-calculator) compares the churn and retention measures side by side.
+
+Monthly customer churn also feeds lifetime value. The [customer lifetime value calculator](/customer-lifetime-value-calculator) uses it to estimate the gross profit one customer brings in.
diff --git a/app/(site)/(tools)/(saas)/customer-churn-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/intro.mdx
new file mode 100644
index 00000000..a8988fa0
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows customer churn: the share of paying customers you had at the start of a period who weren't paying at its end.
+
+Have two counts for one month, quarter, or other period: paying accounts at the start, and how many of those had stopped paying by the end.
diff --git a/app/(site)/(tools)/(saas)/customer-churn-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/usage.mdx
new file mode 100644
index 00000000..0477e896
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/customer-churn-calculator/content/usage.mdx
@@ -0,0 +1,15 @@
+## What to enter
+
+Count accounts, not subscriptions. An account with three subscriptions counts once. Leave out free trials and free plans.
+
+An opening account is lost when nothing it pays for is still active at the end. One that cancelled and came back before the end isn't lost. One that joined and left within the period stays out of both counts.
+
+## How to read the result
+
+<Example title="200 accounts at the start of the month">
+
+9 of them had stopped paying by month end. Customer churn is 4.50%, and 191 opening accounts are still paying.
+
+</Example>
+
+The 191 isn't your customer count at month end. New accounts that joined during the month aren't in it.
diff --git a/app/(site)/(tools)/(saas)/customer-churn-calculator/page.tsx b/app/(site)/(tools)/(saas)/customer-churn-calculator/page.tsx
index 5bff11c1..359d8bf1 100644
--- a/app/(site)/(tools)/(saas)/customer-churn-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/customer-churn-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { UsersRound } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { CustomerChurnCalculator } from "./customer-churn-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function CustomerChurnCalculatorPage() {
   const toolPage = await getRequiredToolPage("customer-churn-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<UsersRound strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<UsersRound strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <CustomerChurnCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
index 1ecfb0d5..eb2f6512 100644
--- a/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
+++ b/app/(site)/(tools)/(saas)/mrr-calculator/content/article.mdx
@@ -34,9 +34,7 @@ No. MRR is a monthly rate, not money received or revenue in your books. In the e
 
 ## What's the difference between MRR and ARR?
 
-ARR on this page is MRR × 12, the annualized run rate. It shows a year at today's rate. It isn't a forecast or money you're owed.
-
-ARR can also mean annual recurring revenue, which [ChartMogul](https://chartmogul.com/saas-metrics/arr/) says counts only contracts of 12 months or longer. Check which one a report means before you compare.
+ARR on this page is MRR × 12, the annualized run rate. ARR can also mean annual recurring revenue, which leaves out monthly plans. The [ARR calculator](/arr-calculator) explains both.
 
 ## What doesn't MRR show?
 
diff --git a/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/article.mdx
new file mode 100644
index 00000000..bfcf5c5b
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/article.mdx
@@ -0,0 +1,43 @@
+## What do the MRR movements mean?
+
+Each movement is a change in MRR from one kind of customer event. These are the common meanings. If your billing tool defines them differently, use its numbers.
+
+| Movement | What it records |
+| --- | --- |
+| New MRR | A customer's first paid subscription, such as a trial user who starts paying |
+| Expansion MRR | An existing customer pays more, through an upgrade or more seats |
+| Reactivation MRR | A former customer starts paying again |
+| Contraction MRR | A customer pays less but stays, through a downgrade or fewer seats |
+| Churned MRR | A customer stops paying entirely, through a cancellation or failed renewal |
+
+[ChartMogul's movement guide](https://help.chartmogul.com/article/163-understanding-mrr-movements) uses these five, plus a neutral movement for changes that leave MRR the same. It also counts a new discount as contraction.
+
+## How do you calculate ending MRR?
+
+Add the gains to starting MRR and subtract the losses.
+
+<Formula title="Ending MRR">
+
+Ending MRR = starting MRR + new + expansion + reactivation - contraction - churned
+
+Net new MRR = ending MRR - starting MRR
+
+</Formula>
+
+The order of the bars is fixed: gains first, then losses. It isn't the order things happened during the month, and the order doesn't change the ending balance.
+
+Ending MRR is a run rate on the last day of the month, not the revenue you earned during it. The [MRR calculator](/mrr-calculator) explains what counts toward MRR.
+
+## Why doesn't my report's ending MRR match?
+
+Usually because the figures follow different rules. Check that every amount covers the same month, currency, and definition of MRR.
+
+Timing matters too. [ChartMogul's churn recognition setting](https://help.chartmogul.com/article/242-churn-recognition) can record a cancellation when it's made, when it's scheduled, or when the paid period ends. Each choice can move churn into a different month.
+
+## What can you work out from these movements?
+
+The same numbers feed most monthly SaaS metrics.
+
+- The [net revenue retention calculator](/net-revenue-retention-calculator) shows how much starting MRR your existing customers kept, with expansion counted.
+- The [revenue churn calculator](/revenue-churn-calculator) shows the share of starting MRR lost to contraction and churn.
+- The [SaaS metrics calculator](/saas-metrics-calculator) puts growth and retention for the month on one page.
diff --git a/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/intro.mdx
new file mode 100644
index 00000000..ce1c6e5e
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator walks one month of monthly recurring revenue (MRR) from its starting balance to its ending balance, one change at a time.
+
+Have MRR at the start of the month and that month's new, expansion, reactivation, contraction, and churned MRR from your billing report. You get ending MRR, net new MRR, and a waterfall chart of each step.
diff --git a/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/usage.mdx
new file mode 100644
index 00000000..0a8bbe36
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Starting MRR is the balance just before the month began. It is usually last month's ending MRR.
+
+Type each change as a positive amount. The calculator adds new, expansion, and reactivation MRR, and subtracts contraction and churned MRR.
+
+Use monthly amounts for every change. A new customer on a $1,200 yearly plan adds $100 to new MRR, not $1,200.
+
+## How to read the result
+
+<Example title="A month with all five changes">
+
+Start at $10,000. Add $1,200 new, $400 expansion, and $150 reactivation. Subtract $250 contraction and $500 churned.
+
+Ending MRR is $11,000.00. Net new MRR is +$1,000.00.
+
+</Example>
+
+The table under the chart gives the balance after each step. If your billing report shows its own ending MRR, compare it with this one. A gap usually means a change is missing or counted twice.
diff --git a/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/page.tsx b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/page.tsx
index 36317ec1..61d96243 100644
--- a/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/mrr-waterfall-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { CalendarDays } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { MrrWaterfallCalculator } from "./mrr-waterfall-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function MrrWaterfallCalculatorPage() {
   const toolPage = await getRequiredToolPage("mrr-waterfall-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CalendarDays strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <MrrWaterfallCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/article.mdx
new file mode 100644
index 00000000..fde8141e
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/article.mdx
@@ -0,0 +1,33 @@
+## How is net revenue retention calculated?
+
+Take the opening group's MRR, add what they gained, subtract what they lost, and divide by where they started.
+
+<Formula title="Net revenue retention">
+
+NRR = (opening MRR + expansion + reactivation - contraction - churned) ÷ opening MRR × 100
+
+</Formula>
+
+[ChartMogul's NRR report](https://help.chartmogul.com/article/143-chart-net-mrr-retention) uses this formula and leaves new customers out. Not every tool counts reactivation: [Baremetrics' formula](https://baremetrics.com/blog/what-is-net-revenue-retention) leaves it out, and ChartMogul has a setting to drop it. Pick one rule and keep it from month to month.
+
+## What does NRR above or below 100% mean?
+
+At 100%, your existing customers pay exactly what they paid at the start of the month. Above 100%, their upgrades outweigh their downgrades and cancellations, so revenue grows even with no new sales. Below 100%, they pay less than before.
+
+NRR measures revenue, not people. You can lose customers and still be above 100%, as the example shows. To count the customers who left, use the [customer churn calculator](/customer-churn-calculator).
+
+## How is NRR different from gross revenue retention?
+
+Gross revenue retention (GRR) counts only the losses. It leaves out expansion and reactivation, so it can't go above 100%. NRR adds the gains back.
+
+This calculator doesn't show GRR. The [revenue churn calculator](/revenue-churn-calculator) shows the share of starting MRR lost, and compares churn and retention measures side by side.
+
+## Why doesn't my NRR match my billing tool?
+
+Usually the starting group or a rule differs. Check these:
+
+- Who was in the opening group. ChartMogul counts past-due subscriptions as well as active ones.
+- Whether reactivation is counted.
+- Whether every figure covers the same month and currency.
+
+For the whole company's MRR, new customers included, use the [MRR waterfall calculator](/mrr-waterfall-calculator).
diff --git a/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/intro.mdx
new file mode 100644
index 00000000..017544d2
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows net revenue retention (NRR): how much of a month's starting recurring revenue your existing customers still pay at its end, after upgrades, downgrades, and cancellations.
+
+Have the monthly recurring revenue (MRR) from customers who were paying when the month began, and that group's expansion, contraction, churned, and reactivated MRR. Leave out new customers.
diff --git a/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/usage.mdx
new file mode 100644
index 00000000..a860cbae
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Opening cohort MRR is the MRR from customers paying just before the month's first day. Every other field covers only those customers. Anyone who first paid during the month stays out.
+
+Count each loss once. A customer who pays less but stays is contraction. A customer who cancels everything is churn.
+
+Reactivation here is narrow. It's for someone in the opening group who cancelled and came back in the same month. Enter their loss as churned MRR and their return as reactivation. A former customer who had already left before the month began isn't in this group.
+
+## How to read the result
+
+<Example title="$20,000 opening MRR">
+
+Expansion $1,500. Contraction $400. Churned $1,100, of which $200 came back as reactivation.
+
+Ending cohort MRR is $20,200. NRR is 101.00%.
+
+</Example>
+
+The breakdown table walks from opening to ending cohort MRR. In the example, NRR is above 100% even though $1,100 churned, because expansion more than made up for it.
diff --git a/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/page.tsx b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/page.tsx
index c09d7047..5d30811f 100644
--- a/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/net-revenue-retention-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { Activity } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { NetRevenueRetentionCalculator } from "./net-revenue-retention-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function NetRevenueRetentionCalculatorPage() {
   const toolPage = await getRequiredToolPage("net-revenue-retention-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<Activity strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Activity strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <NetRevenueRetentionCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/article.mdx
new file mode 100644
index 00000000..39833bec
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/article.mdx
@@ -0,0 +1,39 @@
+## How is revenue churn calculated?
+
+Add the MRR lost to cancellations and downgrades, then divide by MRR at the start of the month.
+
+<Formula title="Gross revenue churn">
+
+Gross revenue churn = (canceled MRR + reduced MRR) ÷ opening MRR × 100
+
+</Formula>
+
+[ChartMogul](https://chartmogul.com/saas-metrics/revenue-churn/) and [Stripe](https://stripe.com/resources/more/revenue-churn-101-how-to-calculate-it-and-why-it-matters) use the same formula.
+
+## What's the difference between gross and net revenue churn?
+
+Gross revenue churn counts only what you lost. Net revenue churn subtracts expansion and reactivation from those losses, so it can drop below zero. That's called negative churn: existing customers add more than they take away.
+
+This calculator shows gross churn. Net revenue churn is 100% minus net revenue retention, which the [net revenue retention calculator](/net-revenue-retention-calculator) works out.
+
+## How do churn and retention measures compare?
+
+All of them follow the customers you had at the start of the month. They differ in what they count and whether gains offset losses.
+
+| Measure | What it asks | Counts upgrades? |
+| --- | --- | --- |
+| Customer churn | What share of paying customers left? | No |
+| Gross revenue churn | What share of starting MRR was lost? | No |
+| Gross revenue retention | What share of starting MRR is still paid? | No |
+| Net revenue churn | What share was lost, after upgrades? | Yes |
+| Net revenue retention | What share is still paid, after upgrades? | Yes |
+
+The ones that count upgrades can pass the usual limits: net revenue churn can go below 0%, and net revenue retention above 100%. Gross revenue retention is 100% minus gross revenue churn. Net revenue retention is 100% minus net revenue churn.
+
+## Why is revenue churn different from customer churn?
+
+Customer churn counts accounts. Revenue churn counts dollars. The two split whenever the customers who leave pay more or less than average.
+
+Say you have 10 customers and $1,000 of MRR. One customer paying $50 leaves. Customer churn is 10%, but revenue churn is 5%. If the one who left paid $300, revenue churn would be 30%.
+
+To count accounts, use the [customer churn calculator](/customer-churn-calculator). To see the whole month's MRR, new customers included, use the [MRR waterfall calculator](/mrr-waterfall-calculator).
diff --git a/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/intro.mdx
new file mode 100644
index 00000000..76be0f8e
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows gross revenue churn: the share of a month's starting monthly recurring revenue (MRR) lost to cancellations and downgrades.
+
+Have the MRR from customers who were paying when the month began, and how much of it they had cancelled or cut by month end. Upgrades and new customers don't count here.
diff --git a/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/usage.mdx
new file mode 100644
index 00000000..44b07d74
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/revenue-churn-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Opening MRR comes from customers paying when the month began. Leave out anyone who first paid during the month.
+
+Compare each of those customers at the start and end of the month. If they pay nothing at month end, their whole opening MRR is canceled. If they still pay, but less, only the drop counts as reduced. If they cancelled and came back within the month, use where they ended.
+
+Count each starting dollar once. A customer who drops from $100 to $80, goes back to $100, and ends at $80 lost $20, not $40. A billing report that adds up every downgrade can show more, sometimes more than your whole opening MRR.
+
+## How to read the result
+
+<Example title="$8,000 opening MRR">
+
+Canceled opening MRR is $360. Reduced opening MRR is $120.
+
+Gross revenue churn is 6.00%. Opening MRR still present is $7,520.00.
+
+</Example>
+
+Divide `Opening MRR still present` by opening MRR and you get gross revenue retention, 94% here.
diff --git a/app/(site)/(tools)/(saas)/revenue-churn-calculator/page.tsx b/app/(site)/(tools)/(saas)/revenue-churn-calculator/page.tsx
index 2f83a35a..5f2e20b2 100644
--- a/app/(site)/(tools)/(saas)/revenue-churn-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/revenue-churn-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { TrendingDown } from "lucide-react";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { RevenueChurnCalculator } from "./revenue-churn-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function RevenueChurnCalculatorPage() {
   const toolPage = await getRequiredToolPage("revenue-churn-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<TrendingDown strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<TrendingDown strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <RevenueChurnCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/article.mdx
new file mode 100644
index 00000000..7d64fa76
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/article.mdx
@@ -0,0 +1,44 @@
+## How do you calculate SaaS gross margin?
+
+Subtract cost of revenue from revenue to get gross profit. Divide gross profit by revenue to get gross margin.
+
+<Formula title="Gross margin">
+
+Gross profit = revenue - cost of revenue
+
+Gross margin = gross profit ÷ revenue × 100
+
+</Formula>
+
+[Atlassian's quarterly filing](https://www.sec.gov/Archives/edgar/data/1650372/000165037226000011/team-20251231.htm) uses the same definitions. Gross margin comes before sales, marketing, research, and admin costs, so it isn't your profit or your cash flow.
+
+## What goes into cost of revenue?
+
+Cost of revenue is what it takes to deliver the product to paying customers. Sales, marketing, and building new things stay out.
+
+| Cost | In cost of revenue? |
+| --- | --- |
+| Hosting, servers, storage, and bandwidth | Yes |
+| Outside APIs and software used to deliver the service | Yes |
+| Customer support pay and tools | Yes |
+| Payment processing fees | Often. Atlassian includes them. |
+| Delivery work for professional services, when that revenue is included | Yes |
+| Maintaining the existing product | Often. Stripe includes it. |
+| Building new features | No |
+| Sales, marketing, and advertising | No |
+| Executive pay and general admin | No |
+
+[Stripe's gross margin guide](https://stripe.com/resources/more/saas-gross-margin-explained-what-it-is-and-why-it-is-important) and Atlassian's filing draw these lines. Companies don't all draw them the same way, so pick a rule and keep it each period.
+
+## What is a good SaaS gross margin?
+
+Stripe's guide calls a gross margin above 75% typically good for a SaaS business, and says below 70% can concern investors. Top performers reach 80% or more. Treat those as rules of thumb, not targets.
+
+Your own trend is more useful. Compare periods only when they use the same scope and cost rules. Some companies also publish an adjusted margin that leaves out costs such as stock-based pay, so check which one a figure is.
+
+## Where is gross margin used next?
+
+Most per-customer SaaS math uses it.
+
+- The [CAC payback calculator](/cac-payback-calculator) uses it to count the months to earn back the cost of a customer.
+- The [customer lifetime value calculator](/customer-lifetime-value-calculator) uses it to estimate the gross profit from one customer.
diff --git a/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/intro.mdx
new file mode 100644
index 00000000..373220d7
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows gross profit and gross margin: how much of a period's revenue is left after the costs of delivering your product.
+
+Have one period's recognized revenue and the costs of serving it, such as hosting, outside APIs, payment fees, and support pay.
diff --git a/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/usage.mdx
new file mode 100644
index 00000000..1e7d28f6
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Recognized revenue is revenue for the service you delivered in the period. It isn't cash collected or MRR. A customer who pays for a year in January is usually recognized across the year as you deliver the service, not all in January.
+
+Use revenue and costs from the same scope. For one product, enter only that product's revenue and the costs of delivering it.
+
+Put each delivery cost in one field, once. For someone who splits their time, such as a founder who also answers support, include only the delivery share. Leave out sales, marketing, building new features, and general admin.
+
+## How to read the result
+
+<Example title="$200,000 of revenue in a quarter">
+
+Hosting $22,000. Third-party APIs $8,000. Payment processing $6,000. Support people $12,000. Other $2,000.
+
+Cost of revenue is $50,000. Gross profit is $150,000.00, and gross margin is 75.00%.
+
+</Example>
+
+The table lists each cost so you can check it against your books. A cost higher than revenue gives a negative margin, which is a real result, not an error.
diff --git a/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/page.tsx b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/page.tsx
index 8e8e1dd2..f6a40934 100644
--- a/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/saas-gross-margin-calculator/page.tsx
@@ -1,18 +1,24 @@
 import { CircleDollarSign } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { SaaSGrossMarginCalculator } from "./saas-gross-margin-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function SaaSGrossMarginCalculatorPage() {
   const toolPage = await getRequiredToolPage("saas-gross-margin-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <SaaSGrossMarginCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/article.mdx
new file mode 100644
index 00000000..88ec469e
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/article.mdx
@@ -0,0 +1,30 @@
+## How is each SaaS metric calculated?
+
+Each result is one formula on the figures you entered. Each one also has its own calculator with more detail.
+
+| Metric | Formula |
+| --- | --- |
+| [Ending MRR](/mrr-waterfall-calculator) | Starting MRR + new + expansion - contraction - churned |
+| [ARR](/arr-calculator) | Ending MRR × 12 |
+| MRR growth | (Ending MRR - starting MRR) ÷ starting MRR |
+| [Net revenue retention](/net-revenue-retention-calculator) | (Starting MRR + expansion - contraction - churned) ÷ starting MRR |
+| [Gross revenue retention](/revenue-churn-calculator) | (Starting MRR - contraction - churned) ÷ starting MRR |
+| [Customer churn](/customer-churn-calculator) | Churned starting accounts ÷ starting accounts |
+| [Monthly ARPA](/arpu-arpa-calculator) | Ending MRR ÷ ending paying accounts |
+| [Gross margin](/saas-gross-margin-calculator) | (Recognized revenue - service costs) ÷ recognized revenue |
+| [CAC](/customer-acquisition-cost-calculator) | Acquisition spend ÷ new accounts |
+| [Simple LTV](/customer-lifetime-value-calculator) | ARPA × gross margin ÷ customer churn |
+| [CAC payback](/cac-payback-calculator) | CAC ÷ (ARPA × gross margin) |
+| [Burn multiple](/burn-multiple-calculator) | Net cash burn ÷ (net new MRR × 12) |
+
+New MRR counts toward growth but stays out of both retention measures. Retention follows only the customers you had at the start.
+
+## Which results are rough from one month?
+
+The revenue and retention results are exact for the figures you entered. The per-customer results are estimates.
+
+- Simple LTV assumes this month's churn and margin hold for good. One month of churn from a small customer base can swing it a lot. With no churn, it can't give a figure at all.
+- CAC matches this month's spend with this month's new accounts. If your sales take longer than a month, [Stripe's CAC guide](https://stripe.com/resources/more/cac-in-saas) warns the match is rough.
+- Burn multiple from one month swings with payment timing. A quarter is steadier.
+
+The dedicated calculators let you set each input yourself, add churn to payback, or compare a second case.
diff --git a/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/intro.mdx b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/intro.mdx
new file mode 100644
index 00000000..014c426b
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+This calculator shows what one month did to your recurring revenue: ending monthly recurring revenue (MRR), growth, and retention.
+
+Have starting MRR and that month's new, expansion, contraction, and churned MRR. Add account counts, costs, and cash burn if you also want gross margin, acquisition cost, lifetime value, payback, and burn multiple.
diff --git a/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/usage.mdx b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/usage.mdx
new file mode 100644
index 00000000..419a79e0
--- /dev/null
+++ b/app/(site)/(tools)/(saas)/saas-metrics-calculator/content/usage.mdx
@@ -0,0 +1,33 @@
+## What to enter
+
+Use monthly amounts for every MRR figure, so a yearly plan counts as one twelfth of its price. The [MRR calculator](/mrr-calculator) lists what counts.
+
+The extra metrics come in groups. Fill in a whole group or leave it blank. A blank group shows `Unavailable` with the reason, which is better than a result built on a guessed zero.
+
+- Account counts: count the same unit throughout. If a company is one paying account, count companies, not seats.
+- Recognized recurring revenue is revenue for service delivered that month. It isn't MRR or cash collected.
+- Net cash burn comes from your cash records: cash paid out minus cash received. The calculator doesn't work it out from the costs you entered.
+
+## How to read the result
+
+<Example title="April snapshot">
+
+Starting MRR $10,000. New $2,000, expansion $1,000, contraction $500, churned $500. 100 starting accounts, 25 new, 5 churned. Recognized revenue $11,000, service costs $2,200, acquisition spend $4,000, net cash burn $12,000.
+
+| Result | Value |
+| --- | --- |
+| Ending MRR | $12,000.00 |
+| MRR growth | 20.00% |
+| Net revenue retention | 100.00% |
+| Gross revenue retention | 90.00% |
+| Customer churn | 5.00% |
+| Monthly ARPA | $100.00 |
+| Gross margin | 80.00% |
+| CAC | $160.00 |
+| Simple LTV | $1,600.00 |
+| CAC payback | 2.00 months |
+| Burn multiple | 0.50× |
+
+</Example>
+
+Net revenue retention is 100% here even though 5 accounts left, because expansion made up for every lost dollar. Gross revenue retention leaves expansion out, so it shows the 10% that was lost.
diff --git a/app/(site)/(tools)/(saas)/saas-metrics-calculator/page.tsx b/app/(site)/(tools)/(saas)/saas-metrics-calculator/page.tsx
index 0811448f..49698ce3 100644
--- a/app/(site)/(tools)/(saas)/saas-metrics-calculator/page.tsx
+++ b/app/(site)/(tools)/(saas)/saas-metrics-calculator/page.tsx
@@ -1,19 +1,25 @@
 
 import { CircleDollarSign } from "lucide-react";
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { SaaSMetricsCalculator } from "./saas-metrics-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function SaaSMetricsCalculatorPage() {
   const toolPage = await getRequiredToolPage("saas-metrics-calculator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<CircleDollarSign strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <SaaSMetricsCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From e487ed32823f7fd07bd76def877bae88914738b9 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:49 +0530
Subject: [PATCH 10/25] Rewrite the twelve other storage tool pages in MDX

Cuts a toggle the drive reliability tool doesn't have, and says the
datasheet error rate is a maximum, not a measured rate.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../backup-321-calculator/content/article.mdx | 45 +++++++++++++++++++
 .../backup-321-calculator/content/intro.mdx   |  3 ++
 .../backup-321-calculator/content/usage.mdx   | 17 +++++++
 .../(storage)/backup-321-calculator/page.tsx  | 11 ++++-
 .../content/article.mdx                       | 38 ++++++++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 13 ++++++
 .../ceph-capacity-calculator/page.tsx         | 11 ++++-
 .../drive-reliability/content/article.mdx     | 35 +++++++++++++++
 .../drive-reliability/content/intro.mdx       |  3 ++
 .../drive-reliability/content/usage.mdx       | 15 +++++++
 .../(storage)/drive-reliability/page.tsx      | 11 ++++-
 .../content/article.mdx                       | 24 ++++++++++
 .../raidz-expansion-planner/content/intro.mdx |  3 ++
 .../raidz-expansion-planner/content/usage.mdx | 15 +++++++
 .../raidz-expansion-planner/page.tsx          | 11 ++++-
 .../rebuild-calculator/content/article.mdx    | 41 +++++++++++++++++
 .../rebuild-calculator/content/intro.mdx      |  3 ++
 .../rebuild-calculator/content/usage.mdx      | 15 +++++++
 .../(storage)/rebuild-calculator/page.tsx     | 11 ++++-
 .../shr-calculator/content/article.mdx        | 22 +++++++++
 .../shr-calculator/content/intro.mdx          |  3 ++
 .../shr-calculator/content/usage.mdx          | 11 +++++
 .../(tools)/(storage)/shr-calculator/page.tsx | 11 ++++-
 .../content/article.mdx                       | 26 +++++++++++
 .../content/intro.mdx                         |  3 ++
 .../content/usage.mdx                         | 18 ++++++++
 .../snapraid-mergerfs-planner/page.tsx        | 11 ++++-
 .../content/article.mdx                       | 25 +++++++++++
 .../storage-growth-planner/content/intro.mdx  |  3 ++
 .../storage-growth-planner/content/usage.mdx  | 13 ++++++
 .../(storage)/storage-growth-planner/page.tsx | 11 ++++-
 .../content/article.mdx                       | 23 ++++++++++
 .../storage-layout-advisor/content/intro.mdx  |  3 ++
 .../storage-layout-advisor/content/usage.mdx  | 15 +++++++
 .../(storage)/storage-layout-advisor/page.tsx | 11 ++++-
 .../unraid-calculator/content/article.mdx     | 27 +++++++++++
 .../unraid-calculator/content/intro.mdx       |  3 ++
 .../unraid-calculator/content/usage.mdx       | 15 +++++++
 .../(storage)/unraid-calculator/page.tsx      | 11 ++++-
 .../content/article.mdx                       | 37 +++++++++++++++
 .../zfs-capacity-calculator/content/intro.mdx |  3 ++
 .../zfs-capacity-calculator/content/usage.mdx | 17 +++++++
 .../zfs-capacity-calculator/page.tsx          | 11 ++++-
 .../content/article.mdx                       | 36 +++++++++++++++
 .../zfs-padding-calculator/content/intro.mdx  |  3 ++
 .../zfs-padding-calculator/content/usage.mdx  | 20 +++++++++
 .../(storage)/zfs-padding-calculator/page.tsx | 11 ++++-
 48 files changed, 707 insertions(+), 24 deletions(-)
 create mode 100644 app/(site)/(tools)/(storage)/backup-321-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/backup-321-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/backup-321-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/drive-reliability/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/drive-reliability/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/drive-reliability/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raidz-expansion-planner/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raidz-expansion-planner/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/raidz-expansion-planner/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/rebuild-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/rebuild-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/rebuild-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/shr-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/shr-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/shr-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-growth-planner/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-growth-planner/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-growth-planner/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-layout-advisor/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-layout-advisor/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/storage-layout-advisor/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/unraid-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/unraid-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/unraid-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-padding-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-padding-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/(storage)/zfs-padding-calculator/content/usage.mdx

diff --git a/app/(site)/(tools)/(storage)/backup-321-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/backup-321-calculator/content/article.mdx
new file mode 100644
index 00000000..b9c1b0dd
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/backup-321-calculator/content/article.mdx
@@ -0,0 +1,45 @@
+## What is the 3-2-1 backup rule?
+
+Keep 3 copies of your data, on 2 different types of media, with 1 copy off-site. That's how [CISA](https://www.cisa.gov/sites/default/files/publications/data_backup_options.pdf) puts it. Your original is copy 1, so you need two backups: one local and one off-site.
+
+## How much backup storage do you need?
+
+Start from the data you'll have at the end of your plan, then add room for every restore point you keep.
+
+<Formula title="Backup target size">
+
+Projected data = data × (1 + yearly growth)^years
+
+Full only: projected data × restore points
+
+Full plus incremental: projected data + projected data × change per point × (restore points - 1)
+
+Each target = that total + headroom
+
+</Formula>
+
+The calculator sizes both targets the same, because each holds the full set of restore points.
+
+## Do full or incremental backups use less space?
+
+Full plus incremental usually needs far less, because it stores one full copy and then only what changed. In the example above, full-only would need 103.68 TB before headroom, against 8.47 TB.
+
+Compression and deduplication can shrink both, and some software keeps extra full copies on a schedule. The calculator models neither, so check how your backup tool keeps restore points.
+
+## What are RPO and RTO?
+
+RPO, the recovery point objective, is how much recent data you can afford to lose, measured in time. RTO, the recovery time objective, is how long you can be down. Both come from [NIST's contingency planning guide](https://nvlpubs.nist.gov/nistpubs/legacy/sp/nistspecialpublication800-34r1.pdf).
+
+The calculator passes RPO when you back up at least that often. For RTO, it compares your target with the time to copy the projected data back at your restore speed.
+
+<Note title="Copy time is only part of a restore">
+
+Finding the right backup, setting up a replacement machine, and checking that apps work all add time. Test a real restore before you rely on a passing result.
+
+</Note>
+
+## Does sizing three copies make my backup 3-2-1?
+
+No. The calculator can't see where your copies live, what media they use, or whether they restore. [CISA's ransomware guide](https://www.cisa.gov/stopransomware/ransomware-guide) advises keeping backups offline and encrypted, and testing that they restore.
+
+To plan the drives themselves, use the [storage growth planner](/storage-growth-planner).
diff --git a/app/(site)/(tools)/(storage)/backup-321-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/backup-321-calculator/content/intro.mdx
new file mode 100644
index 00000000..b1bd4223
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/backup-321-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Find out how much storage each backup target needs: one local and one off-site, sized for your data, its growth, and the restore points you keep.
+
+Have the size of the data you back up and a rough yearly growth rate. Add your restore speeds if you want to check how long a full restore would take.
diff --git a/app/(site)/(tools)/(storage)/backup-321-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/backup-321-calculator/content/usage.mdx
new file mode 100644
index 00000000..191185ca
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/backup-321-calculator/content/usage.mdx
@@ -0,0 +1,17 @@
+## What to enter
+
+Protected data is the size of the files you back up, not the size of the disks they sit on.
+
+Retained points is how many restore points you keep, such as 30 for a month of daily backups. For changed data per point, divide a recent incremental backup's size by your data size.
+
+For the recovery check, use restore speeds you've seen on real transfers, not your plan's advertised speed.
+
+`Share plan` makes a link with your inputs, so anyone you send it to can see them.
+
+<Example title="2 TB of data, growing 20% a year">
+
+Over 3 years the data grows to 3.46 TB. Thirty full-plus-incremental points with 5% change each need 8.47 TB. With 20% headroom, each target needs 10.16 TB, so both need 20.32 TB.
+
+With the recovery check on, a full local restore at 1,000 Mbps and 80% efficiency takes 9.6 hours. Off-site at 100 Mbps it takes 96 hours, which misses a 12-hour target.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/backup-321-calculator/page.tsx b/app/(site)/(tools)/(storage)/backup-321-calculator/page.tsx
index c289a1c0..13d69699 100644
--- a/app/(site)/(tools)/(storage)/backup-321-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/backup-321-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ShieldCheck } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { Backup321CalculatorFromUrl } from "./backup-321-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function Backup321CalculatorPage() {
   const toolPage = await getRequiredToolPage("backup-321-calculator");
@@ -13,10 +16,14 @@ export default async function Backup321CalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<ShieldCheck strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <Backup321CalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/article.mdx
new file mode 100644
index 00000000..bc8210df
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/article.mdx
@@ -0,0 +1,38 @@
+## How do replication and erasure coding change Ceph capacity?
+
+Replication stores whole copies, so three copies leave a third of the raw space for data. Erasure coding splits data into k data chunks and adds m coding chunks, so k ÷ (k + m) of the space holds data.
+
+| Profile | Share for data | Domains needed | Usable from 128 TB raw |
+| --- | --- | --- | --- |
+| 3 copies | 1/3 | 3 | 42.67 TB |
+| Erasure coding 2+2 | 1/2 | 4 | 64 TB |
+| Erasure coding 4+2 | 2/3 | 6 | 85.33 TB |
+
+Erasure coding gives more space but needs more failure domains. [Ceph's erasure coding guide](https://docs.ceph.com/en/latest/rados/operations/erasure-code/) covers its performance and recovery trade-offs.
+
+## What is a failure domain?
+
+It's a group of drives that can fail together, such as a host or a rack. Ceph places each copy or chunk in a different domain, so a profile needs at least as many domains as copies, or k + m for erasure coding.
+
+Six drives in one host are one domain, not six. The calculator only checks the count. Ceph's [CRUSH rules](https://docs.ceph.com/en/latest/rados/operations/crush-map/) decide where data really goes.
+
+## What happens when the largest domain fails?
+
+The calculator removes the biggest domain and checks whether enough remain to place every copy or chunk. With exactly as many domains as the profile needs, losing one leaves too few. Your data can still be available, but Ceph can't restore full protection until the domain returns or you add one.
+
+A spare domain gives Ceph somewhere to rebuild the missing copies. The check doesn't simulate recovery.
+
+## How much free space should a Ceph cluster keep?
+
+Keep every OSD below 85% full, where Ceph starts warning by default. It stops writes at 95%, according to its [monitor settings](https://docs.ceph.com/en/latest/rados/configuration/mon-config-ref/). After a failure, recovery fills the remaining OSDs, so leave room for that too.
+
+## How do I check the plan against a real cluster?
+
+Compare your rows with the live hierarchy and pool settings:
+
+- `ceph osd tree` shows hosts, racks, and OSDs.
+- `ceph osd pool get <pool> size` shows a pool's copy count.
+- `ceph osd erasure-code-profile get <profile>` shows k and m.
+- `ceph df` shows what the cluster reports after it's running.
+
+The result leaves out BlueStore overhead, placement group balance, and snapshots, so `ceph df` can show less. For a single-server pool, the [ZFS capacity calculator](/zfs-capacity-calculator) fits better.
diff --git a/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/intro.mdx
new file mode 100644
index 00000000..dcf0a837
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+See how much data a Ceph cluster can hold with replication or erasure coding, and what happens to it when the largest host or rack fails.
+
+Have each group of OSDs: where it sits, how many drives, and their size.
diff --git a/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/usage.mdx
new file mode 100644
index 00000000..b3b6cde7
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/content/usage.mdx
@@ -0,0 +1,13 @@
+## What to enter
+
+Add one row per batch of identical OSDs. Give each row the name of the host, rack, or data center it sits in. Rows with the same name count as one failure domain, so a host with two drive sizes takes two rows with one label.
+
+Planning reserve is space you keep free so the cluster never fills up. It's your own choice, not a Ceph setting.
+
+`Share plan` makes a link with your inputs, including the domain names, so anyone you send it to can see them.
+
+<Example title="Four hosts, each with four 8 TB OSDs, three copies">
+
+128 TB raw gives 42.67 TB of usable space. With a 20% reserve, the planning target is 34.13 TB. Three copies need three hosts, so the fourth host is spare. Losing one host still leaves three, enough to place every copy.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/ceph-capacity-calculator/page.tsx b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/page.tsx
index d387e6f9..df042cf1 100644
--- a/app/(site)/(tools)/(storage)/ceph-capacity-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/ceph-capacity-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ServerCog } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { CephCapacityCalculatorFromUrl } from "./ceph-capacity-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function CephCapacityCalculatorPage() {
   const toolPage = await getRequiredToolPage("ceph-capacity-calculator");
@@ -12,10 +15,14 @@ export default async function CephCapacityCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<ServerCog strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <CephCapacityCalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/drive-reliability/content/article.mdx b/app/(site)/(tools)/(storage)/drive-reliability/content/article.mdx
new file mode 100644
index 00000000..30497596
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/drive-reliability/content/article.mdx
@@ -0,0 +1,35 @@
+## How is annualized failure rate calculated?
+
+AFR divides failures by drive years of running time.
+
+<Formula title="Annualized failure rate">
+
+AFR = failures ÷ (drive days ÷ 365) × 100
+
+</Formula>
+
+Drive days add up the days each drive ran. A hundred drives for ten days and ten drives for a hundred days both count 1,000 drive days.
+
+The range is an approximate 95% interval from the same failures and drive days. It describes how sure the rate is, not how long a drive will live.
+
+## What does a 0% failure rate mean?
+
+It means no drive in that group failed in the period, not that the model never fails. The range still runs above zero. HMS5C4040BLE640, with 0 failures over 15,858 drive days in Q1 2026, has a range up to 3.19%.
+
+## Why is a drive model missing?
+
+Backblaze only reports models with enough drives and running time for each period, as its [Q1 2026 report](https://www.backblaze.com/blog/backblaze-drive-stats-for-q1-2026/) lists. A missing model means there's no data, not that it's good or bad.
+
+| Period | More than this many drives | And more than this many drive days |
+| --- | --- | --- |
+| Quarterly | 100 | 10,000 |
+| Annual | 250 | 50,000 |
+| Lifetime | 500 | 100,000 |
+
+## Can Backblaze data predict my NAS drive's life?
+
+No. Backblaze runs drives in data centers with their own workload, cooling, and age mix. A model's rate there is a useful hint when you compare models, not a forecast for one drive.
+
+For a drive you own, check its SMART data and firmware, know its warranty, and keep a tested backup. The [3-2-1 backup calculator](/backup-321-calculator) sizes one, and the [rebuild calculator](/rebuild-calculator) shows how long an array stays exposed when a drive fails.
+
+The data comes from [Backblaze Drive Stats](https://www.backblaze.com/cloud-storage/resources/hard-drive-test-data). The share link stores only your filters and chosen models.
diff --git a/app/(site)/(tools)/(storage)/drive-reliability/content/intro.mdx b/app/(site)/(tools)/(storage)/drive-reliability/content/intro.mdx
new file mode 100644
index 00000000..9adaf496
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/drive-reliability/content/intro.mdx
@@ -0,0 +1,3 @@
+Look up how often a hard drive model failed in Backblaze's data centers, and how much data stands behind that number. Search an exact model, or compare up to three.
+
+The result comes from a large server fleet. It tells you how a model did there, not how long your own drive will last.
diff --git a/app/(site)/(tools)/(storage)/drive-reliability/content/usage.mdx b/app/(site)/(tools)/(storage)/drive-reliability/content/usage.mdx
new file mode 100644
index 00000000..6766e4cc
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/drive-reliability/content/usage.mdx
@@ -0,0 +1,15 @@
+## How to read the result
+
+Observed AFR is the share of drives that failed per year of running time. The approximate range next to it shows how sure that number is. A narrow range comes from many failures over a long time. A wide one means a few more or fewer failures would change the rate a lot.
+
+Each row also carries an evidence label. A thin cohort has fewer than 500 drives or at most one failure, so read its rate with care. A model below Backblaze's reporting minimum for the period shows as below the source threshold.
+
+Compare models within one period. Quarterly, annual, and lifetime figures use different minimums. The current snapshot has only a fleet summary for Annual 2025, with no model rows.
+
+<Example title="A 22 TB and a 16 TB model in Q1 2026">
+
+WUH722222ALE6L4: 42 failures over 3,992,942 drive days gives an AFR of 0.38%, with a range of 0.27% to 0.50%.
+
+ST16000NM000J: 1 failure over 10,117 drive days gives 3.61%, with a range of 0.00% to 10.68%. The higher rate rests on one failure, so the two can't be ranked with confidence.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/drive-reliability/page.tsx b/app/(site)/(tools)/(storage)/drive-reliability/page.tsx
index 8477faa9..7739681d 100644
--- a/app/(site)/(tools)/(storage)/drive-reliability/page.tsx
+++ b/app/(site)/(tools)/(storage)/drive-reliability/page.tsx
@@ -1,11 +1,14 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import snapshotData from "./data/drive-reliability-snapshot.json";
 import { DriveReliabilityFromUrl } from "./drive-reliability-from-url";
 import type { DriveReliabilitySnapshot } from "@/lib/drive-reliability";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DriveReliabilityPage() {
   const toolPage = await getRequiredToolPage("drive-reliability");
@@ -14,10 +17,14 @@ export default async function DriveReliabilityPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <DriveReliabilityFromUrl snapshot={snapshotData as DriveReliabilitySnapshot} />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/article.mdx b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/article.mdx
new file mode 100644
index 00000000..2dbdd9d7
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/article.mdx
@@ -0,0 +1,24 @@
+## Why does an expanded vdev hold less than a new one?
+
+Data written before the expansion keeps its old data-to-parity ratio. A 6-wide RAIDZ2 stores 4 data sectors for every 2 parity. After you widen it to 8, those old blocks still use 4 and 2, and only new blocks use 6 and 2. The [`zpool attach` manual](https://openzfs.github.io/openzfs-docs/man/master/8/zpool-attach.8.html) describes this.
+
+The planner calls the difference the geometry gap. The fuller the vdev is before you expand, the bigger the gap. Rewriting old data, for example with `zfs send` and `zfs receive`, moves it to the new ratio.
+
+## Why does ZFS report less free space than the planner?
+
+ZFS keeps estimating space with the vdev's original parity ratio, even after expansion, so `zfs list` and `df` show slightly less than the vdev can hold. The manual says so too. The planner shows the space the vdev can hold, not what `zfs list` will report.
+
+## Why does one extra disk sometimes add less than expected?
+
+Block size and padding can make two widths equally efficient. With 128 KiB blocks and 4 KiB sectors, a 7-wide RAIDZ2 stores data no better than a 6-wide one. In the example above, the first 8 TB disk adds 5.33 TB and the second adds 6.85 TB. The [ZFS padding calculator](/zfs-padding-calculator) shows the allocation for one block at any width.
+
+## What should you check before expanding?
+
+| Check | Why |
+| --- | --- |
+| OpenZFS 2.3 or later | RAIDZ expansion arrived in [OpenZFS 2.3.0](https://github.com/openzfs/zfs/releases/tag/zfs-2.3.0). |
+| The vdev is healthy | Expansion pauses if a disk fails until the vdev is repaired. |
+| The new disk is at least as large as the smallest member | Space above that size goes unused. |
+| A current backup | Expansion reads and rewrites every allocated block. |
+
+Expansion adds one disk at a time and keeps the parity level, so RAIDZ2 stays RAIDZ2. For a new pool, use the [ZFS capacity calculator](/zfs-capacity-calculator) instead.
diff --git a/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/intro.mdx b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/intro.mdx
new file mode 100644
index 00000000..33949d6c
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/intro.mdx
@@ -0,0 +1,3 @@
+See how much space you gain by adding disks to an existing RAIDZ vdev one at a time, and how close each step gets to a vdev built at that width from scratch.
+
+Have the vdev's current width, its smallest disk, how much space it already uses, and its `recordsize` and `ashift`.
diff --git a/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/usage.mdx b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/usage.mdx
new file mode 100644
index 00000000..a446cfd7
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/raidz-expansion-planner/content/usage.mdx
@@ -0,0 +1,15 @@
+## What to enter
+
+Enter one RAIDZ vdev, not the whole pool. The planner assumes this vdev has never been expanded.
+
+Current physical allocation is the `ALLOC` value for this vdev in `zpool list -vp`. It counts parity too, which is what the planner needs.
+
+Use `recordsize` for a dataset or `volblocksize` for a zvol, whichever holds most of your data. `zpool get ashift` shows the pool's `ashift`. `ashift=12` means 4 KiB sectors.
+
+`Share plan` puts your inputs in a link you can send or bookmark.
+
+<Example title="RAIDZ2 from 6 to 8 disks of 8 TB, with 30 TB allocated">
+
+With a 128 KiB `recordsize` and `ashift=12`, capacity rises from 32 TB to 44.18 TB, a gain of 12.18 TB. A fresh 8-disk RAIDZ2 would hold 45.51 TB, so 1.33 TB is lost to the data written before the expansion.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/raidz-expansion-planner/page.tsx b/app/(site)/(tools)/(storage)/raidz-expansion-planner/page.tsx
index 5383ce14..8691546e 100644
--- a/app/(site)/(tools)/(storage)/raidz-expansion-planner/page.tsx
+++ b/app/(site)/(tools)/(storage)/raidz-expansion-planner/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ChevronsRight } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { RaidzExpansionPlannerFromUrl } from "./raidz-expansion-planner-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function RaidzExpansionPlannerPage() {
   const toolPage = await getRequiredToolPage("raidz-expansion-planner");
@@ -12,10 +15,14 @@ export default async function RaidzExpansionPlannerPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<ChevronsRight strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <RaidzExpansionPlannerFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/rebuild-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/rebuild-calculator/content/article.mdx
new file mode 100644
index 00000000..c3a3fe55
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/rebuild-calculator/content/article.mdx
@@ -0,0 +1,41 @@
+## How long does a RAID rebuild take?
+
+Rebuild time is the data read divided by the rebuild speed. Waiting for a replacement drive adds to the time the array runs without full protection.
+
+<Formula title="Degraded window">
+
+Rebuild time = drives read × drive size × read scope ÷ rebuild speed
+
+Degraded window = rebuild time + replacement delay
+
+</Formula>
+
+How many drives the rebuild reads depends on the layout:
+
+| Layout | Drives read to rebuild one | More read errors it can correct |
+| --- | --- | --- |
+| RAID 1 and RAID 10 | 1, the mirror partner | 0 |
+| RAID 5 | All the others, N - 1 | 0 |
+| RAID 6 | At least N - 2 | 1 |
+
+N is the number of drives. A real RAID 6 rebuild may read more than N - 2 drives. [Intel's RAID guide](https://cdrdv2-public.intel.com/840787/SWUG_full_featured_entry_RAID.pdf) explains why mirror and parity rebuilds read differently.
+
+## What does read-error exposure mean?
+
+It's the modeled chance of hitting at least one unreadable sector while the rebuild reads every bit, if each bit fails at the datasheet rate on its own. More data read, or a higher error rate, means more exposure.
+
+<Formula title="Read-error exposure">
+
+Exposure = 1 - e^(-bits read ÷ bits per error)
+
+</Formula>
+
+On RAID 1, RAID 5, and RAID 10, one such error during a rebuild can leave a block that can't be rebuilt. RAID 6 can correct one.
+
+## Is a high exposure the chance of losing my array?
+
+No. The datasheet rate is a maximum, not a measured rate, so real drives can do better. Errors also don't strike each bit independently. What happens after an error depends on your controller or software.
+
+Treat the number as a way to compare layouts and drive sizes. With the example's drives in RAID 5, the read grows to 40 TB and exposure to 27.4%, with no error left to correct.
+
+The model also leaves out a second drive failing during the rebuild. The [drive reliability explorer](/drive-reliability) shows how often drive models fail, and the [RAID calculator](/raid-calculator) compares the space each layout gives.
diff --git a/app/(site)/(tools)/(storage)/rebuild-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/rebuild-calculator/content/intro.mdx
new file mode 100644
index 00000000..d3062437
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/rebuild-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Estimate how long a RAID array stays degraded after a drive fails, how much data the rebuild has to read, and how likely a read error is along the way.
+
+Have the RAID level, the number and size of drives, a rebuild speed, and the read error rate from the drive's datasheet.
diff --git a/app/(site)/(tools)/(storage)/rebuild-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/rebuild-calculator/content/usage.mdx
new file mode 100644
index 00000000..0e91ce59
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/rebuild-calculator/content/usage.mdx
@@ -0,0 +1,15 @@
+## What to enter
+
+Rebuild throughput is the speed the array reads the surviving drives during a rebuild. A speed from an earlier rebuild on similar hardware is best. A drive's top sequential speed is too high, because the array keeps serving other work. If you're unsure, try a few speeds and compare.
+
+Member read scope is the share of each drive the rebuild reads. Leave it at 100% unless your system only rebuilds used space, as ZFS does.
+
+The URE specification is on the drive's datasheet, usually as "nonrecoverable read errors per bits read". The [Seagate IronWolf manual](https://www.seagate.com/www-content/product-content/ironwolf/en-us/docs/100818527d.pdf), for example, lists 1 per 10^15 bits.
+
+Replacement delay is the time before a new drive goes in. It adds to the degraded window but not to the read.
+
+<Example title="RAID 6 with six 8 TB drives at 150 MB/s">
+
+The rebuild reads 32 TB and takes 2 days 11 hours. At 1 error per 10^15 bits, modeled read-error exposure is 22.6%. RAID 6 can still correct one more error, so this is not a 22.6% chance of losing data.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/rebuild-calculator/page.tsx b/app/(site)/(tools)/(storage)/rebuild-calculator/page.tsx
index edb7a97b..1f39542b 100644
--- a/app/(site)/(tools)/(storage)/rebuild-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/rebuild-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { RebuildCalculator } from "./rebuild-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function RebuildCalculatorPage() {
   const toolPage = await getRequiredToolPage("rebuild-calculator");
@@ -12,10 +15,14 @@ export default async function RebuildCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <RebuildCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/shr-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/shr-calculator/content/article.mdx
new file mode 100644
index 00000000..772b91f8
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/shr-calculator/content/article.mdx
@@ -0,0 +1,22 @@
+## How does SHR use drives of different sizes?
+
+SHR cuts the drives into layers. Every drive fills the bottom layer up to the size of the smallest drive. The larger drives continue into the next layer, and so on. Each layer is protected on its own, like a small RAID array.
+
+| Layer, for 4, 4, 8, and 8 TB drives | Drives | SHR-1 data | SHR-2 data |
+| --- | --- | --- | --- |
+| 0 to 4 TB | 4 | 12 TB | 8 TB |
+| 4 to 8 TB | 2 | 4 TB | Unused |
+
+SHR-1 uses one drive's share of each layer for protection, and SHR-2 uses two. A layer needs more drives than that to hold data, so in SHR-2 the top layer of the two larger drives stays empty. Plain RAID 5 on the same drives gives 12 TB, because it uses only 4 TB of each drive. The [RAID calculator](/raid-calculator) shows that layout.
+
+## Should I choose SHR-1 or SHR-2?
+
+Decide how many failed drives you need to survive, then compare space. SHR-1 survives one failed drive, and SHR-2 survives two and needs at least four drives.
+
+SHR-2 costs a second drive's worth of space, and with mixed sizes it can leave the top layers unused. Neither is a backup. The [3-2-1 backup calculator](/backup-321-calculator) helps you size one.
+
+## Why does DSM show less space than the calculator?
+
+DSM takes more off after the pool is built. The calculator already subtracts about 10 GB per drive for the system, as [Synology's RAID calculator](https://www.synology.com/en-uk/support/RAID_calculator) does. Synology also reserves about 4% for metadata on a Btrfs volume, or 2% on ext4, and snapshots use more.
+
+An existing pool can also differ because of the order its drives were added or replaced. Check [Synology's SHR guide](https://kb.synology.com/en-uk/DSM/tutorial/What_is_Synology_Hybrid_RAID_SHR) and your NAS model's support before you buy drives to grow a pool.
diff --git a/app/(site)/(tools)/(storage)/shr-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/shr-calculator/content/intro.mdx
new file mode 100644
index 00000000..b9fe9994
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/shr-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+See how much space a Synology SHR-1 or SHR-2 pool gives you from drives of different sizes, and how much goes to protection or sits unused.
+
+Have the size of each drive, as printed on its label. The estimate is for a new pool, so an existing pool you've grown over time can differ.
diff --git a/app/(site)/(tools)/(storage)/shr-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/shr-calculator/content/usage.mdx
new file mode 100644
index 00000000..a1c3a534
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/shr-calculator/content/usage.mdx
@@ -0,0 +1,11 @@
+## How to read the result
+
+The bar splits the raw space of all drives into four parts: the estimated pool, Synology's system reserve, protection, and unused space. The band table shows how the calculator cuts the drives into layers, with the drives that reach each layer.
+
+`Share configuration` makes a link with your drive sizes, so anyone you send it to can see them.
+
+<Example title="Two 4 TB and two 8 TB drives">
+
+SHR-1 gives an estimated pool of 15.96 TB, with 8 TB for protection and nothing unused. SHR-2 gives 7.96 TB, with 8 TB for protection and 8 TB unused.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/shr-calculator/page.tsx b/app/(site)/(tools)/(storage)/shr-calculator/page.tsx
index ecea3965..28fc1950 100644
--- a/app/(site)/(tools)/(storage)/shr-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/shr-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { ShrCalculatorFromUrl } from "./shr-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ShrCalculatorPage() {
   const toolPage = await getRequiredToolPage("shr-calculator");
@@ -12,10 +15,14 @@ export default async function ShrCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <ShrCalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/article.mdx b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/article.mdx
new file mode 100644
index 00000000..d66a37b5
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/article.mdx
@@ -0,0 +1,26 @@
+## How do SnapRAID and mergerfs work together?
+
+SnapRAID protects the data disks with parity. mergerfs shows the same data disks as one folder. They use the same data mounts but do different jobs.
+
+| Tool | Job | Uses |
+| --- | --- | --- |
+| SnapRAID | Parity and checksums, updated when you run a sync | Data disks, parity disks, content files |
+| mergerfs | One pooled folder over many disks | Data disks only |
+
+The fstab line lists data disks only, so a parity disk never becomes part of the pool.
+
+## What does SnapRAID protect between syncs?
+
+Only what was there at the last sync. SnapRAID isn't real-time: files added or changed since then may not be recoverable if a disk fails. The [manual](https://www.snapraid.it/manual) names this as its main limit.
+
+That makes SnapRAID a good fit for media libraries that rarely change, and a poor fit for databases or virtual machine images that change all the time. Schedule syncs to match how fast your data changes, and keep a separate backup. The [3-2-1 backup calculator](/backup-321-calculator) helps you size one.
+
+## What should you check before using the files?
+
+The planner compares paths, not real disks. Two different paths can sit on the same disk, and only the host can tell you.
+
+1. Run `findmnt` and `lsblk` to confirm each path is its own disk.
+2. Check that your mergerfs version and FUSE setup allow `allow_other`, which lets other users and services see the pool.
+3. Save the files under `/etc`, mount the pool, and run your first `snapraid sync`.
+
+Compare the options with the [SnapRAID manual](https://www.snapraid.it/manual) and the [mergerfs quick start](https://trapexit.github.io/mergerfs/2.41.1/quickstart/) for your installed versions. For a parity-protected array that runs in real time, see the [Unraid calculator](/unraid-calculator).
diff --git a/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/intro.mdx b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/intro.mdx
new file mode 100644
index 00000000..f4c76fe4
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/intro.mdx
@@ -0,0 +1,3 @@
+Build a `snapraid.conf` and a matching mergerfs line for `/etc/fstab` from one list of disks. The planner checks that parity, data, content files, and the pool don't overlap.
+
+Have the mount path and size of each data and parity disk, and where you want SnapRAID's content files.
diff --git a/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/usage.mdx b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/usage.mdx
new file mode 100644
index 00000000..a25e6536
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/content/usage.mdx
@@ -0,0 +1,18 @@
+## What to enter
+
+Each parity disk must be at least as large as your largest data disk, because parity can grow to that size. The [SnapRAID manual](https://www.snapraid.it/manual) sets this rule.
+
+Content files are SnapRAID's list of files and checksums. Keep at least one more copy than you have parity disks, each on a different disk. A copy can sit on a data disk, such as `/mnt/disk1/snapraid.content`, but never on a parity disk.
+
+The mergerfs policy decides which disk gets a new file:
+
+| Option | mergerfs policy | New files go to |
+| --- | --- | --- |
+| Balanced | `epmfs` | The disk with the most free space among those that already have the folder |
+| Most free | `mfs` | The disk with the most free space |
+
+Balanced keeps a folder's files together. The [mergerfs policy docs](https://trapexit.github.io/mergerfs/latest/config/functions_categories_policies/) explain the rest.
+
+Leave the blocksize at 256 KiB, SnapRAID's default, unless you have a reason to change it.
+
+Your paths stay in this browser and aren't added to the page address.
diff --git a/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/page.tsx b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/page.tsx
index c20a91fb..33162242 100644
--- a/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/page.tsx
+++ b/app/(site)/(tools)/(storage)/snapraid-mergerfs-planner/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { SnapraidMergerfsPlanner } from "./snapraid-mergerfs-planner";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function SnapraidMergerfsPlannerPage() {
   const toolPage = await getRequiredToolPage("snapraid-mergerfs-planner");
@@ -12,10 +15,14 @@ export default async function SnapraidMergerfsPlannerPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <SnapraidMergerfsPlanner />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/storage-growth-planner/content/article.mdx b/app/(site)/(tools)/(storage)/storage-growth-planner/content/article.mdx
new file mode 100644
index 00000000..076ee1b0
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-growth-planner/content/article.mdx
@@ -0,0 +1,25 @@
+## How do you estimate storage growth?
+
+Multiply your data by one plus the growth rate, once for each year.
+
+<Formula title="Data after n years">
+
+Data in year n = current data × (1 + annual growth)^n
+
+</Formula>
+
+At 20% a year, 10 TB becomes 12 TB after one year and 14.4 TB after two. Real growth comes in jumps, such as a new camera or a migration, so try a slower and a faster rate too.
+
+## What does the shortfall year mean?
+
+It's the first year your data is larger than the usable space minus your reserve. The array isn't full yet, but you're into the space you meant to keep free. Plan to buy more drives before then.
+
+Usable space comes from equal drives and the layout you pick: mirror keeps half, single parity loses one drive, and dual parity loses two. For mixed drives or a ZFS pool, check the number in the [RAID calculator](/raid-calculator) or the [ZFS capacity calculator](/zfs-capacity-calculator).
+
+## How much does it cost to run a NAS?
+
+Power adds up because a NAS runs all the time. A system drawing 50 W all day uses 438 kWh a year, which is 0.05 kW × 8,760 hours. Multiply by your electricity rate to get the yearly cost.
+
+The total adds hardware, power over the whole horizon, the replacement reserve, and the backup budget. It leaves out labor, cooling, taxes, and moving data. Prices are the ones you enter, not live prices.
+
+A backup budget is money, not storage. The [3-2-1 backup calculator](/backup-321-calculator) sizes the backup itself.
diff --git a/app/(site)/(tools)/(storage)/storage-growth-planner/content/intro.mdx b/app/(site)/(tools)/(storage)/storage-growth-planner/content/intro.mdx
new file mode 100644
index 00000000..7b82f967
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-growth-planner/content/intro.mdx
@@ -0,0 +1,3 @@
+Find out when your data will outgrow a storage setup, and what that setup costs to buy and run over the years.
+
+Have how much data you store now, how fast it grows each year, and the drives and prices you're considering.
diff --git a/app/(site)/(tools)/(storage)/storage-growth-planner/content/usage.mdx b/app/(site)/(tools)/(storage)/storage-growth-planner/content/usage.mdx
new file mode 100644
index 00000000..cb34fc49
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-growth-planner/content/usage.mdx
@@ -0,0 +1,13 @@
+## What to enter
+
+Current data is what you store now, not the size of your drives. To estimate annual growth, compare it with how much you stored a year ago. Count snapshots and backups only if they live on this storage.
+
+Operating reserve is free space you never plan to fill. Average draw is the whole system's power use, measured at the wall if you can, not the drives' label ratings. Replacement reserve is a yearly share of the drive cost set aside for failed drives.
+
+`Share plan` makes a link with your inputs, so anyone you send it to can see them.
+
+<Example title="10 TB growing 20% a year on six 12 TB drives with dual parity">
+
+Usable space is 48 TB, or 38.4 TB after a 20% reserve. Data reaches 24.88 TB by year 5, so the plan covers all 5 years. At 40% growth it falls short in year 4. Hardware costs $1,600 and power at 60 W and $0.15 per kWh adds $394.20, for a total of $1,994.20.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/storage-growth-planner/page.tsx b/app/(site)/(tools)/(storage)/storage-growth-planner/page.tsx
index 338faf08..14d161a8 100644
--- a/app/(site)/(tools)/(storage)/storage-growth-planner/page.tsx
+++ b/app/(site)/(tools)/(storage)/storage-growth-planner/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Calculator } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { StorageGrowthPlannerFromUrl } from "./storage-growth-planner-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function StorageGrowthPlannerPage() {
   const toolPage = await getRequiredToolPage("storage-growth-planner");
@@ -12,10 +15,14 @@ export default async function StorageGrowthPlannerPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Calculator strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <StorageGrowthPlannerFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/storage-layout-advisor/content/article.mdx b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/article.mdx
new file mode 100644
index 00000000..4c05a783
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/article.mdx
@@ -0,0 +1,23 @@
+## Which RAID layout should I use?
+
+Start from how many failed drives you must survive, then pick the layout that keeps the most space for what you store.
+
+| Layout | Usable from four 8 TB drives | Survives |
+| --- | --- | --- |
+| RAID 5 or RAIDZ1 | 24 TB | Any 1 drive |
+| RAID 6 or RAIDZ2 | 16 TB | Any 2 drives |
+| Striped mirrors, RAID 10 | 16 TB | Any 1 drive, up to one per pair |
+
+RAID 6 and striped mirrors tie on space but not on failures. RAID 6 survives any two failed drives. Striped mirrors survive two only if they sit in different pairs.
+
+Mirrors suit VMs and databases because each small write touches fewer drives. The [RAID calculator](/raid-calculator) shows the write penalty for each level.
+
+## What does "best fit" mean?
+
+It's the top of a ranked list, not a guarantee. The advisor drops layouts that miss your failure target, then ranks the rest by the share of space they keep, adjusted for your workload. It doesn't measure speed or predict reliability.
+
+## Why can my real pool hold less?
+
+The result is the array size before a filesystem goes on it. ZFS RAIDZ also loses space to padding that depends on block size and pool width, so a RAIDZ1 can hold less than RAID 5 on the same drives. Use the [ZFS capacity calculator](/zfs-capacity-calculator) for a closer ZFS number.
+
+Check that your NAS or operating system supports the layout and the drive count. Adding a disk to an existing RAIDZ vdev is a separate question, covered by the [RAIDZ expansion planner](/raidz-expansion-planner).
diff --git a/app/(site)/(tools)/(storage)/storage-layout-advisor/content/intro.mdx b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/intro.mdx
new file mode 100644
index 00000000..3fd10352
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/intro.mdx
@@ -0,0 +1,3 @@
+Compare the RAID and ZFS layouts your drives can build, see how much space and protection each gives, and get a best fit for how many failures you need to survive and what you store.
+
+Have the size of each drive, as printed on its label.
diff --git a/app/(site)/(tools)/(storage)/storage-layout-advisor/content/usage.mdx b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/usage.mdx
new file mode 100644
index 00000000..060a83ce
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/storage-layout-advisor/content/usage.mdx
@@ -0,0 +1,15 @@
+## What to enter
+
+Protected failures is the number of drives that can fail at once, in any order, without losing data. Only layouts that meet it are compared.
+
+Workload changes the order of the list, not the space. VMs and databases put mirrors first, because they handle small random writes better. Bulk files and General put parity first, because it keeps more space.
+
+For striped mirrors, drives pair up in the order you enter them, so put same-size drives next to each other.
+
+`Share layout` makes a link with your inputs, so anyone you send it to can see them.
+
+<Example title="Four 8 TB drives, one protected failure">
+
+With General, the best fit is RAID 5 or RAIDZ1 with 24 TB usable. RAID 6 and striped mirrors follow with 16 TB each. Switch to VMs and databases and striped mirrors move to the top.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/storage-layout-advisor/page.tsx b/app/(site)/(tools)/(storage)/storage-layout-advisor/page.tsx
index 9cad368b..26ff65b1 100644
--- a/app/(site)/(tools)/(storage)/storage-layout-advisor/page.tsx
+++ b/app/(site)/(tools)/(storage)/storage-layout-advisor/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { StorageLayoutAdvisorFromUrl } from "./storage-layout-advisor-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function StorageLayoutAdvisorPage() {
   const toolPage = await getRequiredToolPage("storage-layout-advisor");
@@ -12,10 +15,14 @@ export default async function StorageLayoutAdvisorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <StorageLayoutAdvisorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/unraid-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/unraid-calculator/content/article.mdx
new file mode 100644
index 00000000..65d0ce1d
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/unraid-calculator/content/article.mdx
@@ -0,0 +1,27 @@
+## How is Unraid array capacity calculated?
+
+Add up the data drives. Parity drives hold recovery information, not files, so they don't count.
+
+Unlike RAID, Unraid uses all of every data drive, even when sizes differ. The same four drives of 4, 8, 12, and 12 TB in RAID 5 would give 12 TB, because RAID uses only as much of each drive as the smallest holds. The [RAID calculator](/raid-calculator) shows that layout.
+
+## How big does the Unraid parity drive need to be?
+
+At least as large as your largest data drive. With dual parity, both parity drives must meet that rule, but they can differ in size. [Unraid's docs](https://docs.unraid.net/unraid-os/using-unraid-to/manage-storage/array/adding-disks-to-array/) set the rule.
+
+| Parity | Survives | Rule |
+| --- | --- | --- |
+| None | No failed drive | None |
+| Single | 1 failed drive | Parity at least as large as every data drive |
+| Dual | 2 failed drives | Both parity drives at least as large as every data drive |
+
+Extra space on a larger parity drive doesn't add to your data space.
+
+## Can I add a larger drive to Unraid later?
+
+Yes, but a data drive larger than your parity drive needs a parity upgrade first. Replace the parity drive with the larger one, then reuse the old parity drive as a data drive. Follow Unraid's guide for [replacing disks](https://docs.unraid.net/unraid-os/using-unraid-to/manage-storage/array/replacing-disks-in-array/).
+
+## Why does Unraid show less space than the calculator?
+
+The result is the raw size of the data drives. The filesystem on each drive takes some space, and your operating system may count in TiB. Cache pools aren't part of this array estimate.
+
+Parity is not a backup. It rebuilds a failed drive but can't bring back deleted or damaged files. The [3-2-1 backup calculator](/backup-321-calculator) helps you size a backup. For a ZFS pool instead of an Unraid array, use the [ZFS capacity calculator](/zfs-capacity-calculator).
diff --git a/app/(site)/(tools)/(storage)/unraid-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/unraid-calculator/content/intro.mdx
new file mode 100644
index 00000000..a760f542
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/unraid-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+See how much space an Unraid array gives you from the data and parity drives you assign, and whether a bigger drive you add later would need a parity upgrade first.
+
+Have the size of each drive, as printed on its label, and which ones will be parity.
diff --git a/app/(site)/(tools)/(storage)/unraid-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/unraid-calculator/content/usage.mdx
new file mode 100644
index 00000000..a1e090a7
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/unraid-calculator/content/usage.mdx
@@ -0,0 +1,15 @@
+## What to enter
+
+Add your parity drives and data drives separately. The calculator doesn't pick parity for you, because that choice decides which drives you can add later.
+
+Use `Plan a future data drive` to check one you might buy. It isn't added to today's capacity.
+
+Results show in TiB. Switch to TB to compare them with drive labels.
+
+`Share configuration` makes a link with your drives and their roles, so anyone you send it to can see them.
+
+<Example title="A 12 TB parity drive with 4, 8, and 12 TB data drives">
+
+Current data capacity is 24 TB, shown as 21.83 TiB. A future 16 TB data drive needs the parity drive upgraded to at least 16 TB first.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/unraid-calculator/page.tsx b/app/(site)/(tools)/(storage)/unraid-calculator/page.tsx
index a7fab721..ebe104d8 100644
--- a/app/(site)/(tools)/(storage)/unraid-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/unraid-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { HardDrive } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { UnraidCalculatorFromUrl } from "./unraid-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function UnraidCalculatorPage() {
   const toolPage = await getRequiredToolPage("unraid-calculator");
@@ -13,10 +16,14 @@ export default async function UnraidCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<HardDrive strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <UnraidCalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/article.mdx
new file mode 100644
index 00000000..2f63fb23
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/article.mdx
@@ -0,0 +1,37 @@
+## How does a ZFS pool add up its vdevs?
+
+A pool is a set of vdevs, and ZFS spreads data across all of them. Each vdev has its own redundancy, so the pool's space is the sum of what each vdev gives.
+
+<MarkerArt figure="catalog/zfs-capacity" alt="Separate vdevs stack together to form one ZFS pool." />
+
+Losing a whole vdev loses the pool, so the weakest vdev sets the pool's safety. The [OpenZFS vdev overview](https://openzfs.github.io/openzfs-docs/Basic%20Concepts/Pool%20Structure/VDEVs.html) covers the rules.
+
+| Vdev | Minimum drives | Drives that can fail in that vdev |
+| --- | --- | --- |
+| Mirror | 2 | All but one |
+| RAIDZ1 | 2 | 1 |
+| RAIDZ2 | 3 | 2 |
+| RAIDZ3 | 4 | 3 |
+
+## Why does block size change RAIDZ capacity?
+
+RAIDZ writes each block as data sectors plus parity sectors, then pads the total to a multiple of parity plus one. Small blocks waste more of each stripe on parity and padding.
+
+| Six 8 TB drives in RAIDZ2 | Writable |
+| --- | --- |
+| 128 KiB `recordsize` | 28.98 TiB |
+| 8 KiB `volblocksize` | 14.43 TiB |
+
+With 8 KiB blocks, only a third of the space holds data, against two thirds with 128 KiB blocks. The [OpenZFS RAIDZ guide](https://openzfs.github.io/openzfs-docs/Basic%20Concepts/Pool%20Structure/RAIDZ.html) explains the allocation, and the [ZFS padding calculator](/zfs-padding-calculator) shows the sectors for one block. The estimate uses one block size for the whole pool, while a real pool mixes sizes.
+
+## What is ZFS slop space?
+
+It's space ZFS keeps back so the pool never fills completely. OpenZFS reserves 1/32 of the pool by default, about 3.2%, according to its [module parameters](https://openzfs.github.io/openzfs-docs/man/master/4/zfs.4.html). The OpenZFS source caps it at 128 GiB, so large pools lose less than 3.2%.
+
+Planning headroom is different. It's your own choice of space to leave free, and it doesn't change what ZFS can write.
+
+## Why does my pool show less free space?
+
+The estimate is for a new, empty pool. Partitions, metadata, snapshots, and the real mix of block sizes all take space, so `zfs list` usually shows less. Drives are also labeled in TB while ZFS reports TiB, so an 8 TB drive shows as 7.28 TiB. The [RAID calculator](/raid-calculator) explains that difference in full.
+
+To widen an existing RAIDZ vdev, use the [RAIDZ expansion planner](/raidz-expansion-planner). Expanded vdevs hold less than this estimate for a fresh one.
diff --git a/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/intro.mdx
new file mode 100644
index 00000000..d4756d88
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Estimate how much you can store in a new ZFS pool built from mirrors and RAIDZ vdevs, after parity, RAIDZ padding, and the space ZFS keeps back.
+
+Have the drives in each vdev you plan to build, and the `recordsize` or `volblocksize` your data will use.
diff --git a/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/usage.mdx
new file mode 100644
index 00000000..e05f29e5
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/content/usage.mdx
@@ -0,0 +1,17 @@
+## What to enter
+
+Add each vdev on its own. Four drives as two mirrors are two vdevs, not one four-way mirror.
+
+Pick the block size most of your data will use: `recordsize` for datasets, 128 KiB by default, or `volblocksize` for zvols. Small blocks on RAIDZ can lose a lot of space to padding. Leave `ashift` at 12, for 4 KiB sectors, unless you know your drives need another value.
+
+Planning headroom is extra free space you don't plan to fill. It lowers the planning target, not the writable capacity. Spares, SLOG, and L2ARC devices don't add space. A special vdev holds metadata, and the result counts it apart from the data vdevs.
+
+Results show in TiB, the binary unit `zfs list` uses. Switch to TB to compare them with drive labels.
+
+`Share configuration` puts your inputs in a link. The `zpool create -n` command uses placeholder device names, so replace them and check it before you run anything.
+
+<Example title="Six 8 TB drives in one RAIDZ2 vdev">
+
+With a 128 KiB `recordsize` and `ashift=12`, estimated writable capacity is 28.98 TiB, which is 31.86 TB. Parity takes 14.55 TiB and ZFS keeps back 0.13 TiB. With 20% headroom, the planning target is 23.18 TiB.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/zfs-capacity-calculator/page.tsx b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/page.tsx
index 28a4ccc1..3f0542d6 100644
--- a/app/(site)/(tools)/(storage)/zfs-capacity-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/zfs-capacity-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Database } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { ZfsCapacityCalculatorFromUrl } from "./zfs-capacity-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ZfsCapacityCalculatorPage() {
   const toolPage = await getRequiredToolPage("zfs-capacity-calculator");
@@ -12,10 +15,14 @@ export default async function ZfsCapacityCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Database strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <ZfsCapacityCalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/article.mdx b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/article.mdx
new file mode 100644
index 00000000..bbd3c6c1
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/article.mdx
@@ -0,0 +1,36 @@
+## How does RAIDZ allocate a block?
+
+RAIDZ splits the block into sectors, adds parity for each row of data sectors, then pads the total up to a multiple of parity plus one.
+
+<Formula title="RAIDZ allocation">
+
+Data sectors = block size ÷ sector size, rounded up
+
+Rows = data sectors ÷ (width - parity), rounded up
+
+Parity sectors = rows × parity
+
+Allocated sectors = data + parity, rounded up to a multiple of (parity + 1)
+
+</Formula>
+
+The sectors added by that last rounding are the padding. The [OpenZFS RAIDZ guide](https://openzfs.github.io/openzfs-docs/Basic%20Concepts/Pool%20Structure/RAIDZ.html) explains how RAIDZ lays out data.
+
+## Which block size wastes the least space on RAIDZ?
+
+Larger blocks, up to a point. On a six-drive RAIDZ2 with 4 KiB sectors:
+
+| Block size | Space on disk | Share that holds data |
+| --- | --- | --- |
+| 4 KiB | 12 KiB | 33.3% |
+| 8 KiB | 24 KiB | 33.3% |
+| 16 KiB | 24 KiB | 66.7% |
+| 128 KiB | 192 KiB | 66.7% |
+
+From 16 KiB up, every block reaches the best this width can do, which is 4 data drives out of 6. That's why a zvol with small blocks can lose much more space on RAIDZ than a dataset with 128 KiB records.
+
+## Should I pick the most space-efficient block size?
+
+Not on space alone. Block size also changes how fast reads and writes are and how well data compresses. A database that writes 8 KiB pages can run better with a matching small block, even on a less efficient layout. Use this calculator to see the space cost of that choice.
+
+The result is for one uncompressed block. Compression, metadata, and snapshots change real use. For a whole pool, use the [ZFS capacity calculator](/zfs-capacity-calculator).
diff --git a/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/intro.mdx b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/intro.mdx
new file mode 100644
index 00000000..67e604d1
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+See how much disk space one ZFS block really takes on a RAIDZ vdev once parity and padding are added, and compare block sizes before you set `recordsize` or `volblocksize`.
+
+Have the RAIDZ level, the number of drives in the vdev, the block size, and the pool's `ashift`.
diff --git a/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/usage.mdx b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/usage.mdx
new file mode 100644
index 00000000..875864b8
--- /dev/null
+++ b/app/(site)/(tools)/(storage)/zfs-padding-calculator/content/usage.mdx
@@ -0,0 +1,20 @@
+## What to enter
+
+Vdev width is the number of drives in this one RAIDZ vdev, not in the whole pool. `zpool get ashift` shows `ashift`. 12 means 4 KiB sectors.
+
+Pick Filesystem for a dataset, where the setting is `recordsize`, or Zvol for a block device, where it's `volblocksize`. `recordsize` is the largest block a file uses, so files smaller than it use one smaller block.
+
+`Share configuration` puts your inputs in a link you can send or bookmark.
+
+<Example title="An 8 KiB block on a six-drive RAIDZ2 with ashift=12">
+
+| Part | Sectors | Space |
+| --- | --- | --- |
+| Data | 2 | 8 KiB |
+| Parity | 2 | 8 KiB |
+| Padding | 2 | 8 KiB |
+| Total | 6 | 24 KiB |
+
+The 8 KiB block takes 24 KiB on disk, so a third of the space holds data.
+
+</Example>
diff --git a/app/(site)/(tools)/(storage)/zfs-padding-calculator/page.tsx b/app/(site)/(tools)/(storage)/zfs-padding-calculator/page.tsx
index 88f4cac5..d4eb387d 100644
--- a/app/(site)/(tools)/(storage)/zfs-padding-calculator/page.tsx
+++ b/app/(site)/(tools)/(storage)/zfs-padding-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Columns3 } from "lucide-react";
 import { PageCanvas } from "../../../../ui/site/page-canvas";
 import { ZfsPaddingCalculatorFromUrl } from "./zfs-padding-calculator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ZfsPaddingCalculatorPage() {
   const toolPage = await getRequiredToolPage("zfs-padding-calculator");
@@ -12,10 +15,14 @@ export default async function ZfsPaddingCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Columns3 strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <ZfsPaddingCalculatorFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 81cde15aaac341df630ae382bc9953440b3e15ad Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:11:49 +0530
Subject: [PATCH 11/25] Rewrite the developer and self-host tool pages in MDX

Ten more pages, plus the chmod copy message that said "UiSelect".

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../chmod-calculator/chmod-calculator.tsx     |  2 +-
 .../content/article.mdx                       | 52 ++++++++++++++++++
 .../docker-compose-checker/content/intro.mdx  |  3 +
 .../docker-compose-checker/content/usage.mdx  | 32 +++++++++++
 .../(tools)/docker-compose-checker/page.tsx   | 12 +++-
 .../dockerignore-tester/content/article.mdx   | 54 ++++++++++++++++++
 .../dockerignore-tester/content/intro.mdx     |  3 +
 .../dockerignore-tester/content/usage.mdx     | 19 +++++++
 .../(tools)/dockerignore-tester/page.tsx      | 11 +++-
 .../(tools)/ip-asn-lookup/content/article.mdx | 41 ++++++++++++++
 .../(tools)/ip-asn-lookup/content/intro.mdx   |  3 +
 .../(tools)/ip-asn-lookup/content/usage.mdx   | 19 +++++++
 app/(site)/(tools)/ip-asn-lookup/page.tsx     | 12 +++-
 .../lxc-idmap-checker/content/article.mdx     | 52 ++++++++++++++++++
 .../lxc-idmap-checker/content/intro.mdx       |  3 +
 .../lxc-idmap-checker/content/usage.mdx       | 29 ++++++++++
 app/(site)/(tools)/lxc-idmap-checker/page.tsx | 12 +++-
 .../nfs-firewall-rules/content/article.mdx    | 55 +++++++++++++++++++
 .../nfs-firewall-rules/content/intro.mdx      |  3 +
 .../nfs-firewall-rules/content/usage.mdx      | 23 ++++++++
 .../(tools)/nfs-firewall-rules/page.tsx       | 11 +++-
 .../content/article.mdx                       | 43 +++++++++++++++
 .../content/intro.mdx                         |  3 +
 .../content/usage.mdx                         | 13 +++++
 .../nginx-proxy-pass-calculator/page.tsx      | 11 +++-
 .../content/article.mdx                       | 41 ++++++++++++++
 .../content/intro.mdx                         |  3 +
 .../content/usage.mdx                         | 17 ++++++
 .../restic-retention-simulator/page.tsx       | 12 +++-
 .../rsync-filter-tester/content/article.mdx   | 47 ++++++++++++++++
 .../rsync-filter-tester/content/intro.mdx     |  3 +
 .../rsync-filter-tester/content/usage.mdx     | 21 +++++++
 .../(tools)/rsync-filter-tester/page.tsx      | 12 +++-
 .../content/article.mdx                       | 29 ++++++++++
 .../content/intro.mdx                         |  3 +
 .../content/usage.mdx                         | 24 ++++++++
 .../self-hosted-app-resource-planner/page.tsx | 12 +++-
 .../content/article.mdx                       | 15 +++++
 .../content/intro.mdx                         |  3 +
 .../content/usage.mdx                         | 19 +++++++
 .../shortcuts-cheatsheet-generator/page.tsx   | 11 +++-
 41 files changed, 766 insertions(+), 27 deletions(-)
 create mode 100644 app/(site)/(tools)/docker-compose-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/docker-compose-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/docker-compose-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/dockerignore-tester/content/article.mdx
 create mode 100644 app/(site)/(tools)/dockerignore-tester/content/intro.mdx
 create mode 100644 app/(site)/(tools)/dockerignore-tester/content/usage.mdx
 create mode 100644 app/(site)/(tools)/ip-asn-lookup/content/article.mdx
 create mode 100644 app/(site)/(tools)/ip-asn-lookup/content/intro.mdx
 create mode 100644 app/(site)/(tools)/ip-asn-lookup/content/usage.mdx
 create mode 100644 app/(site)/(tools)/lxc-idmap-checker/content/article.mdx
 create mode 100644 app/(site)/(tools)/lxc-idmap-checker/content/intro.mdx
 create mode 100644 app/(site)/(tools)/lxc-idmap-checker/content/usage.mdx
 create mode 100644 app/(site)/(tools)/nfs-firewall-rules/content/article.mdx
 create mode 100644 app/(site)/(tools)/nfs-firewall-rules/content/intro.mdx
 create mode 100644 app/(site)/(tools)/nfs-firewall-rules/content/usage.mdx
 create mode 100644 app/(site)/(tools)/nginx-proxy-pass-calculator/content/article.mdx
 create mode 100644 app/(site)/(tools)/nginx-proxy-pass-calculator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/nginx-proxy-pass-calculator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/restic-retention-simulator/content/article.mdx
 create mode 100644 app/(site)/(tools)/restic-retention-simulator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/restic-retention-simulator/content/usage.mdx
 create mode 100644 app/(site)/(tools)/rsync-filter-tester/content/article.mdx
 create mode 100644 app/(site)/(tools)/rsync-filter-tester/content/intro.mdx
 create mode 100644 app/(site)/(tools)/rsync-filter-tester/content/usage.mdx
 create mode 100644 app/(site)/(tools)/self-hosted-app-resource-planner/content/article.mdx
 create mode 100644 app/(site)/(tools)/self-hosted-app-resource-planner/content/intro.mdx
 create mode 100644 app/(site)/(tools)/self-hosted-app-resource-planner/content/usage.mdx
 create mode 100644 app/(site)/(tools)/shortcuts-cheatsheet-generator/content/article.mdx
 create mode 100644 app/(site)/(tools)/shortcuts-cheatsheet-generator/content/intro.mdx
 create mode 100644 app/(site)/(tools)/shortcuts-cheatsheet-generator/content/usage.mdx

diff --git a/app/(site)/(tools)/chmod-calculator/chmod-calculator.tsx b/app/(site)/(tools)/chmod-calculator/chmod-calculator.tsx
index 3210f059..2e0e6b55 100644
--- a/app/(site)/(tools)/chmod-calculator/chmod-calculator.tsx
+++ b/app/(site)/(tools)/chmod-calculator/chmod-calculator.tsx
@@ -35,7 +35,7 @@ const SPECIAL_BITS = [
   ["sticky", "Sticky"],
 ] as const;
 
-const COPY_FAILURE = "Copy failed. UiSelect the text to copy it.";
+const COPY_FAILURE = "Copy failed. Select the text to copy it.";
 
 async function copyText(value: string) {
   try {
diff --git a/app/(site)/(tools)/docker-compose-checker/content/article.mdx b/app/(site)/(tools)/docker-compose-checker/content/article.mdx
new file mode 100644
index 00000000..eaf85300
--- /dev/null
+++ b/app/(site)/(tools)/docker-compose-checker/content/article.mdx
@@ -0,0 +1,52 @@
+## Why is my container port open to the whole network?
+
+A port written as `"8080:80"` listens on every network interface of the host, not just on the host itself. [Docker's port publishing guide](https://docs.docker.com/engine/network/port-publishing/) calls this insecure by default.
+
+If only a reverse proxy on the same machine should reach the app, add the local address: `"127.0.0.1:8080:80"`. The checker flags published ports with no host address for this reason.
+
+<Warning title="ufw doesn't block published Docker ports">
+
+Docker writes its own firewall rules, and [Docker says it and ufw are incompatible](https://docs.docker.com/engine/network/packet-filtering-firewalls/). A port published to all interfaces can be reachable even when ufw denies it.
+
+</Warning>
+
+To set up the proxy side, the [nginx proxy_pass calculator](/nginx-proxy-pass-calculator) shows how a request path maps to the app. The course chapter on [accessing apps safely at home](/self-hosting-for-beginners/access-apps-safely-at-home) covers the bigger picture.
+
+## Is mounting the Docker socket safe?
+
+Only for containers you trust fully. A container with `/var/run/docker.sock` can control Docker, and Docker runs as root. [Docker's security guide](https://docs.docker.com/engine/security/) says only trusted users should control the daemon.
+
+Reverse proxies and dashboards often ask for it. Check what the app needs the socket for before you add it.
+
+## Why isn't my variable being replaced?
+
+Compose fills `${VAR}` from your shell and the `.env` file in the project folder. A service's `env_file` is different: it passes variables into the container and doesn't fill `${VAR}` in the Compose file. See [variable interpolation](https://docs.docker.com/compose/how-tos/environment-variables/variable-interpolation/).
+
+The default forms differ on empty values:
+
+- `${VAR-default}` uses the default when `VAR` isn't set.
+- `${VAR:-default}` uses it when `VAR` isn't set or is empty.
+- `${VAR?message}` stops with the message when `VAR` isn't set.
+- `${VAR:?message}` stops when `VAR` isn't set or is empty.
+
+Write `$$` for a literal dollar sign, such as in a healthcheck command. The full list is in the [interpolation reference](https://docs.docker.com/reference/compose-file/interpolation/).
+
+## Do I still need the version line?
+
+No. [Docker's Compose reference](https://docs.docker.com/reference/compose-file/version-and-name/) says `version` is only informative and Compose warns that it's obsolete. Compose always uses the latest schema, whatever the line says. You can delete it unless an older tool still needs it.
+
+## Does depends_on wait for the database to be ready?
+
+Not by default. A plain `depends_on` only sets the start order. To wait until the database is ready, give it a `healthcheck` and use `condition: service_healthy`, as [Docker's startup order guide](https://docs.docker.com/compose/how-tos/startup-order/) shows.
+
+The checker confirms that each dependency exists in the file. It can't tell whether a healthcheck will pass.
+
+## Should I pin image tags?
+
+Pinning makes updates a choice instead of a surprise. An image with no tag, or with `latest`, can change the next time you pull. Pin a version such as `postgres:16`, or a digest when you need the exact same image every time.
+
+## How do I check the whole project?
+
+Run `docker compose config -q` in the project folder. It merges every file, `.env`, and profile the way the real deployment does, and prints nothing when the model is valid. Add `--environment` to see the values it used. See the [compose config reference](https://docs.docker.com/reference/cli/docker/compose/config/).
+
+Neither check proves the images exist, ports are free on the host, or the services start. Those need a real `docker compose up`. If Compose is new to you, start with [understanding Docker Compose](/self-hosting-for-beginners/understand-docker-compose). If your services build from a Dockerfile, the [.dockerignore tester](/dockerignore-tester) shows what goes into the build.
diff --git a/app/(site)/(tools)/docker-compose-checker/content/intro.mdx b/app/(site)/(tools)/docker-compose-checker/content/intro.mdx
new file mode 100644
index 00000000..5fdfd8d1
--- /dev/null
+++ b/app/(site)/(tools)/docker-compose-checker/content/intro.mdx
@@ -0,0 +1,3 @@
+Paste a `docker-compose.yml` to find YAML mistakes, broken references, and settings worth a second look, such as ports open to every network or a mounted Docker socket.
+
+It runs in your browser and doesn't start Docker. If the file uses variables, have the values from your `.env` ready.
diff --git a/app/(site)/(tools)/docker-compose-checker/content/usage.mdx b/app/(site)/(tools)/docker-compose-checker/content/usage.mdx
new file mode 100644
index 00000000..3a67dea3
--- /dev/null
+++ b/app/(site)/(tools)/docker-compose-checker/content/usage.mdx
@@ -0,0 +1,32 @@
+## What to paste
+
+Paste one Compose file. If it uses `${VARIABLES}`, paste their values into the second box as `KEY=VALUE` lines. Use made-up values for passwords.
+
+The checker reads only what you paste. It doesn't see your `.env` file, files listed under a service's `env_file`, or files pulled in with `include` or `extends`. When a file uses `include` or `extends`, the result says the model is incomplete.
+
+## How to read the findings
+
+Each finding names the path in the file, such as `services.app.ports[0]`, and the line when it can.
+
+| Severity | What it means |
+| --- | --- |
+| Error | Compose would reject this, or a reference points at nothing. Fix it first. |
+| Warning | The file probably doesn't do what you meant, such as a variable with no value. |
+| Advisory | Valid, but worth a second look. It isn't a security verdict. |
+| Info | Context about what the checker did or couldn't read. |
+
+<Example title="A web app that depends on a database you forgot to add">
+
+```yaml
+services:
+  app:
+    image: nginx:latest
+    ports:
+      - "8080:80"
+    depends_on:
+      - db
+```
+
+The result is `Compose model has blocking issues`. The error says the dependency `db` is not in the file. Two advisories follow: the image doesn't pin a version, and port 8080 has no host address.
+
+</Example>
diff --git a/app/(site)/(tools)/docker-compose-checker/page.tsx b/app/(site)/(tools)/docker-compose-checker/page.tsx
index 2ddf1fef..222ecef3 100644
--- a/app/(site)/(tools)/docker-compose-checker/page.tsx
+++ b/app/(site)/(tools)/docker-compose-checker/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileCheck2 } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { DockerComposeChecker } from "./docker-compose-checker";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DockerComposeCheckerPage() {
   const toolPage = await getRequiredToolPage("docker-compose-checker");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <DockerComposeChecker />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/dockerignore-tester/content/article.mdx b/app/(site)/(tools)/dockerignore-tester/content/article.mdx
new file mode 100644
index 00000000..a08b53e8
--- /dev/null
+++ b/app/(site)/(tools)/dockerignore-tester/content/article.mdx
@@ -0,0 +1,54 @@
+## Why doesn't my .dockerignore pattern match files in subfolders?
+
+Patterns start at the root of the build context. `*.log` matches `app.log` but not `logs/app.log`. To match at any depth, start the pattern with `**/`.
+
+<Example title="The same rules, with and without **/">
+
+With `*.log` and `node_modules`:
+
+- `app.log` and `node_modules/x/index.js` are Excluded.
+- `logs/app.log` and `packages/web/node_modules/y.js` are Included.
+
+With `**/*.log` and `**/node_modules`, all four are Excluded.
+
+</Example>
+
+This is the biggest difference from `.gitignore`, where `*.log` matches in every folder. [Docker's own example](https://docs.docker.com/build/concepts/context/#dockerignore-files) shows `*.md` excluding Markdown files at the root only.
+
+## How do I ignore everything except a few files?
+
+Start with `*`, then add a `!` line for each thing you want to keep. The order matters, because the last matching line wins.
+
+<Example title="Keep only the source and the package file">
+
+Rules: `*`, `!src`, `!package.json`.
+
+`src/index.js` and `package.json` are Included. `README.md` and `.env` are Excluded by line 1.
+
+</Example>
+
+## Can I re-include a file inside an ignored folder?
+
+Yes. In Docker, a later `!` line can bring back a file even when an earlier line excluded its folder, as the `docs/README.md` example above shows. Git works differently: [a file can't be re-included](https://git-scm.com/docs/gitignore) when its parent folder is excluded. So rules copied from `.gitignore` can give different results here.
+
+## Why is my .env.local still in the image?
+
+Because `.env` matches only a file named exactly `.env` at the root. `.env*` also catches `.env.local`, and `**/.env*` catches copies in subfolders too, such as `config/.env`.
+
+<Warning title="COPY . . copies everything you didn't exclude">
+
+Anything left in the build context can end up in an image layer with a broad `COPY`. Test every secrets file you have, not just `.env`.
+
+</Warning>
+
+Common entries are `.git`, dependency folders such as `node_modules` that the image installs again, `.env` files, build output, and logs. Test each one here before you rely on it.
+
+## Does .dockerignore stop the Dockerfile from being sent?
+
+No. You can list `Dockerfile` and `.dockerignore`, and the builder still receives them because it needs them. Listing them only stops `COPY` and `ADD` from putting them in the image. See [Docker's build context guide](https://docs.docker.com/build/concepts/context/#dockerignore-files).
+
+## How do I confirm what Docker really sends?
+
+Run a real build and check the `COPY` step you care about. This tester follows Docker's matching library, `moby/patternmatcher` v0.6.1. It doesn't look at real files, symlinks, or permissions.
+
+If Docker isn't set up yet, see [installing Docker](/self-hosting-for-beginners/install-docker). To check the Compose file that runs the image, use the [Docker Compose checker](/docker-compose-checker).
diff --git a/app/(site)/(tools)/dockerignore-tester/content/intro.mdx b/app/(site)/(tools)/dockerignore-tester/content/intro.mdx
new file mode 100644
index 00000000..01ac3fb1
--- /dev/null
+++ b/app/(site)/(tools)/dockerignore-tester/content/intro.mdx
@@ -0,0 +1,3 @@
+Paste your `.dockerignore` rules and a few paths from your project to see whether each path goes into the Docker build, and which line decided it.
+
+The paths don't need to exist. Matching runs in your browser, and nothing is uploaded.
diff --git a/app/(site)/(tools)/dockerignore-tester/content/usage.mdx b/app/(site)/(tools)/dockerignore-tester/content/usage.mdx
new file mode 100644
index 00000000..fd27fc73
--- /dev/null
+++ b/app/(site)/(tools)/dockerignore-tester/content/usage.mdx
@@ -0,0 +1,19 @@
+## Which file to test
+
+Docker uses one ignore file per build. If your Dockerfile has its own ignore file next to it, such as `build.Dockerfile.dockerignore`, Docker uses that one instead of the root `.dockerignore`. It doesn't merge the two. Pick the matching option in `Effective file` and paste only that file.
+
+## Which paths to try
+
+Write paths relative to the build context, the folder you pass to `docker build`, which is usually the project folder. Try the source of each `COPY` you care about, a file inside each folder you exclude, and each `!` exception.
+
+## How to read the result
+
+Every path starts as Included. Each matching line flips it to Excluded, or back to Included for a `!` line. The last matching line decides, and the trace shows every line that matched along the way.
+
+<Example title="Ignore the docs folder but keep its README">
+
+Rules: `docs`, then `!docs/README.md`. Paths: `docs/README.md`, `docs/guide`, and `src`.
+
+`docs/README.md` is Included by line 2. Its trace shows line 1 as a `Parent` match, because `docs` matched the folder it sits in, and line 2 as a `Direct` match. `docs/guide` is Excluded by line 1. `src` matches nothing, so it stays Included.
+
+</Example>
diff --git a/app/(site)/(tools)/dockerignore-tester/page.tsx b/app/(site)/(tools)/dockerignore-tester/page.tsx
index 4c875c6f..f3418965 100644
--- a/app/(site)/(tools)/dockerignore-tester/page.tsx
+++ b/app/(site)/(tools)/dockerignore-tester/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { FileSearch } from "lucide-react";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { DockerignoreTester } from "./dockerignore-tester";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function DockerignoreTesterPage() {
   const toolPage = await getRequiredToolPage("dockerignore-tester");
@@ -12,10 +15,14 @@ export default async function DockerignoreTesterPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<FileSearch strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <DockerignoreTester />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/ip-asn-lookup/content/article.mdx b/app/(site)/(tools)/ip-asn-lookup/content/article.mdx
new file mode 100644
index 00000000..213bb301
--- /dev/null
+++ b/app/(site)/(tools)/ip-asn-lookup/content/article.mdx
@@ -0,0 +1,41 @@
+## Who owns this IP address?
+
+The registry record names the organization the address block is registered to. That's usually an internet provider, hosting company, or cloud platform, not the person or device using the address today.
+
+The record covers a whole range. A hosting company can assign one address in it to a customer, and the record will still show the hosting company.
+
+## What is an ASN?
+
+An autonomous system number identifies one network that routes traffic on the internet, such as `AS15169` for Google or `AS13335` for Cloudflare. Networks use BGP to tell each other which address blocks they carry.
+
+An ASN lookup shows the registered holder of that number. An IP lookup also shows which ASN currently announces the address.
+
+## Why do the registered owner and the route origin differ?
+
+They answer different questions. The registration says who the block was given to. The route says which network announces it right now. A block registered to one organization can be announced by another, such as a provider carrying a customer's range. Neither record is wrong.
+
+The route comes from [Team Cymru's IP to ASN service](https://www.team-cymru.com/ip-asn-mapping), built from BGP feeds it refreshes every four hours. Its country code also comes from registry records.
+
+## Can an IP lookup show where someone is?
+
+No. The registered country belongs to the organization's record, not to the device. The lookup can't name a subscriber, a person, or a street address.
+
+Location services estimate where an address is from other data. Their guesses are a separate thing, and this tool doesn't make one.
+
+## How do I report abuse from an IP address?
+
+Send your report to the abuse contact in the result. Include enough for the provider to find the traffic:
+
+1. The address, the exact time with its time zone, and what happened, such as the protocol or URL.
+2. The log lines that show it. Remove unrelated personal data and secrets.
+3. Any instructions in the registry record, such as a web form instead of email.
+
+The contact is where to send reports. It doesn't prove that the holder caused the traffic, and no one has to reply.
+
+## Where does the data come from?
+
+The registration comes from one of the five regional internet registries: ARIN, RIPE NCC, APNIC, LACNIC, or AFRINIC. The tool finds the right one with [IANA's RDAP bootstrap](https://www.rfc-editor.org/rfc/rfc9224) and asks it over [RDAP](https://www.rfc-editor.org/rfc/rfc9082), the structured successor to WHOIS. The raw response is in the result if you need fields the summary leaves out.
+
+If a registry or the routing service doesn't answer, the result says it can't determine the record. A failed lookup doesn't mean the address is unregistered, so try again later.
+
+For domain names instead of addresses, the [domain owner lookup](/domain-owner) shows a domain's registration record.
diff --git a/app/(site)/(tools)/ip-asn-lookup/content/intro.mdx b/app/(site)/(tools)/ip-asn-lookup/content/intro.mdx
new file mode 100644
index 00000000..4580702b
--- /dev/null
+++ b/app/(site)/(tools)/ip-asn-lookup/content/intro.mdx
@@ -0,0 +1,3 @@
+Enter a public IP address or an AS number to see who it's registered to, where to report abuse, and which network announces the address on the internet.
+
+Your query goes to stack127's server, which asks the regional internet registry and a routing data service.
diff --git a/app/(site)/(tools)/ip-asn-lookup/content/usage.mdx b/app/(site)/(tools)/ip-asn-lookup/content/usage.mdx
new file mode 100644
index 00000000..a08185a2
--- /dev/null
+++ b/app/(site)/(tools)/ip-asn-lookup/content/usage.mdx
@@ -0,0 +1,19 @@
+## What to enter
+
+Enter one public IPv4 or IPv6 address, or an AS number such as `AS13335` or `13335`. To look up a domain, find its IP address first with the [DNS lookup](/dns-lookup).
+
+Private addresses such as `192.168.1.10` have no public record, so the tool doesn't look them up. They only exist inside a local network.
+
+## How to read the result
+
+The top line names the registered holder and the registry that holds the record. Below it are the address range, the abuse contact, and the current route.
+
+<Example title="8.8.8.8">
+
+The lead reads `8.8.8.8: Google LLC (ARIN).` The allocation is `8.8.8.0 to 8.8.8.255`, and the abuse contact is `network-abuse@google.com`.
+
+The current BGP route shows origin `AS15169` and announced prefix `8.8.8.0/24`, from Team Cymru.
+
+</Example>
+
+A field marked `Unknown` or `Not published` means the registry left it out. It doesn't mean the value is zero or the organization doesn't exist.
diff --git a/app/(site)/(tools)/ip-asn-lookup/page.tsx b/app/(site)/(tools)/ip-asn-lookup/page.tsx
index 4fa7edcc..ea0f16eb 100644
--- a/app/(site)/(tools)/ip-asn-lookup/page.tsx
+++ b/app/(site)/(tools)/ip-asn-lookup/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { Network } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { IpAsnLookupFromUrl } from "./ip-asn-lookup-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 import "./ip-asn-lookup.css";
 
 export default async function IpAsnLookupPage() {
@@ -11,9 +14,12 @@ export default async function IpAsnLookupPage() {
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas as="main">
-        <ToolPageHeader icon={<Network strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<Network strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <IpAsnLookupFromUrl />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/lxc-idmap-checker/content/article.mdx b/app/(site)/(tools)/lxc-idmap-checker/content/article.mdx
new file mode 100644
index 00000000..1784d8e6
--- /dev/null
+++ b/app/(site)/(tools)/lxc-idmap-checker/content/article.mdx
@@ -0,0 +1,52 @@
+## How does LXC ID mapping work?
+
+An unprivileged container sees its own user and group IDs, but the host stores each one as a different ID. Each map line says where a block of container IDs lands on the host.
+
+<Formula title="Host ID">
+
+host ID = host start + (container ID - container start)
+
+</Formula>
+
+The common default is `u 0 100000 65536`. Container root (0) is host 100000, and container user 1000 is host 101000. The line covers 65,536 IDs, so the last one is container 65535, host 165535. The [LXC config manual](https://linuxcontainers.org/lxc/manpages/man5/lxc.container.conf.5.html) defines the format.
+
+The same idea applies to groups, with `g` lines. A container needs both maps, and they don't have to match.
+
+## Why do files on my bind mount show up as nobody?
+
+Because the host's owner isn't in the container's map. Any host ID outside the map appears inside the container as the overflow ID, 65534, usually shown as `nobody`. The [Linux user namespaces manual](https://man7.org/linux/man-pages/man7/user_namespaces.7.html) describes this.
+
+It works the other way too. Files the container creates on the mount belong to high host IDs, such as 101000 for container user 1000.
+
+You can fix this in two ways:
+
+1. Change the owner of the host folder to the mapped ID, such as `chown -R 101000:101000 /path/on/host` for container user 1000 with the default map.
+2. Pass one container ID straight through to the same host ID, as below.
+
+## How do I give a container access to a host user's files?
+
+Split the map so one ID passes through unchanged, then allow that ID in the grants. The [Proxmox guide to unprivileged containers](https://pve.proxmox.com/wiki/Unprivileged_LXC_containers) walks through the same steps.
+
+1. Replace the single map line with three: the IDs below yours, your ID mapped to itself, and the IDs above it. The example above shows this for ID 1000. Do the same with `g` lines for the group.
+2. Add `root:1000:1` to both `/etc/subuid` and `/etc/subgid` on the host.
+3. Make sure the host folder is owned by 1000, then restart the container.
+
+The three lines must add up to the full 65,536 IDs. In the example, 1000 + 1 + 64535 is 65,536. If a line is short, the IDs past it stay unmapped, and if ranges overlap, the checker rejects the map.
+
+<Warning title="A passed-through ID is the same user on the host">
+
+Container user 1000 can then do anything host user 1000 can do to files on the mount. Pass through only the ID you need.
+
+</Warning>
+
+## What are /etc/subuid and /etc/subgid?
+
+They list the ID ranges each host user may hand to containers. Each line is `owner:start:count`, so `root:100000:65536` lets root use host IDs 100000 to 165535. See the [subuid manual](https://man7.org/linux/man-pages/man5/subuid.5.html).
+
+UIDs come from `/etc/subuid` and GIDs from `/etc/subgid`. The Proxmox guide adds a grant for every host range a map uses, including a single passed-through ID.
+
+## What's the difference between privileged and unprivileged containers?
+
+In a privileged container, container root is host root. In an unprivileged one, container root is a high host ID such as 100000. If something escapes the container, it lands as that unprivileged user instead of root, as the Proxmox guide explains.
+
+The checker only does the arithmetic and the grant check. It doesn't read the running container, so check the real owners with `ls -ln` on both sides. Once the IDs line up, the [chmod calculator](/chmod-calculator) helps with the permission bits.
diff --git a/app/(site)/(tools)/lxc-idmap-checker/content/intro.mdx b/app/(site)/(tools)/lxc-idmap-checker/content/intro.mdx
new file mode 100644
index 00000000..343c69d8
--- /dev/null
+++ b/app/(site)/(tools)/lxc-idmap-checker/content/intro.mdx
@@ -0,0 +1,3 @@
+Paste a container's `lxc.idmap` lines to see which host user or group a container ID becomes, and whether `/etc/subuid` and `/etc/subgid` allow that range.
+
+Use it when files on a bind mount show up as `nobody`, or a container can't write to a shared folder. It runs in your browser and doesn't read your host's files.
diff --git a/app/(site)/(tools)/lxc-idmap-checker/content/usage.mdx b/app/(site)/(tools)/lxc-idmap-checker/content/usage.mdx
new file mode 100644
index 00000000..8004488d
--- /dev/null
+++ b/app/(site)/(tools)/lxc-idmap-checker/content/usage.mdx
@@ -0,0 +1,29 @@
+## What to paste
+
+From the container's config, copy the part after `lxc.idmap`, such as `u 0 100000 65536`. On Proxmox the config is `/etc/pve/lxc/<id>.conf`. Put `u` lines in `UID map` and `g` lines in `GID map`. Leave out the `lxc.idmap =` or `lxc.idmap:` prefix.
+
+For the grants, copy the matching lines from `/etc/subuid` and `/etc/subgid` on the host, and enter their owner. On Proxmox the owner is `root`, because LXC creates containers as root.
+
+For `Query ID`, enter the container user or group you care about, such as `1000` for the first normal user.
+
+## How to read the result
+
+The lead line says which host ID the container ID maps to, or that it's unmapped. The grant status is one of three:
+
+- `covered`: one grant for this owner covers the whole host range the ID falls in.
+- `missing`: you pasted grants, but none covers that whole range.
+- `unknown`: you didn't paste grants, so the tool can't check them.
+
+<Example title="Passing container user 1000 through to host user 1000">
+
+UID map:
+
+```text
+u 0 100000 1000
+u 1000 1000 1
+u 1001 101001 64535
+```
+
+The result reads `UID 1000 maps to host 1000.` With only `root:100000:65536` as a grant, the status is missing, because nothing allows host ID 1000. Add `root:1000:1` and it becomes covered.
+
+</Example>
diff --git a/app/(site)/(tools)/lxc-idmap-checker/page.tsx b/app/(site)/(tools)/lxc-idmap-checker/page.tsx
index 1aaad0b2..4f3dc6a8 100644
--- a/app/(site)/(tools)/lxc-idmap-checker/page.tsx
+++ b/app/(site)/(tools)/lxc-idmap-checker/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileCheck2 } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { LxcIdmapChecker } from "./lxc-idmap-checker";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function LxcIdmapCheckerPage() {
   const toolPage = await getRequiredToolPage("lxc-idmap-checker");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <LxcIdmapChecker />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/nfs-firewall-rules/content/article.mdx b/app/(site)/(tools)/nfs-firewall-rules/content/article.mdx
new file mode 100644
index 00000000..c4a250b9
--- /dev/null
+++ b/app/(site)/(tools)/nfs-firewall-rules/content/article.mdx
@@ -0,0 +1,55 @@
+## Which ports does NFS need?
+
+It depends on the version. NFSv4 needs one port, and NFSv3 needs several.
+
+| Setup | Open on the server | Open on the client |
+| --- | --- | --- |
+| NFSv4.1 or later | TCP 2049 | Nothing new |
+| NFSv4.0 | TCP 2049 | The callback port |
+| NFSv3 | TCP 111 and 2049, plus `mountd`, `statd`, and `lockd` | TCP 111, plus `statd` and `lockd` |
+
+NFSv4 uses the registered port 2049, so clients don't need the RPC port mapper on 111. [RFC 7530](https://www.rfc-editor.org/rfc/rfc7530#section-3.1) explains why that lets NFS cross firewalls.
+
+## Should I use NFSv3 or NFSv4 through a firewall?
+
+Use NFSv4.1 or later when both sides support it. It's one TCP port on the server and nothing on the client. In NFSv4.1, the server sends callbacks over the connection the client already opened, as [RFC 8881](https://www.rfc-editor.org/rfc/rfc8881) describes.
+
+NFSv4.0 is the odd one out. The server opens a new connection back to the client for callbacks, so the client needs an open port too.
+
+## How do I pin the NFSv3 ports?
+
+Set fixed ports in `/etc/nfs.conf` on the host, then restart the NFS services. Without this, the ports can change after a reboot and your rules stop matching.
+
+```ini
+[mountd]
+port = 20048
+
+[statd]
+port = 662
+
+[lockd]
+port = 32803
+udp-port = 32769
+```
+
+These numbers are only examples. Pick free ports, then check them with `rpcinfo -p`. The [nfs.conf manual](https://man7.org/linux/man-pages/man5/nfs.conf.5.html) lists the keys for each section.
+
+## Why don't my firewalld rules work?
+
+Rules added with `--permanent` change only the saved config. They take effect after `firewall-cmd --reload` or a restart, as the [firewall-cmd manual](https://firewalld.org/documentation/man-pages/firewall-cmd.html) says.
+
+Also check the zone. A rule in `public` does nothing if your interface is in another zone.
+
+<Note title="These are fragments, not a full firewall">
+
+The `nftables` output is a set of lines for an existing `inet` input chain. The `ufw` output assumes ufw is already on. In every case, rules that come earlier can still block or allow the same traffic.
+
+</Note>
+
+## My firewall is open but the mount still fails. What now?
+
+Test from the client with `mount -t nfs -o vers=4.1 server:/export /mnt`, then `findmnt` to see the version it used. Change `vers=4.1` to `vers=3` for an NFSv3 setup.
+
+`access denied` comes from the export, not the firewall. Check `/etc/exports` on the server and that the client's address is allowed.
+
+If the mount works but files show the wrong owner, the user IDs differ between client and server. If the share goes into an LXC container, the [LXC ID mapping checker](/lxc-idmap-checker) shows how container IDs map to the host.
diff --git a/app/(site)/(tools)/nfs-firewall-rules/content/intro.mdx b/app/(site)/(tools)/nfs-firewall-rules/content/intro.mdx
new file mode 100644
index 00000000..e42fd8af
--- /dev/null
+++ b/app/(site)/(tools)/nfs-firewall-rules/content/intro.mdx
@@ -0,0 +1,3 @@
+Pick your NFS version, which host you're protecting, and your firewall to get the inbound ports to open and the `firewalld`, `ufw`, or `nftables` rules for them.
+
+Have the network your clients connect from, such as `192.168.1.0/24`. For NFSv3, also have the helper ports from the server. It runs in your browser and doesn't change any firewall.
diff --git a/app/(site)/(tools)/nfs-firewall-rules/content/usage.mdx b/app/(site)/(tools)/nfs-firewall-rules/content/usage.mdx
new file mode 100644
index 00000000..952a7a93
--- /dev/null
+++ b/app/(site)/(tools)/nfs-firewall-rules/content/usage.mdx
@@ -0,0 +1,23 @@
+## What to enter
+
+`Protected host` is the machine whose firewall you're changing. Plan the server and the client separately.
+
+The allowed CIDR is the network the other side connects from. Keep it as small as you can, such as your home network instead of `0.0.0.0/0`.
+
+For `firewalld`, enter the zone your network interface is in. `firewall-cmd --get-active-zones` shows it.
+
+## Why NFSv3 asks for verified ports
+
+NFSv3 helpers such as `mountd`, `statd`, and `lockd` pick ports when they start, unless you pin them. On the server, run `rpcinfo -p` to see the ports in use, and enter only those. Until you do, the planner shows the fixed ports and lists what's missing, without firewall commands.
+
+<Example title="NFSv4.1 server with ufw">
+
+NFS version `NFSv4.1+`, protected host `NFS server`, firewall `UFW`, allowed client CIDR `192.168.1.0/24`.
+
+The result is `Allow 1 listener rule on the NFS server.` The command is:
+
+```bash
+ufw allow in proto tcp from 192.168.1.0/24 to any port 2049 comment 'NFS nfs'
+```
+
+</Example>
diff --git a/app/(site)/(tools)/nfs-firewall-rules/page.tsx b/app/(site)/(tools)/nfs-firewall-rules/page.tsx
index da80ebb2..86f7f496 100644
--- a/app/(site)/(tools)/nfs-firewall-rules/page.tsx
+++ b/app/(site)/(tools)/nfs-firewall-rules/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { ShieldCheck } from "lucide-react";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { NfsFirewallRulesPlanner } from "./nfs-firewall-rules-planner";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function NfsFirewallRulesPage() {
   const toolPage = await getRequiredToolPage("nfs-firewall-rules");
@@ -12,10 +15,14 @@ export default async function NfsFirewallRulesPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<ShieldCheck strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <NfsFirewallRulesPlanner />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/nginx-proxy-pass-calculator/content/article.mdx b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/article.mdx
new file mode 100644
index 00000000..e7c9480d
--- /dev/null
+++ b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/article.mdx
@@ -0,0 +1,43 @@
+## Does the trailing slash in proxy_pass matter?
+
+Yes. It decides whether nginx keeps the location path or swaps it out. The rule is whether `proxy_pass` has any path after the host, even a single `/`.
+
+- With no path, as in `http://backend`, nginx passes the request path unchanged.
+- With any path, as in `http://backend/`, nginx cuts the matched location from the front of the request path and puts the `proxy_pass` path in its place.
+
+The [proxy_pass documentation](https://nginx.org/en/docs/http/ngx_http_proxy_module.html#proxy_pass) describes both cases.
+
+## What URL does each proxy_pass send?
+
+For location `/api/` and request `/api/users?id=42`:
+
+- `proxy_pass http://backend` sends `http://backend/api/users?id=42`.
+- `proxy_pass http://backend/` sends `http://backend/users?id=42`.
+- `proxy_pass http://backend/v2` sends `http://backend/v2users?id=42`.
+- `proxy_pass http://backend/v2/` sends `http://backend/v2/users?id=42`.
+
+The join is plain text, so `/v2` plus `users` becomes `/v2users`. The query string always follows unchanged.
+
+## Why do I get a double slash in the upstream URL?
+
+Because the location has no trailing slash but `proxy_pass` does. With location `/api` and `proxy_pass http://127.0.0.1:3000/`, the request `/api/users` loses `/api` and keeps `/users`. Adding that to `/` gives `http://127.0.0.1:3000//users`.
+
+Make the slashes match: use `location /api/` with `http://127.0.0.1:3000/`, or `location /api` with `http://127.0.0.1:3000`.
+
+A location without the slash also matches more than you might expect. `location /api` matches `/apiusers` too.
+
+## Why does nginx redirect /api to /api/?
+
+When a prefix location ends in a slash and uses `proxy_pass`, nginx answers a request for the same path without the slash with a 301 redirect that adds it. The [location documentation](https://nginx.org/en/docs/http/ngx_http_core_module.html#location) shows how to avoid it with an extra exact-match location, `location = /api`.
+
+## Why does my app break under a subpath?
+
+Many apps build links from the root, such as `/static/app.js`. Under `/app/`, those links skip the proxy location and fail. Check whether the app has a base URL or subpath setting, and set it to the same path as the location.
+
+If the app has no such setting, give it its own subdomain instead, with `location /` and a `proxy_pass` with no path.
+
+## How do I check what nginx really sends?
+
+Run `nginx -T` to print the full config nginx loaded, and check that the request lands in the location you think it does. Then look at the request path in the app's access log.
+
+If nginx runs in Docker beside the app, the [Docker Compose checker](/docker-compose-checker) flags ports published to every network. The course chapter on [accessing apps safely at home](/self-hosting-for-beginners/access-apps-safely-at-home) covers where a reverse proxy fits.
diff --git a/app/(site)/(tools)/nginx-proxy-pass-calculator/content/intro.mdx b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/intro.mdx
new file mode 100644
index 00000000..0ceb0ec2
--- /dev/null
+++ b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/intro.mdx
@@ -0,0 +1,3 @@
+Enter an nginx `location`, a request path, and your `proxy_pass` URL to see the exact URL nginx sends to your app, and what changes if you add or drop the trailing slash.
+
+It runs in your browser. Copy the values from your nginx config.
diff --git a/app/(site)/(tools)/nginx-proxy-pass-calculator/content/usage.mdx b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/usage.mdx
new file mode 100644
index 00000000..14414383
--- /dev/null
+++ b/app/(site)/(tools)/nginx-proxy-pass-calculator/content/usage.mdx
@@ -0,0 +1,13 @@
+## What to enter
+
+`Matched location` is the path after `location` in the block that handles the request, such as `/api/`. `Request target` is the path and query the browser asks for, such as `/api/users?id=42`. `proxy_pass URL` is everything after `proxy_pass`, without the semicolon.
+
+Leave `Rewrite before proxy_pass` on `None` unless that location has a `rewrite` line. Regex locations, named locations, rewrites, and variables depend on the running server, so the tool says it needs live nginx instead of guessing.
+
+<Example title="An app served under /api/">
+
+Location `/api/`, request `/api/users?id=42`, `proxy_pass http://backend/`.
+
+The final upstream URL is `http://backend/users?id=42`. With `Compare the final slash` on, the tool also shows `http://backend/api/users?id=42` for `proxy_pass http://backend`.
+
+</Example>
diff --git a/app/(site)/(tools)/nginx-proxy-pass-calculator/page.tsx b/app/(site)/(tools)/nginx-proxy-pass-calculator/page.tsx
index 6e9d7e40..cb747cf1 100644
--- a/app/(site)/(tools)/nginx-proxy-pass-calculator/page.tsx
+++ b/app/(site)/(tools)/nginx-proxy-pass-calculator/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { Route } from "lucide-react";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { NginxProxyPassCalculator } from "./nginx-proxy-pass-calculator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function NginxProxyPassCalculatorPage() {
   const toolPage = await getRequiredToolPage("nginx-proxy-pass-calculator");
@@ -12,10 +15,14 @@ export default async function NginxProxyPassCalculatorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Route strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <NginxProxyPassCalculator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/restic-retention-simulator/content/article.mdx b/app/(site)/(tools)/restic-retention-simulator/content/article.mdx
new file mode 100644
index 00000000..b7154cff
--- /dev/null
+++ b/app/(site)/(tools)/restic-retention-simulator/content/article.mdx
@@ -0,0 +1,41 @@
+## How does restic forget decide what to keep?
+
+Each rule picks snapshots on its own, and a snapshot stays if any rule picks it. Everything else is forgotten. The [restic forget documentation](https://restic.readthedocs.io/en/stable/060_forget.html) describes each rule.
+
+- `--keep-last n` keeps the newest n snapshots.
+- `--keep-daily n` keeps the newest snapshot from each of the last n days that have one.
+- `--keep-weekly n` does the same for weeks.
+- `--keep-monthly n` does the same for months.
+- `--keep-yearly n` does the same for years.
+
+Weeks run from Monday to Sunday. One snapshot can satisfy several rules at once, so a policy of 7 daily and 4 weekly can keep fewer than 11 snapshots.
+
+## Does --keep-daily 7 keep the last 7 days?
+
+No. It keeps the newest snapshot from the last 7 days that have a snapshot. Days with no backup don't count, so after a week of missed backups, `--keep-daily 7` still keeps 7 snapshots that reach further back.
+
+To keep everything within a time span instead, restic has `--keep-within` and `--keep-within-daily`, which take a duration such as `7d`. This simulator doesn't model those, or `--keep-hourly` and `--keep-tag`.
+
+## Why is my oldest snapshot kept?
+
+When there aren't enough snapshots to fill a rule, restic also keeps the oldest one and marks it `oldest`. With 20 days of backups and `--keep-monthly 6`, only one month has snapshots, so the oldest stays as well.
+
+## Why are some snapshots kept that I didn't expect?
+
+Check the grouping first. restic applies the policy to each group of host and paths separately, so every backup job keeps its own full set. A snapshot with a different path list counts as a separate group, even on the same host.
+
+To group differently, use `--group-by`, such as `--group-by host` or `--group-by paths,tags`.
+
+## Does forget free disk space?
+
+Not by itself. `forget` removes snapshots from the list, and `prune` deletes the data that only those snapshots used. Add `--prune` to `forget` to run both. Pruning locks the repository, so backups can't run while it works.
+
+The simulator can't tell how much space you'll get back, because snapshots share most of their data.
+
+<Warning title="Run a dry run before the real command">
+
+Run `restic forget --dry-run` with the same rules and grouping, and compare its list with this one. Only then run it without `--dry-run`. Forgotten snapshots can't be brought back after a prune.
+
+</Warning>
+
+For where backups fit in a home server setup, see the course chapter on [backups before serious apps](/self-hosting-for-beginners/backups-before-serious-apps).
diff --git a/app/(site)/(tools)/restic-retention-simulator/content/intro.mdx b/app/(site)/(tools)/restic-retention-simulator/content/intro.mdx
new file mode 100644
index 00000000..295904a0
--- /dev/null
+++ b/app/(site)/(tools)/restic-retention-simulator/content/intro.mdx
@@ -0,0 +1,3 @@
+Paste your snapshot list and set `--keep-daily`, `--keep-weekly`, and the other rules to see which snapshots `restic forget` would keep, and why.
+
+Get the list with `restic snapshots --json`. The simulator runs in your browser and never touches your repository.
diff --git a/app/(site)/(tools)/restic-retention-simulator/content/usage.mdx b/app/(site)/(tools)/restic-retention-simulator/content/usage.mdx
new file mode 100644
index 00000000..023895ad
--- /dev/null
+++ b/app/(site)/(tools)/restic-retention-simulator/content/usage.mdx
@@ -0,0 +1,17 @@
+## What to enter
+
+Paste the output of `restic snapshots --json` as it is. The simulator reads each snapshot's ID, time, host, paths, and tags.
+
+Pick the timezone your backups run in. Daily, weekly, monthly, and yearly rules count calendar days in that timezone, so a backup just after midnight can land on a different day in UTC.
+
+`Group snapshots by` applies each rule separately to every host, path set, or tag set. restic itself groups by host and paths together, which this tool can't combine. If one host backs up several paths in separate jobs, compare the result with a dry run.
+
+<Example title="20 nightly backups with 7 daily, 4 weekly, and 6 monthly">
+
+One snapshot a night from 1 to 20 September 2026, grouped by host, timezone `Europe/Berlin`.
+
+The result is `Kept 10 of 20 snapshots.` The 7 newest are daily keeps, and 20 September also counts for its week and month. 13 and 6 September are the newest in their weeks. 1 September is kept as the oldest snapshot, because the history isn't long enough to fill 4 weeks and 6 months.
+
+</Example>
+
+`pruned` means no rule picked that snapshot. Nothing is deleted.
diff --git a/app/(site)/(tools)/restic-retention-simulator/page.tsx b/app/(site)/(tools)/restic-retention-simulator/page.tsx
index 03dac47b..1b5d0d8b 100644
--- a/app/(site)/(tools)/restic-retention-simulator/page.tsx
+++ b/app/(site)/(tools)/restic-retention-simulator/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileCheck2 } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { ResticRetentionSimulator } from "./restic-retention-simulator";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ResticRetentionSimulatorPage() {
   const toolPage = await getRequiredToolPage("restic-retention-simulator");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <ResticRetentionSimulator />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/rsync-filter-tester/content/article.mdx b/app/(site)/(tools)/rsync-filter-tester/content/article.mdx
new file mode 100644
index 00000000..025a6876
--- /dev/null
+++ b/app/(site)/(tools)/rsync-filter-tester/content/article.mdx
@@ -0,0 +1,47 @@
+## How does rsync decide which files to copy?
+
+rsync checks each file and folder against your rules from top to bottom, and the first rule that matches decides. A path that matches no rule is copied. The [rsync manual](https://download.samba.org/pub/rsync/rsync.1#FILTER_RULES) covers the full rule language.
+
+So order matters. Put exceptions before the broad rule they're exceptions to:
+
+- `+ keep.log` then `- *.log` copies `keep.log` and skips the other logs.
+- `- *.log` then `+ keep.log` skips every log, because the first rule already matched.
+
+## Why are files in my included folder not copied?
+
+Because a folder above them was excluded. When rsync excludes a folder, it doesn't look inside, so no later rule can bring back a file in it. This is the most common rsync filter mistake.
+
+Include every folder on the way down. The rsync manual's own example, `+ foo/`, `+ foo/bar.c`, `- *`, copies only `foo/bar.c`, and notes that `foo/` must be included or `- *` would exclude it.
+
+## How do I copy only one file type?
+
+Include all folders first, then the file type, then exclude everything else:
+
+```bash
+rsync -av --include='*/' --include='*.jpg' --exclude='*' src/ dest/
+```
+
+`*/` matches every folder, so rsync walks the whole tree. That can leave empty folders at the destination. Add `-m` (`--prune-empty-dirs`) to skip them.
+
+## What do the pattern symbols mean?
+
+- `*.conf` with no slash matches a file name at any depth, such as `app.conf` or `etc/app.conf`.
+- A leading `/`, as in `/etc/*.conf`, anchors the pattern to the top of the transfer, not your system's root.
+- `*` matches within one path segment, so `/etc/*.conf` doesn't match `etc/app/site.conf`.
+- `**` crosses folders, so `/logs/**` matches everything at any depth under `logs/`.
+- `?` matches one character, so `part?.txt` matches `part1.txt` but not `part12.txt`.
+- A trailing `/`, as in `cache/`, matches folders only.
+
+A standalone `!` clears every rule above it.
+
+## How do I check before copying?
+
+Run the real command with `--dry-run` and `-v`. rsync lists what it would copy without changing anything. This tester doesn't follow symlinks, check permissions, or read `.rsync-filter` merge files, so the dry run is the final check.
+
+<Warning title="Excluded files are kept with --delete">
+
+With `--delete`, rsync removes destination files that aren't in the source. Files your rules exclude are left alone, unless you also use `--delete-excluded`. Test that flag with a dry run first.
+
+</Warning>
+
+For backups with snapshots and retention instead of plain copies, see the [restic retention simulator](/restic-retention-simulator).
diff --git a/app/(site)/(tools)/rsync-filter-tester/content/intro.mdx b/app/(site)/(tools)/rsync-filter-tester/content/intro.mdx
new file mode 100644
index 00000000..8a193cc5
--- /dev/null
+++ b/app/(site)/(tools)/rsync-filter-tester/content/intro.mdx
@@ -0,0 +1,3 @@
+Paste your rsync `+` include and `-` exclude rules and a sample list of paths to see which files rsync copies, which rule decides each one, and which folders it never looks inside.
+
+The paths don't need to exist. It runs in your browser.
diff --git a/app/(site)/(tools)/rsync-filter-tester/content/usage.mdx b/app/(site)/(tools)/rsync-filter-tester/content/usage.mdx
new file mode 100644
index 00000000..9d2ddde5
--- /dev/null
+++ b/app/(site)/(tools)/rsync-filter-tester/content/usage.mdx
@@ -0,0 +1,21 @@
+## What to enter
+
+Write one rule per line, in the order you'll pass them to rsync. `--include=PATTERN` is `+ PATTERN`, and `--exclude=PATTERN` is `- PATTERN`.
+
+For paths, list files relative to the folder you're copying, and end each directory with `/`. Include the folders that lead to the files you care about, such as `photos/` and `photos/2026/`, because a folder's own result decides whether rsync looks inside it.
+
+Leave `Unmatched paths` on `Include` to match rsync. A path no rule matches is copied.
+
+## How to read the result
+
+Each path is included, excluded, or unvisited. Unvisited means rsync never reaches the path, because a folder above it was excluded.
+
+<Example title="Copy only JPEG files from a photo folder">
+
+Paths: `photos/`, `photos/2026/`, `photos/2026/a.jpg`, `photos/2026/b.raw`, `notes.txt`, `cover.jpg`.
+
+With `+ *.jpg` then `- *`, the result is `Included 1, excluded 2, unvisited 3.` Only `cover.jpg` is copied, because `- *` excludes `photos/` and rsync never looks inside.
+
+Add `+ */` as the first rule and it becomes `Included 4, excluded 2, unvisited 0.` Now `photos/2026/a.jpg` is copied too.
+
+</Example>
diff --git a/app/(site)/(tools)/rsync-filter-tester/page.tsx b/app/(site)/(tools)/rsync-filter-tester/page.tsx
index 14532644..d2d16f89 100644
--- a/app/(site)/(tools)/rsync-filter-tester/page.tsx
+++ b/app/(site)/(tools)/rsync-filter-tester/page.tsx
@@ -1,18 +1,24 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { FileCheck2 } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { RsyncFilterTester } from "./rsync-filter-tester";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function RsyncFilterTesterPage() {
   const toolPage = await getRequiredToolPage("rsync-filter-tester");
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<FileCheck2 strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <RsyncFilterTester />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/self-hosted-app-resource-planner/content/article.mdx b/app/(site)/(tools)/self-hosted-app-resource-planner/content/article.mdx
new file mode 100644
index 00000000..aa8c481e
--- /dev/null
+++ b/app/(site)/(tools)/self-hosted-app-resource-planner/content/article.mdx
@@ -0,0 +1,29 @@
+## How much RAM does a home server need?
+
+Add up the apps you'll run, then leave room for the system. Small services such as a password manager or a DNS filter need well under 1 GiB each. Media servers and photo libraries need several GiB each, and most of a home server's RAM goes to them.
+
+The planner's estimates name their source. Immich's, for example, follows [the project's requirements](https://immich.app/docs/install/requirements): 6 GB of RAM minimum and 8 GB recommended.
+
+## Should I plan for the low or the high estimate?
+
+Plan for the high one. RAM use grows with users, library size, and background work such as transcoding, thumbnails, or search indexing. A server that fits only the low estimates will run out of memory at busy moments.
+
+When Linux runs out of memory, the kernel starts killing processes, and [Docker notes](https://docs.docker.com/engine/containers/resource_constraints/) that any process can be picked, including Docker itself.
+
+## Does a Docker memory limit make an app need less RAM?
+
+No. A limit caps how much a container can use. An app that needs more than its limit can crash or slow down, but it won't need less. Use limits to protect the other apps on the server, not to make a plan fit.
+
+After the apps are running, `docker stats` shows what each container really uses. Compare that with the plan and adjust the estimates.
+
+## What does the storage estimate include?
+
+It depends on the app, so read its basis. Some ranges cover only the app and its database. Your own data, such as a film library or years of photos, can be far bigger. Add it as a custom row when the basis doesn't mention it.
+
+Leave space for backups too, on another disk if you can.
+
+## Does the planner check CPU?
+
+No. It totals RAM and storage only. Video transcoding and machine learning, such as face recognition in photo apps, lean on the CPU or a GPU. Check each app's own requirements. Immich, for example, asks for at least 2 CPU cores.
+
+To pick the machine itself, see the course chapter on [picking your first server](/self-hosting-for-beginners/pick-your-first-server).
diff --git a/app/(site)/(tools)/self-hosted-app-resource-planner/content/intro.mdx b/app/(site)/(tools)/self-hosted-app-resource-planner/content/intro.mdx
new file mode 100644
index 00000000..c9ee221e
--- /dev/null
+++ b/app/(site)/(tools)/self-hosted-app-resource-planner/content/intro.mdx
@@ -0,0 +1,3 @@
+Add the apps you plan to self-host and your server's RAM and disk to see whether they fit, with a low and a high estimate for each app.
+
+Have the RAM and disk space you can give these apps, after the operating system and anything else on the machine.
diff --git a/app/(site)/(tools)/self-hosted-app-resource-planner/content/usage.mdx b/app/(site)/(tools)/self-hosted-app-resource-planner/content/usage.mdx
new file mode 100644
index 00000000..6ea2db72
--- /dev/null
+++ b/app/(site)/(tools)/self-hosted-app-resource-planner/content/usage.mdx
@@ -0,0 +1,24 @@
+## What to enter
+
+Search for each app by name. The estimates come from the [self-host apps directory](/self-host-apps). Each shows its basis, its source, and a confidence level. Most are estimates for a small home setup, not measurements.
+
+For an app that isn't listed, or a setup bigger than the basis describes, add a custom row with your own low and high numbers. `Quantity` multiplies both, such as two copies of the same database.
+
+RAM is in GiB and storage is in GB, the unit disks are sold in. `Headroom reserve` holds back a share of each budget once, for the operating system, caches, and spikes. The default 20% is a starting point, not a rule.
+
+## How to read the result
+
+| Status | What it means |
+| --- | --- |
+| Within | Even the high estimates fit. |
+| Tight | The low estimates fit, but the high ones don't. |
+| Over | Even the low estimates don't fit. |
+| Unknown | At least one app has no estimate, so the total can't be settled. |
+
+<Example title="Jellyfin, Immich, and Vaultwarden on a 16 GiB server">
+
+Budget 16 GiB RAM and 1,000 GB storage, with 20% headroom.
+
+The result is `RAM may exceed the available amount.` RAM needs 10 GiB to 17 GiB, and 13 GiB is available. Storage needs 101 GB to 620 GB, which fits in the 800 GB available. With 24 GiB of RAM, the plan is within budget.
+
+</Example>
diff --git a/app/(site)/(tools)/self-hosted-app-resource-planner/page.tsx b/app/(site)/(tools)/self-hosted-app-resource-planner/page.tsx
index 723e16e4..591e9809 100644
--- a/app/(site)/(tools)/self-hosted-app-resource-planner/page.tsx
+++ b/app/(site)/(tools)/self-hosted-app-resource-planner/page.tsx
@@ -1,9 +1,12 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
 import { HardDrive } from "lucide-react";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { SelfHostedAppResourcePlanner } from "./self-hosted-app-resource-planner";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function SelfHostedAppResourcePlannerPage() {
   const toolPage = await getRequiredToolPage("self-hosted-app-resource-planner");
@@ -11,9 +14,12 @@ export default async function SelfHostedAppResourcePlannerPage() {
   return (
     <ToolPageShell toolPage={toolPage}>
       <PageCanvas>
-        <ToolPageHeader icon={<HardDrive strokeWidth={2.2} />} toolPage={toolPage} />
+        <ToolPageHeader icon={<HardDrive strokeWidth={2.2} />} intro={<Intro />} toolPage={toolPage} />
         <SelfHostedAppResourcePlanner />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );
diff --git a/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/article.mdx b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/article.mdx
new file mode 100644
index 00000000..43e5c5a5
--- /dev/null
+++ b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/article.mdx
@@ -0,0 +1,15 @@
+## Where do the shortcuts come from?
+
+Each app's shortcuts come from its own documentation, such as Microsoft's [VS Code default keyboard shortcuts](https://code.visualstudio.com/docs/reference/default-keybindings). The bottom of each app's section on the sheet names the source and the date it was last checked.
+
+The sheet shows default shortcuts only. If you changed a key in an app's settings, or use a mode such as Vim keys in your editor, the sheet won't know.
+
+## How many shortcuts should a cheat sheet have?
+
+Fewer than you think. A sheet you can scan in a few seconds is one you'll keep next to the keyboard. Start with the shortcuts for things you do many times a day, and make a new sheet once those stick.
+
+A sheet built around one task, such as an editor, a terminal, and a browser for coding, is often more useful than one for a single app.
+
+## Where can I see every shortcut for an app?
+
+The [keyboard shortcuts directory](/keyboard-shortcuts) has a full page for each app, with notes on modes, key sequences, and platform differences. The sheet uses the same data as those pages, such as [VS Code](/keyboard-shortcuts/vscode) and [Chrome](/keyboard-shortcuts/chrome).
diff --git a/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/intro.mdx b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/intro.mdx
new file mode 100644
index 00000000..f0a2a87c
--- /dev/null
+++ b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/intro.mdx
@@ -0,0 +1,3 @@
+Pick the apps you use, your platform, and the shortcut groups you want, then print one cheat sheet with all of them.
+
+There are more than 200 apps to choose from, from VS Code and Chrome to Figma and Excel. The preview is exactly what prints.
diff --git a/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/usage.mdx b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/usage.mdx
new file mode 100644
index 00000000..8c38eaf6
--- /dev/null
+++ b/app/(site)/(tools)/shortcuts-cheatsheet-generator/content/usage.mdx
@@ -0,0 +1,19 @@
+## How to make a sheet that fits on a page
+
+Pick one platform per app unless the sheet is for a shared desk. Windows, macOS, and Linux often use the same action with a different modifier, such as `Ctrl` and `Cmd`, and one platform makes a much shorter sheet.
+
+Then untick the groups you don't need. Each group is a task, such as navigation or search, so drop the ones you rarely do.
+
+<Example title="VS Code on a Mac">
+
+VS Code has 153 shortcuts across seven groups. Choose `macOS` and keep only `Basic editing` and `Navigation`, and the sheet drops to 46 shortcuts.
+
+</Example>
+
+Each app keeps its name and each group its heading on the paper. So when two apps share a key, such as `Cmd+K`, the sheet shows which app it belongs to.
+
+To print, use `Print sheet`. In the browser's print dialog, turn off headers and footers for a cleaner page.
+
+## Share or bookmark a sheet
+
+Add `?apps=` to the page address, followed by each app's name as it appears in its keyboard shortcuts page address, such as `vscode` from `/keyboard-shortcuts/vscode`. For example, `/shortcuts-cheatsheet-generator?apps=vscode,chrome` opens with both apps picked. Platform and group choices aren't saved in the link.
diff --git a/app/(site)/(tools)/shortcuts-cheatsheet-generator/page.tsx b/app/(site)/(tools)/shortcuts-cheatsheet-generator/page.tsx
index 3339db97..6b9fa21f 100644
--- a/app/(site)/(tools)/shortcuts-cheatsheet-generator/page.tsx
+++ b/app/(site)/(tools)/shortcuts-cheatsheet-generator/page.tsx
@@ -1,10 +1,13 @@
 import { ToolPageShell } from "@/app/ui/tools/tool-page-shell";
-import { ToolPageHeader, ToolPageMarkdown } from "@/app/ui/site/tool-page-content";
+import { ToolPageArticle, ToolPageHeader } from "@/app/ui/site/tool-page-content";
 import { getRequiredToolPage } from "@/lib/tool-pages";
 import { PageCanvas } from "../../../ui/site/page-canvas";
 import { Keyboard } from "lucide-react";
 import { shortcutAppCatalog } from "@/lib/shortcuts";
 import { ShortcutsCheatSheetGeneratorFromUrl } from "./shortcuts-cheatsheet-generator-from-url";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
+import Usage from "./content/usage.mdx";
 
 export default async function ShortcutsCheatSheetGeneratorPage() {
   const toolPage = await getRequiredToolPage("shortcuts-cheatsheet-generator");
@@ -14,10 +17,14 @@ export default async function ShortcutsCheatSheetGeneratorPage() {
       <PageCanvas>
         <ToolPageHeader
           icon={<Keyboard strokeWidth={2.2} />}
+          intro={<Intro />}
           toolPage={toolPage}
         />
         <ShortcutsCheatSheetGeneratorFromUrl catalog={shortcutAppCatalog} />
-        <ToolPageMarkdown toolPage={toolPage} />
+        <ToolPageArticle>
+          <Usage />
+          <Article />
+        </ToolPageArticle>
       </PageCanvas>
     </ToolPageShell>
   );

From 1e9f5ef07c580c2f25a2b474b9402b1c2d09df7c Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:12:43 +0530
Subject: [PATCH 12/25] Rewrite the six hardware directory pages in MDX

The shared hardware page takes each route's intro and article. Each page
now says what its sources are, what a listing does and doesn't promise,
and why the exact model matters.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../content/article.mdx                       | 29 ++++++++++++++
 .../local-security-cameras/content/intro.mdx  |  1 +
 .../local-security-cameras/page.tsx           |  4 +-
 .../matter-devices/content/article.mdx        | 32 +++++++++++++++
 .../matter-devices/content/intro.mdx          |  1 +
 .../(directories)/matter-devices/page.tsx     |  4 +-
 .../nut-compatible-ups/content/article.mdx    | 27 +++++++++++++
 .../nut-compatible-ups/content/intro.mdx      |  1 +
 .../(directories)/nut-compatible-ups/page.tsx |  4 +-
 .../z-wave-devices/content/article.mdx        | 30 ++++++++++++++
 .../z-wave-devices/content/intro.mdx          |  1 +
 .../(directories)/z-wave-devices/page.tsx     |  4 +-
 .../zigbee-coordinators/content/article.mdx   | 30 ++++++++++++++
 .../zigbee-coordinators/content/intro.mdx     |  1 +
 .../zigbee-coordinators/page.tsx              |  4 +-
 .../zigbee-devices/content/article.mdx        | 40 +++++++++++++++++++
 .../zigbee-devices/content/intro.mdx          |  1 +
 .../(directories)/zigbee-devices/page.tsx     |  9 +++--
 .../directories/hardware-directory-page.tsx   | 10 ++---
 19 files changed, 219 insertions(+), 14 deletions(-)
 create mode 100644 app/(site)/(directories)/local-security-cameras/content/article.mdx
 create mode 100644 app/(site)/(directories)/local-security-cameras/content/intro.mdx
 create mode 100644 app/(site)/(directories)/matter-devices/content/article.mdx
 create mode 100644 app/(site)/(directories)/matter-devices/content/intro.mdx
 create mode 100644 app/(site)/(directories)/nut-compatible-ups/content/article.mdx
 create mode 100644 app/(site)/(directories)/nut-compatible-ups/content/intro.mdx
 create mode 100644 app/(site)/(directories)/z-wave-devices/content/article.mdx
 create mode 100644 app/(site)/(directories)/z-wave-devices/content/intro.mdx
 create mode 100644 app/(site)/(directories)/zigbee-coordinators/content/article.mdx
 create mode 100644 app/(site)/(directories)/zigbee-coordinators/content/intro.mdx
 create mode 100644 app/(site)/(directories)/zigbee-devices/content/article.mdx
 create mode 100644 app/(site)/(directories)/zigbee-devices/content/intro.mdx

diff --git a/app/(site)/(directories)/local-security-cameras/content/article.mdx b/app/(site)/(directories)/local-security-cameras/content/article.mdx
new file mode 100644
index 00000000..dcbf2073
--- /dev/null
+++ b/app/(site)/(directories)/local-security-cameras/content/article.mdx
@@ -0,0 +1,29 @@
+## Will this camera work with Frigate?
+
+If it has an RTSP stream, Frigate can usually record it, but only a few cameras here have a tested setup. The Frigate status in the details tells you which:
+
+<Terms>
+<Term name="Verified">Someone ran this Frigate config on the camera and reported it to the source database.</Term>
+<Term name="Recorded, not bench verified">The database generated a config from the published stream paths. Nobody has reported testing it.</Term>
+<Term name="Not recorded">There's no Frigate config for this camera yet.</Term>
+</Terms>
+
+## What should I look for in a camera for Frigate?
+
+[Frigate's hardware guide](https://docs.frigate.video/frigate/hardware) suggests a few things. The details show each one when the source publishes it.
+
+- H.264 video and AAC audio give the most compatibility with Frigate and Home Assistant.
+- More than one substream lets Frigate detect on a small stream and record the full one.
+- A wired connection is safer. Frigate doesn't recommend Wi-Fi cameras, because their streams can drop.
+
+RTSP carries the video. ONVIF helps software find the camera and control it, such as moving a PTZ camera.
+
+## Why do firmware and the exact model matter?
+
+Stream paths and ONVIF behavior can change with a firmware update. Many brands also sell rebadged hardware, such as Hikvision cameras under other names, so one model can follow another maker's stream paths. Check the stream path in the details against your camera's current firmware.
+
+## Where does this list come from?
+
+From the [CCTV Camera Database](https://github.com/ch-bas/cctv-camera-database), a public domain list built from manufacturer datasheets and product pages. We include cameras that publish RTSP or ONVIF and cite a manufacturer source. Each camera's details show when the database last checked it.
+
+We haven't tested these cameras ourselves. The database says its specs may contain errors, so confirm against the official datasheet before you buy.
diff --git a/app/(site)/(directories)/local-security-cameras/content/intro.mdx b/app/(site)/(directories)/local-security-cameras/content/intro.mdx
new file mode 100644
index 00000000..fa6dd8bd
--- /dev/null
+++ b/app/(site)/(directories)/local-security-cameras/content/intro.mdx
@@ -0,0 +1 @@
+Search IP cameras by brand, model, or feature, such as `PoE` or `ONVIF`, to find ones that stream video on your own network over RTSP or ONVIF. Open a card for stream paths, codecs, power, and Frigate setup notes, with links to the sources. The date above the cards shows when we last read the camera database.
diff --git a/app/(site)/(directories)/local-security-cameras/page.tsx b/app/(site)/(directories)/local-security-cameras/page.tsx
index d0976fb9..2ac12670 100644
--- a/app/(site)/(directories)/local-security-cameras/page.tsx
+++ b/app/(site)/(directories)/local-security-cameras/page.tsx
@@ -1,9 +1,11 @@
 import { Cctv } from "lucide-react";
 import { HardwareDirectoryPage } from "../../../ui/directories/hardware-directory-page";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 import { getHardwareDirectorySnapshot } from "@/lib/hardware-directories";
 
 export default async function LocalSecurityCamerasPage() {
-  return <HardwareDirectoryPage config={{
+  return <HardwareDirectoryPage article={<Article />} intro={<Intro />} config={{
     detailFilterLabel: "Protocol or connection",
     icon: <Cctv strokeWidth={2.2} />,
     route: "/local-security-cameras",
diff --git a/app/(site)/(directories)/matter-devices/content/article.mdx b/app/(site)/(directories)/matter-devices/content/article.mdx
new file mode 100644
index 00000000..e7974261
--- /dev/null
+++ b/app/(site)/(directories)/matter-devices/content/article.mdx
@@ -0,0 +1,32 @@
+## Will a Matter device work with Home Assistant?
+
+Usually, but certification doesn't promise every feature. It means the product passed the Connectivity Standards Alliance's tests for its device type. [Home Assistant's Matter docs](https://www.home-assistant.io/integrations/matter/) note that Matter, as a shared standard, may lack features a brand's own app offers. Check that your controller supports the device type on the card.
+
+An "Aggregator" is a bridge. It brings a brand's other devices into Matter, so what you can control depends on the bridge.
+
+## What do I need for Thread, Wi-Fi, or Ethernet?
+
+Each network needs something different:
+
+| Network | What you need |
+| --- | --- |
+| Thread | A Thread border router, which links Thread devices to your home network |
+| Wi-Fi | Your Wi-Fi network |
+| Ethernet | A wired network port |
+| Bluetooth | A phone near the device during setup. Bluetooth is only used to add the device, not to control it. |
+
+Matter also needs local IPv6 and multicast traffic to reach your controller, so check your router doesn't block them.
+
+## Why does one product have several certificates?
+
+Brands certify hardware versions, firmware versions, and regional models separately, so one product can carry many certificate IDs. The details list each variant with its firmware, hardware version, and product ID. A device on newer firmware may sit under a later certificate.
+
+## Where does this list come from?
+
+From the [Connectivity Standards Alliance's certified product list](https://csa-iot.org/csa-iot_products/). We group certificates for the same product into one card. For some products, the community [Matter Database](https://github.com/matterdatabase/matterdatabase) adds retail names and images.
+
+We haven't tested these products ourselves. If you can't find one, it may be certified under another brand name, or after the date above the cards.
+
+## What about Zigbee and Z-Wave devices?
+
+Each has its own radio and software. Check exact models in [Zigbee devices](/zigbee-devices) and [Z-Wave devices](/z-wave-devices).
diff --git a/app/(site)/(directories)/matter-devices/content/intro.mdx b/app/(site)/(directories)/matter-devices/content/intro.mdx
new file mode 100644
index 00000000..96be7344
--- /dev/null
+++ b/app/(site)/(directories)/matter-devices/content/intro.mdx
@@ -0,0 +1 @@
+Search Matter certified products by brand, device type, or network, such as Thread or Wi-Fi. Each card groups one product's certificates and shows how it connects and which Matter version it was certified for. The date above the cards shows when we last read the certification list.
diff --git a/app/(site)/(directories)/matter-devices/page.tsx b/app/(site)/(directories)/matter-devices/page.tsx
index c5112ea9..89b698dc 100644
--- a/app/(site)/(directories)/matter-devices/page.tsx
+++ b/app/(site)/(directories)/matter-devices/page.tsx
@@ -1,9 +1,11 @@
 import { Network } from "lucide-react";
 import { HardwareDirectoryPage } from "../../../ui/directories/hardware-directory-page";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 import { getHardwareDirectorySnapshot } from "@/lib/hardware-directories";
 
 export default async function MatterDevicesPage() {
-  return <HardwareDirectoryPage config={{
+  return <HardwareDirectoryPage article={<Article />} intro={<Intro />} config={{
     detailFilterLabel: "Transport or version",
     icon: <Network strokeWidth={2.2} />,
     route: "/matter-devices",
diff --git a/app/(site)/(directories)/nut-compatible-ups/content/article.mdx b/app/(site)/(directories)/nut-compatible-ups/content/article.mdx
new file mode 100644
index 00000000..cb3a7f16
--- /dev/null
+++ b/app/(site)/(directories)/nut-compatible-ups/content/article.mdx
@@ -0,0 +1,27 @@
+## What does NUT do with my UPS?
+
+NUT lets a computer read the UPS battery status and shut down cleanly before the battery runs out. One machine connects to the UPS, and others on your network can watch it through that machine. Home Assistant reads a UPS through its [NUT integration](https://www.home-assistant.io/integrations/nut/).
+
+## What does the NUT support level mean?
+
+It shows how the driver's authors learned the UPS's protocol. The scale comes from the [NUT compatibility list](https://networkupstools.org/stable-hcl.html):
+
+| Level | How the protocol was learned |
+| --- | --- |
+| 1 | Reverse engineered |
+| 2 | From public fragments of the protocol |
+| 3 | From the published protocol |
+| 4 | Provided by the vendor |
+| 5 | Provided by the vendor, with hardware |
+
+It isn't a test result for your unit. When a card shows two levels, each connection type has its own.
+
+## Is my exact UPS model supported?
+
+Check that the model name and connection match yours. Some entries cover a whole product family, and a family entry may not include every model or regional version. Filter by "Product family" or "Named model" to tell them apart.
+
+If your model isn't listed, the NUT list suggests trying the drivers for other models from the same maker. Many work, or mostly work.
+
+## Where does this list come from?
+
+From the NUT compatibility list, read from the [NUT source code](https://github.com/networkupstools/nut). We leave out power distribution units and transfer switches, which the list also covers. We haven't tested these units ourselves, and the NUT project says its list may miss supported models or contain errors.
diff --git a/app/(site)/(directories)/nut-compatible-ups/content/intro.mdx b/app/(site)/(directories)/nut-compatible-ups/content/intro.mdx
new file mode 100644
index 00000000..d6a8cd47
--- /dev/null
+++ b/app/(site)/(directories)/nut-compatible-ups/content/intro.mdx
@@ -0,0 +1 @@
+Search by brand or model to see which Network UPS Tools (NUT) driver supports a UPS and how it connects. Open a card for every driver and connection option, with a link to the NUT listing. The date above the cards shows when we last read the NUT compatibility list.
diff --git a/app/(site)/(directories)/nut-compatible-ups/page.tsx b/app/(site)/(directories)/nut-compatible-ups/page.tsx
index 9f6d51ad..9181db83 100644
--- a/app/(site)/(directories)/nut-compatible-ups/page.tsx
+++ b/app/(site)/(directories)/nut-compatible-ups/page.tsx
@@ -1,9 +1,11 @@
 import { BatteryCharging } from "lucide-react";
 import { HardwareDirectoryPage } from "../../../ui/directories/hardware-directory-page";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 import { getHardwareDirectorySnapshot } from "@/lib/hardware-directories";
 
 export default async function NutCompatibleUpsPage() {
-  return <HardwareDirectoryPage config={{
+  return <HardwareDirectoryPage article={<Article />} intro={<Intro />} config={{
     detailFilterLabel: "Driver, connection or support",
     icon: <BatteryCharging strokeWidth={2.2} />,
     route: "/nut-compatible-ups",
diff --git a/app/(site)/(directories)/z-wave-devices/content/article.mdx b/app/(site)/(directories)/z-wave-devices/content/article.mdx
new file mode 100644
index 00000000..27cc43a9
--- /dev/null
+++ b/app/(site)/(directories)/z-wave-devices/content/article.mdx
@@ -0,0 +1,30 @@
+## Will this Z-Wave device work with Home Assistant?
+
+Very likely, if it's certified for your region. Home Assistant's Z-Wave integration runs on Z-Wave JS, and [its docs](https://www.home-assistant.io/integrations/zwave_js/) say a device "may very well work as intended" without a device file.
+
+A configuration file adds the model's settings, such as configuration parameters and association groups, plus any fixes it needs. "No Z-Wave JS match" means we couldn't match a file, sometimes because the certificate lists no product ID. It doesn't mean the device fails.
+
+## Which Z-Wave frequency do I need?
+
+The one for your country. Z-Wave radios use different frequencies by region, and Home Assistant's docs say you can't change an end device's frequency, so buy devices made for your region. 700 and 800 series controllers can switch region.
+
+"US LR" on a card means Z-Wave Long Range, a newer US option that reaches farther. Home Assistant uses it when your adapter supports it. Devices without Long Range still join the same network.
+
+## Why do product IDs matter more than the name?
+
+A retail name can cover several hardware versions and regions, each with its own certificate. Z-Wave JS picks a configuration file from the manufacturer ID, product type, and product ID the device reports, and sometimes the firmware version. The details list these IDs and every certified variant, so you can match the exact one you're buying.
+
+## Where does this list come from?
+
+It joins two public sources by those product IDs.
+
+| Source | What it adds |
+| --- | --- |
+| [Z-Wave Alliance product catalog](https://products.z-wavealliance.org/) | Certification, frequency, device type, and product IDs |
+| [Z-Wave JS device database](https://devices.zwave-js.io/) | Whether Z-Wave JS has a configuration file, and what it sets |
+
+Every product here is certified by the Z-Wave Alliance. We haven't tested them ourselves, so check the manual or configuration link in the details before you buy.
+
+## What about Zigbee and Matter devices?
+
+They use different radios and software, so check them in [Zigbee devices](/zigbee-devices) and [Matter devices](/matter-devices).
diff --git a/app/(site)/(directories)/z-wave-devices/content/intro.mdx b/app/(site)/(directories)/z-wave-devices/content/intro.mdx
new file mode 100644
index 00000000..925c9422
--- /dev/null
+++ b/app/(site)/(directories)/z-wave-devices/content/intro.mdx
@@ -0,0 +1 @@
+Search certified Z-Wave products by brand, model, or product ID, such as `ZW100` or `ZEN77`. Each card shows the radio frequency and whether Z-Wave JS, the driver Home Assistant uses, has a configuration file for it. The date above the cards shows when we last read the sources.
diff --git a/app/(site)/(directories)/z-wave-devices/page.tsx b/app/(site)/(directories)/z-wave-devices/page.tsx
index 3f8c5a15..eb1b2414 100644
--- a/app/(site)/(directories)/z-wave-devices/page.tsx
+++ b/app/(site)/(directories)/z-wave-devices/page.tsx
@@ -1,9 +1,11 @@
 import { Waves } from "lucide-react";
 import { HardwareDirectoryPage } from "../../../ui/directories/hardware-directory-page";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 import { getHardwareDirectorySnapshot } from "@/lib/hardware-directories";
 
 export default async function ZWaveDevicesPage() {
-  return <HardwareDirectoryPage config={{
+  return <HardwareDirectoryPage article={<Article />} intro={<Intro />} config={{
     detailFilterLabel: "Region or software support",
     icon: <Waves strokeWidth={2.2} />,
     route: "/z-wave-devices",
diff --git a/app/(site)/(directories)/zigbee-coordinators/content/article.mdx b/app/(site)/(directories)/zigbee-coordinators/content/article.mdx
new file mode 100644
index 00000000..05e67801
--- /dev/null
+++ b/app/(site)/(directories)/zigbee-coordinators/content/article.mdx
@@ -0,0 +1,30 @@
+## Which Zigbee coordinator should I buy?
+
+Start with the radio chipset, because it decides which firmware and software you can use. [Zigbee2MQTT recommends](https://www.zigbee2mqtt.io/guide/adapters/) Texas Instruments, Silicon Labs, and Dresden Elektronik adapters. [Home Assistant's ZHA docs](https://www.home-assistant.io/integrations/zha/) recommend its own adapters first, and list others it has tested.
+
+| Chipset on the card | Maker | What the docs say |
+| --- | --- | --- |
+| CC2652, CC1352 | Texas Instruments | Recommended by Zigbee2MQTT |
+| EFR32MG21, EFR32MG24 | Silicon Labs | Recommended by Zigbee2MQTT |
+| CC2530, CC2531, CC2538 | Texas Instruments, older | Not recommended. They run end-of-life firmware, and ZHA says CC2530 and CC2531 sticks struggle past 15 to 20 devices. |
+| XBee 3 | Digi | ZHA supports it but doesn't recommend it |
+
+Dresden Elektronik adapters, sold as ConBee and RaspBee, show no chipset here. When a card says the chipset isn't published, check the manufacturer page in the details.
+
+## Should I get a USB or network coordinator?
+
+Get USB if the adapter can sit near the machine running ZHA or Zigbee2MQTT. Put it on a USB extension cable, away from the computer, and use a USB 2.0 port, as ZHA's docs recommend.
+
+A network coordinator lets you place the radio anywhere with an Ethernet cable. Zigbee2MQTT warns that adapters on Wi-Fi may be less stable, so it recommends wired Ethernet.
+
+## Will I need to pair my devices again?
+
+Usually not, if you keep a backup. Zigbee2MQTT says firmware updates on the same adapter don't need re-pairing, but moving to a different adapter may. ZHA can move a network between Silicon Labs, Texas Instruments, and ConBee radios from a ZHA backup. Devices then rejoin on their own, normally within an hour.
+
+## Where does this list come from?
+
+Each card comes from the coordinator records in [Blakadder's Zigbee device compatibility repository](https://zigbee.blakadder.com/), a community list. "Works with" shows the software those reports name. We haven't tested these adapters ourselves, so check the firmware your software needs on the manufacturer page before you buy.
+
+## Which Zigbee devices will work with my coordinator?
+
+That depends on ZHA or Zigbee2MQTT more than on the coordinator. Check exact models in [Zigbee devices](/zigbee-devices).
diff --git a/app/(site)/(directories)/zigbee-coordinators/content/intro.mdx b/app/(site)/(directories)/zigbee-coordinators/content/intro.mdx
new file mode 100644
index 00000000..a6c8cc87
--- /dev/null
+++ b/app/(site)/(directories)/zigbee-coordinators/content/intro.mdx
@@ -0,0 +1 @@
+A coordinator is the USB or network radio that runs your Zigbee network, and ZHA or Zigbee2MQTT talks to it. Search by model or chipset, such as `ZBDongle-P` or `EFR32MG21`, and open a card for its connection, chipset, and source links. The date above the cards shows when we last read the source.
diff --git a/app/(site)/(directories)/zigbee-coordinators/page.tsx b/app/(site)/(directories)/zigbee-coordinators/page.tsx
index 15378ced..20e46c35 100644
--- a/app/(site)/(directories)/zigbee-coordinators/page.tsx
+++ b/app/(site)/(directories)/zigbee-coordinators/page.tsx
@@ -1,9 +1,11 @@
 import { RadioTower } from "lucide-react";
 import { HardwareDirectoryPage } from "../../../ui/directories/hardware-directory-page";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 import { getHardwareDirectorySnapshot } from "@/lib/hardware-directories";
 
 export default async function ZigbeeCoordinatorsPage() {
-  return <HardwareDirectoryPage config={{
+  return <HardwareDirectoryPage article={<Article />} intro={<Intro />} config={{
     detailFilterLabel: "Connection or radio",
     icon: <RadioTower strokeWidth={2.2} />,
     route: "/zigbee-coordinators",
diff --git a/app/(site)/(directories)/zigbee-devices/content/article.mdx b/app/(site)/(directories)/zigbee-devices/content/article.mdx
new file mode 100644
index 00000000..2e1e6e1b
--- /dev/null
+++ b/app/(site)/(directories)/zigbee-devices/content/article.mdx
@@ -0,0 +1,40 @@
+## Will my Zigbee device work with ZHA?
+
+Probably, if it follows the Zigbee standard, but no official list confirms it. [Home Assistant's ZHA docs](https://www.home-assistant.io/integrations/zha/) say there is no official compatibility list, because standard devices should work without device-specific code. Devices that bend the standard need a "quirk", a small fix written by volunteers.
+
+The ZHA results here come from community reports in [Blakadder's Zigbee device compatibility repository](https://zigbee.blakadder.com/). A device with no ZHA report hasn't failed with ZHA. Nobody has reported it there yet.
+
+## What does a Zigbee2MQTT listing mean?
+
+It means Zigbee2MQTT has a definition for that exact model, so it knows which features to show. A device without one can still pair, but [Zigbee2MQTT then guesses its features](https://www.zigbee2mqtt.io/advanced/support-new-devices/01_support_new_devices.html) from the standard and may miss some.
+
+The device details show what the definition adds:
+
+<Terms>
+<Term name="Exposed fields">The values Zigbee2MQTT can read or set, such as `brightness` or `occupancy`.</Term>
+<Term name="OTA updates">Whether the definition supports firmware updates over the air.</Term>
+<Term name="White-label model">Yes means this is another brand's version of hardware Zigbee2MQTT already defines.</Term>
+</Terms>
+
+## Why does the exact model matter?
+
+Support belongs to a model number, not a product name. Brands reuse names across hardware revisions, and a newer revision may behave differently or not be supported yet.
+
+Tuya-based devices are the hardest case. Many report the same Zigbee model, such as `TS0601`, and differ only in a manufacturer code like `_TZE200_1fuxihti`. The device details list the codes each definition covers. Zigbee2MQTT and ZHA both show your device's code on its page after pairing. If yours isn't listed, its features may not match.
+
+## Where does this device list come from?
+
+It joins two public sources. A device is listed when either source knows it. When both name the same brand and model, the card shows both.
+
+| Source | What it adds |
+| --- | --- |
+| [Zigbee2MQTT supported devices](https://www.zigbee2mqtt.io/supported-devices/) | Zigbee2MQTT support, exposed fields, OTA updates, and device identifiers |
+| [Blakadder compatibility repository](https://zigbee.blakadder.com/) | Community reports for ZHA, deCONZ, ioBroker, Tasmota, and other hubs |
+
+We haven't tested these devices ourselves. Support changes with new releases and device firmware, so open the source links in the device details before you buy.
+
+## Do you need a Zigbee coordinator?
+
+Yes. Every device here joins your network through a coordinator, the USB or network radio that ZHA or Zigbee2MQTT talks to. Coordinators aren't listed on this page. Compare their chipsets and firmware support in [Zigbee coordinators](/zigbee-coordinators).
+
+For other smart home radios, see [Z-Wave devices](/z-wave-devices) and [Matter devices](/matter-devices).
diff --git a/app/(site)/(directories)/zigbee-devices/content/intro.mdx b/app/(site)/(directories)/zigbee-devices/content/intro.mdx
new file mode 100644
index 00000000..bbec86c2
--- /dev/null
+++ b/app/(site)/(directories)/zigbee-devices/content/intro.mdx
@@ -0,0 +1 @@
+Search by brand, retail model, or feature to see whether a Zigbee device has a Zigbee2MQTT definition, a community report for ZHA, or both. Open a card for its features, device identifiers, and links to each source. The date above the cards shows when we last read those sources.
diff --git a/app/(site)/(directories)/zigbee-devices/page.tsx b/app/(site)/(directories)/zigbee-devices/page.tsx
index 32b42a12..429c33af 100644
--- a/app/(site)/(directories)/zigbee-devices/page.tsx
+++ b/app/(site)/(directories)/zigbee-devices/page.tsx
@@ -1,7 +1,6 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { RadioTower } from "lucide-react";
 import { AppShell, SidebarLabel } from "@/app/ui/site/app-shell";
@@ -23,6 +22,8 @@ import { DirectoryQueryProvider } from "../../../ui/directories/directory-query"
 import { sortDevices, zigbeeIndexRecord, zigbeePageSize } from "./filters";
 import { ZigbeeDeviceFilters, ZigbeeDeviceResults } from "./zigbee-device-view";
 import styles from "./zigbee-devices.module.css";
+import Article from "./content/article.mdx";
+import Intro from "./content/intro.mdx";
 
 export default async function ZigbeeDevicesPage() {
   const directoryPage = await getRequiredDirectoryPage("zigbee-devices");
@@ -75,7 +76,7 @@ export default async function ZigbeeDevicesPage() {
           <PageHeader bordered>
             <h1><PageTitleIcon><RadioTower strokeWidth={2.2} /></PageTitleIcon>{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
             <PageMeta updatedAt={directoryPage.updated_at} />
-            <ContentMarkdown markdown={directoryPage.intro_markdown} />
+            <Intro />
           </PageHeader>
 
           <ZigbeeDeviceResults
@@ -88,7 +89,7 @@ export default async function ZigbeeDevicesPage() {
           />
 
           <section className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
-            <DirectoryPageContent page={directoryPage} section="copy-1" />
+            <Article />
           </section>
         </PageCanvas>
       </AppShell>
diff --git a/app/ui/directories/hardware-directory-page.tsx b/app/ui/directories/hardware-directory-page.tsx
index c2a9f58a..2ca348e3 100644
--- a/app/ui/directories/hardware-directory-page.tsx
+++ b/app/ui/directories/hardware-directory-page.tsx
@@ -1,6 +1,5 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { ContentMarkdown } from "../content-markdown";
-import { DirectoryPageTitle, DirectoryPageContent } from "./directory-page-content";
+import { DirectoryPageTitle } from "./directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import type { ReactNode } from "react";
@@ -29,7 +28,8 @@ export type HardwareDirectoryConfig = {
 // the first time someone filters, so the default page stays light.
 const inlineIndexLimit = 300;
 
-export async function HardwareDirectoryPage({ config, snapshot }: { config: HardwareDirectoryConfig; snapshot: HardwareDirectorySnapshot }) {
+/** `intro` and `article` are the page's own `content/intro.mdx` and `content/article.mdx`. */
+export async function HardwareDirectoryPage({ article, config, intro, snapshot }: { article: ReactNode; config: HardwareDirectoryConfig; intro: ReactNode; snapshot: HardwareDirectorySnapshot }) {
   const directoryPage = await getRequiredDirectoryPage(config.route.slice(1));
   const records = snapshot.records;
   const firstPage = sortHardwareRecords(records, "name").slice(0, hardwarePageSize).map(hardwareIndexRecord);
@@ -66,7 +66,7 @@ export async function HardwareDirectoryPage({ config, snapshot }: { config: Hard
           <PageHeader bordered>
             <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} fallback={config.icon} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
             <PageMeta updatedAt={directoryPage.updated_at} />
-            <ContentMarkdown markdown={directoryPage.intro_markdown} />
+            {intro}
           </PageHeader>
 
           <HardwareDirectoryResults
@@ -80,7 +80,7 @@ export async function HardwareDirectoryPage({ config, snapshot }: { config: Hard
           />
 
           <section className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
-            <DirectoryPageContent page={directoryPage} />
+            {article}
           </section>
         </PageCanvas>
       </AppShell>

From ddec331053a6bebcdfe4f91551d23845350f0bda Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:21:13 +0530
Subject: [PATCH 13/25] Rewrite the keyboard shortcuts hub and six app intros
 in MDX

The hub says where the shortcuts come from and why one might not work.
Each app intro says what the app is and what its shortcuts cover.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(index)/content/intro.mdx                 |  1 +
 .../(index)/content/shortcut-not-working.mdx  |  8 +++++++
 .../content/where-shortcuts-come-from.mdx     |  5 ++++
 .../1password/content/intro.mdx               |  2 +-
 .../excel/content/intro.mdx                   |  2 +-
 .../figma/content/intro.mdx                   |  2 +-
 .../keyboard-shortcuts-directory.tsx          | 23 +++++++++++++++----
 .../macos/content/intro.mdx                   |  2 +-
 .../keyboard-shortcuts/vim/content/intro.mdx  |  2 +-
 .../vscode/content/intro.mdx                  |  2 +-
 10 files changed, 38 insertions(+), 11 deletions(-)
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/(index)/content/intro.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/(index)/content/shortcut-not-working.mdx
 create mode 100644 app/(site)/(directories)/keyboard-shortcuts/(index)/content/where-shortcuts-come-from.mdx

diff --git a/app/(site)/(directories)/keyboard-shortcuts/(index)/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/intro.mdx
new file mode 100644
index 00000000..79c30f08
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/intro.mdx
@@ -0,0 +1 @@
+Pick an app to see its default keyboard shortcuts, grouped by the task they help with. Each row shows the keys for every platform the app runs on, so Mac, Windows, and Linux users can read the same page.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/(index)/content/shortcut-not-working.mdx b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/shortcut-not-working.mdx
new file mode 100644
index 00000000..c4bea512
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/shortcut-not-working.mdx
@@ -0,0 +1,8 @@
+## Why doesn't a shortcut work for me?
+
+Usually something else has claimed the keys first. Check these in order:
+
+- You or an extension changed it. Apps such as VS Code and 1Password let you remap shortcuts, and your keys replace the defaults listed here.
+- Your keyboard isn't a US layout. Many references, including Microsoft's for Excel and VS Code, assume one, so keys such as `/` and `[` can sit elsewhere.
+- The operating system took it. Your system can reserve a combination before the app sees it. On a Mac, the top row may control brightness and volume until you hold Fn.
+- Your app version differs. The lists follow current desktop releases.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/(index)/content/where-shortcuts-come-from.mdx b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/where-shortcuts-come-from.mdx
new file mode 100644
index 00000000..155ed3f6
--- /dev/null
+++ b/app/(site)/(directories)/keyboard-shortcuts/(index)/content/where-shortcuts-come-from.mdx
@@ -0,0 +1,5 @@
+## Where do these shortcuts come from?
+
+Each app's list follows a published shortcut reference, usually the maker's own help pages, and shows the default keys. When the source gives no key for a platform, the row says "Not documented" instead of guessing.
+
+Mac keys get their own line because many apps swap Ctrl for Cmd and Alt for Option, but not all of them do. The printable sheet names each app's source and the date it was checked.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
index 41c6a665..3cf5e55b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/1password/content/intro.mdx
@@ -1 +1 @@
-1Password has separate keyboard layers for the desktop app, Quick Access, and the browser extension. The bindings below keep those contexts separate so the same key can be read without guessing where it works.
+1Password stores your passwords, passkeys, and other secrets, then fills them in for you. Its shortcuts are split by where they work: anywhere on your computer, in the desktop app, in Quick Access, and in the browser extension.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
index d3a23102..694a0f27 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/excel/content/intro.mdx
@@ -1 +1 @@
-Excel shortcuts are easiest to use when they follow the job in front of you: move through a grid, edit a cell, format a selection, work with data, and reach the ribbon or formula bar. This reference covers current desktop defaults for Windows and Mac.
+Excel is Microsoft's spreadsheet app for budgets, lists, data, and reports. Use these keys to move around a worksheet, select and fill ranges, format cells, enter formulas, and reach ribbon commands without the mouse.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
index bcb073e1..1d2d1892 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/figma/content/intro.mdx
@@ -1 +1 @@
-Figma work is mostly selection and repetition. These shortcuts get you from tool choice to shape editing to layer and canvas control without breaking the design flow.
+Figma is a design tool, in the browser or as a desktop app, where teams build interfaces, prototypes, and graphics together. These keys switch tools, pan and zoom the canvas, select layers without a mouse, and speed up shape and text edits.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-directory.tsx b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-directory.tsx
index a88d56f9..7f6a038d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-directory.tsx
+++ b/app/(site)/(directories)/keyboard-shortcuts/keyboard-shortcuts-directory.tsx
@@ -1,7 +1,6 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import Link from "next/link";
 import { appsInCategory, shortcutAppCatalog, shortcutCategories } from "@/lib/shortcuts";
@@ -10,7 +9,11 @@ import { DirectoryTitleIcon } from "@/app/ui/directories/directory-title-icon";
 import { PageHeader } from "@/app/ui/site/page-header";
 import { EntryHero } from "@/app/ui/site/entry-hero";
 import { siteSpotKeyboardShortcutsArt } from "../../art/site--spot-keyboard-shortcuts";
+import { proseClassName, proseSectionFlowClassName } from "@/app/ui/site/prose";
 import styles from "./keyboard-shortcuts.module.css";
+import Intro from "./(index)/content/intro.mdx";
+import ShortcutNotWorking from "./(index)/content/shortcut-not-working.mdx";
+import WhereShortcutsComeFrom from "./(index)/content/where-shortcuts-come-from.mdx";
 
 function categoryId(category: string) {
   return "category-" + category.toLowerCase().replace(/[^a-z0-9]+/g, "-");
@@ -26,7 +29,7 @@ export async function KeyboardShortcutsDirectory() {
       <PageHeader>
         <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
         <PageMeta updatedAt={directoryPage.updated_at} />
-        <ContentMarkdown markdown={directoryPage.intro_markdown} />
+        <Intro />
         <small>{shortcutAppCatalog.length} apps · {totalShortcuts} shortcuts · Windows, macOS, and Linux</small>
       </PageHeader>
 
@@ -67,8 +70,18 @@ export async function KeyboardShortcutsDirectory() {
         );
       })}
 
-      <section className={styles.nextStep} aria-labelledby="generator-title">
-        <DirectoryPageContent page={directoryPage} section="copy-1" />
+      <article className={`${proseClassName} ${proseSectionFlowClassName}`}>
+        <section>
+          <WhereShortcutsComeFrom />
+        </section>
+        <section>
+          <ShortcutNotWorking />
+        </section>
+      </article>
+
+      <section className={styles.nextStep} aria-labelledby="print-title">
+        <h2 id="print-title">Print the shortcuts you use</h2>
+        <p><Link href="/shortcuts-cheatsheet-generator">Make a printable sheet from one or more apps</Link></p>
       </section>
       </PageCanvas>
     </>
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
index abbf3c80..69bb4807 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos/content/intro.mdx
@@ -1 +1 @@
-macOS shortcuts are the layer underneath almost every app. Start with clipboard and window control, then use Mission Control, screenshots, Finder, text movement, and system actions when the desktop gets busy.
+macOS runs every Mac, so these keys work on the desktop and in most apps you open. They cover copy and undo, switching apps and windows, Mission Control, screenshots, Finder, text editing, and system controls such as locking the screen.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
index 51438656..fca1ee9c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vim/content/intro.mdx
@@ -1 +1 @@
-Vim is a language of motions, operators, and modes rather than a list of isolated hotkeys. This reference covers the normal, insert, visual, search, window, and command-line paths that make the official quick reference useful at the keyboard.
+Vim is a keyboard-driven text editor: you switch between modes to move, type, and change text. The commands here move the cursor, edit with operators and registers, search and replace, and handle windows, buffers, and files.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
index d84ffb28..faa50408 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vscode/content/intro.mdx
@@ -1 +1 @@
-VS Code's default shortcuts cover the whole coding loop: edit and navigate code, search and refactor, manage files and panels, run tasks, debug, and use the built-in chat tools. This reference follows Microsoft's current common default list for a standard US keyboard layout.
+Visual Studio Code is Microsoft's free code editor, which you extend for the languages you write. Its default keys here cover multi-cursor editing, jumping to files and symbols, workspace search, split editors, the terminal, and the debugger.

From 1357850b3d784f21c11974420ae0c9c82c5e5646 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:27:20 +0530
Subject: [PATCH 14/25] Give 66 keyboard shortcut pages their own intros (7-Zip
 to FileZilla)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(directories)/keyboard-shortcuts/7-zip/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/ableton-live/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/adobe-after-effects/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/adobe-audition/content/intro.mdx         | 2 +-
 .../keyboard-shortcuts/adobe-illustrator/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/adobe-indesign/content/intro.mdx         | 2 +-
 .../adobe-lightroom-classic/content/intro.mdx                   | 2 +-
 .../keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx    | 2 +-
 .../adobe-substance-3d-painter/content/intro.mdx                | 2 +-
 .../(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/affinity-designer/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/affinity-photo/content/intro.mdx         | 2 +-
 .../(directories)/keyboard-shortcuts/aider/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/airtable/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/alfred/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/amplitude/content/intro.mdx              | 2 +-
 .../keyboard-shortcuts/android-studio/content/intro.mdx         | 2 +-
 .../(directories)/keyboard-shortcuts/anydesk/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/apple-music/content/intro.mdx            | 2 +-
 .../keyboard-shortcuts/apple-notes/content/intro.mdx            | 2 +-
 .../keyboard-shortcuts/arc-browser/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/asana/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/audacity/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/autocad/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/autodesk-maya/content/intro.mdx          | 2 +-
 .../keyboard-shortcuts/autodesk-revit/content/intro.mdx         | 2 +-
 .../(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/azure-devops/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/basecamp/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/bear/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/bitbucket/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/blender/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/bluebeam-revu/content/intro.mdx          | 2 +-
 .../(directories)/keyboard-shortcuts/brave/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/buffer/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/canva/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/chrome/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/cinema-4d/content/intro.mdx              | 2 +-
 .../keyboard-shortcuts/claude-code/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/clickup/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/clip-studio-paint/content/intro.mdx      | 2 +-
 .../(directories)/keyboard-shortcuts/clockify/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/coda/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/codex/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/confluence/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/craft/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/cubase/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/cursor/content/intro.mdx   | 2 +-
 .../davinci-resolve-fusion-page/content/intro.mdx               | 2 +-
 .../keyboard-shortcuts/davinci-resolve/content/intro.mdx        | 2 +-
 .../(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/deepl/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/descript/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/discord/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/eclipse/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/emacs/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/evernote/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/excalidraw/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/fantastical/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/figjam/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/filezilla/content/intro.mdx              | 2 +-
 66 files changed, 66 insertions(+), 66 deletions(-)

diff --git a/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
index 35979aee..33cdb66c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/7-zip/content/intro.mdx
@@ -1 +1 @@
-7-Zip File Manager uses function keys for file work and numeric keypad keys for selection. The official source defines the bindings directly in the File Manager key handler.
+7-Zip is a free archiver for Windows that packs and unpacks ZIP, 7z, and other archive files. In its File Manager, the function keys rename, copy, and move files, the number pad builds a selection, and other keys switch panels and views.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
index 177fbcab..924ff6d3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ableton-live/content/intro.mdx
@@ -1 +1 @@
-Ableton Live's keymap reaches almost every part of a set: views, devices, clips, arrangement editing, tracks, transport, and the browser. The groups follow Live's own manual so a binding stays tied to the view where it works.
+Ableton Live is music software for writing tracks in the studio and playing them on stage, built around Session View and Arrangement View. Its keys switch views, edit clips and devices, draw automation, set the grid and loop, and run tracks, transport, and the browser.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
index 546afb73..d1fa6a0f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-pro/content/intro.mdx
@@ -1 +1 @@
-Acrobat's desktop keymap covers tool selection, PDF navigation, comments, form work, task panes, bookmarks, search, and accessibility. Focus-sensitive and single-key commands stay grouped with the interface state they require.
+Acrobat Pro is the paid edition of Acrobat, for when you need to edit PDFs, build forms, and prepare files for others. These keys pick tools, add comments, author forms and portfolios, move through pages, and reach bookmarks, search, and Read Out Loud.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
index 9518055d..e0903d90 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-acrobat-reader/content/intro.mdx
@@ -1 +1 @@
-Adobe documents one desktop keyboard map for Acrobat Reader and Acrobat. This Reader reference keeps the viewing, commenting, form-entry, search, portfolio, navigation, and accessibility commands, while leaving Acrobat-only authoring tools on the Acrobat Pro page.
+Acrobat Reader is Adobe's free app for opening PDFs, filling in forms, and leaving comments. Use these keys to page through and zoom a document, search it, jump with bookmarks, mark it up, and have it read aloud.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
index 63f540b9..c7f4c8bc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-after-effects/content/intro.mdx
@@ -1 +1 @@
-After Effects assigns shortcuts across the application and inside individual panels. This reference keeps timeline properties, layers, views, tools, keyframes, masks, paint, text, previews, and rendering in separate groups so focus-dependent commands retain their context.
+After Effects is where video editors and motion designers build animated titles, effects, and composites. The keys cover tools and panels, compositions and previews, layers and their properties, keyframes, text, masks and shapes, and rendering.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
index a77a2e6e..20419aed 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-audition/content/intro.mdx
@@ -1 +1 @@
-Audition's published defaults cover transport and zoom, markers, Waveform Editor processing, spectral editing, and Multitrack clip or mixer adjustments. Editor-specific commands stay separate so a binding is not mistaken for an application-wide action.
+Adobe Audition is an audio editor with two workspaces: the Waveform Editor for fixing a single file and the Multitrack Editor for mixing many. Its shortcuts follow that split, after a shared set for playback, zoom, and markers.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
index afd9557b..9a66c9d0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-illustrator/content/intro.mdx
@@ -1 +1 @@
-Illustrator's default keymap covers document work, its dense tool palette, artboards, object selection, drawing, color, type, and effects. These tables keep Adobe's Windows and macOS defaults separate.
+Illustrator is the vector drawing app designers reach for when making logos, icons, and print artwork that scales to any size. Its shortcuts pick tools, manage artboards and the view, select and arrange objects, and handle color, type, and effects.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
index e76d9a3e..ec3a0709 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-indesign/content/intro.mdx
@@ -1 +1 @@
-InDesign's default shortcuts cover layout tools, frames, transformations, typography, tables, document navigation, panels, styles, and production previews. The same key can change meaning when a text insertion point is active, so context stays in each action.
+InDesign lays out books, magazines, and brochures for print or screen, with frames that hold text and images. You can switch selection and drawing tools, transform objects, set and move type, edit tables, change the view, and open production panels from the keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
index 1d6ee3cd..6e7a782e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-lightroom-classic/content/intro.mdx
@@ -1 +1 @@
-Lightroom Classic's keymap follows its module-based workflow. It covers the workspace, catalog and photo management, Library views, ratings, collections, metadata, Develop controls, and local adjustment tools.
+Lightroom Classic keeps your photo library in a catalog on your computer and edits images without touching the originals. Its keys switch modules, sort the Library with ratings, flags, and filters, manage collections and metadata, and apply Develop and local adjustments.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
index 3a64f636..1e38012e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-pro/content/intro.mdx
@@ -1 +1 @@
-Premiere Pro separates application commands from panel-specific commands. This reference keeps file, edit, clip, sequence, marker, graphics, workspace, mixer, effects, utility-panel, Project, Program Monitor, and Timeline bindings in their working context.
+Premiere Pro is Adobe's timeline editor for cutting footage, sound, and graphics into a finished video. Some keys work anywhere, such as for clips, trimming, and markers, while others only work in the Project, Program, or Timeline panel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
index f2b1f1b0..10806b81 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-premiere-rush/content/intro.mdx
@@ -1 +1 @@
-Premiere Rush keeps project, clip, timeline, preview, and media-browser commands in separate contexts. This reference preserves those focus boundaries and the few commands that apply only while editing title text.
+Premiere Rush is a simple video editor for quick clips, and Adobe stopped offering it for download in 2025. If you still have it installed, these keys edit projects and clips, play the timeline, and work in Large Preview and the Media Browser.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
index e2b0bd84..2c5f3620 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-substance-3d-painter/content/intro.mdx
@@ -1 +1 @@
-Substance 3D Painter combines editable application shortcuts with fixed mouse and layer-stack controls. This reference separates tools, viewport navigation, painting gestures, masks, layers, and project commands so each chord keeps its working context.
+Substance 3D Painter lets artists paint textures straight onto 3D models for games, film, and product renders. The keys cover projects, tools and the manipulator, painting with stencils, the camera and viewport, and masks, layers, and animation.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
index 8f883de9..3cf5d50f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/adobe-xd/content/intro.mdx
@@ -1 +1 @@
-Adobe XD assigns commands across design, vector editing, layout, prototype preview, and shared-spec contexts. This reference keeps platform-only exports, window controls, and preview recording explicit instead of inventing Windows equivalents.
+Adobe XD is for designing app and website screens and linking them into clickable prototypes, though Adobe no longer adds features to it. Its shortcuts cover drawing tools and paths, layers and components, alignment and text, preview, specs, and prototype links.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
index dc126465..f854fe67 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-designer/content/intro.mdx
@@ -1 +1 @@
-Affinity Designer 2 assigns tools by Persona and combines them with document, view, text, drawing-modifier, and layer controls. Tool letters can be tapped to keep a tool active or held for temporary use before returning to the previous tool.
+Affinity Designer 2 lets you draw vector shapes and paint pixels in the same document by switching Personas. Tool keys change between the Designer and Pixel Personas, while other keys handle documents, the view, color and brushes, and drawing modifiers.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
index 414f85d2..5da367bb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/affinity-photo/content/intro.mdx
@@ -1 +1 @@
-Affinity Photo 2 changes tool letters with the active Persona while keeping common document, view, brush, and layer commands available throughout the desktop app. This reference labels each Persona so overlapping keys remain understandable.
+Affinity Photo 2 is a photo editor for retouching, compositing, and developing RAW files, split into Personas for each job. Its keys cover documents and layers, Photo Persona tools, the Liquify and Develop Personas, brush and color controls, and painting modifiers.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
index abe0ccae..8dbd3a5f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/aider/content/intro.mdx
@@ -1 +1 @@
-Aider's interactive terminal prompt supports editing, history navigation, interruption, multiline input, and external-editor handoff. Its default Emacs bindings and optional vi command mode are documented separately so the active input mode is always clear.
+Aider is an AI pair programmer that runs in your terminal and edits the code in your git repo. Its prompt keys stop a reply and add multiline input, with Emacs-style editing by default and a vi mode if you start Aider with --vim.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
index 51a664bd..41b9513c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/airtable/content/intro.mdx
@@ -1 +1 @@
-Airtable's documented shortcuts cover base navigation, view controls, cell editing, record movement, and the Gallery, Kanban, Gantt, and expanded-record surfaces. The reference keeps context-specific commands with the view where Airtable says they work.
+Airtable looks like a spreadsheet but works like a database, so teams track projects, inventory, or content in linked tables. These keys move around bases and views, select and edit grid cells, work in Gallery, Kanban, and Gantt views, and open expanded records.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
index c91ea8fd..07689e44 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/alfred/content/intro.mdx
@@ -1 +1 @@
-Alfred's default hotkeys cover launching and dismissing the search window, acting on results, browsing files, managing the File Buffer, using Clipboard History, and controlling the Music Mini Player. Powerpack requirements are stated where they apply.
+Alfred is a Mac launcher you open with a hotkey to start apps, find files, and run workflows. Its default keys run the search window and results, browse files and the File Buffer, open Clipboard History and snippets, and control the Music Mini Player.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
index 5cf099c1..57b4dac0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/amplitude/content/intro.mdx
@@ -1 +1 @@
-Amplitude's chart-creation shortcuts open event and property controls, refresh or save analysis, copy and organize charts, and operate hovered selector rows. Every binding here stays within the chart builder context documented by Amplitude.
+Amplitude is product analytics software that charts how people use your app or website. Its shortcuts work while you build a chart: open the event and property pickers, then refresh, save, copy, or file the result.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
index c0f44bc6..5837891b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/android-studio/content/intro.mdx
@@ -1 +1 @@
-Android Studio's default keymap covers tool windows, search and navigation, visual layout tools, code generation and editing, builds, debugging, refactoring, and version control. Windows and Linux share one documented column, while macOS has its own combinations.
+Android Studio is Google's IDE for building Android apps, based on IntelliJ IDEA. The keys open tool windows, find and navigate code, generate and refactor it, build, run, and debug, and work with version control and the layout editors.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
index 381ba1bd..37d89392 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/anydesk/content/intro.mdx
@@ -1 +1 @@
-AnyDesk reserves one Windows hotkey family for controlling an active remote session. Every command begins with Control+Alt+Shift, which keeps local session controls distinct from keystrokes sent to the remote device.
+AnyDesk lets you see and control another computer over the internet, whether you're helping someone or reaching your own machine. While a session is open, these keys move between remote displays and tabs, control the session, and change how the screen fits.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
index 96a5fe1d..9b2303c5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-music/content/intro.mdx
@@ -1 +1 @@
-Apple Music uses different desktop keymaps on Windows and macOS. This reference keeps platform-only playlist, library, window, and access-key commands visible instead of applying a blanket Control-to-Command conversion.
+Apple Music is Apple's app for streaming music and playing your own library, on a Mac or a Windows PC. Shortcuts handle playback, playlists and the library, and windows and views, and on Windows you also get Alt access keys for moving around the app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
index aa803591..bb0770b8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/apple-notes/content/intro.mdx
@@ -1 +1 @@
-Notes on Mac provides shortcuts for the main window, note formatting, lists, shared-note navigation, and table editing. Table keys depend on whether the insertion point is inside a cell, so those commands remain in their own group.
+Notes is the note app that comes with every Mac and syncs with your iPhone through iCloud. Its keys create notes and folders, add attachments and formatting, manage lists and checklists, and move around tables.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
index 0092dc2c..e2089009 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/arc-browser/content/intro.mdx
@@ -1 +1 @@
-Arc organizes browsing around tabs, Spaces, a sidebar, and Split View. This reference preserves the different Windows and macOS navigation chords, including macOS-only Little Arc and alternate history keys.
+Arc is a web browser from The Browser Company that keeps your tabs in a sidebar and groups them into Spaces. These keys open and close tabs and windows, jump between tabs and Spaces, set up Split View, and handle page zoom and history.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
index bb502422..9dd4f05e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/asana/content/intro.mdx
@@ -1 +1 @@
-Asana combines Inbox keys, task actions, Tab-key chords, selection controls, and native desktop-window shortcuts. The list-view field-navigation command is different: Asana explicitly documents it as two Right Arrow presses.
+Asana is a work management app where teams plan projects and assign tasks. From the keyboard you can triage your Inbox, edit task details, add tasks and sections to lists, move around the app, select tasks, and manage windows and tabs in the desktop app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
index 1431c9d5..6708a994 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/audacity/content/intro.mdx
@@ -1 +1 @@
-Audacity's Standard shortcut set covers projects, audio editing, selections, timeline views, playback, recording, looping, track mute controls, and effect reuse. The extended Full set remains separate because it is not enabled by default.
+Audacity is a free, open source audio editor and recorder used for podcasts, voiceovers, and music. Its default keys open and save projects, edit audio and clips, set selections and labels, zoom the timeline, and control playback, recording, and looping.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
index 521c4c7e..8c772476 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autocad/content/intro.mdx
@@ -1 +1 @@
-AutoCAD's default CUIx keymap controls drawings, palettes, selection and editing, drafting aids, viewports, layouts, and 3D subobject filters. This record follows the Windows shortcut table published for AutoCAD 2026.
+AutoCAD is Autodesk's drafting software for 2D drawings and 3D models in architecture, engineering, and manufacturing. These Windows keys open drawings and palettes, select and edit objects, toggle drafting aids like Snap and OSNAP, and switch layouts and viewports.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
index a28464b9..88c47f22 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-maya/content/intro.mdx
@@ -1 +1 @@
-Maya's default hotkeys cover transform tools, scene files, object display, animation playback, snapping, component selection, editing, panel views, and polygon modeling. Mouse-only camera and marking-menu gestures are kept out of the keyboard tables.
+Maya is 3D software for modeling, animating, and rendering characters and scenes for film and games. Its hotkeys pick transform tools, manage scene files and display, play and key animation, snap and select components, and switch panel views for polygon modeling.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
index a0d1091f..d965c97b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/autodesk-revit/content/intro.mdx
@@ -1 +1 @@
-Revit uses short letter sequences for modeling, annotation, view, and systems commands. The tables retain Autodesk's alternative sequences and reserved Ctrl combinations where the 2026 default list publishes them.
+Revit is building design software where walls, doors, and ducts are real objects in one shared model. You type short letter sequences to place architecture, structure, and MEP elements, modify geometry, add annotations, and control views and windows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
index 20827467..0138eb0c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/axure-rp/content/intro.mdx
@@ -1 +1 @@
-Axure RP 11's keymap covers files, canvas movement, widget insertion and editing, vector operations, sitemap management, prototype tools, panes, preview, and publishing. Single-key canvas commands remain visible as documented alternatives.
+Axure RP builds wireframes and prototypes that behave like the real product, with logic, conditions, and live data. Its keys handle files and text, canvas movement and guides, inserting and arranging widgets, vector operations, the sitemap, preview, and publishing.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
index 91b574f0..a2bc8875 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/azure-devops/content/intro.mdx
@@ -1 +1 @@
-Azure DevOps web shortcuts change with the active service and page. Sequential navigation keys work only when focus is outside an input control, so this reference separates global navigation, Repos, work items, Boards, Test Plans, and Wiki commands.
+Azure DevOps is Microsoft's web platform for code, boards, pipelines, and test plans. Its shortcuts change with the part you're in: global navigation, Repos, work items and the rich-text editor, Boards and backlogs, queries, Test Plans, and Wiki.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
index 22ffbced..11fe0dd5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/balsamiq-wireframes/content/intro.mdx
@@ -1 +1 @@
-Balsamiq Wireframes combines direct-selection keys, drawing letters, and context-sensitive editing commands. Browser and operating-system shortcuts can take precedence in the web editor, so this reference keeps Balsamiq's published platform limits visible.
+Balsamiq Wireframes sketches screens in a deliberately rough, hand-drawn style so feedback stays on layout, not looks. These keys select, move, and resize controls, arrange and group them, edit text and icons, manage projects and boards, and run presentation mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
index c2cd76af..f8086ff8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/basecamp/content/intro.mdx
@@ -1 +1 @@
-Basecamp 5 uses Shift-letter navigation throughout the web app, plus a small set of project and page commands. Hold Shift outside a text field to reveal available keycaps; inside a text field, press Shift twice to activate hotkey mode.
+Basecamp keeps a team's projects, to-dos, messages, and chat in one place. Hold Shift to see its keys, which jump around the app through the Jump menu, act on the current project or page, and search one project or all of them.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
index 677375e8..2849a9e0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bear/content/intro.mdx
@@ -1 +1 @@
-Bear for Mac has native commands for Markdown-style formatting, note structure, tables, navigation, and windows. Many bindings depend on whether focus is in the editor, note list, sidebar, or a table cell, so they are grouped by working context.
+Bear is a Markdown notes app for Mac that sorts your notes with tags instead of folders. Its keys format text, add tables and to-dos, move lines and lists, insert dates, switch notes, and manage files and windows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
index c69a5341..e0bb30a3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bitbucket/content/intro.mdx
@@ -1 +1 @@
-Bitbucket Cloud's documented keyboard shortcuts cover site search, navigation panels, repository file filtering, and the core pull-request review tabs and actions.
+Bitbucket is Atlassian's git hosting service, where teams store code and review pull requests. Its web keys search the site and open the navigation, filter files and search code in a repository, and approve or move through a pull request.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
index 8d80464e..b10ba90f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/blender/content/intro.mdx
@@ -1 +1 @@
-Blender's common default keymap covers file work, properties, selections, editor panels, 3D Viewport modes, animation keys, and Python data-path tools.
+Blender is free, open source 3D software for modeling, animation, rendering, and video. Its common keys copy and reset values under the pointer, handle files and undo, select and hide objects, switch 3D Viewport modes, insert keyframes and drivers, and copy Python paths.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
index 6ec110b6..35a10052 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/bluebeam-revu/content/intro.mdx
@@ -1 +1 @@
-Bluebeam Revu's published Windows shortcuts cover markup creation and arrangement, measurement, PDF viewing, editing, page operations, panels, and document navigation.
+Bluebeam Revu is a PDF app for construction and engineering teams who mark up and measure drawings. On Windows, its keys pick markup and measurement tools, change PDF view and layout, edit and select, work with pages, and open panels.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
index f3b61e46..d23e0903 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/brave/content/intro.mdx
@@ -1 +1 @@
-Brave keeps the useful browser controls close to the keyboard: move across tabs, jump to the address bar, search a page, or open browser tools without leaving the current window.
+Brave is a web browser built on Chromium that blocks ads and trackers by default. Its shortcuts reopen a closed tab, search from the address bar, open the Brave menu, bookmarks, and history, and go back or reload a page.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
index 702e153b..369c2923 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/buffer/content/intro.mdx
@@ -1 +1 @@
-Buffer's web shortcuts open its reference and command bar, jump among product areas, start new work, schedule posts, build threads, and navigate Community conversations.
+Buffer schedules posts across your social accounts and gathers replies in one inbox. In the web app, its keys open the command bar, jump between Publishing, Insights, and Community, start posts and ideas, schedule from the composer, and move through comments.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
index 3b80b5b0..4809ba49 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/canva/content/intro.mdx
@@ -1 +1 @@
-Canva's editor uses shortcuts for creating elements, arranging and resizing selections, formatting text, changing page views, and handling comments. Desktop-app window and tab commands are separate from shortcuts that act inside a design.
+Canva is an online design tool for social posts, slides, videos, and print, built on drag and drop templates. The keys edit and arrange elements, format text, play video and zoom, add comments, and run windows and tabs in the Mac desktop app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
index 299c5227..da9d9785 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/chrome/content/intro.mdx
@@ -1 +1 @@
-Chrome's official list covers the browser habits that happen dozens of times a day: manage tabs, move through history, search the current page, reach browser tools, and work in the address bar without leaving the keyboard.
+Chrome is Google's web browser, which syncs your bookmarks and passwords through your Google account. Its shortcuts manage tabs and windows, go back and forward, work in the address bar, find text and open browser tools, and reach the menu and accessibility options.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
index 08d3fba4..51bc4445 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cinema-4d/content/intro.mdx
@@ -1 +1 @@
-Cinema 4D's default shortcuts cover animation, project files, managers, the viewport, display modes, modeling and selection tools, rendering, and sculpt controls.
+Cinema 4D is Maxon's 3D app for motion graphics, product shots, and animated scenes. Its shortcuts run the Timeline and animation, open managers and editors, move the viewport camera, model meshes, select and render, and modify sculpt brushes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
index be0d1dd9..b41c8484 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/claude-code/content/intro.mdx
@@ -1 +1 @@
-Claude Code spends most of its time waiting for a decision, running a tool, or holding a prompt. These official interactive-mode shortcuts cover interrupts, rewinds, mode changes, multiline input, terminal-style editing, and transcript navigation.
+Claude Code is Anthropic's coding agent that reads your project, edits files, and runs commands from the terminal. These keys interrupt or rewind a turn, switch permission modes and models, edit and recall prompts, add new lines, and open the transcript.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
index ff6a1fdb..8a980da9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clickup/content/intro.mdx
@@ -1 +1 @@
-ClickUp's official shortcut set covers workspace navigation, task creation, text editing, Chat, Inbox triage, views, SyncUps, and desktop-wide capture commands.
+ClickUp combines tasks, docs, chat, and goals in one workspace for teams. Its keys create tasks from anywhere, format text in the editor, fill task fields, handle Chat and Inbox, switch views, and run SyncUps, once you turn shortcuts on.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
index c671befa..42568a6e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clip-studio-paint/content/intro.mdx
@@ -1 +1 @@
-Clip Studio Paint assigns defaults to file, edit, layer, selection, canvas, and ruler commands. The defaults can be customized, so this reference describes the initial shortcut set rather than a user's edited configuration.
+Clip Studio Paint is a drawing and painting app built for comics, manga, and illustration. Its default keys handle files, edits and transforms, layers, selections, rotating and zooming the canvas, rulers, and showing or hiding palettes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
index e4f8b43d..7e0c675e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/clockify/content/intro.mdx
@@ -1 +1 @@
-Clockify's web Time Tracker uses single keys when no field is being edited. The native Mac app has a separate set of Command shortcuts that work while its window has focus.
+Clockify is a time tracker for logging hours against projects, clients, and tasks. The web Time Tracker uses single keys to start, stop, and continue timers, and the Mac app has its own Command shortcuts for timers and entries.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
index 9f8f206a..5b141569 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/coda/content/intro.mdx
@@ -1 +1 @@
-Coda combines document navigation, rich-text formatting, insert triggers, and table movement. Several keys change behavior with focus, so page, paragraph, and table commands are separated here.
+Coda mixes documents, tables, and formulas so a team's doc can work like an app. The keys move around pages, format text, set headings and lists, insert references and formulas, and select and move through table rows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
index 919a8b73..e8cc79f9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/codex/content/intro.mdx
@@ -1 +1 @@
-Codex CLI gives you a terminal UI around a running coding task. The current keymap covers steering, prompt editing, transcript navigation, reasoning effort, approvals, and the list pickers that appear around a session.
+Codex CLI is OpenAI's coding agent for the terminal, and it can work while you keep typing. Its keys queue or interrupt messages during a task, edit your prompt, change reasoning effort and modes, and scroll the transcript and pickers.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
index 2fd38ef2..8128f135 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/confluence/content/intro.mdx
@@ -1 +1 @@
-Confluence Cloud has separate command sets for site navigation, pages and live docs, editor formatting, tables, Markdown input, and whiteboards. General shortcuts can be disabled in the in-product shortcut dialog.
+Confluence is Atlassian's team wiki for pages, live docs, and whiteboards. Its shortcuts cover site actions, creating and editing pages, formatting in the editor, working with tables, Markdown and autocomplete triggers, and whiteboard tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
index 37956ec2..fd1ba627 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/craft/content/intro.mdx
@@ -1 +1 @@
-Craft separates document navigation, task entry, block editing, formatting, organization, and tabs. Several commands are available only in the Mac app, so those bindings are kept platform-specific.
+Craft is a notes and documents app where every paragraph is a block you can move, nest, or turn into a page. The keys search and navigate, create documents and tasks, insert and format blocks, reorder blocks and pages, and switch tabs and windows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
index fde36571..623f614d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cubase/content/intro.mdx
@@ -1 +1 @@
-Cubase Pro's current default key command reference covers project files, editing, transport, windows, and media. The platform-neutral commands are paired with the documented Windows and macOS modifier conventions.
+Cubase is Steinberg's music production app for recording, editing, and mixing songs and scores. Its key commands open and save projects, edit events, run the transport and locators, and reach tracks and devices.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
index badb4a7e..c84f4fc0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/cursor/content/intro.mdx
@@ -1 +1 @@
-Cursor puts the editor and an AI workspace side by side. Its official reference covers chat, inline edit, code context, autocomplete, terminal prompts, model controls, and the familiar editor navigation keys around them.
+Cursor is a code editor built around AI chat and agents, forked from VS Code. Its shortcuts toggle panels, send and queue chat messages, open inline edit, add code to context, accept suggestions, and turn plain words into terminal commands.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
index 7e9aa1d6..abccb9a7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve-fusion-page/content/intro.mdx
@@ -1 +1 @@
-The Fusion page uses a small set of transport and playhead commands for moving through a composition. The focused Fusion timeline or viewer determines where a command applies.
+The Fusion page is DaVinci Resolve's node-based workspace for visual effects and motion graphics. Its keys play your composition forward or back, step a frame at a time, and jump to the render range In and Out points.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
index 4fe7991b..e2fd7336 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/davinci-resolve/content/intro.mdx
@@ -1 +1 @@
-These DaVinci Resolve commands cover playback, timeline navigation, timeline zoom, and the blade and clip-enable tools. Focus matters because Resolve has page- and panel-specific commands.
+DaVinci Resolve is Blackmagic Design's video editor, with color grading, effects, and audio built in. The keys play, stop, and step through frames, then zoom the timeline, cut at the playhead, and turn clips on or off.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
index 0e69119e..59ae6cdf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/dbeaver/content/intro.mdx
@@ -1 +1 @@
-DBeaver groups shortcuts by connections, result sets, editors, search, windows, files, and debugging. Focused view and the active key scheme affect which command receives a key.
+DBeaver is a free database client that connects to PostgreSQL, MySQL, SQLite, and many other databases. Its keys open connections and SQL scripts, edit result sets, work in data and text editors, search and move between windows, and run or debug.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
index bf92bb6e..eb10282e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/deepl/content/intro.mdx
@@ -1 +1 @@
-DeepL's desktop shortcuts send selected text from any application to DeepL for translation or writing improvement. Translation uses a repeated C sequence; the keys are not pressed as one simultaneous chord.
+DeepL is a translation and writing app, and its desktop version works with text you select in any other app. The shortcuts translate or improve that selection, plus a key to quit DeepL on a Mac.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
index 55f4ddba..a366cd72 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/descript/content/intro.mdx
@@ -1 +1 @@
-Descript's documented shortcuts cover tool selection, the action bar, transcript correction, timeline visibility, and scene creation. The editor's in-app shortcut panel contains additional commands.
+Descript edits audio and video through a transcript, so cutting words in the text cuts them from the recording. Its keys switch editing tools, open the action bar, correct the script and split scenes, and show or hide the timeline.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
index 1cc67e4f..df4d1860 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/discord/content/intro.mdx
@@ -1 +1 @@
-Discord's browser and desktop shortcuts cover settings, search, messages, channels, servers, voice controls, and keyboard navigation. Custom keybinds are desktop-only and are not included as defaults.
+Discord is a chat app for communities, with text channels, voice calls, and servers. Its shortcuts open settings, search channels and pick emoji or GIFs, edit messages, mute or deafen in voice, switch servers, and move around by keyboard.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
index 50b9747b..6bf019c4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/draw-io-diagrams-net/content/intro.mdx
@@ -1 +1 @@
-The diagrams.net editor has keyboard commands for document work, canvas views, selection, shapes, labels, styling, and tables, plus modifier-and-pointer gestures for precise diagram construction. Focus and the selected object determine which command runs.
+draw.io, also called diagrams.net, is a free diagram editor for flowcharts, network maps, and org charts. These keys save and undo, move the canvas, select and arrange shapes, edit labels and styles, connect library shapes, and change table shapes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
index fe90257f..66ce2344 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/eclipse/content/intro.mdx
@@ -1 +1 @@
-Eclipse shortcuts cover quick access, code navigation, editing, search, debugging, and workbench navigation. The active context, installed plug-ins, scheme, locale, and operating system can change the active binding.
+Eclipse is an open source IDE best known for Java, extended with plug-ins for other languages. Its keys open Quick Access, find and replace, edit lines, build, run, and debug, and move between editors, views, files, and projects.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
index b1e2fca2..07cdcc5e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/emacs/content/intro.mdx
@@ -1 +1 @@
-GNU Emacs uses Control and Meta key notation for movement, editing, files, buffers, windows, search, help, and keyboard macros. Prefix commands are shown in press order rather than as one chord.
+Emacs is a programmable text editor that's been around since the 1970s, driven by Control and Meta keys. These commands move the cursor, cut and paste text (kill and yank), visit files, switch buffers and windows, search and replace, get help, and record keyboard macros.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
index 09f3763d..4f7e1381 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/evernote/content/intro.mdx
@@ -1 +1 @@
-Evernote publishes separate Mac and Windows shortcuts for global capture, notes, navigation, views, editing, formatting, and its AI assistant.
+Evernote stores notes, web clips, tasks, and files in notebooks you can search later. Its keys capture notes from anywhere, create and move notes, navigate and change the view, edit and format text, and open the AI assistant.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
index 4573b095..d623cf3a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/excalidraw/content/intro.mdx
@@ -1 +1 @@
-Excalidraw's official shortcut map covers file actions, clipboard and layer operations, canvas modes, zoom, selection, and tool locking. Most commands use Ctrl on Windows and Linux or Command on macOS.
+Excalidraw is a free, open source whiteboard in your browser for quick diagrams and sketches you can share. Its keys save and export drawings, copy and paste shapes and styles, arrange layers and groups, change canvas modes and zoom, and pick tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
index 8d17d676..bbd97111 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fantastical/content/intro.mdx
@@ -1 +1 @@
-Fantastical's Mac and Windows shortcut pages cover search, event and task creation, date navigation, item movement, and app controls.
+Fantastical is a calendar and task app that creates events from plain sentences like "lunch with Sam Friday at noon". Its keys search, add events and tasks, jump between dates, and nudge an item earlier or later by a day or fifteen minutes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
index 9a06796d..6c5d8e0b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/figjam/content/intro.mdx
@@ -1 +1 @@
-FigJam's official help pages document shortcuts for selection and ordering, text, connectors, drawing, comments, tables, and board tools.
+FigJam is Figma's online whiteboard for brainstorms, retros, and diagrams with your team. Its keys select and order objects, format text, add sticky notes, sections, and connectors, and create and copy tables.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
index f5664d55..0dc98d51 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/filezilla/content/intro.mdx
@@ -1 +1 @@
-FileZilla's official wiki lists shortcuts for panes, transfers, bookmarks, searches, queues, tabs, and local or remote file navigation.
+FileZilla is a free FTP and SFTP client for moving files between your computer and a server. Its keys rename and refresh files, switch panes, transfer items and disconnect, and manage bookmarks, tabs, and directory comparison.

From 3b5c0b53b49eb01ef16e7d55ebbe120161d32a30 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:27:56 +0530
Subject: [PATCH 15/25] Give 76 keyboard shortcut pages their own intros
 (Numbers to Zulip)

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(directories)/keyboard-shortcuts/numbers/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/obs-studio/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/obsidian/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/omnifocus/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/opencode/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/opera/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/oracle-virtualbox/content/intro.mdx      | 2 +-
 .../(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/pages/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/paint-net/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/penpot/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/pi-coding-agent/content/intro.mdx        | 2 +-
 .../(directories)/keyboard-shortcuts/power-bi/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/powershell/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/presonus-studio-one/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/prezi/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/pro-tools/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/protopie/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/pycharm/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/quickbooks-online/content/intro.mdx      | 2 +-
 .../(directories)/keyboard-shortcuts/raycast/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/reddit/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/riverside-fm/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/rocket-chat/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/rstudio/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/safari/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/salesforce/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/scrivener/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/signal/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/simplenote/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/sketch/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/sketchup/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/slack/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/smartsheet/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/solidworks/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/spark-mail/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/spotify/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/squarespace/content/intro.mdx            | 2 +-
 .../keyboard-shortcuts/sublime-text/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/superhuman/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/tableau/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/tableplus/content/intro.mdx              | 2 +-
 .../keyboard-shortcuts/tally-forms/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/telegram/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/things-3/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/tmux/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/todoist/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/typora/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/ulysses/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/visual-studio/content/intro.mdx          | 2 +-
 .../keyboard-shortcuts/vmware-workstation/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/warp/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/webflow/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/webstorm/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/whimsical/content/intro.mdx              | 2 +-
 .../keyboard-shortcuts/windows-file-explorer/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/windows-snipping-tool/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/windows-terminal/content/intro.mdx       | 2 +-
 .../(directories)/keyboard-shortcuts/windows/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/winmerge/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/wireshark/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/wix/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/wondershare-filmora/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/wordpress-admin/content/intro.mdx        | 2 +-
 .../keyboard-shortcuts/wps-office/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/wrike/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/x-twitter/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/youtrack/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/youtube/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/zbrush/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/zed/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/zen-browser/content/intro.mdx            | 2 +-
 .../(directories)/keyboard-shortcuts/zendesk/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/zeplin/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/zoom/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/zulip/content/intro.mdx    | 2 +-
 76 files changed, 76 insertions(+), 76 deletions(-)

diff --git a/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
index e51fbd33..a8922351 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/numbers/content/intro.mdx
@@ -1 +1 @@
-Numbers on Mac uses familiar editing keys alongside spreadsheet-specific commands for sheets, tables, formulas, objects, and comments. This reference keeps the app-level commands separate from cell navigation and text formatting so the same key is easier to locate.
+Numbers is Apple's spreadsheet app, where tables and charts sit on a free canvas instead of one big grid. The keys here handle files and sheets, moving through cells, typing text and formulas, and arranging objects and comments.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
index 40a66da4..96f9ca42 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/obs-studio/content/intro.mdx
@@ -1 +1 @@
-OBS Studio's documented defaults focus on editing sources and moving around the preview. This reference keeps the general commands, source-list actions, transforms, and preview controls separate so a key is read in the right OBS context.
+OBS Studio is free, open source software for recording your screen and streaming live. Its default keys let you arrange sources in the list, then nudge, crop, and fit them in the preview window, plus undo and redo.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
index f6648893..6184578b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/obsidian/content/intro.mdx
@@ -1 +1 @@
-Obsidian separates system editing shortcuts from customizable command hotkeys. This reference covers the documented editing and navigation defaults across Windows, Linux, and macOS, while leaving plugin and user-assigned commands to Obsidian's Hotkeys settings.
+Obsidian is a note-taking app that keeps your notes as plain Markdown files on your own computer. These default keys cover everyday editing, moving the cursor by word and line, and selecting text as you write.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
index c083ae63..59132b25 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/omnifocus/content/intro.mdx
@@ -1 +1 @@
-OmniFocus on Mac provides shortcuts for quick entry, perspectives, item editing, review, notes, and window management. This reference uses the official OmniFocus 4 command list and leaves iPad, iPhone, and web-only bindings out of the macOS page.
+OmniFocus is a task manager for Mac built around projects, tags, and a weekly review. Its shortcuts add actions with Quick Entry, jump between perspectives, edit the outline, and manage windows and sync.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
index 00ab33e1..9eab548f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/opencode/content/intro.mdx
@@ -1 +1 @@
-OpenCode exposes a large, remappable TUI keymap. This page covers the current default leader chords, session and model controls, message navigation, prompt editing, dialogs, and the desktop prompt layer.
+OpenCode is an open source AI coding agent that runs in your terminal. Most of its keys start with a leader key, and they cover sessions, switching models and agents, scrolling through replies, editing the prompt, and dialogs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
index 724023e7..f0549e2a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/opera/content/intro.mdx
@@ -1 +1 @@
-Opera's documented browser shortcuts cover commands, page search, tabs, navigation, and display controls. Opera also lets users customize most browser shortcuts in Settings, so this page keeps the published defaults and calls out the configurable layer.
+Opera is a Chromium-based web browser with a sidebar and built-in extras like a free VPN. These keys open browser pages such as History and Downloads, find text on a page, and move back, forward, and through page elements.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
index 1c65ada6..96734cf0 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/oracle-virtualbox/content/intro.mdx
@@ -1 +1 @@
-VirtualBox reserves a host key to release keyboard and mouse ownership from a virtual machine and to send special combinations to the guest. This reference keeps host-key actions separate from guest shortcuts, because the guest operating system still owns its own normal keymap.
+VirtualBox runs other operating systems as virtual machines on your computer. Its host key frees your keyboard and mouse from a guest, sends combinations like Ctrl+Alt+Delete into it, and decides which side gets keys like Alt+Tab.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
index 9eee7a78..b8855ecd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/otter-ai/content/intro.mdx
@@ -1 +1 @@
-Otter's published shortcuts cover search, audio playback, and transcript editing. The key map stays focused on the commands Otter documents for its web workspace and leaves account or browser shortcuts out.
+Otter.ai records meetings and turns speech into a searchable transcript. A handful of keys help you check that transcript: search, play and skip the audio, change speed, split or join paragraphs, and open the shortcut panel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
index 70c67756..cc126431 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pages/content/intro.mdx
@@ -1 +1 @@
-Pages on Mac combines document editing with page-layout objects, tables, comments, and style controls. This reference groups the commands people use while writing, searching, formatting, and arranging a document, with Apple-specific object and table actions kept visible.
+Pages comes free with your Mac and handles both plain documents and page layouts like flyers and newsletters. Use these keys for files and windows, text formatting and find, placing and grouping objects, and adding or removing table rows and columns.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
index 8c5c8aec..5f6865bb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/paint-net/content/intro.mdx
@@ -1 +1 @@
-Paint.NET combines canvas navigation with image zoom, selection controls, tool windows, and keyboard access to its drawing tools. Its official list also documents repeated key presses for tool groups, so those bindings stay explicit instead of being collapsed into one generic tool shortcut.
+Paint.NET is a free image editor for Windows, simpler than Photoshop but with layers and effects. These keys pan and zoom the image, show or hide its tool windows, and handle selections, copy, paste, and undo.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
index 7035d39b..6039c79c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/penpot/content/intro.mdx
@@ -1 +1 @@
-Penpot's workspace shortcuts cover alignment, object editing, zoom, layers, selection, and prototyping. This reference keeps Windows and Linux together where the official table does and shows macOS symbols as their equivalent key combinations.
+Penpot is an open source design and prototyping tool that runs in your browser. Its shortcuts align objects, copy and duplicate them, group and layer them, and zoom or pick tools in the workspace.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
index c8283ba1..ac6977a8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pi-coding-agent/content/intro.mdx
@@ -1 +1 @@
-Pi's keyboard model separates the prompt you are writing from the agent work already running. This reference covers the current editor, queue, session, model, thinking, transcript, tree, and application defaults.
+Pi keeps a coding agent in your terminal and lets you send new instructions while a run is still going. Its keys control the app, switch models and thinking levels, edit and queue prompts, and browse the transcript and session tree.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
index 786c7f16..0cbbc108 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/power-bi/content/intro.mdx
@@ -1 +1 @@
-Power BI Desktop documents shortcuts for report visuals, tables, matrices, panes, canvas zoom, slicers, selection, DAX, data entry, and model relationships. This page focuses on the Windows desktop report experience and keeps context-specific keys in the group where they apply.
+Power BI Desktop is Microsoft's Windows app for building data reports and dashboards. Its shortcuts help with report commands, moving between visuals on the canvas, reading tables and matrices, and editing formulas and the data model.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
index b4de350b..3ee11be6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/powershell/content/intro.mdx
@@ -1 +1 @@
-PowerShell's interactive keyboard layer comes from PSReadLine. This reference covers its Windows, Emacs, and Vi modes across cursor movement, line editing, history, completion, selection, and multiline input.
+PowerShell is Microsoft's command shell and scripting language, and its line editing comes from a module called PSReadLine. These keys move the cursor, edit the line, search history, complete commands, and select text, including Vi mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
index 02e1b878..76ab0120 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/presonus-studio-one/content/intro.mdx
@@ -1 +1 @@
-Studio One's official key command sheet covers transport, editing, events, tracks, the browser, console views, markers, zoom, and file commands. This reference keeps the PC commands and their documented Mac modifier substitutions together.
+Studio One is PreSonus' music app for taking a song from the first recording to a finished master. The key commands here run the transport, edit events and audio, manage tracks and markers, and open the browser, console, and other views.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
index f7a209fe..c570381d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/prezi/content/intro.mdx
@@ -1 +1 @@
-Prezi Present uses familiar editing commands alongside canvas navigation and object transformation controls. This reference covers the first-party shortcuts for selecting, arranging, moving through a presentation, and changing the canvas view.
+Prezi Present builds presentations on one big canvas you zoom around, instead of a stack of slides. Its keys handle copying and grouping, panning and zooming the canvas, and resizing or snapping objects as you drag them.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
index b4745093..9e25961c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pro-tools/content/intro.mdx
@@ -1 +1 @@
-Avid's Pro Tools Shortcuts Guide covers search, shortcut focus, playback, recording, edit tools, selection, nudging, clip gain, MIDI editing, and core menus. This reference keeps the Mac and Windows columns explicit and preserves feature-scope notes.
+Pro Tools is Avid's audio workstation for recording, editing, and mixing in music and post-production. Its shortcuts cover playback and recording, the edit modes and tools, selecting and nudging clips, MIDI and clip gain, and the menus.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
index 140ebf49..110f1bde 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/protopie/content/intro.mdx
@@ -1 +1 @@
-ProtoPie's official shortcut list covers Studio files, editing tools, objects, arrangement, interactions, canvas navigation, panels, and preview windows. The record keeps the Windows and macOS columns side by side and excludes pointer-only gestures.
+ProtoPie turns designs into interactive prototypes that behave like real apps, without writing code. Its shortcuts open and save pies, pick drawing tools, arrange layers, adjust interaction timing, and show or hide panels.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
index dc68d349..db45a478 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/pycharm/content/intro.mdx
@@ -1 +1 @@
-PyCharm's keymap reference groups the actions developers reach for while searching, editing, navigating, building, and debugging Python projects. This page keeps those actions together and shows the Windows, Linux, and macOS modifier differences.
+PyCharm is JetBrains' editor for Python, with code checks, a debugger, and project tools built in. Its default keymap covers Search Everywhere and Find Usages, basic editing, running and debugging, and moving around the editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
index 147921a8..9598b490 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/quickbooks-online/content/intro.mdx
@@ -1 +1 @@
-QuickBooks Online documents shortcuts for date fields, forms, dropdowns, transactions, registers, payroll, and the browser window. This reference keeps browser-specific save variants as alternatives instead of treating them as universal commands.
+QuickBooks Online is Intuit's accounting software for small businesses, used in a web browser. Its shortcuts move through forms and dropdowns, jump dates in date fields, save transactions, and work in registers and payroll.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
index 7a7773a1..e7c93009 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/raycast/content/intro.mdx
@@ -1 +1 @@
-Raycast is a keyboard-first launcher with search, action panels, forms, AI chat, and configurable hotkeys. This reference separates built-in commands from settings and text editing so configurable global shortcuts are not mistaken for fixed app bindings.
+Raycast is a launcher you open with one hotkey to search files, run commands, and use extensions. These keys open Raycast, move through results and the Action Panel, act on items, and drive AI Chat.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
index 16e585f2..1a1e39e9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/reddit/content/intro.mdx
@@ -1 +1 @@
-Reddit's current desktop web hotkeys move through posts and comments, perform voting and saving actions, and control media playback. This page keeps navigation, actions, and media separate so the single-letter bindings are easy to scan.
+Reddit is where people talk in topic communities through posts and comment threads. On the desktop site, single-letter keys move between posts and comments, vote, reply, and save, and other keys control video playback.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
index 07ad95ac..2b399333 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/riverside-fm/content/intro.mdx
@@ -1 +1 @@
-Riverside's editor shortcuts cover transcript selection, timeline playback, recording splits, comments, scenes, and clipboard actions. This reference keeps the editor scope clear because the separate Studio shortcut list is a different workflow.
+Riverside is a remote studio for recording podcasts and video interviews, with an editor that works from the transcript. Its editor keys play and scroll, select and search transcript text, split and correct recordings, and add scenes or comments.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
index 7c7e8aeb..72839182 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/rocket-chat/content/intro.mdx
@@ -1 +1 @@
-Rocket.Chat's documented defaults cover global search, read-state management, and the message composer. This reference keeps the composer-specific keys separate because they only apply while the empty or active composer has focus.
+Rocket.Chat is open source team chat that companies can host on their own servers. Its few documented keys search channels and people and mark messages read, and the rest move around and edit in the message composer.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
index b58d7ebd..91761ecd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/rstudio/content/intro.mdx
@@ -1 +1 @@
-RStudio's current Posit guide publishes defaults for the command palette, console, source editor, completions, panes, help, builds, debugging, plots, version control, sessions, terminals, and menus. This reference keeps Windows, Linux, and macOS differences explicit.
+RStudio is Posit's editor for the R language, with the console, plots, and help in panes beside your code. Its shortcuts run the command palette and console, move through source files, fold code, find and edit, and handle plots, Git, and builds.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
index 4e1dd179..ccceb608 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/safari/content/intro.mdx
@@ -1 +1 @@
-Safari's Mac User Guide lists keyboard commands for scrolling, webpage fields, tabs, history, downloads, reading lists, bookmarks, zoom, and windows. This reference keeps keyboard actions separate from the guide's pointer gestures.
+Safari is Apple's web browser, and on a Mac it's the one that comes built in. These keys scroll pages, switch and pick tabs, go back and forward, zoom, and open the Reading List, Reader, and bookmarks.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
index 29460637..ad0c473a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/salesforce/content/intro.mdx
@@ -1 +1 @@
-Salesforce Lightning Experience publishes global, navigation, composer, and console shortcuts. This reference keeps the standard Lightning actions separate from the extra workspace-tab controls available in Lightning console apps.
+Salesforce is a customer relationship platform where sales and service teams track accounts, deals, and cases. Its Lightning Experience keys edit records and move around the app, and console apps add keys for workspace tabs, History, and Omni-Channel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
index 259b93b9..d11afd00 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/scrivener/content/intro.mdx
@@ -1 +1 @@
-Scrivener's current manuals include an exhaustive menu appendix with file, edit, document, format, navigate, project, and window commands. This reference records the stable desktop defaults that writers use for projects, documents, text editing, search, and compilation.
+Scrivener is a writing app for long projects like novels and theses, where you write in small pieces and arrange them in a binder. The keys below handle projects, editing and formatting text, moving documents around the binder, and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
index a291c446..5bfaec7e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/signal/content/intro.mdx
@@ -1 +1 @@
-Signal Desktop keyboard shortcuts move through conversations, search messages, format drafts, manage media, and control calls. This reference keeps the published Mac and Windows/Linux differences visible.
+Signal is a private messaging app with end-to-end encryption, and these keys are for Signal Desktop. They move between chats, act on selected messages and the composer, and mute, answer, or start calls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
index edf446b2..bca8f71f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/simplenote/content/intro.mdx
@@ -1 +1 @@
-Simplenote's official help page lists desktop shortcuts for creating and searching notes, checklists, focus mode, Markdown preview, and font size. The platform-specific table is preserved here.
+Simplenote is a free, plain-text notes app that syncs across your devices. Its desktop keys are few: make, find, print, and delete notes, add checklist items, switch on focus mode or Markdown preview, and change font size.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
index c82c7f1d..8971548a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketch/content/intro.mdx
@@ -1 +1 @@
-Sketch's Mac app shortcut reference covers documents, canvas navigation, comments, layers, styling, and export. This page keeps the current US English Mac defaults separate from Sketch web shortcuts.
+Sketch is a Mac design app for interfaces and icons, with a web app for sharing and handoff. These Mac keys run the Command Bar and documents, switch views and zoom the canvas, add comments, find layers, and style and arrange text.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
index 94bb1575..f2b64c51 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sketchup/content/intro.mdx
@@ -1 +1 @@
-SketchUp's current default shortcut table covers the direct tool keys used for selection, drawing, modeling, and camera control. These entries apply to the Windows and Mac desktop defaults.
+SketchUp is a 3D modeling app that architects, woodworkers, and hobbyists use to draw buildings and objects. Single-letter keys pick its tools: select, line, and rectangle, then push/pull, move, and rotate, plus orbit, pan, and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
index 4d759494..a57f16e1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/slack/content/intro.mdx
@@ -1 +1 @@
-Slack's shortcut map spans the desktop shell, conversations, workspaces, tabs, messages, huddles, and canvas editing. This page keeps those contexts together and calls out desktop-only or keyboard-layout-sensitive bindings.
+Slack is chat for work, organized into channels, direct messages, and threads. Its shortcuts jump between unread conversations, switch workspaces and tabs, edit and format messages, and work inside canvases.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
index 9079f53b..0a06d380 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/smartsheet/content/intro.mdx
@@ -1 +1 @@
-Smartsheet's official keyboard shortcut table covers sheet editing, search, hierarchy, formatting, row selection, date entry, and dashboard focus. Windows and Mac mappings are shown separately where they differ.
+Smartsheet is a work management app that looks like a spreadsheet but tracks projects, tasks, and owners. You can edit cells, find rows, indent tasks into a hierarchy, apply formatting, and select rows, columns, and cards.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
index 75e210f6..f6c98baf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/solidworks/content/intro.mdx
@@ -1 +1 @@
-SOLIDWORKS Design Help publishes selected Windows shortcuts for assemblies, copying, display, selection, sketching, and the shortcut bar. The record focuses on stable key commands rather than mouse gestures.
+SOLIDWORKS is Dassault's CAD software for designing parts and assemblies in 3D on Windows. Its shortcuts rebuild and copy, rotate and zoom the view, control selection and sketch relations, and help while mating parts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
index 14216277..9dbd685f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/spark-mail/content/intro.mdx
@@ -1 +1 @@
-Spark Mail's desktop shortcut reference groups email triage, navigation, composing, formatting, calendar, and team actions. This record uses the published Mac and Windows desktop presets.
+Spark is an email app from Readdle that sorts your inbox and lets teams share messages. Its keys move through mail and reply, archive, or mark it, open folders like Done and Pinned, and write and format new messages.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
index d533d062..53e5ad12 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/spotify/content/intro.mdx
@@ -1 +1 @@
-Spotify's current desktop support page lists shortcuts for search, playback, library navigation, sidebars, and queue actions. The table below keeps its Mac and Windows differences explicit.
+Spotify streams music and podcasts, and its desktop app has keys so you can control it without hunting for buttons. They open search and your Library, filter lists, and play, pause, skip, shuffle, repeat, or change volume.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
index f3a7a16b..c0215013 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/squarespace/content/intro.mdx
@@ -1 +1 @@
-Squarespace's official guide covers site navigation, Fluid Engine block editing, text formatting, and Acuity actions. These entries describe the current Mac and Windows editing shortcuts.
+Squarespace is a website builder where you edit pages visually from templates. Its editor keys move around your site, arrange and resize blocks in Fluid Engine, and set headings, links, and text styles.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
index cb9dfa50..fe53ba68 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/sublime-text/content/intro.mdx
@@ -1 +1 @@
-Sublime Text's current community documentation publishes separate Windows/Linux and macOS tables for editing, navigation, builds, search, tabs, folding, and bookmarks.
+Sublime Text is a fast, lightweight code editor known for multiple selections and its Goto Anything search. These keys edit and move lines, quick-open files, jump to symbols and lines, run builds, and switch tabs or fold code.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
index b53db147..f6ce6b46 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/superhuman/content/intro.mdx
@@ -1 +1 @@
-Superhuman's official shortcut guide covers inbox triage, search, composing, formatting, navigation, and tabs. This reference pairs the desktop modifier differences while keeping single-key actions readable.
+Superhuman is an email client built for working through your inbox at speed, mostly from the keyboard. Its single keys triage conversations, compose and format replies, and jump between Inbox, Sent, Drafts, and your other tabs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
index 142b57bd..ac36984e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableau/content/intro.mdx
@@ -1 +1 @@
-Tableau's official shortcut reference covers Desktop workbooks, authoring, data, dashboards, marks, and worksheet navigation. This curated set keeps the most-used Windows and Mac defaults together.
+Tableau lets you drag data fields onto a sheet to build charts, then combine them into dashboards. These Tableau Desktop keys open and save workbooks, describe fields and refresh data, and select marks, labels, and pages.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
index ec4ae9a9..6bb421cc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tableplus/content/intro.mdx
@@ -1 +1 @@
-TablePlus's official shortcut documentation covers connections, workspaces, SQL editing, panes, query execution, and table data. Windows entries use the documented Control replacement for Command.
+TablePlus is a native app for working with databases like PostgreSQL, MySQL, and SQLite. Use its keys to open connections and tabs, run and format SQL, and copy, insert, filter, or duplicate rows in a table.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
index 813aed66..a08caffc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tally-forms/content/intro.mdx
@@ -1 +1 @@
-Tally's official keyboard shortcut guide covers form editing, block movement, formatting, command menus, and Markdown-style input. The shared web shortcuts are paired across Windows, macOS, and Linux.
+Tally is a form builder that works like a document: you type questions as blocks on a page. From the keyboard you can select and move blocks, format text, open the block and command menus, and toggle required, hidden, or logic settings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
index 5f8f9f3f..655fc751 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/telegram/content/intro.mdx
@@ -1 +1 @@
-Telegram Desktop publishes its default shortcut actions in the open-source desktop implementation and exposes them in Chat Settings. This reference focuses on chat, folder, window, and message navigation.
+Telegram keeps your chats, groups, and channels in its cloud, so the desktop app picks up where your phone left off. Its keys lock or quit the app, jump between chats and folders, and send, schedule, or mark messages read.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
index c57457ed..e96c8442 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/things-3/content/intro.mdx
@@ -1 +1 @@
-Things 3's official Mac shortcut reference covers task creation, scheduling, navigation, Markdown styling, search, and list organization. iPad and iPhone shortcuts are outside this Mac record.
+Things 3 is a to-do app for Mac that sorts tasks into Today, Upcoming, Anytime, and Someday. Its shortcuts create and edit to-dos and projects, jump between lists, and format notes with Markdown and checklists.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
index 6e38dc06..e4df5b13 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
@@ -1 +1 @@
-tmux's default prefix map controls sessions, windows, panes, copy mode, and terminal layout without leaving a shell. The entries use tmux's default Ctrl-B prefix and preserve the distinction between a prefix chord and the command key that follows it.
+tmux keeps terminal sessions running after you disconnect and splits one window into many panes. Every key here follows the Ctrl+B prefix, and they manage sessions and windows, split and resize panes, and copy text in copy mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
index 7bc10d40..2bbc325b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/todoist/content/intro.mdx
@@ -1 +1 @@
-Todoist's current reference covers general app navigation, quick add, global desktop controls, task editing, projects, sorting, upcoming view, calendar layout, and multi-window workflows. This map keeps web and desktop commands together while showing platform-specific bindings explicitly.
+Todoist is a to-do list app that turns typed phrases like "every Monday" into due dates. Its keys open Quick Add, even from outside the app on desktop, then add and complete tasks, sort projects, and switch between list, board, and calendar layouts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
index 1e8a4066..1118f3e9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/typora/content/intro.mdx
@@ -1 +1 @@
-Typora's official shortcut table covers file operations, Markdown editing, headings, lists, formatting, search, views, and document navigation. The Windows and Linux defaults are paired, while macOS command and option variants stay explicit.
+Typora is a Markdown editor that shows formatting as you type, with no separate preview pane. From the keyboard you open files and tabs, edit and search text, set headings and insert tables or code blocks, and toggle the sidebar, source mode, and focus mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
index df81f293..3a6cd7a4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ulysses/content/intro.mdx
@@ -1 +1 @@
-Ulysses' official Mac reference covers sheets and groups, library navigation, search, editor markup, tables, previews, appearance, and export. The app's iPad and iPhone hardware-keyboard maps are separate, so this record stays Mac-only.
+Ulysses is a Markdown writing app for Mac where every text lives as a sheet in one library. Keys here create and split sheets and groups, search the library, toggle editor views and markup, and edit tables and export.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
index 4a77b778..0cee3315 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/visual-studio/content/intro.mdx
@@ -1 +1 @@
-Visual Studio's General profile includes distinct defaults for building, debugging, editing, files, projects, refactoring, views, and document windows. This Windows reference keeps the common commands and their context notes readable instead of flattening every context-specific command into one list.
+Visual Studio is Microsoft's full IDE for .NET and C++ work on Windows, separate from the lighter VS Code. Its default General profile keys build and debug, edit and navigate code, manage files and projects, and refactor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
index aab0133d..f61cd43e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/vmware-workstation/content/intro.mdx
@@ -1 +1 @@
-VMware Workstation's default hot-key combinations release input, control full-screen guests, switch virtual machines, and manage Unity mode. This reference covers the host shortcuts documented for Workstation Pro on Windows and Linux.
+With VMware Workstation, a Windows or Linux PC can run other operating systems in a window or full screen. Its hot keys grab and release your keyboard and mouse, send Ctrl+Alt+Delete to a guest, switch machines in full screen, and toggle Unity mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
index 37d81fe2..031e5e1f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/warp/content/intro.mdx
@@ -1 +1 @@
-Warp's official shortcut reference covers panes, blocks, terminal input, command search, tabs, navigation, and font controls across macOS, Windows, and Linux. The map preserves Warp's platform-specific defaults, including Emacs-style input bindings shared by the terminal editor.
+Warp is a modern terminal that groups each command and its output into a block you can select and copy. Keys here open command search and Workflows, act on blocks, split panes and tabs, and edit the input line.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
index 6e301298..08da4aeb 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/webflow/content/intro.mdx
@@ -1 +1 @@
-Webflow's current designer reference covers canvas editing, breakpoints, panels, classes, interactions, element movement, and publishing. Webflow documents Command and Option on Mac with Control and Alt equivalents on Windows, which this map keeps explicit.
+Webflow is a visual website builder for designers who want control over HTML and CSS without writing it. Its Designer keys open panels, select and edit elements, switch breakpoints, move around the canvas, and work the interactions timeline.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
index 5d6a6d09..d71ceb6b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/webstorm/content/intro.mdx
@@ -1 +1 @@
-WebStorm's default keymap covers search, code completion, editing, navigation, refactoring, files, tabs, debugging, and version control. The reference uses the standard Windows/Linux and macOS keymaps and keeps two-stroke commands labeled as sequences.
+WebStorm is built for JavaScript and TypeScript work, with testing and debugging in the same window. Out of the box, its keys handle search and navigation, code completion, refactoring and generating code, files and tabs, and running, debugging, and version control.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
index 2c13999d..b4a111e9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/whimsical/content/intro.mdx
@@ -1 +1 @@
-Whimsical publishes separate current shortcut tables for its Windows and Mac apps. This reference covers workspace navigation, boards, diagrams, mind maps, and notes.
+Whimsical is a visual workspace for flowcharts, wireframes, mind maps, and sticky notes. With the keyboard you can search files, zoom and fit boards, add diagram shapes, grow mind map nodes, and size and format sticky notes.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
index b7684765..4e756471 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-file-explorer/content/intro.mdx
@@ -1 +1 @@
-Microsoft publishes a dedicated File Explorer section in its current Windows keyboard shortcut reference. This map covers navigation, tabs, search, panes, and file actions.
+File Explorer is where you browse, open, and manage files and folders on Windows. Its keys focus the address bar and search, open windows and tabs, move between tabs, and rename items.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
index bc6ec02f..9514b908 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-snipping-tool/content/intro.mdx
@@ -1 +1 @@
-Microsoft documents shortcuts for opening the Snipping Tool capture overlays and for working inside the Snipping Tool editor.
+Snipping Tool is the screenshot and screen recording app built into Windows. Its keys open the capture overlay from anywhere, grab the full screen, and then pick a mode, set a delay, copy, or save in the editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
index 6e5e9eef..99901ae8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows-terminal/content/intro.mdx
@@ -1 +1 @@
-Windows Terminal is a workspace for several shells, so its important keys manage the container around the prompt. Open tabs, split panes, search scrollback, copy and paste, zoom, and reach the command palette.
+Windows Terminal holds Command Prompt, PowerShell, and WSL shells in tabs and split panes. Its keys open and switch tabs, split and resize panes, copy and paste, change text size, search scrollback, and open the command palette.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
index 1fd116cf..8c46aeea 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/windows/content/intro.mdx
@@ -1 +1 @@
-Windows shortcuts span the desktop, text fields, File Explorer, virtual desktops, the taskbar, and the command prompt. This page gathers Microsoft's current Windows 10 and Windows 11 defaults so the same key can be understood in the context where it actually works.
+Windows shortcuts work across the whole PC, from the desktop to most apps you open. They cover text editing, switching apps and windows, Windows key combinations like snapping, File Explorer, Command Prompt, and virtual desktops and the taskbar.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
index d50be4f1..1411e8d3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/winmerge/content/intro.mdx
@@ -1 +1 @@
-WinMerge publishes separate shortcut sections for folder comparison, file comparison, merge mode, search, bookmarks, and zoom.
+WinMerge is a free Windows tool that compares two files or folders and shows what changed. Use the keys to step through differences, rescan and open items in a folder comparison, copy changes left or right, and resolve merge conflicts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
index 9f02e27c..4549c16d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wireshark/content/intro.mdx
@@ -1 +1 @@
-Wireshark's current User's Guide documents keyboard navigation, packet search, marking, references, capture controls, and display actions for its desktop application.
+Wireshark captures network traffic and lets you inspect every packet in detail. Its keys move between packets and panes, open and save capture files, mark and comment packets, and start or stop captures.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
index 1d22fb3b..5a485dcd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wix/content/intro.mdx
@@ -1 +1 @@
-Wix publishes keyboard shortcuts for the Wix Editor, including object editing, panels, page controls, and text formatting.
+Wix lets you build a website by dragging text, images, and buttons anywhere on the page. In the editor, keys copy, duplicate, and layer elements, save and preview the site, switch to the mobile view, and format text.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
index a30b07bd..bd4c23e1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wondershare-filmora/content/intro.mdx
@@ -1 +1 @@
-Filmora publishes complete Windows and Mac shortcut tables for file actions, editing, timeline navigation, markers, playback, and export.
+Filmora is a beginner-friendly video editor from Wondershare for YouTube clips, vlogs, and social videos. Its keys handle projects and imports, trim and move clips on the timeline, step through playback by frame, and set markers before export.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
index 870ac7a9..a23ad651 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wordpress-admin/content/intro.mdx
@@ -1 +1 @@
-WordPress publishes keyboard references for the Block Editor, Classic Editor, comments, and Site Editor. This map keeps those admin editing surfaces together and does not claim shortcuts for every plugin screen.
+WordPress is open source software for building websites and blogs, which you write and manage from its admin dashboard. These keys work in the Block Editor and its text formatting, the older Classic Editor, the comments screen, and the Site Editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
index f5e0fcdc..66101a9f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wps-office/content/intro.mdx
@@ -1 +1 @@
-WPS publishes product-specific shortcut tables for Writer, Spreadsheets, Presentation, and the Mac app. This reference keeps the Windows document tools separate from the Mac commands.
+WPS Office is a free office suite with a word processor, spreadsheets, and slides that open Microsoft Office files. The keys are split by app: Writer, Spreadsheets, and Presentation on Windows, and a separate set for the Mac app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
index ce9bbccb..c06872f4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/wrike/content/intro.mdx
@@ -1 +1 @@
-Wrike publishes shortcuts for task creation, search, comments, text formatting, table views, and Gantt chart navigation.
+Wrike is project management software that teams use to plan work, assign tasks, and track deadlines. Keys here create tasks and open search from anywhere, edit in Table view, and fill dates and move tasks in Gantt charts.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
index cf6083d7..90385f74 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/x-twitter/content/intro.mdx
@@ -1 +1 @@
-X publishes keyboard shortcuts for posts, timeline navigation, search, direct messages, profile areas, and other common actions on x.com.
+X, formerly Twitter, is the social network for short posts and replies. On x.com, single keys like, reply to, and repost the post in focus, move up and down your timeline, and jump to Home, Notifications, or your profile.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
index ff4eb39b..4f928092 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtrack/content/intro.mdx
@@ -1 +1 @@
-YouTrack Cloud publishes keyboard tables for issue lists, single issues, rich text, and whiteboards. This reference keeps those contexts separate.
+YouTrack is where software teams file bugs, plan their work on boards, and sketch ideas on whiteboards. Its keys move through and act on issue lists, edit and comment on a single issue, and add cards and text on whiteboards.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
index f86af674..d897257b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/youtube/content/intro.mdx
@@ -1 +1 @@
-YouTube publishes desktop player shortcuts for playback, seeking, captions, chapters, speed, volume, search, and playlist navigation.
+YouTube's player answers to the keyboard on any computer, so you can watch without reaching for the mouse. These keys play and pause, jump to a set point in the video, change volume and speed, turn on captions, and go full screen.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
index cb4b8be3..5e40efc5 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zbrush/content/intro.mdx
@@ -1 +1 @@
-Maxon publishes ZBrush's default keyboard shortcuts by category, including project files, palettes, sculpting controls, masking, subtools, and rendering.
+ZBrush is Maxon's digital sculpting app, used for game characters, film creatures, and 3D printing. Its shortcuts open projects and palettes, pick colors and toggle canvas views, divide and sculpt meshes, and render or grab textures.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
index 0be02e25..52e2b9e1 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zed/content/intro.mdx
@@ -1 +1 @@
-Zed's default keymap is built around moving quickly through an editor, workspace, terminal, and agent panel. This reference covers the current built-in defaults across macOS, Linux, and Windows, including the context-sensitive keys that are most useful in daily work.
+Zed is a fast code editor built for working with teammates and AI agents in the same window. Its default keys open files and pickers, edit and search code, run the agent panel, and drive the terminal and Git.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
index a43b8020..ab9b68e4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zen-browser/content/intro.mdx
@@ -1 +1 @@
-Zen Browser publishes a current desktop shortcut reference for compact mode, workspaces, split views, tabs, navigation, search, pages, and developer tools.
+Zen Browser is a Firefox-based browser with vertical tabs, workspaces, and split views. Its own keys toggle compact mode, switch workspaces, and split the view, and the rest handle tabs, navigation, and page and developer tools.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
index c1feae9c..d0f6545b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zendesk/content/intro.mdx
@@ -1 +1 @@
-Zendesk publishes an Agent Workspace keyboard cheat sheet for navigation, ticket actions, status changes, and composing replies or internal notes.
+Zendesk is customer support software where agents answer tickets from email, chat, and other channels. Its Agent Workspace keys jump between views and search, reply or add internal notes, set ticket status, and format replies.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
index f42f7cde..7e9f6011 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zeplin/content/intro.mdx
@@ -1 +1 @@
-Zeplin publishes separate Mac and Windows app shortcuts for projects, styleguides, screens, sections, tags, layers, and zoom.
+Zeplin is where designers hand off finished screens so developers can read sizes, colors, and assets. Its desktop keys open search, the dashboard, and styleguides, select and rename screens and layers, and zoom or fit the view.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
index abe7ca4f..7f70dba8 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zoom/content/intro.mdx
@@ -1 +1 @@
-Zoom publishes current desktop shortcuts for meetings, chat, calls, product navigation, and accessibility controls across Windows, macOS, and Linux.
+Zoom is a video meeting app for work calls, webinars, and team chat. Its desktop keys mute, share, and switch views in meetings, move between chats and calls, and jump between the app's tabs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
index 45af913e..a9a69886 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/zulip/content/intro.mdx
@@ -1 +1 @@
-Zulip publishes a current Web and Desktop keyboard reference for streams, topics, direct messages, search, composing, and message actions.
+Zulip sorts team chat by topic, so each conversation in a channel keeps its own named thread. Its keys reply and start topics, move between views and through messages, write and send messages, and edit or act on existing ones.

From 686e5c0e631b6d958452e67ae740fd6e98f2a076 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:28:15 +0530
Subject: [PATCH 16/25] Give 70 keyboard shortcut pages their own intros (Final
 Cut Pro to Notion)

Every published shortcut app page now has its own intro.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../keyboard-shortcuts/final-cut-pro/content/intro.mdx          | 2 +-
 .../(directories)/keyboard-shortcuts/firefox/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/fl-studio/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/framer/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/freshdesk/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/front/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/fusion-360/content/intro.mdx             | 2 +-
 .../(directories)/keyboard-shortcuts/ghostty/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/gimp/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/github-copilot/content/intro.mdx         | 2 +-
 .../keyboard-shortcuts/github-desktop/content/intro.mdx         | 2 +-
 .../(directories)/keyboard-shortcuts/github/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/gitkraken/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/gitlab/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/gmail/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/gnome/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/godot-engine/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/goodnotes/content/intro.mdx              | 2 +-
 .../keyboard-shortcuts/google-docs/content/intro.mdx            | 2 +-
 .../keyboard-shortcuts/google-drive/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/google-forms/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/google-gemini/content/intro.mdx          | 2 +-
 .../keyboard-shortcuts/google-meet/content/intro.mdx            | 2 +-
 .../keyboard-shortcuts/google-sheets/content/intro.mdx          | 2 +-
 .../keyboard-shortcuts/google-slides/content/intro.mdx          | 2 +-
 .../keyboard-shortcuts/grammarly/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/harvest/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/httpie/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/ia-writer/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/imessage/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/inkscape/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/insomnia/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/intellij-idea/content/intro.mdx          | 2 +-
 .../(directories)/keyboard-shortcuts/intercom/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/iterm2/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/jira/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/joplin/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/jupyter-notebook/content/intro.mdx       | 2 +-
 .../(directories)/keyboard-shortcuts/keynote/content/intro.mdx  | 2 +-
 .../(directories)/keyboard-shortcuts/krita/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/libreoffice-writer/content/intro.mdx     | 2 +-
 .../(directories)/keyboard-shortcuts/linear/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/linkedin/content/intro.mdx | 2 +-
 .../keyboard-shortcuts/linux-kde-plasma/content/intro.mdx       | 2 +-
 .../keyboard-shortcuts/logic-pro/content/intro.mdx              | 2 +-
 .../(directories)/keyboard-shortcuts/logseq/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/looker/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/loom/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/macos-finder/content/intro.mdx           | 2 +-
 .../keyboard-shortcuts/macos-spotlight/content/intro.mdx        | 2 +-
 .../(directories)/keyboard-shortcuts/mastodon/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/matlab/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/mattermost/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/microsoft-edge/content/intro.mdx         | 2 +-
 .../keyboard-shortcuts/microsoft-onedrive/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/microsoft-onenote/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/microsoft-outlook/content/intro.mdx      | 2 +-
 .../keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx   | 2 +-
 .../keyboard-shortcuts/microsoft-powertoys/content/intro.mdx    | 2 +-
 .../keyboard-shortcuts/microsoft-teams/content/intro.mdx        | 2 +-
 .../keyboard-shortcuts/microsoft-word/content/intro.mdx         | 2 +-
 .../(directories)/keyboard-shortcuts/milanote/content/intro.mdx | 2 +-
 .../(directories)/keyboard-shortcuts/miro/content/intro.mdx     | 2 +-
 .../keyboard-shortcuts/monday-com/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx    | 2 +-
 .../(directories)/keyboard-shortcuts/neovim/content/intro.mdx   | 2 +-
 .../(directories)/keyboard-shortcuts/netflix/content/intro.mdx  | 2 +-
 .../keyboard-shortcuts/notability/content/intro.mdx             | 2 +-
 .../keyboard-shortcuts/notepad-plus-plus/content/intro.mdx      | 2 +-
 .../(directories)/keyboard-shortcuts/notion/content/intro.mdx   | 2 +-
 70 files changed, 70 insertions(+), 70 deletions(-)

diff --git a/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
index 57273678..d7143fee 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/final-cut-pro/content/intro.mdx
@@ -1 +1 @@
-Final Cut Pro's Mac guide documents shortcuts for application control, editing, clip placement, timeline navigation, selection, and playback organization.
+Final Cut Pro is Apple's video editor for the Mac, used by YouTubers, filmmakers, and editors who cut on its magnetic timeline. These keys run app commands, cut, connect, and audition clips, and select clips or switch multicam angles in the timeline.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
index 33bccba9..54d43623 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/firefox/content/intro.mdx
@@ -1 +1 @@
-Firefox's official reference spans browsing, editing, tabs, search, bookmarks, developer tools, PDFs, and media. This table keeps those contexts together so the shortcut still makes sense when the page is no longer just a page.
+Firefox is Mozilla's open source web browser, and you can shape it with add-ons. Its shortcuts move through pages and history, find text, manage tabs and windows, open bookmarks, downloads, and developer tools, and control the built-in PDF viewer and video playback.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
index a7f1de32..e1960353 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fl-studio/content/intro.mdx
@@ -1 +1 @@
-FL Studio groups shortcuts by global commands, files, patterns, the Channel Rack, transport, windows, the Mixer, the Playlist, the Piano roll, and the Browser.
+FL Studio is Image-Line's music production app, where beat makers and producers build songs from patterns. Its keys work the Channel Rack and step sequencer, the Playlist, the Piano roll, and the Mixer, plus transport, window focus, and saving or exporting projects.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
index 5056fa79..deea0eaf 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/framer/content/intro.mdx
@@ -1 +1 @@
-Framer's official shortcut table covers agents, arranging, editing, layout, preview, projects, selection, tools, typography, vector editing, views, and zoom.
+Framer lets you design and publish websites on a visual canvas, with a CMS and an AI agent built in. The shortcuts pick drawing and type tools, align layers, add frames and stacks, preview your site, zoom the canvas, and drive the Agent.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
index 877e46fd..083c9be4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/freshdesk/content/intro.mdx
@@ -1 +1 @@
-Freshdesk splits its shortcut map by screen. These entries cover global navigation, ticket lists, selected tickets, and the ticket editor so support agents can move through a queue and reply without leaving the keyboard.
+Freshdesk is a help desk where support teams track and answer customer tickets. Its shortcuts jump between areas with two-key routes, move through the ticket list, and let you reply, forward, add a note, or change a ticket's status.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
index 46360a7b..db9e93ea 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/front/content/intro.mdx
@@ -1 +1 @@
-Front shortcuts keep conversations moving through selection, reply, assignment, tagging, and archive actions. The reference below uses Front's own shortcut set, including the commands that are useful while a conversation or composer has focus.
+Front is a shared inbox: your team works customer email and messages together, with assignments and internal comments. Its keys move through conversations, start and send replies, and archive, assign, tag, or snooze the conversation you have selected.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
index 6e1d59ee..f8756873 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/fusion-360/content/intro.mdx
@@ -1 +1 @@
-Fusion 360 puts common modeling, sketching, view, and document commands on the keyboard. This reference keeps the commands that are useful across a normal design session and leaves pointer gestures outside the shortcut list.
+Fusion 360 is Autodesk's cloud-connected CAD software for designing parts and products in 3D. Use these keys to start sketch lines, shapes, and constraints, pick common modeling commands, change selection modes, and open, save, or switch documents.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
index 170809ba..5ff9f965 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ghostty/content/intro.mdx
@@ -1 +1 @@
-Ghostty's defaults are about arranging terminal work. Split the surface, move between tabs, copy and paste, search scrollback, change the view, and reload configuration while keeping the shell session alive.
+Ghostty is a GPU-accelerated terminal emulator with native app windows, set up through a plain text config file. Its default keybinds split panes and move between them, manage tabs and windows, copy and search scrollback, jump between prompts, and reload your config.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
index c3b895c5..708d34b7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gimp/content/intro.mdx
@@ -1 +1 @@
-GIMP's official quick reference groups shortcuts by toolbox, image files, dialogs, and view controls. These entries cover the commands used most often when selecting, painting, editing layers, and exporting an image.
+GIMP is a free, open source image editor for retouching photos and making graphics. Most of its keys pick a tool, so you can go from selection to brush to text without the toolbox; others create, save, and export images and open docks.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
index 2aebe1da..12236f9a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-copilot/content/intro.mdx
@@ -1 +1 @@
-GitHub Copilot's documented keys live inside the host IDE. These entries use GitHub's current Visual Studio Code reference for inline suggestions and the separate pane, with the same suggestion controls also documented for JetBrains IDEs.
+GitHub Copilot is an AI coding assistant that suggests code as you type in your editor. These VS Code defaults accept, dismiss, cycle, or request inline suggestions, take a long suggestion one word or line at a time, and open the suggestions pane.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
index 7777f1fd..dd707504 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github-desktop/content/intro.mdx
@@ -1 +1 @@
-GitHub Desktop's shortcuts cover repository setup, branch work, commit flow, and the views that developers use while reviewing changes. Mac and Windows bindings come directly from GitHub's current desktop reference.
+GitHub Desktop gives you Git without the command line: you clone, branch, and commit from an app window. Its keys add and switch repositories, create branches, step through changed files and history, commit your work, and open settings.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
index 3830c93e..6c419a18 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/github/content/intro.mdx
@@ -1 +1 @@
-GitHub's keyboard layer changes with the page you are on. These groups cover site navigation, repository sections, issue and pull request triage, comment editing, code browsing, and notifications.
+GitHub is where developers host code and work on it together through issues, pull requests, and Actions. Its keys jump between site areas and repository tabs, triage issues and pull requests, format comments, and browse code, diffs, and blame.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
index 8e4576b6..94057c4c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitkraken/content/intro.mdx
@@ -1 +1 @@
-GitKraken's desktop shortcuts cover the work that repeats in every repository: fetch, stage, commit, move through history, compare changes, and switch between open tabs. The same reference covers Windows, macOS, and Linux.
+GitKraken Desktop is a visual Git client that draws your branches and commits as a graph. Use these keys to fetch, stage, and commit, move through the commit graph, and show, hide, or switch panels and repository tabs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
index 575bfdc5..d5f6a575 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gitlab/content/intro.mdx
@@ -1 +1 @@
-GitLab's web shortcuts move between projects, issues, merge requests, and the editor. This set follows the current GitLab.com and self-managed reference, including the sequential G routes that make project navigation fast.
+GitLab keeps your code, issues, merge requests, and CI/CD pipelines in one DevOps platform. Its shortcuts open common areas from any page, use g routes to reach a project's files, commits, and pipelines, and edit or format text in issues and merge requests.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
index 03335d7b..e153acae 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gmail/content/intro.mdx
@@ -1 +1 @@
-Gmail becomes much faster once a conversation stays selected. This reference covers the complete documented keyboard layer for inbox triage, composing, reading threads, jumping between views, selecting conversations, formatting, and opening Gmail's menus.
+Gmail is Google's email service, used in the browser for personal and work mail. Turn on keyboard shortcuts in Settings to use the single-key inbox actions; the rest jump between views, move through threads, and help you write and format a message.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
index 8e458fe7..a818bbef 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/gnome/content/intro.mdx
@@ -1 +1 @@
-GNOME's Super-key shortcuts connect the desktop shell to the work inside its windows. This reference covers the current official shell defaults for Activities, windows, workspaces, monitors, notifications, screenshots, recording, and common text editing.
+GNOME is the desktop on Ubuntu, Fedora, and other Linux systems, and much of it runs from the Super key. These keys open Activities and apps, switch windows and workspaces, move windows between monitors, take screenshots and screencasts, and lock the screen.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
index 0344dcba..19a01a70 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/godot-engine/content/intro.mdx
@@ -1 +1 @@
-Godot's editor shortcuts move between workspaces, scenes, panels, and the 2D canvas. This record follows the default key mapping in the current Godot 4.6 manual and keeps tool, scene, and run commands together.
+Godot is a game engine you can use for free, with no royalties, to make 2D and 3D games in its own editor. Its default keys switch workspaces, run the project or a scene, and pan, zoom, select, and snap objects on the 2D canvas.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
index 6be6535e..82fd3153 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/goodnotes/content/intro.mdx
@@ -1 +1 @@
-Goodnotes shortcuts cover notebooks and tabs, editing, page navigation, drawing tools, and text formatting. This desktop set follows the current Goodnotes reference for macOS and Windows.
+Goodnotes is a digital notebook for handwritten notes, typed text, and marked-up PDFs. With a keyboard you can create notebooks and tabs, pick pen and selection tools, jump to a page, search a document, and format typed text.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
index 4ecd188f..1d644a7f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-docs/content/intro.mdx
@@ -1 +1 @@
-Google Docs shortcuts handle editing, formatting, navigation, comments, and document commands in the browser. The entries below use Google's current Windows and macOS help tables rather than generic browser shortcuts.
+Google Docs is a word processor in your browser, where several people can write and comment on the same file. Its shortcuts open, find, and print, move text through the clipboard, format characters and paragraphs, and add or step through comments.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
index 0ae23f1a..2daf9fb2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-drive/content/intro.mdx
@@ -1 +1 @@
-Google Drive's web shortcuts cover navigation panels, item selection, file actions, creation, and preview controls. The record follows Google's current desktop help page for Windows and macOS.
+Google Drive stores your files online and holds everything you make in Docs, Sheets, and Slides. In the Drive web app, these keys select, open, rename, share, or move files, upload and create new ones, search, and control a file preview.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
index ff671228..3963885a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-forms/content/intro.mdx
@@ -1 +1 @@
-Google Forms shortcuts help you move through a form, insert questions and media, format text, and manage grading. The bindings below come from Google's current PC and Mac shortcut reference.
+Google Forms builds surveys, quizzes, and sign-up forms, then collects the answers for you. Its keys move through a form, insert and reorder questions and sections, format titles and descriptions, and speed up grading when a form is a quiz.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
index c8a065e1..197f59f9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-gemini/content/intro.mdx
@@ -1 +1 @@
-Google's current Gemini keyboard reference is for Gemini in Chrome. It documents opening the side panel, switching between the tab and Gemini, and entering selection mode on Windows and Mac.
+Gemini is Google's AI assistant, which you can chat with on the web and inside the Chrome browser. The shortcuts Google documents are for Gemini in Chrome: open or close it, switch focus between the tab and Gemini, and start selection mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
index 0982a050..72b4ff38 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-meet/content/intro.mdx
@@ -1 +1 @@
-Google Meet's documented meeting shortcuts control the camera, microphone, captions, presentation, participants, chat, and layout. They work while a Meet call has focus.
+Google Meet is a video calling app you join from the browser, often straight from a Calendar invite. During a call, these keys turn your camera and mic on or off, raise your hand, show captions or chat, present, and change the tile layout.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
index 44dc1da9..a845daef 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-sheets/content/intro.mdx
@@ -1 +1 @@
-Google Sheets shortcuts cover selection, cell entry, formatting, sheet navigation, comments, menus, formulas, and accessibility. This reference keeps Google's PC bindings for Windows and Linux separate from its current Mac bindings.
+Google Sheets works much like Excel, but your spreadsheets live in Google Drive and open in any browser. Its keys select and format cells, jump around the sheet, insert or hide rows and columns, add notes and comments, and show formulas.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
index e794fbeb..4c63e5c7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/google-slides/content/intro.mdx
@@ -1 +1 @@
-Google Slides shortcuts cover slide creation, editing, filmstrip movement, presentation controls, and text formatting. The entries below use Google's current Windows and Mac help tables.
+Google Slides is for building a slide deck you can share by link and present from any browser. Its shortcuts add, duplicate, and reorder slides, move through the filmstrip, start presenting or open speaker notes, style text, and add alt text to images.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
index c72c76c4..2278bfae 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/grammarly/content/intro.mdx
@@ -1 +1 @@
-Grammarly's current desktop accessibility reference documents keyboard navigation for the assistant and sidebar. These entries cover opening and closing the desktop surfaces and moving through their controls.
+Grammarly checks your spelling, grammar, and tone and suggests rewrites while you type in other apps. Its documented shortcuts are for the desktop app: open the Grammarly Assistant or sidebar, close it, and move between its controls.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
index 135699ce..a4d43eec 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/harvest/content/intro.mdx
@@ -1 +1 @@
-Harvest's Windows app shortcuts cover timer creation, the timesheet, favorites, day navigation, and editing or deleting a selected entry. The source gives these as the app's current Windows defaults.
+Harvest tracks the time you spend on projects, so freelancers and teams can bill clients and see where the hours go. These keys are for the Windows app: start a timer, show the timesheet, move between days, and edit, stop, or delete a selected entry.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
index 9cfb0575..ff7ab0a4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/httpie/content/intro.mdx
@@ -1 +1 @@
-HTTPie Desktop's shortcuts cover tabs, the request editor, search, and the library. They keep a request session moving while the URL, code editor, or response panel has focus.
+HTTPie started as a friendly command-line HTTP client and now has a desktop app for testing APIs. Its desktop shortcuts open and switch request tabs, focus the URL and send a request, search inside the editor, and open the library, settings, and AI prompt.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
index 920bcbc3..eb97c10e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/ia-writer/content/intro.mdx
@@ -1 +1 @@
-iA Writer's Mac shortcuts cover files, search, Markdown structure, formatting, preview, and export. They follow the current iA Writer reference so a writer can stay in the editor from first draft to final output.
+iA Writer is a plain text editor for writers who work in Markdown and want few distractions. The keys open and search your library, add headings, lists, links, and other Markdown, switch focus mode and preview, and export or print.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
index 60f22529..9da02bc9 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/imessage/content/intro.mdx
@@ -1 +1 @@
-Apple's Messages shortcuts cover conversation filters, search, replies, Tapbacks, message editing, and conversation details. This record is for the current macOS Messages app.
+Messages is the Mac app for iMessage and texts, synced with the conversations on your iPhone. Its keys start and search conversations, send and edit messages, add a Tapback, mark chats as read, and open contact and conversation details.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
index 513b4d4f..e09f638a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/inkscape/content/intro.mdx
@@ -1 +1 @@
-Inkscape's official key reference covers tools, files, object editing, z-order, and canvas views. These entries focus on the commands that recur while drawing and preparing a vector document.
+Inkscape draws in vectors and saves to SVG, so logos, icons, and diagrams stay sharp at any size. Its keys switch drawing, shape, and text tools, open, import, and export files, group and convert objects, and change stacking order and zoom.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
index 14f33dbb..840efe3e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/insomnia/content/intro.mdx
@@ -1 +1 @@
-Insomnia's desktop shortcuts cover request editing, sending, environments, history, plugins, and workspace organization. The entries below follow Kong's current Windows and macOS shortcut reference.
+Insomnia is Kong's open source app for designing, testing, and debugging APIs. Its keys edit a request's method and URL, pick an environment, send the request, filter the sidebar, and create, duplicate, or pin requests and folders.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
index 585919bd..b386c3c7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/intellij-idea/content/intro.mdx
@@ -1 +1 @@
-IntelliJ IDEA's default keymaps cover search, editing, coding assistance, navigation, debugging, and refactoring. This record keeps the high-use commands from JetBrains' current Windows and macOS keymap references.
+IntelliJ IDEA is JetBrains' IDE for Java and Kotlin, known for its code analysis and refactoring. The keys start with its top commands, like Search Everywhere, then cover editing, code completion and documentation, and jumping between files, symbols, and debugger steps.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
index aa561692..8cf2bfa4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/intercom/content/intro.mdx
@@ -1 +1 @@
-Intercom's Inbox shortcuts cover conversation actions, inbox navigation, and the reply composer. The current Command-K help article also lists direct keys for the actions agents use most often.
+Intercom brings customer chats, emails, and tickets into one Inbox for your support team. Many of its keys run through the Command K menu to assign, snooze, or close conversations, and others switch inboxes or move between reply and note.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
index 8e4ada08..d1801342 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/iterm2/content/intro.mdx
@@ -1 +1 @@
-iTerm2's shortcuts are about keeping several terminal jobs visible at once. Work across panes and tabs, search scrollback, recover paste history, mark useful output, broadcast input, and open the less obvious terminal tools.
+iTerm2 replaces the Mac's built-in Terminal with split panes, searchable scrollback, and Instant Replay. Its keys split and move between panes, manage tabs and windows, search output, open paste history, broadcast input, and set marks you can jump back to.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
index e67bd330..9fe75f54 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/jira/content/intro.mdx
@@ -1 +1 @@
-Jira Cloud's current shortcut reference covers the actions available from issue views and boards, including creating, opening, assigning, commenting, and moving through work items.
+Jira tracks a team's work items on boards and backlogs, from single bugs to whole projects. These Jira Cloud keys create, open, and assign work items, add comments, and move between items without reaching for the mouse.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
index f1dc9a84..49218149 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/joplin/content/intro.mdx
@@ -1 +1 @@
-Joplin's terminal client uses short commands, navigation keys, and typed key sequences to work with notes, todos, notebooks, and the built-in console.
+Joplin is an open source note app with end-to-end encrypted sync, and it also comes as a terminal app. The keys here are for that terminal version: move between notebooks and notes, select and delete items, and type commands and searches.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
index 3ccafc41..e0bf6c44 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/jupyter-notebook/content/intro.mdx
@@ -1 +1 @@
-Jupyter Notebook keeps the notebook itself in the browser, so its most useful keys switch between editing and command mode, run cells, search, and control the kernel.
+Jupyter Notebook lets you run code one cell at a time and keep the output and your notes beside it. The keys here run a cell, switch between edit and command mode, search the page, and interrupt or restart the kernel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
index 4819f478..f8bdaa6b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/keynote/content/intro.mdx
@@ -1 +1 @@
-Keynote's Mac shortcuts cover presentation files, slide navigation, text and object editing, tables, comments, and the live presentation controls.
+Keynote is Apple's presentation app, free on every Mac, iPad, and iPhone. These keys create and save decks, move between slides, format text, find and comment, arrange objects, add table rows, and control video and slides while you present.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
index a956f728..c0dbae5b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/krita/content/intro.mdx
@@ -1 +1 @@
-Krita's default menu, selection, layer, canvas, brush, and text-editor shortcuts keep drawing work close to the keyboard.
+Digital painters use Krita to sketch and paint illustrations, concept art, and comics, and it's free and open source. Its default keys handle files, selections, layers, zooming and mirroring the canvas, brush opacity and colors, and the vector text editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
index ec8c1ef8..c2077e30 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/libreoffice-writer/content/intro.mdx
@@ -1 +1 @@
-Writer's default shortcuts cover document navigation, styles, tables, text selection, and the keyboard-first editing commands used across LibreOffice.
+LibreOffice Writer is the word processor in LibreOffice, a free office suite that also opens and saves Word files. It puts fields, styles, and spelling on the function keys, and other shortcuts select text, insert breaks, apply headings, and work in tables.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
index bc1f94f2..b44b5ea6 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linear/content/intro.mdx
@@ -1 +1 @@
-Linear's keyboard map links issue triage, search, navigation, views, and the rich-text editor. Chords use the same letter-first pattern as Linear's own documentation.
+Linear is an issue tracker for software teams, designed to be driven from the keyboard. Its keys search and switch views, select one or many issues and set priority, and format text in the editor.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
index 531afb44..ccb37464 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linkedin/content/intro.mdx
@@ -1 +1 @@
-LinkedIn's desktop feed shortcuts move between posts and notifications, open the main destinations, and expose a quick reference modal.
+LinkedIn is the professional network where people share work news, hire, and look for jobs. On the desktop site, these keys move through the feed, act on a post or notification, open search with a slash, and use g sequences to reach the main pages.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
index 48005b94..633855ef 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/linux-kde-plasma/content/intro.mdx
@@ -1 +1 @@
-KDE Plasma's documented defaults cover window switching, workspaces, activities, the desktop, and the global actions that stay available above individual apps.
+KDE Plasma is a Linux desktop you can reshape almost any way you like, from panels to window rules. Its default keys switch, move, and resize windows, move across virtual desktops and activities, manage widgets, and run common file and document actions.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
index fad52b78..5614f0a3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/logic-pro/content/intro.mdx
@@ -1 +1 @@
-Logic Pro's key commands cover transport, editing, track and region work, window focus, and the main production views. The most useful commands are grouped by the job they perform.
+Logic Pro takes a song from first recording to final mix on a Mac, with software instruments, Drummer, and Live Loops built in. Apple calls its shortcuts key commands; they run the transport, switch tools, create tracks, edit regions, and open the Mixer.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
index 3a76ad12..147e54e3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/logseq/content/intro.mdx
@@ -1 +1 @@
-Logseq's default keymap covers block editing, navigation, search, page movement, and the left and right sidebars. Sequences are shown in the order they are typed.
+Logseq is an open source outliner for notes, where every line is a block you can link and nest. Its keys create, indent, and move blocks, format text, search and run commands, jump between journals and pages, and open the sidebars.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
index 46a73ecf..b3d3bb2d 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/looker/content/intro.mdx
@@ -1 +1 @@
-Looker's official shortcut map changes with the current location: dashboards, Looks, Explores, and the LookML IDE each have their own commands.
+Looker is Google Cloud's business intelligence tool for exploring data and sharing dashboards. Its shortcuts change with where you are: dashboards, Looks, Explores, and the LookML IDE each have keys to run, save, download, share, or schedule.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
index 2a2ce290..bbc3865f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/loom/content/intro.mdx
@@ -1 +1 @@
-Loom's desktop recorder, Chrome extension, and video player each have a small set of documented controls. This reference keeps those contexts separate.
+Loom records your screen and camera so you can send a short video instead of booking a meeting. Its keys are split three ways: the desktop recorder, the Chrome extension, and the video player for seeking, pausing, and full screen.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
index a709651f..0773ce60 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-finder/content/intro.mdx
@@ -1 +1 @@
-Finder's Mac shortcuts cover file actions, common folders, tabs, search, and the bars that shape a Finder window. Context changes with the selected item and the front Finder view.
+Finder is the Mac's file manager, open from the moment you log in. Its keys duplicate, eject, and get info on items, manage Finder windows and tabs, and jump straight to common folders or the Go to Folder box.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
index 1c7d1e52..c0f3e735 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/macos-spotlight/content/intro.mdx
@@ -1 +1 @@
-Spotlight shortcuts open the search panel, move through results, narrow the result type, and send a selected item to its owning app or Finder.
+Spotlight opens when you press Command and Space, ready to find apps, files, and quick answers on your Mac. These keys preview or reveal the selected result, move through matches, and filter results by category.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
index 1eb4e5bb..55eeda1e 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mastodon/content/intro.mdx
@@ -1 +1 @@
-Mastodon's web shortcuts search, open, and act on posts, move through columns, and use G-prefixed sequences to reach common views.
+Mastodon is a decentralized social network: you join one server and follow people across many. In the web app, these keys move through the timeline, reply to, boost, or quote the focused post, and use g sequences to open your main columns.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
index d3f147a3..21cc5000 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/matlab/content/intro.mdx
@@ -1 +1 @@
-MATLAB's Editor shortcuts cover files, navigation, search, code editing, sections, running, folding, and desktop focus. Platform-specific columns are kept separate where MathWorks changes the modifier.
+MATLAB is MathWorks' language and desktop for numeric computing, used by engineers and scientists. These Editor keys open and save files, jump through code and bookmarks, comment and indent, run sections, fold code, and move focus around the desktop.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
index 8d83bebc..b7645544 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mattermost/content/intro.mdx
@@ -1 +1 @@
-Mattermost shortcuts cover channel navigation, search, message editing, formatting, file uploads, calls, and desktop tab management.
+Mattermost is an open source team chat that organizations can host on their own servers. Its keys switch channels and search, reply to, edit, and format messages, control Calls, and manage tabs in the desktop app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
index 8fc015ee..a7cb87cd 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-edge/content/intro.mdx
@@ -1 +1 @@
-Microsoft Edge shortcuts cover tabs, windows, navigation, search, downloads, developer tools, and page display on Windows and macOS.
+Microsoft Edge is the browser built into Windows, running on the same Chromium engine as Chrome. Its keys open and switch tabs, focus the address bar and search, open page and developer tools, change zoom, and move through PDFs.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
index 7e6ece76..d9d713b3 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onedrive/content/intro.mdx
@@ -1 +1 @@
-OneDrive's Windows and web shortcuts cover file selection, navigation, sharing, details, list refreshes, and keyboard access to common file actions.
+OneDrive is Microsoft's cloud storage, and on work or school accounts it's where your Office files sync and get shared. These keys work in the OneDrive file list: rename, open, delete, select, and share files, change the view, and move focus around the browser.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
index d8838f4c..94f1327b 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-onenote/content/intro.mdx
@@ -1 +1 @@
-OneNote's Windows and Mac desktop shortcuts cover notes, notebooks, search, synchronization, page movement, and the common editing commands.
+OneNote sorts your notes into notebooks, sections, and pages, and you can type, draw, or clip content anywhere on a page. A shared set of keys handles the clipboard, search, and links; the rest are split between OneNote for Windows and OneNote for Mac.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
index cb987b81..c770cd95 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-outlook/content/intro.mdx
@@ -1 +1 @@
-Outlook's Windows shortcuts differ between the new Outlook app and classic Outlook. The groups below keep their mail, calendar, and message commands distinct.
+Outlook handles work email and calendars in Microsoft 365, and on Windows a new version is replacing the classic one. The keys are split the same way: new Outlook, classic Outlook mail, and calendar and navigation keys from classic Outlook.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
index d411323b..361ab0b2 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powerpoint/content/intro.mdx
@@ -1 +1 @@
-PowerPoint's keyboard map separates Windows authoring commands from the presentation controls shared by Windows and Mac. Use the ribbon key tips for commands that do not have a dedicated chord.
+PowerPoint builds the slide decks people present at work and school, next to Word and Excel in Microsoft 365. The authoring keys for Windows add slides, search the ribbon, and insert objects; the presenting keys move between slides and start a show or Presenter view.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
index 7ff204e3..29d09535 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-powertoys/content/intro.mdx
@@ -1 +1 @@
-PowerToys shortcuts start with the Shortcut Guide, PowerToys Run, Always On Top, Color Picker, FancyZones, and Workspaces. The utility bindings are global while PowerToys is running.
+PowerToys is a free set of Microsoft utilities that adds extra tools to Windows. Its keys open the Shortcut Guide, launch PowerToys Run, pin a window on top, pick a color from the screen, snap windows into FancyZones, and open Workspaces.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
index bfbc31f4..858a53dc 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-teams/content/intro.mdx
@@ -1 +1 @@
-Teams shortcuts cover search, chats, settings, pane focus, messaging, and meeting controls across the Windows and macOS desktop and web clients.
+Microsoft Teams puts work chat, channels, meetings, and calls in one app. Its keys search and open chats or channels, write and send messages, and let you mute, turn on your camera, share your screen, or raise your hand in a meeting.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
index ab2c89b0..b5f88df4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/microsoft-word/content/intro.mdx
@@ -1 +1 @@
-Word's desktop shortcut map covers editing, navigation, formatting, review, fields, and document views on Windows and macOS.
+Word is Microsoft's word processor for letters, reports, and long documents. Its keys save and print, move and select by word, line, or page, apply formatting and styles, add comments and track changes, and, on a Mac, run commands from the function keys.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
index e31890fb..424d455a 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/milanote/content/intro.mdx
@@ -1 +1 @@
-Milanote puts boards, notes, images, and tables on one canvas. This reference keeps board movement, text formatting, drawing, and desktop navigation separate so a shortcut is tied to the thing it changes.
+Milanote is a visual board for organizing ideas, where designers and writers plan projects with notes, images, and links. Its keys edit cards and move around a board, format text, work in tables and drawings, and switch boards or the app's appearance.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
index b3977613..253ba70f 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/miro/content/intro.mdx
@@ -1 +1 @@
-Miro's board shortcuts cover tools, object editing, canvas movement, and keyboard-only navigation. The reference separates single-key board tools from modifier shortcuts so accessibility settings and desktop-app commands stay visible.
+Miro is an online whiteboard where teams sketch, plan, and run workshops together. Single keys switch board tools, and others edit objects, move and zoom the canvas, step through toolbars, and control tabs in the desktop app.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
index ea8322f2..f9b4e730 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/monday-com/content/intro.mdx
@@ -1 +1 @@
-monday.com's shortcuts split between system navigation and board work. This page keeps cell editing, board movement, range selection, and account-level search in the same order as the current support reference.
+monday.com lays out a team's projects as tables of items, with a column for each status, owner, or date. Its keys open Quick Search, step through board cells, select items, add groups and columns, open the activity log, and export a board to Excel.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
index f3a4e8ca..a229df0c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/mozilla-thunderbird/content/intro.mdx
@@ -1 +1 @@
-Thunderbird changes its shortcut set with the active pane, so a key can select text while composing and messages while browsing a folder. This reference groups the documented mail, search, navigation, composing, address book, and calendar defaults without hiding those context changes.
+Thunderbird is Mozilla's desktop email app, keeping mail from several accounts, your calendar, and contacts in one window. Its keys compose, reply to, and file messages, find unread mail, help while you write, and get around the calendar and address book.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
index 00d7ce17..b61f3af7 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/neovim/content/intro.mdx
@@ -1 +1 @@
-Neovim keeps Vim's modal editing model and adds built-in behavior around it. This reference covers the core motions and operators plus the LSP, commenting, diagnostic, and terminal-mode defaults that distinguish a current Neovim session from a plugin-specific setup.
+Neovim is a modern fork of Vim, scriptable in Lua and shipped with a built-in language server client. Beyond Vim's movement and editing commands, its defaults cover LSP actions like rename and hover, commenting, diagnostics, Treesitter selection, windows, and terminal mode.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
index eb303ef9..410b2072 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/netflix/content/intro.mdx
@@ -1 +1 @@
-Netflix's computer player uses a short set of playback controls for pausing, seeking, volume, fullscreen mode, mute, and intro skipping. This reference keeps the player actions together and calls out the Windows app exceptions published by Netflix.
+Netflix streams films and series, and when you watch in a web browser you can run the player from the keyboard. These keys play and pause, skip back or forward, change the volume or mute, go full screen, and skip the intro.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
index db44876a..ed80b323 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notability/content/intro.mdx
@@ -1 +1 @@
-Notability's Mac shortcuts cover note creation, page movement, audio playback, search, formatting, recording, and the library. Toolbox and color shortcuts use the current positions in Notability's configurable controls.
+Notability records audio while you write or type, then plays it back in step with your notes. On a Mac, its keys create notes and turn pages, format text and search, pick toolbox tools, colors, and sizes by their position, and manage copied content.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
index fc4637b8..691cdb19 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notepad-plus-plus/content/intro.mdx
@@ -1 +1 @@
-Notepad++ keeps file, search, view, and editor commands in its Shortcut Mapper. This reference lists the stable default bindings documented in the official manual and calls out that users can remap the command or Scintilla layers.
+Notepad++ is a free text and code editor for Windows that opens quickly and handles many files in tabs. Its keys open, save, and switch tabs, duplicate, move, and delete lines, find and replace, zoom, and show or hide tool windows.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
index e9ffff1a..24d5caf4 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/notion/content/intro.mdx
@@ -1 +1 @@
-Notion combines app shortcuts, block editing, Markdown-style input, slash commands, and database actions. This reference keeps those layers together so a long page stays quick to build and navigate.
+Notion builds notes, wikis, and databases out of blocks you can move and reshape. Its keys search and open pages, format text with Markdown, change block types, move blocks around, and use the slash, at sign, and plus menus to add content.

From e0e798fa5d4495c99ef009cca9eee6d5936127ac Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:29:20 +0530
Subject: [PATCH 17/25] Rewrite the TLD, EPP, terminal app, self-host app, and
 license pages in MDX

Terminal and self-host apps get their first guide sections. The TLD page
no longer says no tool can look up an ending without RDAP, and its counts
stay computed from the records.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../(directories)/cli-apps/content/checks.mdx |  5 ++
 .../(directories)/cli-apps/content/health.mdx | 15 ++++
 .../(directories)/cli-apps/content/intro.mdx  |  1 +
 .../cli-apps/content/source-model.mdx         | 11 +++
 .../(directories)/cli-apps/content/types.mdx  |  3 +
 app/(site)/(directories)/cli-apps/page.tsx    | 28 ++++--
 .../epp-status-codes/content/bad-sign.mdx     |  8 +-
 .../content/client-and-server.mdx             |  6 +-
 .../epp-status-codes/content/intro.mdx        |  2 +-
 .../content/related-tools.mdx                 |  5 --
 .../content/see-your-codes.mdx                |  5 ++
 .../epp-status-codes/content/site-down.mdx    |  6 +-
 .../content/two-spellings.mdx                 |  6 +-
 .../content/why-it-was-set.mdx                |  4 +-
 .../(directories)/epp-status-codes/page.tsx   | 41 ++++-----
 .../self-host-apps/content/checks.mdx         |  5 ++
 .../self-host-apps/content/docker.mdx         |  5 ++
 .../self-host-apps/content/health.mdx         | 13 +++
 .../self-host-apps/content/intro.mdx          |  1 +
 .../self-host-apps/content/resources.mdx      | 14 +++
 .../(directories)/self-host-apps/page.tsx     | 28 ++++--
 .../content/all-licenses.mdx                  |  3 +
 .../content/choosing.mdx                      | 15 ++++
 .../content/compare.mdx                       |  3 +
 .../content/copyleft-trigger.mdx              | 12 +++
 .../content/disclaimer.mdx                    |  1 +
 .../content/families.mdx                      |  3 +
 .../content/family-details.mdx                |  8 ++
 .../content/faq.mdx                           | 21 +++++
 .../content/intro.mdx                         |  1 +
 .../content/open-vs-source-available.mdx      |  7 ++
 .../content/verdict-key.mdx                   | 20 +++++
 .../page.tsx                                  | 44 +++++----
 .../tld-directory/content/check-a-name.mdx    |  3 +
 .../tld-directory/content/dnssec.mdx          |  3 +
 .../tld-directory/content/how-many.mdx        |  1 +
 .../tld-directory/content/intro.mdx           |  1 +
 .../tld-directory/content/lookups.mdx         | 11 +++
 .../tld-directory/content/prices.mdx          |  3 +
 .../tld-directory/content/sources.mdx         |  7 ++
 .../tld-directory/content/types.mdx           | 11 +++
 .../(directories)/tld-directory/page.tsx      | 89 +++++++------------
 .../domain-lookup/content/article.mdx         |  2 +-
 43 files changed, 349 insertions(+), 132 deletions(-)
 create mode 100644 app/(site)/(directories)/cli-apps/content/checks.mdx
 create mode 100644 app/(site)/(directories)/cli-apps/content/health.mdx
 create mode 100644 app/(site)/(directories)/cli-apps/content/intro.mdx
 create mode 100644 app/(site)/(directories)/cli-apps/content/source-model.mdx
 create mode 100644 app/(site)/(directories)/cli-apps/content/types.mdx
 delete mode 100644 app/(site)/(directories)/epp-status-codes/content/related-tools.mdx
 create mode 100644 app/(site)/(directories)/epp-status-codes/content/see-your-codes.mdx
 create mode 100644 app/(site)/(directories)/self-host-apps/content/checks.mdx
 create mode 100644 app/(site)/(directories)/self-host-apps/content/docker.mdx
 create mode 100644 app/(site)/(directories)/self-host-apps/content/health.mdx
 create mode 100644 app/(site)/(directories)/self-host-apps/content/intro.mdx
 create mode 100644 app/(site)/(directories)/self-host-apps/content/resources.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/all-licenses.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/choosing.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/compare.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/copyleft-trigger.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/disclaimer.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/families.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/family-details.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/faq.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/intro.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/open-vs-source-available.mdx
 create mode 100644 app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/check-a-name.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/dnssec.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/how-many.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/intro.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/lookups.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/prices.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/sources.mdx
 create mode 100644 app/(site)/(directories)/tld-directory/content/types.mdx

diff --git a/app/(site)/(directories)/cli-apps/content/checks.mdx b/app/(site)/(directories)/cli-apps/content/checks.mdx
new file mode 100644
index 00000000..e56a946b
--- /dev/null
+++ b/app/(site)/(directories)/cli-apps/content/checks.mdx
@@ -0,0 +1,5 @@
+## How are apps chosen and checked?
+
+Each app is checked against its official repository or website, and we write its summary ourselves. The verified date on an app is when we last did that. Lists such as [Terminal Trove](https://terminaltrove.com/list/) and [awesome-cli-apps](https://github.com/agarrharr/awesome-cli-apps) help us find apps we missed, but their descriptions aren't copied.
+
+When a fact isn't published, such as a license or a release date, the app shows "unknown" instead of a guess.
diff --git a/app/(site)/(directories)/cli-apps/content/health.mdx b/app/(site)/(directories)/cli-apps/content/health.mdx
new file mode 100644
index 00000000..07a4de2d
--- /dev/null
+++ b/app/(site)/(directories)/cli-apps/content/health.mdx
@@ -0,0 +1,15 @@
+## What do the health labels mean?
+
+Health shows how recently the project's code changed when we reviewed it.
+
+| Health | Meaning |
+| --- | --- |
+| Active | Code pushed in the 110 days before review |
+| Slow | Last push 110 to 395 days before review |
+| Stale | No push for more than 395 days before review |
+| Archived | The repository is archived on GitHub |
+| Unknown | Not set at review |
+
+Health only changes when we review an app again, except Archived, which follows GitHub. Stars and the last commit date update from GitHub, so the last commit date is the fresher sign of activity.
+
+Most popular sorts by star count. Apps with no star count sort last.
diff --git a/app/(site)/(directories)/cli-apps/content/intro.mdx b/app/(site)/(directories)/cli-apps/content/intro.mdx
new file mode 100644
index 00000000..84043546
--- /dev/null
+++ b/app/(site)/(directories)/cli-apps/content/intro.mdx
@@ -0,0 +1 @@
+Command-line tools, TUI apps, shells, prompts, and AI agents that run in a terminal. Search for an app or a job, such as "git" or "disk usage", or filter by category, platform, and install method. Open an app to see its official links, license, and the date we last checked it.
diff --git a/app/(site)/(directories)/cli-apps/content/source-model.mdx b/app/(site)/(directories)/cli-apps/content/source-model.mdx
new file mode 100644
index 00000000..f9aa620b
--- /dev/null
+++ b/app/(site)/(directories)/cli-apps/content/source-model.mdx
@@ -0,0 +1,11 @@
+## What does the source model mean?
+
+It says whether you can read and change the code.
+
+| Source model | Meaning |
+| --- | --- |
+| Open source | Under a license that lets you use, change, and share the code |
+| Source available | You can read the code, but the license limits use or sharing |
+| Closed source | The code isn't public |
+
+Free to use and open source aren't the same thing, so check Pricing too. For what common licenses allow, see [software licenses for self-hosting](/software-licenses-for-self-hosting).
diff --git a/app/(site)/(directories)/cli-apps/content/types.mdx b/app/(site)/(directories)/cli-apps/content/types.mdx
new file mode 100644
index 00000000..e543c8f6
--- /dev/null
+++ b/app/(site)/(directories)/cli-apps/content/types.mdx
@@ -0,0 +1,3 @@
+## What is the difference between a CLI tool and a TUI app?
+
+A CLI tool takes a command and prints a result, like `ripgrep` searching files. A TUI app draws a full-screen interface you move around with the keyboard, like `lazygit`. The App type filter also covers shells, prompts, multiplexers, terminal emulators, and AI agents, and an app can have more than one type.
diff --git a/app/(site)/(directories)/cli-apps/page.tsx b/app/(site)/(directories)/cli-apps/page.tsx
index f267cbc7..73e290c8 100644
--- a/app/(site)/(directories)/cli-apps/page.tsx
+++ b/app/(site)/(directories)/cli-apps/page.tsx
@@ -1,7 +1,6 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { getRequiredPublishedPage } from "@/lib/page-registry";
 import {
@@ -23,6 +22,12 @@ import { HiddenDetails } from "@/app/ui/directories/hidden-details";
 import { cliAppPageSize, installLabels, labelForValue, platformOptions } from "./cli-app-options";
 import { CliAppFilters, CliAppResults } from "./cli-app-view";
 import { sortApps } from "./filters";
+import { proseClassName, proseSectionFlowClassName } from "@/app/ui/site/prose";
+import Checks from "./content/checks.mdx";
+import Health from "./content/health.mdx";
+import Intro from "./content/intro.mdx";
+import SourceModel from "./content/source-model.mdx";
+import Types from "./content/types.mdx";
 
 const typeLabels = new Map<string, string>(terminalAppTypeLabels);
 
@@ -137,14 +142,27 @@ export default async function CliAppsPage() {
           <PageHeader>
             <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
             <PageMeta updatedAt={directoryPage.updated_at} />
-            <ContentMarkdown markdown={directoryPage.intro_markdown} />
+            <Intro />
           </PageHeader>
         </EntryHero>
         <PageCanvas as="div" flow className="directory-results">
           <CliAppResults firstPage={defaultApps} total={apps.length} categoryLabels={categoryLabels} emptyVisual={<Doodle svg={siteDoodleStarArt} />} />
           <HiddenDetails prefix="cli-app" items={defaultApps.map((app) => ({ slug: app.slug, name: app.name, body: <CliAppDetailsBody app={app} /> }))} />
-        <DirectoryPageContent page={directoryPage} />
-          </PageCanvas>
+          <article className={`${proseClassName} ${proseSectionFlowClassName}`}>
+            <section>
+              <Types />
+            </section>
+            <section>
+              <Checks />
+            </section>
+            <section>
+              <Health />
+            </section>
+            <section>
+              <SourceModel />
+            </section>
+          </article>
+        </PageCanvas>
       </AppShell>
     </DirectoryQueryProvider>
   );
diff --git a/app/(site)/(directories)/epp-status-codes/content/bad-sign.mdx b/app/(site)/(directories)/epp-status-codes/content/bad-sign.mdx
index 96c7ea97..a723bc23 100644
--- a/app/(site)/(directories)/epp-status-codes/content/bad-sign.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/bad-sign.mdx
@@ -1,5 +1,9 @@
 ## Are status codes on my domain a bad sign?
 
-Usually not. A healthy domain normally carries at least one, and `clientTransferProhibited` is the default lock most registrars apply precisely because it protects you from an unauthorised transfer. Seeing it is a good sign, not a problem to fix.
+Usually not. Every domain carries at least one, and `clientTransferProhibited` is a lock most registrars turn on by default to stop unauthorized transfers.
 
-The ones actually worth acting on are the two hold codes, anything starting with `server`, and the lifecycle codes that mean a domain is on its way out. Everything else is either informational or something that clears on its own.
+Look into these:
+
+- `clientHold` or `serverHold`, because the site is offline.
+- Any code starting with `server`, because only the registry can remove it, so find out why it's there.
+- `autoRenewPeriod`, `redemptionPeriod`, or `pendingDelete`, because the domain is close to being lost.
diff --git a/app/(site)/(directories)/epp-status-codes/content/client-and-server.mdx b/app/(site)/(directories)/epp-status-codes/content/client-and-server.mdx
index 2e0e7698..2a6512e6 100644
--- a/app/(site)/(directories)/epp-status-codes/content/client-and-server.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/client-and-server.mdx
@@ -1,7 +1,7 @@
 ## What is the difference between client and server status codes?
 
-This is the useful split. Codes starting with `client` were set by your registrar, which means there is usually a switch in your account that turns them off. Codes starting with `server` were set by the registry that runs the ending, and no amount of clicking in your account will move them. If you are stuck, that prefix tells you whether to look in your own settings or pick up the phone.
+The prefix tells you who set the code and who can remove it.
 
-`client…` → your registrar, usually yours to change
+`client…` → Your registrar. You can usually turn it off in your account.
 
-`server…` → the registry, not yours to change
+`server…` → The registry that runs the ending. Only your registrar can ask it to remove the code.
diff --git a/app/(site)/(directories)/epp-status-codes/content/intro.mdx b/app/(site)/(directories)/epp-status-codes/content/intro.mdx
index bfaa4867..a292516b 100644
--- a/app/(site)/(directories)/epp-status-codes/content/intro.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/intro.mdx
@@ -1 +1 @@
-Every domain carries status codes, and they are usually why a transfer is refused, a site suddenly goes dark, or a registrar dashboard shows something alarming. They are written for software rather than people. Here is what each one means in plain terms, who set it, whether you can remove it yourself, and what to do about it.
+Find a domain status code to see what it means, who set it, and what to do about it. The tables cover the standard EPP codes, grouped by what you can do about them. If your site went offline, look for `clientHold` or `serverHold` first.
diff --git a/app/(site)/(directories)/epp-status-codes/content/related-tools.mdx b/app/(site)/(directories)/epp-status-codes/content/related-tools.mdx
deleted file mode 100644
index ef41084a..00000000
--- a/app/(site)/(directories)/epp-status-codes/content/related-tools.mdx
+++ /dev/null
@@ -1,5 +0,0 @@
-## Related tools
-
-The [registration lookup](/domain-lookup) shows every status on a domain alongside the rest of its record. If you are specifically trying to move a domain, the [transfer readiness check](/transfer-readiness) works out which of these are actually in your way, and for the life cycle codes the [expiry checker](/domain-expiry) lays out the stages in order.
-
-ICANN also publishes [its own reference for these codes](https://www.icann.org/resources/pages/epp-status-codes-2014-06-16-en) , which is worth reading if you want the formal definitions rather than the practical ones.
diff --git a/app/(site)/(directories)/epp-status-codes/content/see-your-codes.mdx b/app/(site)/(directories)/epp-status-codes/content/see-your-codes.mdx
new file mode 100644
index 00000000..33268fb7
--- /dev/null
+++ b/app/(site)/(directories)/epp-status-codes/content/see-your-codes.mdx
@@ -0,0 +1,5 @@
+## How do I see the status codes on my domain?
+
+Enter the domain in [domain lookup](/domain-lookup). It lists each code on the domain with what it means. To move a domain, [transfer readiness](/transfer-readiness) shows which public codes could block it. For the expiry stages, use the [domain expiry checker](/domain-expiry).
+
+For the formal definitions, see [ICANN's EPP status codes page](https://www.icann.org/resources/pages/epp-status-codes-2014-06-16-en).
diff --git a/app/(site)/(directories)/epp-status-codes/content/site-down.mdx b/app/(site)/(directories)/epp-status-codes/content/site-down.mdx
index afccdf45..17b2b14e 100644
--- a/app/(site)/(directories)/epp-status-codes/content/site-down.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/site-down.mdx
@@ -1,5 +1,5 @@
-## My domain is registered but the site is down. Why?
+## Why is my domain registered but my site down?
 
-Check for `client hold` or `server hold` first. Those two tell the registry to stop publishing the domain, so nothing under it resolves at all, while the registration itself remains perfectly valid. People lose hours in DNS tools before finding it, because DNS is not the problem. `client hold` is nearly always unpaid invoices or an unverified contact address.
+Check for a hold code first. `clientHold` and `serverHold` tell the registry to stop publishing the domain in DNS, so the site and email stop working while the registration stays valid.
 
-The other one worth knowing: `inactive` means no nameservers are on record. It looks alarming and usually is not, it just means nothing has been pointed anywhere yet.
+DNS tools will show that the domain doesn't resolve, but changing DNS records won't fix it. The hold has to come off at the registrar or registry.
diff --git a/app/(site)/(directories)/epp-status-codes/content/two-spellings.mdx b/app/(site)/(directories)/epp-status-codes/content/two-spellings.mdx
index 2d81dd22..18eec54f 100644
--- a/app/(site)/(directories)/epp-status-codes/content/two-spellings.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/two-spellings.mdx
@@ -1,5 +1,5 @@
-## Why is the same code written two different ways?
+## Why is the same code written two ways?
 
-You will see these in two spellings and they are the same thing. Your registrar and older tools show `clientTransferProhibited`. The modern registry data shows `client transfer prohibited`. Nothing has changed except the formatting, so both are listed below.
+They're the same code in two formats. Registrars and WHOIS show the EPP spelling, such as `clientTransferProhibited`. RDAP, the newer lookup protocol, writes `client transfer prohibited`. The tables show both.
 
-One that trips people up: `ok` and `active` are also the same status, not two different ones.
+One pair doesn't match by spelling: EPP's `ok` is RDAP's `active`.
diff --git a/app/(site)/(directories)/epp-status-codes/content/why-it-was-set.mdx b/app/(site)/(directories)/epp-status-codes/content/why-it-was-set.mdx
index e01eb2d8..a86e1366 100644
--- a/app/(site)/(directories)/epp-status-codes/content/why-it-was-set.mdx
+++ b/app/(site)/(directories)/epp-status-codes/content/why-it-was-set.mdx
@@ -1,5 +1,5 @@
 ## Why was this status code set on my domain?
 
-Why it was set. `server transfer prohibited` could be a trademark dispute, a court order, a registry security action, or a lock you asked for yourself and forgot about. The code carries no reason and the reason is not published anywhere public. Your registrar can usually find out.
+The code doesn't say, and the reason isn't public. `serverTransferProhibited`, for example, can come from a dispute, a court order, a registry security action, or a lock you asked for and forgot. Your registrar can usually find out.
 
-Registries occasionally publish codes that are entirely their own invention and appear in no standard. Those are shown exactly as the registry returned them, marked as having no explanation available, rather than being matched to something plausible-looking. If you hit one, the registry that runs the ending is the only place it is documented.
+Some registries return codes outside the standard set. [Domain lookup](/domain-lookup) shows them as returned, with no explanation, because only that registry's own documentation defines them.
diff --git a/app/(site)/(directories)/epp-status-codes/page.tsx b/app/(site)/(directories)/epp-status-codes/page.tsx
index 6764c694..f5955f62 100644
--- a/app/(site)/(directories)/epp-status-codes/page.tsx
+++ b/app/(site)/(directories)/epp-status-codes/page.tsx
@@ -14,7 +14,7 @@ import { proseSectionFlowClassName } from "../../../ui/site/prose";
 import BadSign from "./content/bad-sign.mdx";
 import ClientAndServer from "./content/client-and-server.mdx";
 import Intro from "./content/intro.mdx";
-import RelatedTools from "./content/related-tools.mdx";
+import SeeYourCodes from "./content/see-your-codes.mdx";
 import SiteDown from "./content/site-down.mdx";
 import TwoSpellings from "./content/two-spellings.mdx";
 import WhyItWasSet from "./content/why-it-was-set.mdx";
@@ -38,16 +38,6 @@ const GROUP_PILL: Record<StatusGroup, string> = {
 
 const GROUP_ORDER: StatusGroup[] = ["normal", "registrar_lock", "registry_lock", "in_progress", "lifecycle"];
 
-const GROUP_INTRO: Record<StatusGroup, string> = {
-  normal: "Nothing to do. These are what a healthy domain looks like.",
-  registrar_lock:
-    "Your registrar put these on. That matters, because it usually means you can take them off yourself from your account.",
-  registry_lock:
-    "The registry that runs the ending put these on. You cannot remove them yourself, and the route is through your registrar.",
-  in_progress: "Something is part way through. These clear on their own once the registry finishes.",
-  lifecycle: "Where the domain sits between being registered and being released.",
-};
-
 /** A paragraph written as `client…` → meaning renders as one source-path row. */
 function SourcePathParagraph({ children, ...props }: ComponentPropsWithoutRef<"p">) {
   const [code, description] = Array.isArray(children) ? children : [];
@@ -78,25 +68,12 @@ export default async function EppStatusCodesPage() {
         </PageHeader>
 
         <article className={`domain-reference-content ${proseSectionFlowClassName}`}>
-          <section>
-            <TwoSpellings />
-          </section>
-
-          <section>
-            <ClientAndServer components={{ p: SourcePathParagraph }} />
-          </section>
-
-          <section>
-            <SiteDown />
-          </section>
-
           {GROUP_ORDER.map((group) => (
             <section key={group}>
               <div className="domain-answer-head">
                 <h2>{STATUS_GROUP_TITLES[group]}</h2>
                 <StatePill tone={GROUP_TONE[group]}>{GROUP_PILL[group]}</StatePill>
               </div>
-              <p>{GROUP_INTRO[group]}</p>
               <div className="domain-table-scroll">
                 <table className="domain-table">
                   <thead>
@@ -137,7 +114,7 @@ export default async function EppStatusCodesPage() {
           ))}
 
           <section>
-            <WhyItWasSet />
+            <SiteDown />
           </section>
 
           <section>
@@ -145,7 +122,19 @@ export default async function EppStatusCodesPage() {
           </section>
 
           <section>
-            <RelatedTools />
+            <ClientAndServer components={{ p: SourcePathParagraph }} />
+          </section>
+
+          <section>
+            <TwoSpellings />
+          </section>
+
+          <section>
+            <WhyItWasSet />
+          </section>
+
+          <section>
+            <SeeYourCodes />
           </section>
         </article>
       </PageCanvas>
diff --git a/app/(site)/(directories)/self-host-apps/content/checks.mdx b/app/(site)/(directories)/self-host-apps/content/checks.mdx
new file mode 100644
index 00000000..9c9b6dcf
--- /dev/null
+++ b/app/(site)/(directories)/self-host-apps/content/checks.mdx
@@ -0,0 +1,5 @@
+## How are apps checked?
+
+Each app is checked against its official website, repository, docs, and image pages, and we write its summary ourselves. Facts we couldn't confirm show as unknown or "not verified" instead of a guess. The list includes open source, source-available, and closed-source apps, so check the license before you build on one. [Software licenses for self-hosting](/software-licenses-for-self-hosting) explains what each license lets you do.
+
+The full dataset is on [GitHub](https://github.com/stack127labs/stack127-datasets/tree/main/self-host-apps).
diff --git a/app/(site)/(directories)/self-host-apps/content/docker.mdx b/app/(site)/(directories)/self-host-apps/content/docker.mdx
new file mode 100644
index 00000000..f16eeb7a
--- /dev/null
+++ b/app/(site)/(directories)/self-host-apps/content/docker.mdx
@@ -0,0 +1,5 @@
+## What is the difference between an official and a community Docker image?
+
+An official image comes from the app's publisher. A community image is built by someone else, such as [LinuxServer.io](https://www.linuxserver.io/). It can work well, but the publisher doesn't support it, and updates depend on whoever maintains it. The Docker filter includes both, and each app says which it has.
+
+New to Docker? [Self-hosting for beginners](/self-hosting-for-beginners) covers installing it and writing a Compose file.
diff --git a/app/(site)/(directories)/self-host-apps/content/health.mdx b/app/(site)/(directories)/self-host-apps/content/health.mdx
new file mode 100644
index 00000000..50a81548
--- /dev/null
+++ b/app/(site)/(directories)/self-host-apps/content/health.mdx
@@ -0,0 +1,13 @@
+## What do the health labels mean?
+
+Health shows how recently the code changed, from the last commit in the app's public repository.
+
+| Health | Meaning |
+| --- | --- |
+| Active | A commit in the last year |
+| Slow | Last commit one to two years ago |
+| Stale | No commit for more than two years |
+| Archived | The repository is archived |
+| Not verified | We couldn't check it |
+
+Repository facts refresh automatically. Apps without a public repository get their health from our review instead. A quiet project isn't always abandoned, since some apps are simply finished, but check for security fixes before you rely on one.
diff --git a/app/(site)/(directories)/self-host-apps/content/intro.mdx b/app/(site)/(directories)/self-host-apps/content/intro.mdx
new file mode 100644
index 00000000..da8dfe7a
--- /dev/null
+++ b/app/(site)/(directories)/self-host-apps/content/intro.mdx
@@ -0,0 +1 @@
+Apps you can run on your own server, from photo libraries and chat to monitoring and AI tools. Search by name or job, or filter by category, the RAM you have, Docker support, and license. Open an app for its install options, resource estimates, and official links.
diff --git a/app/(site)/(directories)/self-host-apps/content/resources.mdx b/app/(site)/(directories)/self-host-apps/content/resources.mdx
new file mode 100644
index 00000000..653de747
--- /dev/null
+++ b/app/(site)/(directories)/self-host-apps/content/resources.mdx
@@ -0,0 +1,14 @@
+## How much RAM and storage does a self-hosted app need?
+
+Each app shows our estimate for a typical small setup. We base it on the publisher's guidance when there is some. Real use depends on your users and data, so treat it as a starting point.
+
+The RAM and storage filters use the low end of each estimate, and each choice includes the smaller ones. "Up to 2GB" shows every app that can start in 2 GB or less.
+
+| Storage | Low end of the estimate |
+| --- | --- |
+| Tiny | Under 1 GB |
+| Low | 1 to 10 GB |
+| Medium | 10 to 100 GB |
+| High | 100 GB or more |
+
+To check whether several apps fit on one server, use the [self-hosted app resource planner](/self-hosted-app-resource-planner).
diff --git a/app/(site)/(directories)/self-host-apps/page.tsx b/app/(site)/(directories)/self-host-apps/page.tsx
index b0207cb2..672d3b32 100644
--- a/app/(site)/(directories)/self-host-apps/page.tsx
+++ b/app/(site)/(directories)/self-host-apps/page.tsx
@@ -1,7 +1,6 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import { FaGithub } from "react-icons/fa6";
 import { getRequiredPublishedPage } from "@/lib/page-registry";
@@ -25,6 +24,12 @@ import { DirectoryTitleIcon } from "@/app/ui/directories/directory-title-icon";
 import { PageHeader } from "@/app/ui/site/page-header";
 import { EntryHero } from "@/app/ui/site/entry-hero";
 import { siteSpotSelfHostAppsArt } from "../../art/site--spot-self-host-apps";
+import { proseClassName, proseSectionFlowClassName } from "@/app/ui/site/prose";
+import Checks from "./content/checks.mdx";
+import Docker from "./content/docker.mdx";
+import Health from "./content/health.mdx";
+import Intro from "./content/intro.mdx";
+import Resources from "./content/resources.mdx";
 
 // The static page is the default view: most popular first, no filters, page 1.
 // Filters, search, sort, and other pages load in the browser from the search API.
@@ -45,7 +50,7 @@ export default async function SelfHostAppsPage() {
         target="_blank"
       >
         <FaGithub aria-hidden="true" size={14} />
-        View on Github
+        View on GitHub
       </a>
     </div>
   );
@@ -63,13 +68,26 @@ export default async function SelfHostAppsPage() {
             <PageHeader>
               <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
               <PageMeta updatedAt={directoryPage.updated_at} />
-              <ContentMarkdown markdown={directoryPage.intro_markdown} />
+              <Intro />
             </PageHeader>
           </EntryHero>
           <PageCanvas as="div" flow className="directory-results">
             <SelfHostAppResults emptyVisual={<Doodle svg={siteDoodleSparkArt} />} />
             <HiddenDetails prefix="self-host-app" items={detailApps.map((app) => ({ slug: app.slug, name: app.name, body: <AppDetailsBody app={app} /> }))} />
-          <DirectoryPageContent page={directoryPage} />
+            <article className={`${proseClassName} ${proseSectionFlowClassName}`}>
+              <section>
+                <Resources />
+              </section>
+              <section>
+                <Docker />
+              </section>
+              <section>
+                <Health />
+              </section>
+              <section>
+                <Checks />
+              </section>
+            </article>
           </PageCanvas>
         </AppShell>
       </SelfHostAppsSearchProvider>
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/all-licenses.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/all-licenses.mdx
new file mode 100644
index 00000000..286e3663
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/all-licenses.mdx
@@ -0,0 +1,3 @@
+## License details by family
+
+Each card says what the license asks of you and links to its official text. When the [self-hosted apps](/self-host-apps) directory lists apps under a license, the card links to them too.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/choosing.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/choosing.mdx
new file mode 100644
index 00000000..0fcb2918
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/choosing.mdx
@@ -0,0 +1,15 @@
+## Which license should I choose for my self-hosted app?
+
+Start from what you want to allow and what you want to prevent.
+
+| If you want | Consider |
+| --- | --- |
+| As many users as possible, and you don't mind who profits | MIT, or Apache-2.0 for an explicit patent grant |
+| Changes to your files shared back, without rules for whole products | MPL-2.0 |
+| A library others can use in closed products | LGPL-3.0, or MIT |
+| No closed, hosted copies of your changed app | AGPL-3.0 |
+| A business on top of open source code | AGPL-3.0 plus a paid commercial license. You need the rights to all the code, often through contributor agreements. |
+| To block resale as a managed service, and you accept losing the open source label | BSL 1.1 or FSL, which turn into open source licenses after a set time. Elastic-2.0 or Sustainable Use if you want no conversion date. |
+| Free personal use and paid company use | PolyForm Noncommercial. Expect fewer business users. |
+
+Whatever you choose, add a short note beside the LICENSE file that says in plain words what self-hosters may do.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/compare.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/compare.mdx
new file mode 100644
index 00000000..46266b4b
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/compare.mdx
@@ -0,0 +1,3 @@
+## What does each license let you do?
+
+The table shows what each license allows for the things self-hosters do: run it, use it at work, host it for others, change it, and pass it on. It reports what the license text permits, not what a company policy will approve.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/copyleft-trigger.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/copyleft-trigger.mdx
new file mode 100644
index 00000000..fc5593ba
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/copyleft-trigger.mdx
@@ -0,0 +1,12 @@
+## When does GPL or AGPL require you to share source code?
+
+GPL applies when you distribute a copy, changed or not. Then you must pass on the license and make the source available to whoever gets the copy. Running it on your own server, or inside your company, isn't distribution.
+
+AGPL adds a network rule in [section 13](https://www.gnu.org/licenses/agpl-3.0.html#section13). If you change the program and people use your changed version over a network, you must offer them its source. That rule stops a changed, hosted copy from staying closed, which is why AGPL is common for self-hosted web apps.
+
+Two points people often misread:
+
+- Running unmodified AGPL software doesn't trigger section 13, even when family, coworkers, or customers log in.
+- If you're the only user of your changed version, there's no one you owe source to.
+
+EUPL and OSL have network rules too. Their cards below explain them.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/disclaimer.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/disclaimer.mdx
new file mode 100644
index 00000000..da63abdf
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/disclaimer.mdx
@@ -0,0 +1 @@
+This is a practical guide, not legal advice. If money, customers, or a commercial product are involved, read the project's license and get legal help.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/families.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/families.mdx
new file mode 100644
index 00000000..b8109710
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/families.mdx
@@ -0,0 +1,3 @@
+## What are the main types of software license?
+
+Most licenses here fall into four families. What separates them is what you owe when the software leaves your hands.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/family-details.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/family-details.mdx
new file mode 100644
index 00000000..247294fb
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/family-details.mdx
@@ -0,0 +1,8 @@
+| Family | Examples | What you owe |
+| --- | --- | --- |
+| Permissive | MIT, Apache-2.0, BSD | Keep the copyright notices when you pass it on. Your fork can stay closed. |
+| Weak copyleft | MPL-2.0, LGPL | Changes to the covered files or library stay open when you ship them. The rest of your product stays yours. |
+| Copyleft | GPL, AGPL | The whole program stays open when you pass it on. AGPL adds a network rule, explained below. |
+| Restricted | SSPL, Elastic, BSL, FSL, PolyForm | The code is public, but the terms limit some uses, often hosting it as a service or competing with the publisher. These are source-available, not open source. |
+
+Self-hosting a restricted app for yourself or your company is usually allowed, but each license's own text decides. Public domain dedications work like permissive licenses. Creative Commons licenses usually cover docs and media, not the app's code.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/faq.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/faq.mdx
new file mode 100644
index 00000000..52efd1ee
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/faq.mdx
@@ -0,0 +1,21 @@
+## Questions people ask
+
+### Can my company change a GPL app and keep the changes private?
+
+Yes, as long as the copies stay inside the company. GPL applies when you distribute, and internal use isn't distribution.
+
+### Is code on GitHub automatically open source?
+
+No. Code is open source only when its license meets the Open Source Definition. SSPL, BSL, FSL, Elastic, and PolyForm code is often public, and none of those licenses are open source.
+
+### Can I sell hosting for an MIT-licensed app?
+
+Yes. Permissive licenses allow it. That's one reason some projects later move to AGPL or a source-available license.
+
+### Do two BSL 1.1 projects grant the same rights?
+
+No. Each project sets its own Additional Use Grant and change date, so read both.
+
+### Can I use code from a repository with no license?
+
+First look for a license grant in the README, the docs, or other files. If there's none anywhere, normal copyright applies, so treat it as all rights reserved. [GitHub's licensing guidance](https://docs.github.com/en/repositories/managing-your-repositorys-settings-and-features/customizing-your-repository/licensing-a-repository) explains this.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/intro.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/intro.mdx
new file mode 100644
index 00000000..c3923f39
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/intro.mdx
@@ -0,0 +1 @@
+Check what a license lets you do before you run, change, or host a self-hosted app. Compare the common licenses in one table, then open a license for its obligations, its official text, and the apps that use it.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/open-vs-source-available.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/open-vs-source-available.mdx
new file mode 100644
index 00000000..94d0a440
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/open-vs-source-available.mdx
@@ -0,0 +1,7 @@
+## What is the difference between open source and source-available?
+
+Open source means anyone may use, study, change, and share the software for any purpose, including commercial use, as set out in the [Open Source Definition](https://opensource.org/osd). MIT, Apache-2.0, GPL, and AGPL all qualify. A duty to share source isn't a limit on use, so copyleft licenses count.
+
+Source-available means the code is public, but the terms limit some uses. SSPL, Elastic License, BSL, FSL, and PolyForm each limit something different.
+
+A public repository or a free download doesn't tell you which one you have. Read the license before company use, redistribution, or paid hosting.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
new file mode 100644
index 00000000..24c38ff8
--- /dev/null
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
@@ -0,0 +1,20 @@
+## How do I read the license table?
+
+| Column | The question it answers |
+| --- | --- |
+| Self-host | Can you run it on your own hardware, for yourself and your household? |
+| Company | Can it run on a work server for internal use? |
+| OSI | Is it approved by the Open Source Initiative? `pd` means a public domain dedication, which works like open source without being on the list. |
+| Service | Can you host it for people outside your household or company, including paid hosting? |
+| Modify | Can you change the code, and what do you owe when your changes leave your server? |
+| Redistribute | Can you pass it on in images, appliances, forks, or products? |
+| Copyleft | Do conditions travel with the code, and how far? |
+
+| Value | Meaning |
+| --- | --- |
+| **yes** | Allowed. Routine notices or attribution may still apply. |
+| **careful** | Allowed with a real obligation, such as sharing source, share-alike, or a limit on competing. The license's card explains it. |
+| **depends** | Project terms, a chosen option, or a separate agreement decide. |
+| **no** | The license doesn't allow it. |
+
+WTFPL, for example, allows everything, but some company policies ban it anyway. That's a policy question, not a license one. The [self-hosted apps](/self-host-apps) directory uses the same license names, so you can filter apps by license there.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx b/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
index 578f6d3c..982a5ecc 100644
--- a/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
@@ -1,8 +1,7 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
-import type { Components } from "react-markdown";
+import type { MDXComponents } from "mdx/types";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import Link from "next/link";
 import { getDirectoryLicenseCounts } from "@/lib/apps";
@@ -27,6 +26,17 @@ import {
   type Verdict,
 } from "@/lib/software-licenses";
 import { softwareLicensesForSelfHostingLicenseFamiliesArt } from "./art/software-licenses-for-self-hosting--license-families";
+import AllLicenses from "./content/all-licenses.mdx";
+import Choosing from "./content/choosing.mdx";
+import Compare from "./content/compare.mdx";
+import CopyleftTrigger from "./content/copyleft-trigger.mdx";
+import Disclaimer from "./content/disclaimer.mdx";
+import Faq from "./content/faq.mdx";
+import FamilyDetails from "./content/family-details.mdx";
+import Families from "./content/families.mdx";
+import Intro from "./content/intro.mdx";
+import OpenVsSourceAvailable from "./content/open-vs-source-available.mdx";
+import VerdictKey from "./content/verdict-key.mdx";
 
 /** Verdict table columns, in the order people decide things. */
 const verdictColumns = [
@@ -37,14 +47,12 @@ const verdictColumns = [
   { key: "redistribute", label: "Redistribute" },
 ] as const;
 
-const licenseMarkdownComponents: Components = {
+/** Bold verdict words in the table key take the table's verdict colors. */
+const verdictComponents: MDXComponents = {
   strong({ children }) {
     const verdict = typeof children === "string" && ["yes", "careful", "depends", "no"].includes(children) ? children : null;
     return <strong className={verdict ? `license-verdict-${verdict}` : undefined}>{children}</strong>;
   },
-  a({ children, href }) {
-    return href?.startsWith("/") ? <Link href={href}>{children}</Link> : <a href={href} rel="noreferrer" target="_blank">{children}</a>;
-  },
 };
 
 const startHereLinks = [
@@ -193,17 +201,17 @@ export default async function SoftwareLicensesPage() {
         <PageHeader bordered className={proseClassName}>
           <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
           <PageMeta updatedAt={directoryPage.updated_at} />
-          <ContentMarkdown markdown={directoryPage.intro_markdown} components={{ p: ({ children }) => <p className={proseLedeClassName}>{children}</p> }} />
-          <DirectoryPageContent page={directoryPage} section="disclaimer" components={{ p: ({ children }) => <p className="license-disclaimer">{children}</p> }} />
+          <Intro components={{ p: ({ children }) => <p className={proseLedeClassName}>{children}</p> }} />
+          <Disclaimer components={{ p: ({ children }) => <p className="license-disclaimer">{children}</p> }} />
         </PageHeader>
 
         <section className="license-section license-structured-section" id="verdict-table">
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
-            <DirectoryPageContent page={directoryPage} section="copy-1" components={licenseMarkdownComponents} />
+            <Compare />
           </div>
           <VerdictTable />
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
-            <DirectoryPageContent page={directoryPage} section="copy-2" components={licenseMarkdownComponents} />
+            <VerdictKey components={verdictComponents} />
           </div>
         </section>
 
@@ -211,24 +219,24 @@ export default async function SoftwareLicensesPage() {
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="license-families"
         >
-          <DirectoryPageContent page={directoryPage} section="copy-3" components={licenseMarkdownComponents} />
+          <Families />
           <MarkerArt
             caption="The four license families differ by what must stay open and when that obligation begins."
             svg={softwareLicensesForSelfHostingLicenseFamiliesArt}
           />
-          <DirectoryPageContent page={directoryPage} section="copy-4" components={licenseMarkdownComponents} />
+          <FamilyDetails />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="copyleft-trigger"
         >
-          <DirectoryPageContent page={directoryPage} section="copy-5" components={licenseMarkdownComponents} />
+          <CopyleftTrigger />
         </section>
 
         <section className="license-section license-structured-section" id="all-licenses">
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
-            <DirectoryPageContent page={directoryPage} section="copy-6" components={licenseMarkdownComponents} />
+            <AllLicenses />
           </div>
 
           {licenseGroups.map((group) => {
@@ -259,21 +267,21 @@ export default async function SoftwareLicensesPage() {
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="open-source-vs-source-available"
         >
-          <DirectoryPageContent page={directoryPage} section="copy-7" components={licenseMarkdownComponents} />
+          <OpenVsSourceAvailable />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="choosing-a-license"
         >
-          <DirectoryPageContent page={directoryPage} section="copy-8" components={licenseMarkdownComponents} />
+          <Choosing />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="faq"
         >
-          <DirectoryPageContent page={directoryPage} section="copy-9" components={licenseMarkdownComponents} />
+          <Faq />
         </section>
       </PageCanvas>
     </AppShell>
diff --git a/app/(site)/(directories)/tld-directory/content/check-a-name.mdx b/app/(site)/(directories)/tld-directory/content/check-a-name.mdx
new file mode 100644
index 00000000..55c73d03
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/check-a-name.mdx
@@ -0,0 +1,3 @@
+## How do I check a name under one of these endings?
+
+Use the [domain availability checker](/domain-availability) for one name, or [multi-TLD availability](/multi-tld-availability) to try one name across many endings. For a registered domain's registrar, dates, and status codes, use [domain lookup](/domain-lookup).
diff --git a/app/(site)/(directories)/tld-directory/content/dnssec.mdx b/app/(site)/(directories)/tld-directory/content/dnssec.mdx
new file mode 100644
index 00000000..6c9be6ad
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/dnssec.mdx
@@ -0,0 +1,3 @@
+## Does a signed extension mean my domain uses DNSSEC?
+
+No. "Signed" means the ending itself has a DS record in the root zone, so domains under it can use DNSSEC. Each domain still needs to be signed by its DNS host, with its own DS record added through the registrar. To check one domain, use the [DNSSEC checker](/dnssec-checker).
diff --git a/app/(site)/(directories)/tld-directory/content/how-many.mdx b/app/(site)/(directories)/tld-directory/content/how-many.mdx
new file mode 100644
index 00000000..316a6848
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/how-many.mdx
@@ -0,0 +1 @@
+## How many domain extensions are there?
diff --git a/app/(site)/(directories)/tld-directory/content/intro.mdx b/app/(site)/(directories)/tld-directory/content/intro.mdx
new file mode 100644
index 00000000..cd34d7a1
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/intro.mdx
@@ -0,0 +1 @@
+Every top-level domain in the root zone, with its type, its operator, whether we can look up its registration data, and whether it's signed with DNSSEC. Search by ending or operator, or filter the list. The data comes from IANA, and the refresh date is below the table.
diff --git a/app/(site)/(directories)/tld-directory/content/lookups.mdx b/app/(site)/(directories)/tld-directory/content/lookups.mdx
new file mode 100644
index 00000000..d07e5369
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/lookups.mdx
@@ -0,0 +1,11 @@
+## Why can't some domain extensions be looked up?
+
+Our domain tools read registration data over RDAP, and some registries don't offer it. The Lookups column shows where each ending stands.
+
+| Lookups | What it means |
+| --- | --- |
+| Yes | The registry is in [IANA's RDAP directory](https://data.iana.org/rdap/dns.json). |
+| Via our own list | The registry runs RDAP but isn't in IANA's directory. We added it after testing it with a real domain. The name under the label runs the service. |
+| Cannot check | We know of no RDAP service for this ending, so our lookup and availability tools can't answer for it. |
+
+A "Cannot check" ending may still have a WHOIS server or a lookup on the registry's website. Its page in [IANA's root zone database](https://www.iana.org/domains/root/db) lists both. [Domain lookup](/domain-lookup) explains how RDAP and WHOIS differ.
diff --git a/app/(site)/(directories)/tld-directory/content/prices.mdx b/app/(site)/(directories)/tld-directory/content/prices.mdx
new file mode 100644
index 00000000..b539c4e3
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/prices.mdx
@@ -0,0 +1,3 @@
+## Why aren't domain prices listed?
+
+Prices change too often to keep right here. They vary by registrar, by promotion, and by whether the name is premium, so check at a registrar before you buy, and check the renewal price too.
diff --git a/app/(site)/(directories)/tld-directory/content/sources.mdx b/app/(site)/(directories)/tld-directory/content/sources.mdx
new file mode 100644
index 00000000..e4426092
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/sources.mdx
@@ -0,0 +1,7 @@
+## Where does this data come from?
+
+- Type and operator: [IANA's root zone database](https://www.iana.org/domains/root/db).
+- DNSSEC: DS records in the [root zone file](https://www.internic.net/domain/root.zone).
+- Lookups: [IANA's RDAP directory](https://data.iana.org/rdap/dns.json), plus the few registries we added by hand.
+
+A script rebuilds the table from these sources. If a source changes shape, the script stops instead of saving a partial list.
diff --git a/app/(site)/(directories)/tld-directory/content/types.mdx b/app/(site)/(directories)/tld-directory/content/types.mdx
new file mode 100644
index 00000000..82d9ce1f
--- /dev/null
+++ b/app/(site)/(directories)/tld-directory/content/types.mdx
@@ -0,0 +1,11 @@
+## What do the domain extension types mean?
+
+The type is IANA's label for how an ending is run, and it hints at who can register under it.
+
+| Type | What it is |
+| --- | --- |
+| generic | Most endings, such as `.com` and `.xyz`. Most arrived from 2013 on, through ICANN's New gTLD Program. Brand endings, such as `.bmw`, are used only by their owner. |
+| country-code | Two-letter endings for a country or territory, such as `.uk`, plus versions in other scripts, such as `.中国`, shown with their `xn--` form. Each sets its own rules. |
+| sponsored | Endings for one community, such as `.edu` and `.gov`, often with eligibility rules. |
+| generic-restricted | Older generic endings that launched with limits on who could register, such as `.biz` and `.pro`. |
+| infrastructure | `.arpa`, used for reverse DNS. You can't register a name under it. |
diff --git a/app/(site)/(directories)/tld-directory/page.tsx b/app/(site)/(directories)/tld-directory/page.tsx
index 7a98ccbd..bf0b69f9 100644
--- a/app/(site)/(directories)/tld-directory/page.tsx
+++ b/app/(site)/(directories)/tld-directory/page.tsx
@@ -1,10 +1,8 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import "@/app/(site)/(tools)/(domain)/domain-tools.css";
-import Link from "next/link";
 import { AppShell } from "../../../ui/site/app-shell";
 import { DomainToolsSidebar } from "@/app/(site)/(tools)/(domain)/domain-tools-sidebar";
 import { TldTable, type TldRow } from "./tld-table";
@@ -12,15 +10,30 @@ import directory from "@/lib/domain/data/tld-directory.json" with { type: "json"
 import { DirectoryTitleIcon } from "@/app/ui/directories/directory-title-icon";
 import { PageHeader } from "../../../ui/site/page-header";
 import { proseSectionFlowClassName } from "../../../ui/site/prose";
+import CheckAName from "./content/check-a-name.mdx";
+import Dnssec from "./content/dnssec.mdx";
+import HowMany from "./content/how-many.mdx";
+import Intro from "./content/intro.mdx";
+import Lookups from "./content/lookups.mdx";
+import Prices from "./content/prices.mdx";
+import Sources from "./content/sources.mdx";
+import Types from "./content/types.mdx";
 
 export default async function TldDirectoryPage() {
   const directoryPage = await getRequiredDirectoryPage("tld-directory");
   const rows = directory.rows as TldRow[];
-  const counts = directory.counts;
+  const signed = rows.filter((row) => row.dnssec).length;
+  const lookups = rows.filter((row) => row.rdap !== "none").length;
+  const refreshedOn = new Date(`${directory.fetchedAt}T00:00:00Z`).toLocaleDateString("en-US", {
+    day: "numeric",
+    month: "long",
+    timeZone: "UTC",
+    year: "numeric",
+  });
 
   return (
     <AppShell
-      mainLabel="TLD Directory"
+      mainLabel="TLD directory"
       menuLabel="Domain tools"
       sidebar={<DomainToolsSidebar />}
       sidebarLabel="Domain tools sidebar"
@@ -29,86 +42,46 @@ export default async function TldDirectoryPage() {
         <PageHeader>
           <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
           <PageMeta updatedAt={directoryPage.updated_at} />
-          <ContentMarkdown markdown={directoryPage.intro_markdown} />
+          <Intro />
         </PageHeader>
 
         <TldTable rows={rows} />
 
         <hr className="domain-divider" />
 
-          <article className={`domain-reference-content ${proseSectionFlowClassName}`}>
+        <article className={`domain-reference-content ${proseSectionFlowClassName}`}>
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-1" />
+            <HowMany />
             <p>
-              {counts.total.toLocaleString("en-US")} of them exist right now. Of those,{" "}
-              {counts.signed.toLocaleString("en-US")} are signed with DNSSEC and{" "}
-              {counts.rdapCovered.toLocaleString("en-US")} publish registration data that
-              can be looked up. The number moves as endings are added and retired, so the
-              table above was last refreshed on {directory.fetchedAt} from root zone list
-              version {directory.tldListVersion}.
+              There are {rows.length.toLocaleString("en-US")} top-level domains in the root zone. Of those,{" "}
+              {signed.toLocaleString("en-US")} are signed with DNSSEC, and we can look up registration data
+              for {lookups.toLocaleString("en-US")}. The table was last refreshed on {refreshedOn}, from root
+              zone list version {directory.tldListVersion}.
             </p>
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-2" />
-            <div className="domain-table-scroll">
-              <table className="domain-table">
-                <tbody>
-                  <tr>
-                    <th>generic</th>
-                    <td>
-                      Open endings like <code>.com</code>, <code>.app</code> and{" "}
-                      <code>.xyz</code>. Most of the root is this, and most of it arrived
-                      after 2013 when ICANN opened applications.
-                    </td>
-                  </tr>
-                  <tr>
-                    <th>country-code</th>
-                    <td>
-                      Two letter endings tied to a country or territory. Each is run under
-                      its own national rules, which is why <code>.de</code> and{" "}
-                      <code>.uk</code> behave nothing like each other or like{" "}
-                      <code>.com</code>.
-                    </td>
-                  </tr>
-                  <tr>
-                    <th>sponsored</th>
-                    <td>
-                      Endings run for a defined community with eligibility rules, such as{" "}
-                      <code>.edu</code> or <code>.aero</code>. You cannot simply register
-                      one.
-                    </td>
-                  </tr>
-                  <tr>
-                    <th>infrastructure</th>
-                    <td>
-                      <code>.arpa</code>, used by the internet&apos;s own plumbing rather
-                      than by anyone building a site.
-                    </td>
-                  </tr>
-                </tbody>
-              </table>
-            </div>
+            <Types />
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-3" />
+            <Lookups />
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-4" />
+            <Dnssec />
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-5" />
+            <Sources />
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-6" />
+            <Prices />
           </section>
 
           <section>
-            <DirectoryPageContent page={directoryPage} section="copy-7" />
+            <CheckAName />
           </section>
         </article>
       </PageCanvas>
diff --git a/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx b/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
index 90c77a74..4e84473a 100644
--- a/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
+++ b/app/(site)/(tools)/(domain)/domain-lookup/content/article.mdx
@@ -4,7 +4,7 @@ RDAP is the newer way to read public domain registration data, and it replaced W
 
 Since 28 January 2025, ICANN no longer requires generic registries and registrars to run WHOIS, except for `.com`, `.name`, and `.post`. [ICANN's RDAP page](https://www.icann.org/rdap) explains the change. This lookup uses RDAP only.
 
-Country endings such as `.uk` or `.de` set their own rules. Some publish RDAP and some don't. When an ending has none, the result shows `Cannot determine`, which says nothing about whether the name is registered. Use the registry's own lookup, listed in the [TLD directory](/tld-directory).
+Country endings such as `.uk` or `.de` set their own rules. Some publish RDAP and some don't. When an ending has none, the result shows `Cannot determine`, which says nothing about whether the name is registered. Use the registry's own lookup, which the ending's page in [IANA's root zone database](https://www.iana.org/domains/root/db) links to. The [TLD directory](/tld-directory) shows which endings have RDAP.
 
 A WHOIS site can show different details because it reads WHOIS text or an older saved copy. Owner details are a separate question, covered in the [registrant lookup](/domain-owner).
 

From 2b91da1a1974dbb84f106ca4c1b155c81b573209 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:29:20 +0530
Subject: [PATCH 18/25] Rewrite launch directories, platform fees, and the
 eight fee categories in MDX

Each fee category gets its own intro and a short guide with a worked
example from the records. The hub title drops its hard-coded count.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../content/corrections.mdx                   |  3 +
 .../content/free-listings.mdx                 |  5 ++
 .../content/how-we-check.mdx                  | 17 ++++
 .../launch-directories/content/intro.mdx      |  1 +
 .../content/launch-timing.mdx                 |  5 ++
 .../launch-directories/content/link-types.mdx | 22 ++++++
 .../content/recommended-order.mdx             |  7 ++
 .../launch-directory-guide.tsx                | 78 +++++--------------
 .../(directories)/launch-directories/page.tsx |  8 +-
 .../content/apps-and-software/article.mdx     | 17 ++++
 .../content/apps-and-software/intro.mdx       |  2 +-
 .../content/creative-assets/article.mdx       | 11 +++
 .../content/creative-assets/intro.mdx         |  2 +-
 .../creators-and-communities/article.mdx      | 19 +++++
 .../creators-and-communities/intro.mdx        |  2 +-
 .../digital-products-and-stores/article.mdx   | 22 ++++++
 .../digital-products-and-stores/intro.mdx     |  2 +-
 .../platform-fees/[section]/content/index.ts  | 24 ++++--
 .../content/music-and-audio/article.mdx       | 15 ++++
 .../content/music-and-audio/intro.mdx         |  2 +-
 .../[section]/content/payments/article.mdx    | 24 ++++++
 .../[section]/content/payments/intro.mdx      |  2 +-
 .../content/teaching-and-courses/article.mdx  | 17 ++++
 .../content/teaching-and-courses/intro.mdx    |  2 +-
 .../content/writing-and-books/article.mdx     | 19 +++++
 .../content/writing-and-books/intro.mdx       |  2 +-
 .../platform-fees/content/article.mdx         | 28 +++++++
 .../platform-fees/content/intro.mdx           |  2 +-
 .../(directories)/platform-fees/page.tsx      |  3 +-
 29 files changed, 284 insertions(+), 79 deletions(-)
 create mode 100644 app/(site)/(directories)/launch-directories/content/corrections.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/free-listings.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/how-we-check.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/intro.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/launch-timing.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/link-types.mdx
 create mode 100644 app/(site)/(directories)/launch-directories/content/recommended-order.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/creative-assets/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/payments/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/article.mdx
 create mode 100644 app/(site)/(directories)/platform-fees/content/article.mdx

diff --git a/app/(site)/(directories)/launch-directories/content/corrections.mdx b/app/(site)/(directories)/launch-directories/content/corrections.mdx
new file mode 100644
index 00000000..b263538a
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/corrections.mdx
@@ -0,0 +1,3 @@
+## Found something wrong?
+
+Email [stack127@proton.me](mailto:stack127@proton.me) with the site's name and the page that shows the right answer. Each place's details also have a correction link.
diff --git a/app/(site)/(directories)/launch-directories/content/free-listings.mdx b/app/(site)/(directories)/launch-directories/content/free-listings.mdx
new file mode 100644
index 00000000..87b8a7bb
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/free-listings.mdx
@@ -0,0 +1,5 @@
+## What does a free listing ask for?
+
+Some free plans ask for something in return, such as a backlink to the directory, proof that you own the domain, or votes and comments on other launches. Where we checked the free flow, the card lists these under Free plan.
+
+The Free without required backlink filter shows only places where we checked the free flow and found no required backlink. Free places we haven't checked yet are left out.
diff --git a/app/(site)/(directories)/launch-directories/content/how-we-check.mdx b/app/(site)/(directories)/launch-directories/content/how-we-check.mdx
new file mode 100644
index 00000000..774ba87f
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/how-we-check.mdx
@@ -0,0 +1,17 @@
+## How do we check each place?
+
+We read each site's own submission page, pricing, and rules, then open one of its published listings to see what link it gives the maker. The details link each page we used, with the date we checked it. Some sources are older than the record date, which is our latest check of anything on that place.
+
+Card prices show the lowest price we found, and "From" means higher plans exist. Prices, review times, and link rules change, so check the site's own page before you pay.
+
+### What do "Not stated on their site" and "Couldn't verify" mean?
+
+We don't have a checked answer for that detail, and we don't guess one.
+
+<Terms>
+<Term name="Not stated on their site">The site's own pages don't publish it.</Term>
+<Term name="Couldn't verify">A page blocked us, needed a login, or didn't load. It doesn't mean the site has closed.</Term>
+<Term name="Conflicting info">Two of the site's own pages disagree. The details link both.</Term>
+<Term name="Submission page unavailable">We found a submission page, but it didn't load when we checked.</Term>
+<Term name="Submission page not found">We couldn't find where submissions start. Look on the site itself before you give up on it.</Term>
+</Terms>
diff --git a/app/(site)/(directories)/launch-directories/content/intro.mdx b/app/(site)/(directories)/launch-directories/content/intro.mdx
new file mode 100644
index 00000000..dbe05be6
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/intro.mdx
@@ -0,0 +1 @@
+Places to submit a new product, from launch boards like Product Hunt to AI tool lists and software review sites. Filter by category, cost, or link type, then open a card to see who can submit, how long review takes, and every page we checked, with its date.
diff --git a/app/(site)/(directories)/launch-directories/content/launch-timing.mdx b/app/(site)/(directories)/launch-directories/content/launch-timing.mdx
new file mode 100644
index 00000000..82ff55ad
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/launch-timing.mdx
@@ -0,0 +1,5 @@
+## How long until my product launches?
+
+It depends on two waits: approval, then a launch slot. Some sites review within a day, while others publish free queues of several months. Where we checked both, the details list them separately.
+
+A date marked "Our submission" is the date we got for our own product. Yours may differ.
diff --git a/app/(site)/(directories)/launch-directories/content/link-types.mdx b/app/(site)/(directories)/launch-directories/content/link-types.mdx
new file mode 100644
index 00000000..00fe33f9
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/link-types.mdx
@@ -0,0 +1,22 @@
+## Which launch directories give a dofollow link?
+
+Choose Dofollow under Link type to see them. Each result comes from one published listing we opened, or from the plan the site's terms describe, so free and paid listings on the same site can differ.
+
+[Google says](https://developers.google.com/search/docs/crawling-indexing/qualify-outbound-links) links marked nofollow, ugc, or sponsored will generally not be followed. A dofollow link still doesn't promise indexing, rankings, or traffic.
+
+<Terms>
+<Term name="Dofollow">The sampled link had no nofollow, ugc, or sponsored value, or the site's terms promise that.</Term>
+<Term name="Nofollow">The link asks search engines not to follow it.</Term>
+<Term name="UGC">The link is marked as user-generated content.</Term>
+<Term name="Sponsored">The link is marked as paid.</Term>
+<Term name="Mixed">The link carried more than one value, such as ugc and nofollow.</Term>
+<Term name="Varies">Free, paid, or top-ranked listings get different links. The details say which.</Term>
+<Term name="No link">The sampled listing doesn't link to the maker's own site.</Term>
+</Terms>
+
+These two labels mean we have no checked result:
+
+<Terms>
+<Term name="Likely nofollow">We couldn't read a sampled link, but other evidence points to nofollow.</Term>
+<Term name="Couldn't verify">We couldn't open a published listing or read its link.</Term>
+</Terms>
diff --git a/app/(site)/(directories)/launch-directories/content/recommended-order.mdx b/app/(site)/(directories)/launch-directories/content/recommended-order.mdx
new file mode 100644
index 00000000..8d12973b
--- /dev/null
+++ b/app/(site)/(directories)/launch-directories/content/recommended-order.mdx
@@ -0,0 +1,7 @@
+## Which launch sites come first?
+
+Six well-known launch sites come first: Product Hunt, BetaList, DevHunt, Peerlist Launchpad, AlternativeTo, and SaaSHub. That's our pick of where most makers start, not a ranking by traffic. After them:
+
+1. Places with a checked submission page come before places without one.
+2. Launch boards and beta sites come next, then startup and software listings, then AI, developer, design, and regional directories.
+3. Within each group, free options come first, then dofollow links.
diff --git a/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx b/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
index 7bf458fe..afbc99ad 100644
--- a/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
+++ b/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
@@ -1,63 +1,27 @@
-import { DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
-import type { Stack127DirectoryPage } from "@/lib/directory-pages";
-import type { ReactNode } from "react";
-import type { Components } from "react-markdown";
-import { UiDataTable } from "@/app/ui/display";
+import type { ComponentPropsWithoutRef } from "react";
 import { proseClassName, proseFlowClassName } from "@/app/ui/site/prose";
+import Corrections from "./content/corrections.mdx";
+import FreeListings from "./content/free-listings.mdx";
+import HowWeCheck from "./content/how-we-check.mdx";
+import LaunchTiming from "./content/launch-timing.mdx";
+import LinkTypes from "./content/link-types.mdx";
+import RecommendedOrder from "./content/recommended-order.mdx";
 import styles from "./launch-directories.module.css";
 
-type MeaningRow = { id: string; label: string; meaning: ReactNode };
-
-const googleLinkGuide = "https://developers.google.com/search/docs/crawling-indexing/qualify-outbound-links";
-
-// Results from a sampled listing's HTML or from the site's own terms.
-const linkTypes: MeaningRow[] = [
-  { id: "dofollow", label: "Dofollow", meaning: "The sampled link had no nofollow, ugc, or sponsored value, or the site's terms promise that. There's no dofollow HTML attribute, and it doesn't promise indexing, ranking, or traffic." },
-  { id: "nofollow", label: "Nofollow", meaning: <>The link asks search engines not to follow it. It doesn&apos;t stop them finding your site through other links. See <a href={googleLinkGuide} rel="noopener noreferrer" target="_blank">Google&apos;s definition</a>.</> },
-  { id: "ugc", label: "UGC", meaning: "The link is marked as user-generated content." },
-  { id: "sponsored", label: "Sponsored", meaning: "The link is marked as paid." },
-  { id: "multiple", label: "Mixed", meaning: "The sampled link carried more than one value, such as ugc and nofollow together. The details name them." },
-  { id: "varies", label: "Varies", meaning: "Free, paid, or top-ranked listings get different links. The details say which." },
-  { id: "none", label: "No link", meaning: "The sampled listing doesn't link to the maker's own site." },
-];
-
-// No confirmed result. Keep these apart from the sampled findings above.
-const unconfirmedLinkTypes: MeaningRow[] = [
-  { id: "estimated-nofollow", label: "Likely nofollow", meaning: "An estimate, not a checked result. We couldn't read a sampled link, but other evidence points to nofollow. Treat it as unconfirmed." },
-  { id: "unknown", label: "Couldn't verify", meaning: "We couldn't open a published listing or read its link. The link type is unknown." },
-];
-
-const missingLabels: MeaningRow[] = [
-  { id: "not-stated", label: "Not stated on their site", meaning: "The site's own pages don't publish this detail." },
-  { id: "unverified", label: "Couldn't verify", meaning: "A page was blocked, needed a login, or didn't load. It doesn't mean the site has closed." },
-  { id: "conflicting", label: "Conflicting info", meaning: "Two of the site's own pages disagree. The sources in the details link both." },
-  { id: "unavailable", label: "Submission page unavailable", meaning: "We found a submission page, but it didn't load when we checked." },
-  { id: "not-found", label: "Submission page not found", meaning: "We couldn't find where submissions start. Check the site itself before you give up on it." },
-];
-
-function MeaningTable({ ariaLabel, rows }: { ariaLabel: string; rows: MeaningRow[] }) {
-  return <UiDataTable
-    ariaLabel={ariaLabel}
-    columns={[{ id: "label", label: "Label" }, { id: "meaning", label: "What it means" }]}
-    rows={rows.map((row) => ({ id: row.id, cells: { label: row.label, meaning: row.meaning } }))}
-  />;
+// The results header links to these two headings, so each file's h2 keeps a fixed id.
+function headingWithId(id: string) {
+  return function Heading(props: ComponentPropsWithoutRef<"h2">) {
+    return <h2 {...props} id={id} />;
+  };
 }
 
-const guideHeadingComponents: Components = {
-  h2: ({ children }) => <h2 id="how-we-check">{children}</h2>,
-  h3: ({ children }) => <h3 id={typeof children === "string" && children.includes("recommended order") ? "recommended-order" : undefined}>{children}</h3>,
-};
-
-export function LaunchDirectoryGuide({ directoryPage }: { directoryPage: Stack127DirectoryPage }) {
-  return <section aria-labelledby="how-we-check" className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
-    <DirectoryPageContent page={directoryPage} section="guide-1" components={guideHeadingComponents} />
-    <MeaningTable ariaLabel="Link types" rows={linkTypes} />
-    <DirectoryPageContent page={directoryPage} section="guide-2" />
-    <MeaningTable ariaLabel="Unconfirmed link types" rows={unconfirmedLinkTypes} />
-
-    <DirectoryPageContent page={directoryPage} section="guide-3" />
-    <MeaningTable ariaLabel="Missing-detail labels" rows={missingLabels} />
-
-    <DirectoryPageContent page={directoryPage} section="guide-4" />
-  </section>;
+export function LaunchDirectoryGuide() {
+  return <div className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
+    <HowWeCheck components={{ h2: headingWithId("how-we-check") }} />
+    <RecommendedOrder components={{ h2: headingWithId("recommended-order") }} />
+    <LinkTypes />
+    <FreeListings />
+    <LaunchTiming />
+    <Corrections />
+  </div>;
 }
diff --git a/app/(site)/(directories)/launch-directories/page.tsx b/app/(site)/(directories)/launch-directories/page.tsx
index 36f4ea20..1dc8e8d5 100644
--- a/app/(site)/(directories)/launch-directories/page.tsx
+++ b/app/(site)/(directories)/launch-directories/page.tsx
@@ -1,7 +1,6 @@
 import { getRequiredDirectoryPage } from "@/lib/directory-pages";
-import { DirectoryPageTitle, DirectoryPageContent } from "@/app/ui/directories/directory-page-content";
+import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
-import { ContentMarkdown } from "@/app/ui/content-markdown";
 import { DirectoryQueryProvider } from "@/app/ui/directories/directory-query";
 import { AppShell, SidebarLabel } from "@/app/ui/site/app-shell";
 import { EntryHero } from "@/app/ui/site/entry-hero";
@@ -11,6 +10,7 @@ import { DirectoryTitleIcon } from "@/app/ui/directories/directory-title-icon";
 import { getLaunchDirectorySnapshot, launchCategories } from "@/lib/launch-directories";
 import { filterLaunchDirectories } from "@/lib/launch-directories-query";
 import { getRequiredPublishedPage } from "@/lib/page-registry";
+import Intro from "./content/intro.mdx";
 import { LaunchDirectoryGuide } from "./launch-directory-guide";
 import { costOptions, linkOptions } from "./launch-directory-options";
 import { LaunchDirectoryFilters, LaunchDirectoryResults } from "./launch-directory-view";
@@ -39,14 +39,14 @@ export default async function LaunchDirectoriesPage() {
         <PageHeader>
           <h1><DirectoryTitleIcon iconKey={directoryPage.card_icon_key} />{" "}<DirectoryPageTitle title={directoryPage.title} /></h1>
           <PageMeta updatedAt={directoryPage.updated_at} />
-          <ContentMarkdown markdown={directoryPage.intro_markdown} />
+          <Intro />
         </PageHeader>
       </EntryHero>
       {/* Data freshness marker for the cache verifier, not page metadata. */}
       <span data-launch-directories-revision={snapshot.revision} hidden />
       <PageCanvas as="div" className="directory-results">
         <LaunchDirectoryResults categories={[...launchCategories]} directories={directories} />
-        <LaunchDirectoryGuide directoryPage={directoryPage} />
+        <LaunchDirectoryGuide />
       </PageCanvas>
     </AppShell>
   </DirectoryQueryProvider>;
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/article.mdx
new file mode 100644
index 00000000..8378bbe5
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/article.mdx
@@ -0,0 +1,17 @@
+## Do all app stores take 30%?
+
+No. 30% is the standard rate at Apple, Steam, and Meta Horizon Store, but many stores charge less on early revenue, subscriptions, or small developers.
+
+| Store | Lower rate | When it applies |
+| --- | --- | --- |
+| Apple App Store | 15% | Small Business Program members, and subscriptions after their first year |
+| Google Play | 10% | Subscriptions under its new fee model, which is rolling out by region |
+| Steam | 25%, then 20% | A game's lifetime sales above $10M, then above $50M |
+| Epic Games Store | 0% | A game's first $1M each year, then 12% |
+| Shopify App Store | 0% | An app's first $1M since January 2025, then 15% |
+
+Each card lists the conditions, such as company size limits and regional rates.
+
+## Why do some cards show no rate?
+
+Xbox, PlayStation, and Nintendo set revenue shares in contracts they don't publish, so their cards say "Set by agreement". Chrome Web Store and Firefox Add-ons let you sell paid extensions but don't run the checkout. You need your own payment provider; compare them in [Payments](/platform-fees/payments).
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
index 82bd6aa8..20dade06 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/apps-and-software/intro.mdx
@@ -1 +1 @@
-Compare fees for selling apps, games, software, code and datasets. Choose a section to compare platforms that sell the same kind of product.
+What app stores, game stores, plugin marketplaces, and software marketplaces keep from each sale, from Apple and Google Play to Steam and the Shopify App Store. Jump to a section or search for a store by name, then open a card for developer account costs, regional rates, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/article.mdx
new file mode 100644
index 00000000..ded54438
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/article.mdx
@@ -0,0 +1,11 @@
+## How do I compare royalty rates here?
+
+Cards show what the marketplace keeps, so a royalty reads the other way round. Adobe Stock pays contributors 33% on photos, so its card shows 67%. Fab pays 88% on product sales, so its card shows 12%.
+
+## Why do subscription sites show no bar?
+
+They pay from a shared pool, not a share of your price. Envato Elements, for example, puts 50% of its Individual and Teams subscription revenue in a pool and splits it between authors by downloads. What you earn depends on how often subscribers download your work, so there's no fixed cut to show.
+
+## Does going exclusive pay more?
+
+Sometimes. TurboSquid starts at 40% on its non-exclusive Basic plan and at 50% on SquidGuild, which needs your whole 3D catalog to be exclusive. Many marketplaces, including Adobe Stock, Shutterstock, and Creative Market, don't ask for exclusivity. Open a card to see its exclusivity terms.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
index 391a4ecc..04ede0d3 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creative-assets/intro.mdx
@@ -1 +1 @@
-Compare marketplaces for design assets, fonts, templates, 3D files, photos and video. Each section keeps commissions, royalties and other charges in their stated units.
+What marketplaces keep when you sell stock photos and video, graphics, fonts, templates, 3D models, game assets, and craft patterns. Search for a marketplace or jump to a section, then open a card for exclusivity rules, payout minimums, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/article.mdx
new file mode 100644
index 00000000..e8a7cb7d
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/article.mdx
@@ -0,0 +1,19 @@
+## How much of a membership payment do I keep?
+
+Less than the platform fee alone suggests, because card processing comes on top.
+
+<Example title="A $10 monthly Patreon membership, at rates checked in September 2026">
+
+Patreon keeps 10% for new creators, which is $1.00. A US card payment adds 2.9% plus 30¢, which is 59¢. You keep $8.41.
+
+</Example>
+
+The fixed 30¢ weighs more on small payments. Patreon charges 5% plus 10¢ for processing on payments of $3 or less.
+
+## How do freelance marketplaces charge?
+
+Fiverr keeps 20% of every order, including tips, and holds your money for 14 days after an order completes. Upwork charges freelancers 0% to 15% per contract, plus 15¢ for each Connect you spend on proposals. Withdrawal fees vary by payout method on both.
+
+## Do crowdfunding sites charge if I miss my goal?
+
+Not on Kickstarter. It's all-or-nothing, so you pay no fees and get no money if the goal isn't met. If it is, Kickstarter keeps 5%, plus processing of 3% and 30¢ per pledge in the US. Indiegogo also waives fees on regular campaigns that miss their goal. Its Express campaigns have no goal and charge backers at checkout, so fees apply from the first pledge.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
index 9d369c36..36093b06 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/creators-and-communities/intro.mdx
@@ -1 +1 @@
-Compare platforms for memberships, fan subscriptions, video, tips, freelance work and crowdfunding. Choose a section to check the fees for your source of income.
+What membership sites, fan platforms, tip jars, video and livestream programs, freelance marketplaces, game creator programs, and crowdfunding sites keep from your income, from Patreon and Skool to YouTube and Fiverr. Search for a platform or jump to a section, then open a card for payout rules and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/article.mdx
new file mode 100644
index 00000000..98b7940f
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/article.mdx
@@ -0,0 +1,22 @@
+## Is a 0% fee platform cheaper?
+
+Only once you sell enough to cover its monthly plan. Gumroad has no plan but takes 10% plus 50¢ on direct sales. Sellfy's Starter plan costs $39 a month and takes nothing on sales up to $10,000 a year. Card processing at 2.9% plus 30¢ applies on both.
+
+<Example title="Selling a $20 download in the US, at rates checked in September 2026">
+
+| Sales a month | Gumroad fees | Sellfy Starter fees |
+| --- | --- | --- |
+| 10 | $33.80 | $47.80 |
+| 40 | $135.20 | $74.20 |
+
+Gumroad costs $3.38 a sale. Sellfy costs 88¢ a sale plus $39 a month, so it's cheaper from about 16 sales a month.
+
+</Example>
+
+Fees aren't the only difference. Gumroad is the merchant of record and handles sales tax for you. On Sellfy, you file and pay it yourself.
+
+## How does print on demand pay you?
+
+Most print-on-demand services charge a base cost to make and ship each item, and you keep what you add on top. That's why their cards say "Base cost" instead of a percentage.
+
+Marketplaces work differently. Redbubble takes a fee from your earnings, 50% on a Standard account. TeePublic and Displate pay a fixed amount per item sold, such as $4 for a regular-price TeePublic Artisan tee.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
index 6f439e7d..3d8d2832 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/digital-products-and-stores/intro.mdx
@@ -1 +1 @@
-Compare platforms for selling downloads, videos, AI creations and merchandise. Check plan costs, transaction charges and payment fees in each section.
+What it costs to sell downloads, run an online store, sell video, or sell print-on-demand merch, from Gumroad and Etsy to Shopify and Printful. Compare per-sale fees with monthly plans, then open a card for card fees, sales tax handling, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/index.ts b/app/(site)/(directories)/platform-fees/[section]/content/index.ts
index 101d4007..432cd58c 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/index.ts
+++ b/app/(site)/(directories)/platform-fees/[section]/content/index.ts
@@ -1,21 +1,29 @@
 import type { MDXContent } from "mdx/types";
+import AppsAndSoftwareArticle from "./apps-and-software/article.mdx";
 import AppsAndSoftwareIntro from "./apps-and-software/intro.mdx";
+import CreativeAssetsArticle from "./creative-assets/article.mdx";
 import CreativeAssetsIntro from "./creative-assets/intro.mdx";
+import CreatorsAndCommunitiesArticle from "./creators-and-communities/article.mdx";
 import CreatorsAndCommunitiesIntro from "./creators-and-communities/intro.mdx";
+import DigitalProductsAndStoresArticle from "./digital-products-and-stores/article.mdx";
 import DigitalProductsAndStoresIntro from "./digital-products-and-stores/intro.mdx";
+import MusicAndAudioArticle from "./music-and-audio/article.mdx";
 import MusicAndAudioIntro from "./music-and-audio/intro.mdx";
+import PaymentsArticle from "./payments/article.mdx";
 import PaymentsIntro from "./payments/intro.mdx";
+import TeachingAndCoursesArticle from "./teaching-and-courses/article.mdx";
 import TeachingAndCoursesIntro from "./teaching-and-courses/intro.mdx";
+import WritingAndBooksArticle from "./writing-and-books/article.mdx";
 import WritingAndBooksIntro from "./writing-and-books/intro.mdx";
 
 /** Each fee category's own words, keyed by its slug. Add an entry when a category is added. */
 export const feeCategoryContent: Record<string, { Intro: MDXContent; Article?: MDXContent }> = {
-  "apps-and-software": { Intro: AppsAndSoftwareIntro },
-  "creative-assets": { Intro: CreativeAssetsIntro },
-  "creators-and-communities": { Intro: CreatorsAndCommunitiesIntro },
-  "digital-products-and-stores": { Intro: DigitalProductsAndStoresIntro },
-  "music-and-audio": { Intro: MusicAndAudioIntro },
-  "payments": { Intro: PaymentsIntro },
-  "teaching-and-courses": { Intro: TeachingAndCoursesIntro },
-  "writing-and-books": { Intro: WritingAndBooksIntro },
+  "apps-and-software": { Intro: AppsAndSoftwareIntro, Article: AppsAndSoftwareArticle },
+  "creative-assets": { Intro: CreativeAssetsIntro, Article: CreativeAssetsArticle },
+  "creators-and-communities": { Intro: CreatorsAndCommunitiesIntro, Article: CreatorsAndCommunitiesArticle },
+  "digital-products-and-stores": { Intro: DigitalProductsAndStoresIntro, Article: DigitalProductsAndStoresArticle },
+  "music-and-audio": { Intro: MusicAndAudioIntro, Article: MusicAndAudioArticle },
+  "payments": { Intro: PaymentsIntro, Article: PaymentsArticle },
+  "teaching-and-courses": { Intro: TeachingAndCoursesIntro, Article: TeachingAndCoursesArticle },
+  "writing-and-books": { Intro: WritingAndBooksIntro, Article: WritingAndBooksArticle },
 };
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
new file mode 100644
index 00000000..0046946a
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
@@ -0,0 +1,15 @@
+## Is a yearly plan or a royalty cut cheaper for distribution?
+
+It depends on how much your music earns and how often you release. DistroKid and TuneCore charge a yearly plan from $24.99 and keep 0% of store and streaming royalties. CD Baby charges once per release, $9.99 for a single, and keeps 9%.
+
+<Example title="One single earning $300 a year, at rates checked in September 2026">
+
+CD Baby keeps 9%, which is $27 a year, plus the $9.99 release fee once. DistroKid's cheapest plan costs $24.99 a year and covers unlimited uploads.
+
+</Example>
+
+The more you release, the more a yearly plan covers. Withdrawal fees and paid extras can change the picture, so check the lines on each card.
+
+## Do beat stores take a cut?
+
+Several take 0% of your sales: BeatStars, which charges a plan instead, Airbit on every plan, and TRAKTRAIN on its Unlimited plan. SoundClick and Soundee keep 30% on their free plans and less on paid ones. BeatStars adds a 12% service fee to Marketplace orders, which you can choose to cover for your buyers.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
index 0fc7cc51..79f860ce 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/intro.mdx
@@ -1 +1 @@
-Compare platforms for stock audio, beats, music distribution and podcasts. Check whether a rate is a commission, a royalty share or a distribution charge.
+What music distributors, Bandcamp, beat stores, stock audio libraries, and podcast platforms keep from your earnings. Compare yearly plans with royalty cuts, then open a card for withdrawal fees, paid extras, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/payments/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/payments/article.mdx
new file mode 100644
index 00000000..d73d8703
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/payments/article.mdx
@@ -0,0 +1,24 @@
+## Merchant of record or payment processor?
+
+A merchant of record sells your product on your behalf, so it collects and pays sales tax and VAT for you. A payment processor only moves the money, and the tax stays your job. That's why merchant of record rates are higher.
+
+<Example title="A $20 US card sale, at rates checked in September 2026">
+
+| Service | Fee | Who handles sales tax |
+| --- | --- | --- |
+| Stripe | 2.9% + 30¢ = 88¢ | You |
+| Paddle | 5% + 50¢ = $1.50 | Paddle |
+| Lemon Squeezy | 5% + 50¢ = $1.50 | Lemon Squeezy |
+
+</Example>
+
+Paddle's and Lemon Squeezy's fees include card processing. Lemon Squeezy adds 1.5% for international and PayPal payments and 0.5% for subscriptions.
+
+## Which extra fees should I check?
+
+The headline rate is for a domestic card. Check these before you compare:
+
+- International cards: Stripe and PayPal each add 1.5% for US accounts.
+- Currency conversion: Stripe adds 1%, and PayPal adds 3% to 4%.
+- Payouts: standard payouts are free on Stripe, but instant payouts cost 1.5%.
+- Your country: most processors set rates by country, and some only serve sellers in certain countries.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
index 405c2d51..d66fc731 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/payments/intro.mdx
@@ -1 +1 @@
-Compare software checkout services and payment processors. Keep platform charges, processing fees and merchant of record services separate when choosing how to accept payments.
+What payment processors and software checkout services charge on each payment, from Stripe and PayPal to Paddle and Lemon Squeezy. Compare domestic and international rates, then open a card for payout fees, country rules, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/article.mdx
new file mode 100644
index 00000000..d0d37de7
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/article.mdx
@@ -0,0 +1,17 @@
+## Should I sell on a marketplace or my own course platform?
+
+A marketplace finds students for you and keeps a large share. A course platform keeps little or nothing per sale but charges a monthly plan, and you bring the students.
+
+| Platform | Type | What it charges |
+| --- | --- | --- |
+| Udemy | Marketplace | Keeps 63% of a marketplace sale, but 3% when the student uses your instructor link |
+| Teachable | Course platform | Starter plan at $39 a month, plus 7.5% of each sale |
+| Kajabi | Course platform | Basic plan at $179 a month, and 0% of sales with Kajabi Payments |
+
+Card fees are extra on Teachable and Kajabi.
+
+## How do tutoring sites take their cut?
+
+Most take a commission on each lesson, and some lower it as you teach more. Preply keeps 33% of your first 20 hours, falling to 18% after 400 hours. It also keeps the full price of each new student's first trial lesson.
+
+Cambly works differently. It pays a fixed rate per minute, 17¢ for adult lessons, and doesn't say how much it keeps.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
index c9cd4544..ff63dc8b 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/teaching-and-courses/intro.mdx
@@ -1 +1 @@
-Compare course platforms, tutoring marketplaces, teaching resources, event tickets and coaching services. Check commissions, plan costs and payment charges.
+What course platforms, course marketplaces, tutoring sites, worksheet stores, ticketing tools, and coaching apps charge teachers, from Teachable and Kajabi to Udemy and Preply. Jump to a section or search for a platform, then open a card for plan limits, payment fees, and sources.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/article.mdx
new file mode 100644
index 00000000..9fee836c
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/article.mdx
@@ -0,0 +1,19 @@
+## Why does KDP show 30% when it pays 70%?
+
+Cards show what the platform keeps. KDP's 70% ebook royalty shows as 30%. On Amazon.com, the 70% rate needs a price from $2.99 to $12.99, and delivery costs come out of it. Outside those rules, the royalty is 35%.
+
+## How are print book royalties worked out?
+
+The printing cost comes off before you're paid, so the card's percentage isn't what reaches you.
+
+<Formula title="Print royalty">
+Royalty = list price × royalty rate − printing cost
+</Formula>
+
+KDP's royalty rate is 60% or 50% of the list price, or 40% through Expanded Distribution. IngramSpark pays the list price minus your wholesale discount, printing, and a 1.875% market access fee. To work out a KDP royalty with real printing costs, use the [KDP royalty calculator](/kdp-royalty-calculator).
+
+## Is Substack cheaper than a 0% newsletter platform?
+
+It depends on what you earn. Substack is free to start and keeps 10% of paid subscriptions, plus card fees. beehiiv and Ghost take 0% but charge a plan. Paid subscriptions on beehiiv start on its Scale plan, from $43 a month billed yearly, so Substack's 10% costs more once you take in about $430 a month.
+
+Ghost prices its plans by members. Its Publisher plan is $29 a month billed yearly at 1,000 members.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
index 096dc28a..322a631e 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/writing-and-books/intro.mdx
@@ -1 +1 @@
-Compare platforms for books, audiobooks, fiction and paid newsletters. Check royalties, distribution costs and subscription charges within each section.
+What publishing platforms keep from ebooks, print books, audiobooks, comics and serial fiction, and paid newsletters, from KDP and IngramSpark to ACX and Substack. Search for a platform or jump to a section, then open a card for printing deductions, exclusivity, and sources.
diff --git a/app/(site)/(directories)/platform-fees/content/article.mdx b/app/(site)/(directories)/platform-fees/content/article.mdx
new file mode 100644
index 00000000..84888e90
--- /dev/null
+++ b/app/(site)/(directories)/platform-fees/content/article.mdx
@@ -0,0 +1,28 @@
+## How do I read a fee card?
+
+The big number is what the platform keeps from a sale, and the bar shows what you keep before other fees. Those other fees are usually card processing, a fixed charge per sale, or a monthly plan. The three lines under the bar name the ones that matter most for that platform.
+
+Open the link at the bottom of a card, such as "+ 3 more rates" or "All rates and sources", to see every rate, when it applies, the date we checked it, and its sources.
+
+### Why do some cards have no bar?
+
+Because the platform doesn't take a simple cut of your price. Subscription sites that split a shared pool by downloads, ad programs, and fixed pay per item show their own terms instead. These labels stand in for a rate:
+
+<Terms>
+<Term name="Share not disclosed">The platform pays creators a share but doesn't publish it.</Term>
+<Term name="Fee not disclosed">The platform charges a fee but doesn't publish the rate.</Term>
+<Term name="Set by agreement">The rate is in a contract that isn't public, as with console stores.</Term>
+<Term name="Shown in dashboard">The platform shows the rate only inside your seller account.</Term>
+<Term name="Base cost">You set the price, and the cost of making the product comes out of it.</Term>
+<Term name="Your own checkout">The platform doesn't sell for you, so you need your own payment provider.</Term>
+</Terms>
+
+## Is the lowest fee the cheapest?
+
+Not always. A platform that takes 0% often charges a monthly plan, so it only costs less once you sell enough. Card processing is usually extra, and a fixed charge per sale costs more on cheap items. [Digital products and stores](/platform-fees/digital-products-and-stores) works through an example.
+
+## Where do these rates come from?
+
+From each platform's own pricing, help, and terms pages. Rates are for US sellers in US dollars unless a card says otherwise. Fees change often, so check the date on each card and the platform's own page before you sign up.
+
+Found a wrong rate? Email [stack127@proton.me](mailto:stack127@proton.me) with the platform and the page that shows the right one.
diff --git a/app/(site)/(directories)/platform-fees/content/intro.mdx b/app/(site)/(directories)/platform-fees/content/intro.mdx
index 5ff4f02e..d35c3e52 100644
--- a/app/(site)/(directories)/platform-fees/content/intro.mdx
+++ b/app/(site)/(directories)/platform-fees/content/intro.mdx
@@ -1 +1 @@
-Choose what you sell, then compare fees and start costs. Each category has sections for different products and services. Open a card for other rates and official sources.
+See what a platform takes from each sale before you sign up. Pick what you sell, or search for a platform by name. Each card shows the platform's cut, what it costs to start, and the official pages behind every rate.
diff --git a/app/(site)/(directories)/platform-fees/page.tsx b/app/(site)/(directories)/platform-fees/page.tsx
index 82639353..dc8330cb 100644
--- a/app/(site)/(directories)/platform-fees/page.tsx
+++ b/app/(site)/(directories)/platform-fees/page.tsx
@@ -5,6 +5,7 @@ import { FeeFilters, FeeHubResults } from './filters';
 import { CategoryTile, FeeShell } from './components';
 import styles from './page.module.css';
 import { RegistryStructuredData } from '@/lib/registry-layout';
+import Article from './content/article.mdx';
 import Intro from './content/intro.mdx';
 
 export default async function PlatformFeesPage() {
@@ -25,7 +26,7 @@ export default async function PlatformFeesPage() {
 
   return <>
     <RegistryStructuredData path="/platform-fees" />
-    <FeeShell directoryPage={directoryPage} intro={<Intro />} overview>
+    <FeeShell directoryPage={directoryPage} intro={<Intro />} article={<Article />} overview>
     <FeeFilters />
     <FeeHubResults items={items}>
       <p className={styles.count}>{feeGroups.length} categories · {directory.sections.length} sections · {directory.entries.length} listings</p>

From 664aea79a6fda9de73e4bc3883c62a36851cf126 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:29:20 +0530
Subject: [PATCH 19/25] Rewrite the eight tool catalog pages in MDX

Catalogs with tools for different problems get a table that matches a
problem to the right tool. The domain catalog article moves from TSX
into MDX.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../[slug]/content/developer-tools/intro.mdx  |  2 +-
 .../[slug]/content/dns-tools/article.mdx      | 13 +++
 .../[slug]/content/dns-tools/intro.mdx        |  2 +-
 .../[slug]/content/domain-tools/article.mdx   | 33 +++++++
 .../[slug]/content/domain-tools/intro.mdx     |  2 +-
 .../content/hosting-cloud-tools/intro.mdx     |  2 +-
 app/(site)/(catalogs)/[slug]/content/index.ts | 15 ++--
 .../[slug]/content/kdp-tools/article.mdx      | 17 ++++
 .../[slug]/content/kdp-tools/intro.mdx        |  2 +-
 .../content/productivity-tools/intro.mdx      |  2 +-
 .../[slug]/content/saas-tools/article.mdx     | 16 ++++
 .../[slug]/content/saas-tools/intro.mdx       |  2 +-
 .../[slug]/content/storage-tools/article.mdx  | 19 ++++
 .../[slug]/content/storage-tools/intro.mdx    |  2 +-
 .../[slug]/domain-catalog-reference.tsx       | 87 -------------------
 app/(site)/(catalogs)/[slug]/page.tsx         |  2 -
 16 files changed, 116 insertions(+), 102 deletions(-)
 create mode 100644 app/(site)/(catalogs)/[slug]/content/dns-tools/article.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/domain-tools/article.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/kdp-tools/article.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/saas-tools/article.mdx
 create mode 100644 app/(site)/(catalogs)/[slug]/content/storage-tools/article.mdx
 delete mode 100644 app/(site)/(catalogs)/[slug]/domain-catalog-reference.tsx

diff --git a/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
index cbb0d5ad..e268ad1b 100644
--- a/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/developer-tools/intro.mdx
@@ -1 +1 @@
-Test permissions, ignore rules, compose files, user mappings, and file sync patterns with your own inputs.
+Test a config before you run it on a real system: file permissions, `.dockerignore` and Compose files, LXC ID mappings, and rsync filters. Paste your own rules and paths to see what each line does. The checks run in your browser and don't touch your files.
diff --git a/app/(site)/(catalogs)/[slug]/content/dns-tools/article.mdx b/app/(site)/(catalogs)/[slug]/content/dns-tools/article.mdx
new file mode 100644
index 00000000..21dfc0fd
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/dns-tools/article.mdx
@@ -0,0 +1,13 @@
+## Which DNS tool do I need?
+
+Pick the row that matches what you're seeing.
+
+| What's happening | Tool to use |
+| --- | --- |
+| You want to see a record's current value, such as an A, MX, or TXT record | [DNS lookup](/dns-lookup) |
+| You changed a record, and some people still get the old one | [DNS change checker](/dns-change-checker) |
+| The domain doesn't resolve, or fails only some of the time | [Nameserver checker](/nameserver-checker), then [DNS trace](/dns-trace) to see where the lookup stops |
+| Lookups fail with SERVFAIL after you turned on DNSSEC or moved DNS | [DNSSEC checker](/dnssec-checker) |
+| Your nameservers give different answers for the same record | [SOA checker](/soa-checker) |
+| A certificate authority won't issue a certificate for your domain | [CAA checker](/caa-checker) |
+| The domain may be on hold or near expiry, or you want registration and DNS checked together | [Domain report](/domain-report) |
diff --git a/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
index fd530f7c..01b11c0e 100644
--- a/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/dns-tools/intro.mdx
@@ -1 +1 @@
-Look up current records, trace referrals, compare cached answers, and check the DNS settings that affect websites, email, and certificates.
+Look up a domain's DNS records, check whether a change has gone live, and find the setting that stops a website, email, or certificate from working. Not sure which tool you need? Start with [DNS lookup](/dns-lookup), or match your problem in the table below the tools.
diff --git a/app/(site)/(catalogs)/[slug]/content/domain-tools/article.mdx b/app/(site)/(catalogs)/[slug]/content/domain-tools/article.mdx
new file mode 100644
index 00000000..a9d33d05
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/domain-tools/article.mdx
@@ -0,0 +1,33 @@
+## Which domain tool do I need?
+
+Find the question you're asking.
+
+| Your question | Tool to use |
+| --- | --- |
+| What does the full registration record say? | [Domain lookup](/domain-lookup) |
+| How old is this domain? | [Domain age checker](/domain-age) |
+| When does it expire, and what happens then? | [Domain expiry checker](/domain-expiry) |
+| Can I register this name? | [Domain availability](/domain-availability), or [multi-TLD availability](/multi-tld-availability) to try several endings |
+| Who owns it, and how do I reach them? | [Registrant lookup](/domain-owner) |
+| Which registrar is it with, and where do I report abuse? | [Registrar lookup](/domain-registrar) |
+| Can I move it to another registrar? | [Transfer readiness](/transfer-readiness) |
+| It's registered, so why isn't it working? | [Domain report](/domain-report) |
+| What does a status such as `clientHold` mean? | [EPP status codes](/epp-status-codes) |
+| How do I write a name with accents or non-Latin letters? | [Punycode converter](/punycode-converter) |
+| What DNS records does it have? | [DNS lookup](/dns-lookup) |
+
+## Is WHOIS still used?
+
+Mostly not. ICANN stopped requiring WHOIS for most generic endings, such as `.org`, on 28 January 2025, and RDAP replaced it. People still call it a WHOIS lookup, but the lookup tools here read RDAP only. The [domain lookup](/domain-lookup) page explains how the two differ.
+
+## Can every domain ending be looked up?
+
+No. Some endings, mostly country endings, don't publish RDAP. For those, the tools say they can't check the name, which doesn't mean it's free. The [TLD directory](/tld-directory) shows which endings can be looked up and links each registry.
+
+## Can I see who owned a domain before?
+
+No. RDAP returns only the current record, with no past owners or old nameservers. Sites that show history use copies they saved over time.
+
+## What happens to the names I look up?
+
+The name goes from stack127 to the registry, and to the registrar that holds it. stack127 keeps saved answers by domain name, not linked to you. A result can be a saved answer up to 24 hours old, and it shows when it was fetched.
diff --git a/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
index c63980c8..e29aebd6 100644
--- a/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/domain-tools/intro.mdx
@@ -1 +1 @@
-Check registration, availability, ownership, expiry, transfers, and status codes using current registry and registrar data.
+Check a domain's registration: who holds it and through which registrar, when it was created and when it expires, whether a name is free, and what could block a transfer. Answers come from the registry and registrar for the domain's ending. Not sure which tool you need? Find your question in the table below the tools.
diff --git a/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
index ee3322e6..3ab4f793 100644
--- a/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/hosting-cloud-tools/intro.mdx
@@ -1 +1 @@
-Estimate app resources, inspect network information, and review firewall and reverse proxy settings before deployment.
+Plan and check a self-hosted server: whether your apps fit its RAM and disk, which ports NFS needs open, what URL nginx passes to your app, and who an IP address is registered to. Have the values from your server or config ready.
diff --git a/app/(site)/(catalogs)/[slug]/content/index.ts b/app/(site)/(catalogs)/[slug]/content/index.ts
index 306622be..3c37f306 100644
--- a/app/(site)/(catalogs)/[slug]/content/index.ts
+++ b/app/(site)/(catalogs)/[slug]/content/index.ts
@@ -1,21 +1,26 @@
 import type { MDXContent } from "mdx/types";
 import DeveloperToolsIntro from "./developer-tools/intro.mdx";
+import DnsToolsArticle from "./dns-tools/article.mdx";
 import DnsToolsIntro from "./dns-tools/intro.mdx";
+import DomainToolsArticle from "./domain-tools/article.mdx";
 import DomainToolsIntro from "./domain-tools/intro.mdx";
 import HostingCloudToolsIntro from "./hosting-cloud-tools/intro.mdx";
+import KdpToolsArticle from "./kdp-tools/article.mdx";
 import KdpToolsIntro from "./kdp-tools/intro.mdx";
 import ProductivityToolsIntro from "./productivity-tools/intro.mdx";
+import SaasToolsArticle from "./saas-tools/article.mdx";
 import SaasToolsIntro from "./saas-tools/intro.mdx";
+import StorageToolsArticle from "./storage-tools/article.mdx";
 import StorageToolsIntro from "./storage-tools/intro.mdx";
 
 /** Each catalog's own words, keyed by its slug. Add an entry before a catalog is published. */
 export const catalogContent: Record<string, { Intro: MDXContent; Article?: MDXContent }> = {
   "developer-tools": { Intro: DeveloperToolsIntro },
-  "dns-tools": { Intro: DnsToolsIntro },
-  "domain-tools": { Intro: DomainToolsIntro },
+  "dns-tools": { Intro: DnsToolsIntro, Article: DnsToolsArticle },
+  "domain-tools": { Intro: DomainToolsIntro, Article: DomainToolsArticle },
   "hosting-cloud-tools": { Intro: HostingCloudToolsIntro },
-  "kdp-tools": { Intro: KdpToolsIntro },
+  "kdp-tools": { Intro: KdpToolsIntro, Article: KdpToolsArticle },
   "productivity-tools": { Intro: ProductivityToolsIntro },
-  "saas-tools": { Intro: SaasToolsIntro },
-  "storage-tools": { Intro: StorageToolsIntro },
+  "saas-tools": { Intro: SaasToolsIntro, Article: SaasToolsArticle },
+  "storage-tools": { Intro: StorageToolsIntro, Article: StorageToolsArticle },
 };
diff --git a/app/(site)/(catalogs)/[slug]/content/kdp-tools/article.mdx b/app/(site)/(catalogs)/[slug]/content/kdp-tools/article.mdx
new file mode 100644
index 00000000..7a557747
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/kdp-tools/article.mdx
@@ -0,0 +1,17 @@
+## Which KDP tool do I need?
+
+Find the step you're on.
+
+| What you're doing | Tools to use |
+| --- | --- |
+| Estimating how many pages your print book will have | [KDP page count estimator](/kdp-page-count-estimator) |
+| Sizing the cover, spine, page, and margins | [KDP book setup calculator](/kdp-book-setup-calculator) |
+| Checking that an image is sharp enough to print | [KDP image DPI checker](/kdp-image-dpi-checker), [pixels to print size](/pixels-to-print-size-calculator) |
+| Checking an interior or cover PDF before upload | [KDP PDF preflight checker](/kdp-pdf-preflight-checker) |
+| Writing the title, description, and keywords | [KDP book title analyzer](/kdp-book-title-analyzer), [KDP description formatter](/kdp-book-description-formatter), [KDP keywords builder](/kdp-backend-keywords-builder) |
+| Checking the listing before you enter it in KDP | [KDP metadata checker](/kdp-metadata-checker) |
+| Choosing a list price | [KDP minimum list price](/kdp-minimum-list-price-calculator), [KDP print price and profit](/kdp-price-profit-calculator) |
+| Working out what you earn per sale | [KDP royalty calculator](/kdp-royalty-calculator) |
+| Setting a bid for Amazon ads | [KDP book ads bid check](/kdp-break-even-acos-calculator) |
+| Estimating Kindle Unlimited earnings | [Kindle Unlimited KENP earnings](/kindle-unlimited-kenp-earnings-calculator) |
+| Finding out when KDP will pay you | [KDP payment date calculator](/kdp-payment-date-calculator) |
diff --git a/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
index 4fbf4f9a..336f93f5 100644
--- a/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/kdp-tools/intro.mdx
@@ -1 +1 @@
-Tools for Amazon KDP authors. Size your pages and cover, check files and listing details, and estimate royalties, price floors, advertising cost per click, and payment months.
+Tools for Amazon KDP authors: size your pages and cover, check your files and listing, price the book, and see what you'll earn and when. Not sure which one you need? Find your step in the table below the tools.
diff --git a/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
index a8d009b2..c8c6cee7 100644
--- a/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/productivity-tools/intro.mdx
@@ -1 +1 @@
-Build a keyboard shortcut reference around the actions you use, then keep it close while you work.
+Pick the apps you use and print one keyboard shortcut cheat sheet with only the actions you want. To browse every shortcut for one app, use the [keyboard shortcuts directory](/keyboard-shortcuts).
diff --git a/app/(site)/(catalogs)/[slug]/content/saas-tools/article.mdx b/app/(site)/(catalogs)/[slug]/content/saas-tools/article.mdx
new file mode 100644
index 00000000..3bf6930e
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/saas-tools/article.mdx
@@ -0,0 +1,16 @@
+## Which SaaS calculator do I need?
+
+Find the question you're asking.
+
+| Your question | Calculator to use |
+| --- | --- |
+| How did this month go overall? | [SaaS metrics calculator](/saas-metrics-calculator) |
+| How much recurring revenue do I have? | [MRR calculator](/mrr-calculator), [ARR calculator](/arr-calculator) |
+| What made MRR go up or down this month? | [MRR waterfall calculator](/mrr-waterfall-calculator) |
+| How much does each customer pay on average? | [ARPU and ARPA calculator](/arpu-arpa-calculator) |
+| How many customers did I lose? | [Customer churn calculator](/customer-churn-calculator) |
+| How much revenue did I lose, or keep, from existing customers? | [Revenue churn calculator](/revenue-churn-calculator), [NRR calculator](/net-revenue-retention-calculator) |
+| How much of my revenue is gross profit? | [SaaS gross margin](/saas-gross-margin-calculator) |
+| How much MRR do I need to cover my costs? | [Break-even MRR](/break-even-mrr-calculator) |
+| What does a new customer cost, and is it worth it? | [Customer acquisition cost](/customer-acquisition-cost-calculator), [customer lifetime value](/customer-lifetime-value-calculator), [LTV to CAC](/ltv-cac-calculator), [CAC payback](/cac-payback-calculator) |
+| How much cash am I burning for each dollar of new ARR? | [Burn multiple calculator](/burn-multiple-calculator) |
diff --git a/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
index 78c12d99..1c446320 100644
--- a/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/saas-tools/intro.mdx
@@ -1 +1 @@
-Start with a monthly view of recurring revenue, retention, customer churn, margin, and acquisition cost. Each calculator explains what its result means and which figures it needs.
+Calculators for subscription businesses: recurring revenue, churn and retention, margins, and what it costs to win a customer. Enter your own figures. Not sure which metric answers your question? Find it in the table below the tools.
diff --git a/app/(site)/(catalogs)/[slug]/content/storage-tools/article.mdx b/app/(site)/(catalogs)/[slug]/content/storage-tools/article.mdx
new file mode 100644
index 00000000..0372da24
--- /dev/null
+++ b/app/(site)/(catalogs)/[slug]/content/storage-tools/article.mdx
@@ -0,0 +1,19 @@
+## Which storage tool do I need?
+
+Find the question you're asking.
+
+| Your question | Tool to use |
+| --- | --- |
+| Which layout should I build with my drives? | [Storage layout advisor](/storage-layout-advisor) |
+| How much space will this RAID level give me? | [RAID calculator](/raid-calculator) |
+| How much space will my ZFS pool have? | [ZFS capacity calculator](/zfs-capacity-calculator) |
+| Why does RAIDZ use more space than I expected? | [ZFS padding calculator](/zfs-padding-calculator) |
+| What do I gain by adding a disk to a RAIDZ vdev? | [RAIDZ expansion planner](/raidz-expansion-planner) |
+| How much space will my Synology, Unraid, or Ceph setup have? | [SHR calculator](/shr-calculator), [Unraid calculator](/unraid-calculator), [Ceph capacity calculator](/ceph-capacity-calculator) |
+| How do I set up SnapRAID with mergerfs? | [SnapRAID and mergerfs planner](/snapraid-mergerfs-planner) |
+| Which drive models fail least? | [Drive reliability explorer](/drive-reliability) |
+| How long will a rebuild take, and how risky is it? | [RAID rebuild calculator](/rebuild-calculator) |
+| When will I run out of space? | [Storage growth planner](/storage-growth-planner) |
+| How much backup storage do I need? | [3-2-1 backup calculator](/backup-321-calculator) |
+| Which snapshots will my restic policy keep? | [Restic retention simulator](/restic-retention-simulator) |
+| Which ports does an NFS share need open? | [NFS firewall rules](/nfs-firewall-rules) |
diff --git a/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx b/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
index 0b0bf3e0..813d5d3b 100644
--- a/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
+++ b/app/(site)/(catalogs)/[slug]/content/storage-tools/intro.mdx
@@ -1 +1 @@
-Compare capacity, protection, rebuild exposure, growth, and cost using the drives and layout you actually plan to run.
+Plan a storage array or backup before you buy drives: usable space, how many drives can fail, rebuild risk, growth, and backup size. Enter the drives and layout you plan to run. Not sure where to start? Use the [storage layout advisor](/storage-layout-advisor), or find your question in the table below the tools.
diff --git a/app/(site)/(catalogs)/[slug]/domain-catalog-reference.tsx b/app/(site)/(catalogs)/[slug]/domain-catalog-reference.tsx
deleted file mode 100644
index 1bf302be..00000000
--- a/app/(site)/(catalogs)/[slug]/domain-catalog-reference.tsx
+++ /dev/null
@@ -1,87 +0,0 @@
-import Link from "next/link";
-import { coverageSummary } from "@/lib/domain/bootstrap.ts";
-import { proseSectionFlowClassName } from "@/app/ui/site/prose";
-
-export function DomainCatalogReference() {
-  const coverage = coverageSummary();
-  return (
-    <>
-        <section className="domain-reference-content">
-          <h2>Domain references</h2>
-          <p>
-            Use the <Link href="/epp-status-codes">domain status code reference</Link> to understand
-            registry and registrar locks. The <Link href="/tld-directory">TLD directory</Link> shows
-            which domain endings have RDAP and DNSSEC support.
-          </p>
-        </section>
-        <hr className="domain-divider" />
-
-        <article className={`domain-reference-content ${proseSectionFlowClassName}`}>
-          <section>
-            <h2>Is WHOIS still a thing?</h2>
-            <p>
-              Not really, and that is worth knowing before you trust an old tool. WHOIS
-              was a plain text service that answered on port 43, and ICANN stopped
-              requiring registries and registrars to run it on 28 January 2025. It has
-              been replaced by RDAP, which returns properly structured data over a secure
-              connection.
-            </p>
-            <p>
-              Most people still call it a WHOIS lookup, and that is fine. What matters is
-              that RDAP carries information the old format could not, including a
-              machine-readable list of exactly which contact fields a registrar withheld.
-              Every tool here reads RDAP.
-            </p>
-            <p>
-              One thing that trips everybody up: there are two servers holding two
-              different records, and they do not say the same things. The registry runs
-              the ending and is the authority on dates, status codes, nameservers and
-              DNSSEC. The registrar is the company the domain was bought through, and for
-              most endings it is the only party holding any contact details.
-            </p>
-            <p className="domain-source-path">
-              <code>you</code>
-              <span aria-hidden="true">→</span>
-              <code>registry</code>
-              <span aria-hidden="true">→</span>
-              <code>registrar</code>
-            </p>
-          </section>
-
-          <section>
-            <h2>Which domain extensions can be looked up?</h2>
-            <p>
-              Not every ending publishes RDAP. Of the {coverage.rootZoneTlds.toLocaleString("en-US")} endings in
-              the root zone, {coverage.covered.toLocaleString("en-US")} are ones we can
-              look up, using the official IANA directory plus a small reviewed list of
-              registries that run RDAP without being listed there. The
-              remaining {coverage.uncovered.toLocaleString("en-US")} we cannot check at
-              all, and the tools say so rather than showing you a blank that looks like
-              an answer. The{" "}
-              <Link href="/tld-directory">TLD directory</Link> lists every one,
-              and it was last refreshed on {coverage.checkedAt}.
-            </p>
-            <p>
-              None of these tools can show you history. RDAP returns the current state of
-              a record and nothing else, so there is no previous owner, no past
-              nameserver, and no record of what changed last week. Anything claiming
-              otherwise is selling you an archive someone built by saving daily copies.
-            </p>
-          </section>
-
-          <section>
-            <h2>Are these domain lookups private?</h2>
-            <p>
-              The name you enter is sent to the registry and registrar that operate that
-              ending. There is no way around that, since they are the ones holding the
-              answer. On our side we keep the registry&apos;s answer for a short while so
-              that repeated lookups do not hammer them, and that cached answer is stored
-              against the domain name only. Your address is used briefly to stop one
-              person overloading the tools, it is never written next to a lookup, and we
-              do not build any record of who searched for what.
-            </p>
-          </section>
-        </article>
-    </>
-  );
-}
diff --git a/app/(site)/(catalogs)/[slug]/page.tsx b/app/(site)/(catalogs)/[slug]/page.tsx
index 948490bf..24e71586 100644
--- a/app/(site)/(catalogs)/[slug]/page.tsx
+++ b/app/(site)/(catalogs)/[slug]/page.tsx
@@ -9,7 +9,6 @@ import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content"
 import { proseClassName, proseFlowClassName } from "@/app/ui/site/prose";
 import { ToolCatalog } from "@/app/ui/catalogs/tool-catalog";
 import { ToolCatalogSidebar } from "@/app/ui/catalogs/tool-catalog-sidebar";
-import { DomainCatalogReference } from "./domain-catalog-reference";
 import { cardArt } from "@/lib/card-art";
 import { cardIcon } from "@/lib/card-icons";
 import { getPublishedToolCatalog } from "@/lib/tool-catalogs";
@@ -43,7 +42,6 @@ export default async function ToolCatalogPage({ params }: { params: Promise<{ sl
       </EntryHero>
       <PageCanvas>
         <ToolCatalog heading="Tools" tools={catalog.tools} />
-        {slug === "domain-tools" ? <DomainCatalogReference /> : null}
       </PageCanvas>
       {Article ? (
         <PageCanvas as="article" reading className={`${proseClassName} ${proseFlowClassName}`}>

From bb4769fa88d177821e1b340a5458bb5843203d92 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:36:50 +0530
Subject: [PATCH 20/25] Open source links in a new tab on the licenses and
 launch pages again

The move to MDX dropped the page-scoped link override. The launch guide
is a labelled section again.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 .../launch-directory-guide.tsx                | 20 +++++++++++-------
 .../page.tsx                                  | 21 ++++++++++++-------
 app/ui/content-elements.tsx                   |  7 +++++++
 3 files changed, 32 insertions(+), 16 deletions(-)

diff --git a/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx b/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
index afbc99ad..b89b50d1 100644
--- a/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
+++ b/app/(site)/(directories)/launch-directories/launch-directory-guide.tsx
@@ -1,4 +1,5 @@
 import type { ComponentPropsWithoutRef } from "react";
+import { NewTabContentLink } from "@/app/ui/content-elements";
 import { proseClassName, proseFlowClassName } from "@/app/ui/site/prose";
 import Corrections from "./content/corrections.mdx";
 import FreeListings from "./content/free-listings.mdx";
@@ -15,13 +16,16 @@ function headingWithId(id: string) {
   };
 }
 
+// Source links open in a new tab, so visitors keep their filtered list.
+const a = NewTabContentLink;
+
 export function LaunchDirectoryGuide() {
-  return <div className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
-    <HowWeCheck components={{ h2: headingWithId("how-we-check") }} />
-    <RecommendedOrder components={{ h2: headingWithId("recommended-order") }} />
-    <LinkTypes />
-    <FreeListings />
-    <LaunchTiming />
-    <Corrections />
-  </div>;
+  return <section aria-labelledby="how-we-check" className={`${proseClassName} ${proseFlowClassName} ${styles.guide}`}>
+    <HowWeCheck components={{ a, h2: headingWithId("how-we-check") }} />
+    <RecommendedOrder components={{ a, h2: headingWithId("recommended-order") }} />
+    <LinkTypes components={{ a }} />
+    <FreeListings components={{ a }} />
+    <LaunchTiming components={{ a }} />
+    <Corrections components={{ a }} />
+  </section>;
 }
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx b/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
index 982a5ecc..39e6338a 100644
--- a/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/page.tsx
@@ -2,6 +2,7 @@ import { getRequiredDirectoryPage } from "@/lib/directory-pages";
 import { DirectoryPageTitle } from "@/app/ui/directories/directory-page-content";
 import { PageMeta } from "@/app/ui/site/page-meta";
 import type { MDXComponents } from "mdx/types";
+import { NewTabContentLink } from "@/app/ui/content-elements";
 import { PageCanvas } from "@/app/ui/site/page-canvas";
 import Link from "next/link";
 import { getDirectoryLicenseCounts } from "@/lib/apps";
@@ -47,8 +48,12 @@ const verdictColumns = [
   { key: "redistribute", label: "Redistribute" },
 ] as const;
 
+/** Source links open in a new tab, so readers keep their place in the comparison. */
+const licenseComponents: MDXComponents = { a: NewTabContentLink };
+
 /** Bold verdict words in the table key take the table's verdict colors. */
 const verdictComponents: MDXComponents = {
+  ...licenseComponents,
   strong({ children }) {
     const verdict = typeof children === "string" && ["yes", "careful", "depends", "no"].includes(children) ? children : null;
     return <strong className={verdict ? `license-verdict-${verdict}` : undefined}>{children}</strong>;
@@ -207,7 +212,7 @@ export default async function SoftwareLicensesPage() {
 
         <section className="license-section license-structured-section" id="verdict-table">
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
-            <Compare />
+            <Compare components={licenseComponents} />
           </div>
           <VerdictTable />
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
@@ -219,24 +224,24 @@ export default async function SoftwareLicensesPage() {
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="license-families"
         >
-          <Families />
+          <Families components={licenseComponents} />
           <MarkerArt
             caption="The four license families differ by what must stay open and when that obligation begins."
             svg={softwareLicensesForSelfHostingLicenseFamiliesArt}
           />
-          <FamilyDetails />
+          <FamilyDetails components={licenseComponents} />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="copyleft-trigger"
         >
-          <CopyleftTrigger />
+          <CopyleftTrigger components={licenseComponents} />
         </section>
 
         <section className="license-section license-structured-section" id="all-licenses">
           <div className={`license-narrative ${proseClassName} ${proseFlowClassName}`}>
-            <AllLicenses />
+            <AllLicenses components={licenseComponents} />
           </div>
 
           {licenseGroups.map((group) => {
@@ -267,21 +272,21 @@ export default async function SoftwareLicensesPage() {
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="open-source-vs-source-available"
         >
-          <OpenVsSourceAvailable />
+          <OpenVsSourceAvailable components={licenseComponents} />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="choosing-a-license"
         >
-          <Choosing />
+          <Choosing components={licenseComponents} />
         </section>
 
         <section
           className={`license-section license-narrative ${proseClassName} ${proseFlowClassName}`}
           id="faq"
         >
-          <Faq />
+          <Faq components={licenseComponents} />
         </section>
       </PageCanvas>
     </AppShell>
diff --git a/app/ui/content-elements.tsx b/app/ui/content-elements.tsx
index d93578ee..9b1a9506 100644
--- a/app/ui/content-elements.tsx
+++ b/app/ui/content-elements.tsx
@@ -46,6 +46,13 @@ export function ContentLink({ children, href, ...props }: ComponentPropsWithoutR
   return href?.startsWith("/") ? <Link href={href}>{children}</Link> : <a href={href} {...props}>{children}</a>;
 }
 
+/** For directory pages whose source links open beside the listing instead of leaving it. */
+export function NewTabContentLink({ children, href, ...props }: ComponentPropsWithoutRef<"a">) {
+  return href?.startsWith("/") || href?.startsWith("#") || href?.startsWith("mailto:")
+    ? <ContentLink href={href} {...props}>{children}</ContentLink>
+    : <a href={href} rel="noopener noreferrer" target="_blank" {...props}>{children}</a>;
+}
+
 export function ContentTable({ children, ...props }: ComponentPropsWithoutRef<"table">) {
   return <TableFrame ariaLabel="Content table" className={styles.tableScroll}><table {...props}>{children}</table></TableFrame>;
 }

From eaa95904e73eca2c2b1460c4c6120cdf429e8d14 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:39:26 +0530
Subject: [PATCH 21/25] Apply the content audit fixes

Trims claims that went past their sources, finishes the music cost
example, fixes the tmux intro, and explains every OSI value in the
license table key.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 app/(site)/(directories)/cli-apps/content/health.mdx          | 2 +-
 .../(directories)/keyboard-shortcuts/tmux/content/intro.mdx   | 2 +-
 .../[section]/content/music-and-audio/article.mdx             | 2 ++
 .../content/verdict-key.mdx                                   | 4 ++--
 .../(tools)/(domain)/transfer-readiness/content/article.mdx   | 4 ++--
 .../(saas)/burn-multiple-calculator/content/article.mdx       | 4 ++--
 6 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/app/(site)/(directories)/cli-apps/content/health.mdx b/app/(site)/(directories)/cli-apps/content/health.mdx
index 07a4de2d..4796b580 100644
--- a/app/(site)/(directories)/cli-apps/content/health.mdx
+++ b/app/(site)/(directories)/cli-apps/content/health.mdx
@@ -10,6 +10,6 @@ Health shows how recently the project's code changed when we reviewed it.
 | Archived | The repository is archived on GitHub |
 | Unknown | Not set at review |
 
-Health only changes when we review an app again, except Archived, which follows GitHub. Stars and the last commit date update from GitHub, so the last commit date is the fresher sign of activity.
+Health changes when we review an app again. Stars and the last commit date come from GitHub and can be newer than the review, so the last commit date is the fresher sign of activity.
 
 Most popular sorts by star count. Apps with no star count sort last.
diff --git a/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
index e4df5b13..41594e2c 100644
--- a/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
+++ b/app/(site)/(directories)/keyboard-shortcuts/tmux/content/intro.mdx
@@ -1 +1 @@
-tmux keeps terminal sessions running after you disconnect and splits one window into many panes. Every key here follows the Ctrl+B prefix, and they manage sessions and windows, split and resize panes, and copy text in copy mode.
+tmux keeps terminal sessions running after you disconnect and splits one window into many panes. Press Ctrl+B first, then the key. The keys here manage sessions and windows, split and resize panes, open copy mode, and paste copied text.
diff --git a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
index 0046946a..cd0d7eaf 100644
--- a/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
+++ b/app/(site)/(directories)/platform-fees/[section]/content/music-and-audio/article.mdx
@@ -6,6 +6,8 @@ It depends on how much your music earns and how often you release. DistroKid and
 
 CD Baby keeps 9%, which is $27 a year, plus the $9.99 release fee once. DistroKid's cheapest plan costs $24.99 a year and covers unlimited uploads.
 
+In the first year, CD Baby costs $36.99 and DistroKid $24.99. After that, CD Baby costs less only while the single earns under about $278 a year.
+
 </Example>
 
 The more you release, the more a yearly plan covers. Withdrawal fees and paid extras can change the picture, so check the lines on each card.
diff --git a/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx b/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
index 24c38ff8..0d1baa0c 100644
--- a/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
+++ b/app/(site)/(directories)/software-licenses-for-self-hosting/content/verdict-key.mdx
@@ -4,7 +4,7 @@
 | --- | --- |
 | Self-host | Can you run it on your own hardware, for yourself and your household? |
 | Company | Can it run on a work server for internal use? |
-| OSI | Is it approved by the Open Source Initiative? `pd` means a public domain dedication, which works like open source without being on the list. |
+| OSI | Is it approved by the Open Source Initiative? `pd` means a public domain dedication, which works like open source without being on the list. `n.a.` means OSI doesn't review that kind of license, such as Creative Commons or a commercial EULA. `depends` marks patterns that mix licenses, such as dual licensing. |
 | Service | Can you host it for people outside your household or company, including paid hosting? |
 | Modify | Can you change the code, and what do you owe when your changes leave your server? |
 | Redistribute | Can you pass it on in images, appliances, forks, or products? |
@@ -17,4 +17,4 @@
 | **depends** | Project terms, a chosen option, or a separate agreement decide. |
 | **no** | The license doesn't allow it. |
 
-WTFPL, for example, allows everything, but some company policies ban it anyway. That's a policy question, not a license one. The [self-hosted apps](/self-host-apps) directory uses the same license names, so you can filter apps by license there.
+WTFPL, for example, allows everything, yet some company policies ban it. The [self-hosted apps](/self-host-apps) directory uses the same license names, so you can filter apps by license there.
diff --git a/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx b/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
index 834d95d7..1e20ef71 100644
--- a/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
+++ b/app/(site)/(tools)/(domain)/transfer-readiness/content/article.mdx
@@ -6,7 +6,7 @@ Only the one your registrar sets. The others need the registrar's help or time.
 | --- | --- |
 | `clientTransferProhibited` | You, usually with a "transfer lock" switch in your registrar account. |
 | `serverTransferProhibited` | Only the registry. Ask your registrar why it's there. |
-| `pendingTransfer` | Nobody. Another transfer is already running, so wait for it to finish or cancel it with your registrar. |
+| `pendingTransfer` | It clears when the transfer that's already running ends. Wait for it to finish, or ask your registrar to cancel it. |
 | `redemptionPeriod` or `pendingDelete` | The domain must be restored first, if restoring is still possible. |
 
 ## Why can't I transfer a domain I registered or moved recently?
@@ -15,7 +15,7 @@ Under ICANN's [Transfer Policy](https://www.icann.org/en/contracted-parties/accr
 
 Changing the registrant's name, organization, or email can also start a 60-day lock on generic endings. Registrars may let you opt out, but only before you make the change. Ask before editing contact details to prepare a transfer.
 
-The [ICANN Board adopted](https://www.icann.org/en/board-activities-and-meetings/materials/approved-resolutions-regular-meeting-of-the-icann-board-07-06-2026-en) shorter 30-day locks on 7 June 2026, and removed the registrant change lock. They don't apply until ICANN publishes a date, so the 60-day rules still hold.
+The [ICANN Board adopted new transfer rules](https://www.icann.org/en/board-activities-and-meetings/materials/approved-resolutions-regular-meeting-of-the-icann-board-07-06-2026-en) on 7 June 2026. They don't apply until ICANN publishes a start date, so the 60-day rules still hold.
 
 ## How do I move a domain without the site or email going down?
 
diff --git a/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
index 216aefc9..c66c4b64 100644
--- a/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
+++ b/app/(site)/(tools)/(saas)/burn-multiple-calculator/content/article.mdx
@@ -12,7 +12,7 @@ David Sacks of Craft Ventures [introduced the burn multiple](https://www.craftve
 
 ## What is a good burn multiple?
 
-Lower is better. These bands are the common rules of thumb for venture-backed startups.
+Lower is better. Investors in venture-backed startups often use these bands.
 
 | Burn multiple | Read as |
 | --- | --- |
@@ -22,7 +22,7 @@ Lower is better. These bands are the common rules of thumb for venture-backed st
 | 2 to 3 | Worth looking into |
 | Above 3 | A warning sign |
 
-[ChartMogul's burn multiple guide](https://chartmogul.com/saas-metrics/burn-multiple/) lists these bands. Craft Ventures calls its version rules of thumb for venture-stage startups, not targets for every business.
+[ChartMogul's burn multiple guide](https://chartmogul.com/saas-metrics/burn-multiple/) lists these bands. Craft Ventures calls its own table rules of thumb for venture-stage startups.
 
 ## Why does my burn multiple jump around?
 

From cb6943afa876e8464c8c3bd90229fd598f17dc68 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:50:30 +0530
Subject: [PATCH 22/25] Add record readiness checks for three database
 directories

The directories publisher needs one for each directory whose records
live in the database. Self-host apps, terminal apps, and launch
directories had none it could use for a copy-only batch.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 scripts/cli-apps/records-ready.sql                     | 2 ++
 scripts/launch-directories/published-records-ready.sql | 2 ++
 scripts/self-host-apps/records-ready.sql               | 2 ++
 3 files changed, 6 insertions(+)
 create mode 100644 scripts/cli-apps/records-ready.sql
 create mode 100644 scripts/launch-directories/published-records-ready.sql
 create mode 100644 scripts/self-host-apps/records-ready.sql

diff --git a/scripts/cli-apps/records-ready.sql b/scripts/cli-apps/records-ready.sql
new file mode 100644
index 00000000..a907ba67
--- /dev/null
+++ b/scripts/cli-apps/records-ready.sql
@@ -0,0 +1,2 @@
+-- The directory has published records to list. Used by the directories publisher.
+select count(*) > 0 as ready from public.terminal_apps where published;
diff --git a/scripts/launch-directories/published-records-ready.sql b/scripts/launch-directories/published-records-ready.sql
new file mode 100644
index 00000000..f121406c
--- /dev/null
+++ b/scripts/launch-directories/published-records-ready.sql
@@ -0,0 +1,2 @@
+-- The directory has published records to list. Used by the directories publisher.
+select count(*) > 0 as ready from public.launch_directories where is_published;
diff --git a/scripts/self-host-apps/records-ready.sql b/scripts/self-host-apps/records-ready.sql
new file mode 100644
index 00000000..0b35cbbd
--- /dev/null
+++ b/scripts/self-host-apps/records-ready.sql
@@ -0,0 +1,2 @@
+-- The directory has published records to list. Used by the directories publisher.
+select count(*) > 0 as ready from public.self_host_apps where published;

From fccdcb80e97d754774d2c593417d0983263af474 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:51:28 +0530
Subject: [PATCH 23/25] Keep the new readiness checks to one SELECT each

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 scripts/cli-apps/records-ready.sql                     | 1 -
 scripts/launch-directories/published-records-ready.sql | 1 -
 scripts/self-host-apps/records-ready.sql               | 1 -
 3 files changed, 3 deletions(-)

diff --git a/scripts/cli-apps/records-ready.sql b/scripts/cli-apps/records-ready.sql
index a907ba67..338937ec 100644
--- a/scripts/cli-apps/records-ready.sql
+++ b/scripts/cli-apps/records-ready.sql
@@ -1,2 +1 @@
--- The directory has published records to list. Used by the directories publisher.
 select count(*) > 0 as ready from public.terminal_apps where published;
diff --git a/scripts/launch-directories/published-records-ready.sql b/scripts/launch-directories/published-records-ready.sql
index f121406c..69e5454c 100644
--- a/scripts/launch-directories/published-records-ready.sql
+++ b/scripts/launch-directories/published-records-ready.sql
@@ -1,2 +1 @@
--- The directory has published records to list. Used by the directories publisher.
 select count(*) > 0 as ready from public.launch_directories where is_published;
diff --git a/scripts/self-host-apps/records-ready.sql b/scripts/self-host-apps/records-ready.sql
index 0b35cbbd..b625571c 100644
--- a/scripts/self-host-apps/records-ready.sql
+++ b/scripts/self-host-apps/records-ready.sql
@@ -1,2 +1 @@
--- The directory has published records to list. Used by the directories publisher.
 select count(*) > 0 as ready from public.self_host_apps where published;

From 8196390b7333209cbf95bddd9ca12a7eeb50e8c2 Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:55:07 +0530
Subject: [PATCH 24/25] Count only listed apps in the self-host readiness check

Also restores the terminal apps note that Archived follows GitHub data
between reviews, which the code does.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 app/(site)/(directories)/cli-apps/content/health.mdx | 2 +-
 scripts/self-host-apps/records-ready.sql             | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/(site)/(directories)/cli-apps/content/health.mdx b/app/(site)/(directories)/cli-apps/content/health.mdx
index 4796b580..0bc8c22d 100644
--- a/app/(site)/(directories)/cli-apps/content/health.mdx
+++ b/app/(site)/(directories)/cli-apps/content/health.mdx
@@ -10,6 +10,6 @@ Health shows how recently the project's code changed when we reviewed it.
 | Archived | The repository is archived on GitHub |
 | Unknown | Not set at review |
 
-Health changes when we review an app again. Stars and the last commit date come from GitHub and can be newer than the review, so the last commit date is the fresher sign of activity.
+Health changes when we review an app again, except Archived, which shows as soon as our GitHub data marks the repository archived. Stars and the last commit date also come from that data and can be newer than the review, so the last commit date is the fresher sign of activity.
 
 Most popular sorts by star count. Apps with no star count sort last.
diff --git a/scripts/self-host-apps/records-ready.sql b/scripts/self-host-apps/records-ready.sql
index b625571c..18b513ad 100644
--- a/scripts/self-host-apps/records-ready.sql
+++ b/scripts/self-host-apps/records-ready.sql
@@ -1 +1 @@
-select count(*) > 0 as ready from public.self_host_apps where published;
+select count(*) > 0 as ready from public.self_host_apps where published and self_hosting_status = 'self_hostable';

From d36bc268ce277e0fa57227596a0be83d5e28acff Mon Sep 17 00:00:00 2001
From: Ravi Teja KNTS <ravitejaknts@Ravis-MacBook-Air.local>
Date: Sat, 10 Oct 2026 03:56:45 +0530
Subject: [PATCH 25/25] Mark the content pass written and reviewed in the plan

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 dev-space/charts-and-content-in-code-plan.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/dev-space/charts-and-content-in-code-plan.md b/dev-space/charts-and-content-in-code-plan.md
index 8385bd93..9e4b9b86 100644
--- a/dev-space/charts-and-content-in-code-plan.md
+++ b/dev-space/charts-and-content-in-code-plan.md
@@ -15,7 +15,7 @@ Work through the steps in order. Step 0 and Part 1 ship together in pull request
 | 2a | Content design doc | Opus | #36 | Shipped in `ce282243` |
 | 2b | Pilot: MDX setup, export script, two pages | Claude Opus worker, Sol for the script, Sol review | #36 | Shipped in `ce282243`: `/cac-payback-calculator` and `/epp-status-codes` |
 | 2c | Docs and skills for content in code | Opus | #36 | Shipped in `ce282243` |
-| 2d | Content pass: rewrite and move every published tool, directory, child, and catalog page | Claude Opus thread in its own worktree, Sol for scripts and review | One PR at the end | In progress on `content/page-rewrite`: route side done, 19 move-only tools moved, tool family pilots done |
+| 2d | Content pass: rewrite and move every published tool, directory, child, and catalog page | Claude Opus thread in its own worktree, Sol for scripts and review | #39 | All 327 pages written and moved, Sol review passed. Browser checks and the production publisher batches wait for release approval |
 | 2e | Cleanup and retire database content columns | Sol | Final PR | Not started |
 | 3 | Production release | Coordinator | Release | Not started |