diff --git a/.storybook/main.ts b/.storybook/main.ts
index 7dcb010d26..5b1419fca1 100644
--- a/.storybook/main.ts
+++ b/.storybook/main.ts
@@ -8,6 +8,16 @@ const config = {
     backgrounds: false,
   },
   async viteFinal(config) {
+    config.plugins ??= []
+
+    config.plugins.push({
+      name: 'ignore-internals',
+      transform(_, id) {
+        if (id.includes('/app/pages/blog/') && id.endsWith('.md')) {
+          return 'export default {}'
+        }
+      },
+    })
     // Replace the built-in vue-docgen plugin with a fault-tolerant version.
     // vue-docgen-api can crash on components that import types from other
     // .vue files (it tries to parse the SFC with @babel/parser as plain TS).
diff --git a/app/components/AppFooter.vue b/app/components/AppFooter.vue
index 43ead35e43..ddccbc9019 100644
--- a/app/components/AppFooter.vue
+++ b/app/components/AppFooter.vue
@@ -25,6 +25,9 @@ const closeModal = () => modalRef.value?.close?.()
           <LinkBase :to="{ name: 'about' }">
             {{ $t('footer.about') }}
           </LinkBase>
+          <LinkBase :to="{ name: 'blog' }">
+            {{ $t('footer.blog') }}
+          </LinkBase>
           <LinkBase :to="{ name: 'privacy' }">
             {{ $t('privacy_policy.title') }}
           </LinkBase>
diff --git a/app/components/AppHeader.vue b/app/components/AppHeader.vue
index 7a0d8980df..1600bb4c90 100644
--- a/app/components/AppHeader.vue
+++ b/app/components/AppHeader.vue
@@ -59,6 +59,14 @@ const mobileLinks = computed<NavigationConfigWithGroups>(() => [
         external: false,
         iconClass: 'i-lucide:info',
       },
+      {
+        name: 'Blog',
+        label: $t('footer.blog'),
+        to: { name: 'blog' },
+        type: 'link',
+        external: false,
+        iconClass: 'i-lucide:notebook-pen',
+      },
       {
         name: 'Privacy Policy',
         label: $t('privacy_policy.title'),
diff --git a/app/components/AuthorAvatar.vue b/app/components/AuthorAvatar.vue
new file mode 100644
index 0000000000..0e68ae41a3
--- /dev/null
+++ b/app/components/AuthorAvatar.vue
@@ -0,0 +1,45 @@
+<script setup lang="ts">
+import type { ResolvedAuthor } from '#shared/schemas/blog'
+
+const props = defineProps<{
+  author: Partial<ResolvedAuthor> & Pick<ResolvedAuthor, 'name' | 'avatar'>
+  size?: 'sm' | 'md' | 'lg'
+}>()
+
+const sizeClasses = computed(() => {
+  switch (props.size ?? 'md') {
+    case 'sm':
+      return 'w-8 h-8 text-sm'
+    case 'lg':
+      return 'w-12 h-12 text-xl'
+    default:
+      return 'w-10 h-10 text-lg'
+  }
+})
+
+const initials = computed(() =>
+  props.author.name
+    .split(' ')
+    .map(n => n[0])
+    .join('')
+    .toUpperCase()
+    .slice(0, 2),
+)
+</script>
+
+<template>
+  <div
+    class="shrink-0 flex items-center justify-center border border-border rounded-full bg-bg-muted overflow-hidden"
+    :class="[sizeClasses]"
+  >
+    <img
+      v-if="author.avatar"
+      :src="author.avatar"
+      :alt="author.name"
+      class="w-full h-full object-cover"
+    />
+    <span v-else class="text-fg-subtle font-mono" aria-hidden="true">
+      {{ initials }}
+    </span>
+  </div>
+</template>
diff --git a/app/components/AuthorList.vue b/app/components/AuthorList.vue
new file mode 100644
index 0000000000..ee5de3464a
--- /dev/null
+++ b/app/components/AuthorList.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import type { Author } from '#shared/schemas/blog'
+
+const props = defineProps<{
+  authors: Author[]
+  variant?: 'compact' | 'expanded'
+}>()
+
+const { resolvedAuthors } = useBlueskyAuthorProfiles(props.authors)
+</script>
+
+<template>
+  <!-- Expanded variant: vertical list with larger avatars -->
+  <div v-if="variant === 'expanded'" class="flex flex-wrap items-center gap-4">
+    <div v-for="author in resolvedAuthors" :key="author.name" class="flex items-center gap-2">
+      <AuthorAvatar :author="author" size="md" disable-link />
+      <div class="flex flex-col">
+        <span class="text-sm font-medium text-fg">{{ author.name }}</span>
+        <a
+          v-if="author.blueskyHandle && author.profileUrl"
+          :href="author.profileUrl"
+          target="_blank"
+          rel="noopener noreferrer"
+          :aria-label="$t('blog.author.view_profile', { name: author.name })"
+          class="text-xs text-fg-muted hover:text-primary transition-colors"
+        >
+          @{{ author.blueskyHandle }}
+        </a>
+      </div>
+    </div>
+  </div>
+
+  <!-- Compact variant: no avatars -->
+  <div v-else class="flex items-center gap-2 min-w-0">
+    <div class="flex items-center">
+      <AuthorAvatar
+        v-for="(author, index) in resolvedAuthors"
+        :key="author.name"
+        :author="author"
+        size="md"
+        class="ring-2 ring-bg"
+        :class="index > 0 ? '-ms-3' : ''"
+      />
+    </div>
+    <span class="text-xs text-fg-muted font-mono truncate">
+      {{ resolvedAuthors.map(a => a.name).join(', ') }}
+    </span>
+  </div>
+</template>
diff --git a/app/components/BlogPostListCard.vue b/app/components/BlogPostListCard.vue
new file mode 100644
index 0000000000..d5e4f1b13c
--- /dev/null
+++ b/app/components/BlogPostListCard.vue
@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import type { Author } from '#shared/schemas/blog'
+
+defineProps<{
+  /** Authors of the blog post */
+  authors: Author[]
+  /** Blog Title */
+  title: string
+  /** Tags such as OpenSource, Architecture, Community, etc. */
+  topics: string[]
+  /** Brief line from the text. */
+  excerpt: string
+  /** The datetime value (ISO string or Date) */
+  published: string
+  /** Path/Slug of the post */
+  path: string
+  /** For keyboard nav scaffold */
+  index: number
+}>()
+</script>
+
+<template>
+  <article
+    class="group relative hover:bg-bg-subtle transition-colors duration-150 focus-within:outline-none focus-within:ring-2 focus-within:ring-offset-bg focus-within:ring-offset-2 focus-within:ring-fg/50 -mx-4 px-4 -my-2 py-2 sm:-mx-6 sm:px-6 sm:-my-3 sm:py-3 sm:rounded-md"
+  >
+    <NuxtLink
+      :to="`/blog/${path}`"
+      :data-suggestion-index="index"
+      class="flex items-center gap-4 focus-visible:outline-none after:content-[''] after:absolute after:inset-0"
+    >
+      <!-- Text Content -->
+      <div class="flex-1 min-w-0 text-start gap-2">
+        <span class="text-xs text-fg-muted font-mono">{{ published }}</span>
+        <h2
+          class="font-mono text-xl font-medium text-fg group-hover:text-primary transition-colors hover:underline"
+        >
+          {{ title }}
+        </h2>
+        <p v-if="excerpt" class="text-fg-muted leading-relaxed line-clamp-2 no-underline">
+          {{ excerpt }}
+        </p>
+        <div class="flex flex-wrap items-center gap-2 text-xs text-fg-muted font-mono mt-4">
+          <AuthorList :authors="authors" />
+        </div>
+      </div>
+
+      <span
+        class="i-lucide:arrow-right w-4 h-4 text-fg-subtle group-hover:text-fg relative inset-is-0 group-hover:inset-is-1 transition-all duration-200 shrink-0"
+        aria-hidden="true"
+      />
+    </NuxtLink>
+  </article>
+</template>
diff --git a/app/components/BlueskyComment.vue b/app/components/BlueskyComment.vue
new file mode 100644
index 0000000000..12fe336a1f
--- /dev/null
+++ b/app/components/BlueskyComment.vue
@@ -0,0 +1,203 @@
+<script setup lang="ts">
+import type { AppBskyRichtextFacet } from '@atproto/api'
+import { segmentize } from '@atcute/bluesky-richtext-segmenter'
+import type { Comment } from '#shared/types/blog-post'
+
+type RichtextFeature =
+  | AppBskyRichtextFacet.Link
+  | AppBskyRichtextFacet.Mention
+  | AppBskyRichtextFacet.Tag
+
+function getCommentUrl(comment: Comment): string {
+  return atUriToWebUrl(comment.uri) ?? '#'
+}
+const props = defineProps<{
+  comment: Comment
+  depth: number
+}>()
+
+const MaxDepth = 4
+
+function getFeatureUrl(feature: RichtextFeature): string | undefined {
+  if (feature.$type === 'app.bsky.richtext.facet#link') return feature.uri
+  if (feature.$type === 'app.bsky.richtext.facet#mention')
+    return `https://bsky.app/profile/${feature.did}`
+  if (feature.$type === 'app.bsky.richtext.facet#tag')
+    return `https://bsky.app/hashtag/${feature.tag}`
+}
+
+const processedSegments = segmentize(props.comment.text, props.comment.facets).map(segment => ({
+  text: segment.text,
+  url: segment.features?.[0] ? getFeatureUrl(segment.features[0] as RichtextFeature) : undefined,
+}))
+
+function getHostname(uri: string): string {
+  try {
+    return new URL(uri).hostname
+  } catch {
+    return uri
+  }
+}
+</script>
+
+<template>
+  <div :class="depth === 0 ? 'flex gap-3' : 'flex gap-3 mt-3'">
+    <!-- Avatar -->
+    <a
+      :href="`https://bsky.app/profile/${comment.author.handle}`"
+      target="_blank"
+      rel="noopener noreferrer"
+      class="shrink-0"
+    >
+      <img
+        v-if="comment.author.avatar"
+        :src="comment.author.avatar"
+        :alt="comment.author.displayName || comment.author.handle"
+        :class="['rounded-full', depth === 0 ? 'w-10 h-10' : 'w-8 h-8']"
+        width="40"
+        height="40"
+        loading="lazy"
+      />
+      <div
+        v-else
+        :class="[
+          'rounded-full bg-border flex items-center justify-center text-fg-muted',
+          depth === 0 ? 'w-10 h-10' : 'w-8 h-8 text-sm',
+        ]"
+      >
+        {{ (comment.author.displayName || comment.author.handle).charAt(0).toUpperCase() }}
+      </div>
+    </a>
+
+    <div class="flex-1 min-w-0">
+      <!-- Author info + timestamp -->
+      <div class="flex flex-wrap items-baseline gap-x-2 gap-y-0">
+        <a
+          :href="`https://bsky.app/profile/${comment.author.handle}`"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="font-medium text-fg hover:underline"
+        >
+          {{ comment.author.displayName || comment.author.handle }}
+        </a>
+        <span class="text-fg-subtle text-sm">@{{ comment.author.handle }}</span>
+        <span class="text-fg-subtle text-sm">·</span>
+        <a
+          :href="getCommentUrl(props.comment)"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="text-fg-subtle text-sm hover:underline"
+        >
+          <NuxtTime relative :datetime="comment.createdAt" />
+        </a>
+      </div>
+
+      <!-- Comment text with rich segments -->
+      <p class="text-fg-muted whitespace-pre-wrap">
+        <template v-for="(segment, i) in processedSegments" :key="i">
+          <a
+            v-if="segment.url"
+            :href="segment.url"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="link"
+            >{{ segment.text }}</a
+          >
+          <template v-else>{{ segment.text }}</template>
+        </template>
+      </p>
+
+      <!-- Embedded images -->
+      <div
+        v-if="comment.embed?.type === 'images' && comment.embed.images"
+        class="flex flex-wrap gap-2"
+      >
+        <a
+          v-for="(img, i) in comment.embed.images"
+          :key="i"
+          :href="img.fullsize"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="block"
+        >
+          <img
+            :src="img.thumb"
+            :alt="img.alt || 'Embedded image'"
+            class="rounded-lg max-w-48 max-h-36 object-cover"
+            loading="lazy"
+          />
+        </a>
+      </div>
+
+      <!-- Embedded external link card -->
+      <a
+        v-if="comment.embed?.type === 'external' && comment.embed.external"
+        :href="comment.embed.external.uri"
+        target="_blank"
+        rel="noopener noreferrer"
+        class="flex gap-3 p-3 border border-border rounded-lg bg-bg-subtle hover:bg-bg-subtle/80 transition-colors no-underline"
+      >
+        <img
+          v-if="comment.embed.external.thumb"
+          :src="comment.embed.external.thumb"
+          :alt="comment.embed.external.title"
+          width="20"
+          height="20"
+          class="w-20 h-20 rounded object-cover shrink-0"
+          loading="lazy"
+        />
+        <div class="min-w-0">
+          <div class="font-medium text-fg truncate">
+            {{ comment.embed.external.title }}
+          </div>
+          <div class="text-sm text-fg-muted line-clamp-2">
+            {{ comment.embed.external.description }}
+          </div>
+          <div class="text-xs text-fg-subtle mt-1 truncate">
+            {{ getHostname(comment.embed.external.uri) }}
+          </div>
+        </div>
+      </a>
+
+      <!-- Like/repost counts -->
+      <div
+        v-if="comment.likeCount > 0 || comment.repostCount > 0"
+        class="mt-2 flex gap-4 text-sm text-fg-subtle"
+      >
+        <span v-if="comment.likeCount > 0">
+          {{ $t('blog.atproto.like_count', { count: comment.likeCount }, comment.likeCount) }}
+        </span>
+        <span v-if="comment.repostCount > 0">
+          {{ $t('blog.atproto.repost_count', { count: comment.repostCount }, comment.repostCount) }}
+        </span>
+      </div>
+
+      <!-- Nested replies -->
+      <template v-if="comment.replies.length > 0">
+        <div v-if="depth < MaxDepth" class="mt-2 ps-2 border-is-2 border-border flex flex-col">
+          <BlueskyComment
+            v-for="reply in comment.replies"
+            :key="reply.uri"
+            :comment="reply"
+            :depth="depth + 1"
+          />
+        </div>
+        <a
+          v-else
+          :href="getCommentUrl(comment.replies[0]!)"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="mt-2 block text-sm link"
+        >
+          {{
+            $t(
+              'blog.atproto.more_replies',
+              { count: comment.replies.length },
+              comment.replies.length,
+            )
+          }}
+        </a>
+      </template>
+    </div>
+  </div>
+</template>
diff --git a/app/components/BlueskyComments.vue b/app/components/BlueskyComments.vue
new file mode 100644
index 0000000000..54655a46c1
--- /dev/null
+++ b/app/components/BlueskyComments.vue
@@ -0,0 +1,116 @@
+<script setup lang="ts">
+const props = defineProps<{
+  postUri: string
+}>()
+
+// Since we need this to work isomorphically across SSR/build & client runtime fetch comments via server API
+const { data, pending, error } = useBlueskyComments(() => props.postUri)
+
+const thread = computed(() => data.value?.thread)
+const likes = computed(() => data.value?.likes ?? [])
+const totalLikes = computed(() => data.value?.totalLikes ?? 0)
+const postUrl = computed(() => data.value?.postUrl)
+</script>
+
+<template>
+  <section class="mt-12 pt-8 border-t border-border max-w-prose mx-auto">
+    <!-- Likes -->
+    <div v-if="likes.length > 0" class="mb-8">
+      <h3 class="text-xl font-semibold text-fg mb-4">
+        {{ $t('blog.atproto.likes_on_bluesky') }} ({{ totalLikes }})
+      </h3>
+      <ul class="flex flex-wrap gap-1 list-none p-0 m-0">
+        <li v-for="like in likes" :key="like.actor.did" class="m-0 p-0">
+          <a
+            :href="`https://bsky.app/profile/${like.actor.handle}`"
+            target="_blank"
+            rel="noopener noreferrer"
+            :title="like.actor.displayName || like.actor.handle"
+          >
+            <img
+              v-if="like.actor.avatar"
+              :src="like.actor.avatar"
+              :alt="like.actor.displayName || like.actor.handle"
+              class="w-8 h-8 rounded-full hover:opacity-80 transition-opacity m-0"
+            />
+            <div
+              v-else
+              class="w-8 h-8 rounded-full bg-bg-subtle flex items-center justify-center text-fg-muted text-xs"
+            >
+              {{ (like.actor.displayName || like.actor.handle).charAt(0).toUpperCase() }}
+            </div>
+          </a>
+        </li>
+        <li
+          v-if="totalLikes > likes.length"
+          class="flex items-center text-fg-muted text-sm m-0 p-0 ps-2"
+        >
+          <a
+            v-if="postUrl"
+            :href="postUrl"
+            target="_blank"
+            rel="noopener noreferrer"
+            class="link ms-auto"
+          >
+            +{{ totalLikes - likes.length }}
+          </a>
+        </li>
+      </ul>
+    </div>
+
+    <!-- Comments Section -->
+    <div class="mb-8">
+      <h3 class="text-xl font-semibold text-fg mb-4">{{ $t('blog.atproto.comments') }}</h3>
+
+      <!-- Build-time/Initial loading -->
+      <div v-if="pending && !thread" class="flex items-center gap-2 text-fg-muted" role="status">
+        <span class="i-svg-spinners:90-ring-with-bg h-5 w-5" aria-hidden="true" />
+        <span>{{ $t('blog.atproto.loading_comments') }}</span>
+      </div>
+
+      <!-- Background refresh indicator -->
+      <div v-else-if="pending && thread" class="text-xs text-fg-subtle mb-4 animate-pulse">
+        {{ $t('blog.atproto.updating') }}
+      </div>
+
+      <!-- Error State -->
+      <div v-else-if="error" class="text-fg-muted">
+        {{ $t('blog.atproto.could_not_load_comments') }}
+        <LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
+          {{ $t('blog.atproto.view_on_bluesky') }}
+        </LinkBase>
+      </div>
+
+      <!-- No comments -->
+      <div v-else-if="!thread || thread.replies.length === 0">
+        <p class="text-fg-muted mb-4">{{ $t('blog.atproto.no_comments_yet') }}</p>
+        <LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
+          {{ $t('blog.atproto.reply_on_bluesky') }}
+        </LinkBase>
+      </div>
+
+      <!-- Comments Thread -->
+      <div v-else class="flex flex-col gap-6">
+        <div class="flex items-center justify-between gap-4 text-sm text-fg-muted">
+          <span>{{
+            $t('blog.atproto.reply_count', { count: thread.replyCount }, thread.replyCount)
+          }}</span>
+          <LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
+            {{ $t('blog.atproto.reply_on_bluesky') }}
+          </LinkBase>
+        </div>
+
+        <BlueskyComment
+          v-for="reply in thread.replies"
+          :key="reply.uri"
+          :comment="reply"
+          :depth="0"
+        />
+
+        <LinkBase v-if="postUrl" variant="button-primary" :to="postUrl">
+          {{ $t('blog.atproto.like_or_reply_on_bluesky') }}
+        </LinkBase>
+      </div>
+    </div>
+  </section>
+</template>
diff --git a/app/components/OgImage/BlogPost.d.vue.ts b/app/components/OgImage/BlogPost.d.vue.ts
new file mode 100644
index 0000000000..75e2a9ad17
--- /dev/null
+++ b/app/components/OgImage/BlogPost.d.vue.ts
@@ -0,0 +1,13 @@
+// This type declaration file is required to break a circular type resolution in vue-tsc.
+// And is based off Package.d.vue.ts
+
+import type { DefineComponent } from 'vue'
+
+declare const _default: DefineComponent<{
+  title: string
+  authors?: { name: string; blueskyHandle?: string }[]
+  date?: string
+  primaryColor?: string
+}>
+
+export default _default
diff --git a/app/components/OgImage/BlogPost.vue b/app/components/OgImage/BlogPost.vue
new file mode 100644
index 0000000000..2192be4f7e
--- /dev/null
+++ b/app/components/OgImage/BlogPost.vue
@@ -0,0 +1,142 @@
+<script setup lang="ts">
+import type { Author } from '#shared/schemas/blog'
+
+const props = withDefaults(
+  defineProps<{
+    title: string
+    authors?: Author[]
+    date?: string
+    primaryColor?: string
+  }>(),
+  {
+    authors: () => [],
+    date: '',
+    primaryColor: '#60a5fa',
+  },
+)
+
+const { resolvedAuthors } = useBlueskyAuthorProfiles(props.authors)
+
+const formattedDate = computed(() => {
+  if (!props.date) return ''
+  try {
+    return new Date(props.date).toLocaleDateString('en-US', {
+      year: 'numeric',
+      month: 'short',
+      day: 'numeric',
+    })
+  } catch {
+    return props.date
+  }
+})
+
+const MAX_VISIBLE_AUTHORS = 2
+
+const getInitials = (name: string) =>
+  name
+    .split(' ')
+    .map(n => n[0])
+    .join('')
+    .toUpperCase()
+    .slice(0, 2)
+
+const visibleAuthors = computed(() => {
+  if (resolvedAuthors.value.length <= 3) return resolvedAuthors.value
+  return resolvedAuthors.value.slice(0, MAX_VISIBLE_AUTHORS)
+})
+
+const extraCount = computed(() => {
+  if (resolvedAuthors.value.length <= 3) return 0
+  return resolvedAuthors.value.length - MAX_VISIBLE_AUTHORS
+})
+
+const formattedAuthorNames = computed(() => {
+  const allNames = resolvedAuthors.value.map(a => a.name)
+  if (allNames.length === 0) return ''
+  if (allNames.length === 1) return allNames[0]
+  if (allNames.length === 2) return `${allNames[0]} and ${allNames[1]}`
+  if (allNames.length === 3) return `${allNames[0]}, ${allNames[1]}, and ${allNames[2]}`
+  // More than 3: show first 2 + others
+  const shown = allNames.slice(0, MAX_VISIBLE_AUTHORS)
+  const remaining = allNames.length - MAX_VISIBLE_AUTHORS
+  return `${shown.join(', ')} and ${remaining} others`
+})
+</script>
+
+<template>
+  <div
+    class="h-full w-full flex flex-col justify-center px-20 bg-[#050505] text-[#fafafa] relative overflow-hidden"
+  >
+    <!-- npmx logo - top right -->
+    <div
+      class="absolute top-12 z-10 flex items-center gap-1 text-5xl font-bold tracking-tight"
+      style="font-family: 'Geist', sans-serif; right: 6rem"
+    >
+      <span :style="{ color: primaryColor }" class="opacity-80">./</span>
+      <span class="text-white">npmx</span>
+    </div>
+
+    <div class="relative z-10 flex flex-col gap-2">
+      <!-- Date -->
+      <span
+        v-if="formattedDate"
+        class="text-3xl text-[#a3a3a3] font-light"
+        style="font-family: 'Geist', sans-serif"
+      >
+        {{ formattedDate }}
+      </span>
+
+      <!-- Blog title -->
+      <h1
+        class="text-6xl font-semibold tracking-tight leading-snug w-9/10"
+        style="font-family: 'Geist', sans-serif; letter-spacing: -0.03em"
+      >
+        {{ title }}
+      </h1>
+
+      <!-- Authors -->
+      <div
+        v-if="resolvedAuthors.length"
+        class="flex items-center gap-4 self-start justify-start flex-nowrap"
+        style="font-family: 'Geist', sans-serif"
+      >
+        <!-- Stacked avatars -->
+        <span>
+          <span
+            v-for="(author, index) in visibleAuthors"
+            :key="author.name"
+            class="flex items-center justify-center rounded-full border border-[#050505] bg-[#1a1a1a] overflow-hidden w-12 h-12"
+            :style="{ marginLeft: index > 0 ? '-20px' : '0' }"
+          >
+            <img
+              v-if="author.avatar"
+              :src="author.avatar"
+              :alt="author.name"
+              class="w-full h-full object-cover"
+            />
+            <span v-else style="font-size: 20px; color: #666; font-weight: 500">
+              {{ getInitials(author.name) }}
+            </span>
+          </span>
+          <!-- +N badge -->
+          <span
+            v-if="extraCount > 0"
+            class="flex items-center justify-center text-lg font-medium text-[#a3a3a3] rounded-full border border-[#050505] bg-[#262626] overflow-hidden w-12 h-12"
+            :style="{ marginLeft: '-20px' }"
+          >
+            +{{ extraCount }}
+          </span>
+        </span>
+        <!-- Names -->
+        <span style="font-size: 24px; color: #a3a3a3; font-weight: 300">{{
+          formattedAuthorNames
+        }}</span>
+      </div>
+    </div>
+
+    <div
+      class="absolute -top-32 -inset-ie-32 w-[550px] h-[550px] rounded-full blur-3xl"
+      :style="{ backgroundColor: primaryColor + '10' }"
+    />
+  </div>
+</template>
diff --git a/app/components/Readme.vue b/app/components/Readme.vue
index b44225797c..c571e63bc2 100644
--- a/app/components/Readme.vue
+++ b/app/components/Readme.vue
@@ -61,7 +61,7 @@ function handleClick(event: MouseEvent) {
 
 <template>
   <article
-    class="readme prose prose-invert max-w-[70ch] lg:max-w-none px-1"
+    class="readme max-w-[70ch] lg:max-w-none px-1"
     dir="auto"
     v-html="html"
     :style="{
diff --git a/app/components/global/BlogPostFederatedArticles.vue b/app/components/global/BlogPostFederatedArticles.vue
new file mode 100644
index 0000000000..82d99c3f7d
--- /dev/null
+++ b/app/components/global/BlogPostFederatedArticles.vue
@@ -0,0 +1,75 @@
+<script setup lang="ts">
+import type { FederatedArticleInput } from '#shared/types/blog-post'
+import type { Author } from '#shared/schemas/blog'
+import type { AtIdentifierString } from '@atproto/lex'
+
+const props = defineProps<{
+  headline: string
+  articles: FederatedArticleInput[]
+}>()
+
+// Prepare authors list for the composable
+const authors = computed<Author[]>(() =>
+  props.articles.map(article => ({
+    name: article.authorHandle,
+    blueskyHandle: article.authorHandle as AtIdentifierString,
+  })),
+)
+
+// Fetch author profiles for avatars
+const { resolvedAuthors } = useBlueskyAuthorProfiles(authors.value)
+
+// Merge the input data with the fetched avatars
+const federatedArticles = computed(() => {
+  return props.articles.map((article, index) => {
+    const profile = resolvedAuthors.value[index]
+
+    return {
+      url: article.url,
+      title: article.title,
+      description: article.description,
+      authorHandle: article.authorHandle,
+      author: {
+        name: profile?.name || article.authorHandle,
+        blueskyHandle: article.authorHandle as AtIdentifierString,
+        avatar: profile?.avatar || null,
+        profileUrl: profile?.profileUrl || null,
+      },
+    }
+  })
+})
+</script>
+
+<template>
+  <aside class="px-4 sm:-mx-6 sm:px-6 sm:-my-3 sm:py-3 sm:rounded-md">
+    <h2 class="font-mono text-xl font-medium text-fg mt-0">
+      {{ headline }}
+    </h2>
+    <div
+      v-if="federatedArticles.length"
+      class="grid gap-4 grid-cols-[repeat(auto-fit,minmax(14rem,1fr))] transition-[grid-template-cols]"
+    >
+      <a
+        :href="article.url"
+        target="_blank"
+        rel="noopener noreferrer"
+        v-for="article in federatedArticles"
+        :key="article.url"
+        class="grid grid-cols-[auto_1fr] gap-x-5 no-underline hover:no-underline rounded-lg border border-border p-4 transition-shadow hover:shadow-lg hover:shadow-gray-500/50"
+      >
+        <AuthorAvatar v-if="article.author" :author="article.author" size="md" class="row-span-2" />
+        <div class="flex flex-col">
+          <p class="text-lg text-fg leading-tight m-0">
+            {{ article.title }}
+          </p>
+          <p class="text-md font-semibold text-fg-muted leading-none mt-2">
+            {{ article.author.name }}
+          </p>
+          <p class="text-sm text-fg-subtle leading-snug m-0">
+            {{ article.description }}
+          </p>
+        </div>
+      </a>
+    </div>
+  </aside>
+</template>
diff --git a/app/components/global/BlogPostWrapper.vue b/app/components/global/BlogPostWrapper.vue
new file mode 100644
index 0000000000..3e40decf29
--- /dev/null
+++ b/app/components/global/BlogPostWrapper.vue
@@ -0,0 +1,55 @@
+<script setup lang="ts">
+import type { BlogPostFrontmatter } from '#shared/schemas/blog'
+
+const props = defineProps<{
+  frontmatter: BlogPostFrontmatter
+}>()
+
+useSeoMeta({
+  title: props.frontmatter.title,
+  description: props.frontmatter.description || props.frontmatter.excerpt,
+  ogTitle: props.frontmatter.title,
+  ogDescription: props.frontmatter.description || props.frontmatter.excerpt,
+  ogType: 'article',
+})
+
+defineOgImageComponent('BlogPost', {
+  title: props.frontmatter.title,
+  authors: props.frontmatter.authors,
+  date: props.frontmatter.date,
+})
+
+const slug = computed(() => props.frontmatter.slug)
+
+// Use Constellation to find the Bluesky post linking to this blog post
+const { data: blueskyLink } = await useBlogPostBlueskyLink(slug)
+const blueskyPostUri = computed(() => blueskyLink.value?.postUri ?? null)
+</script>
+
+<template>
+  <main class="container w-full py-8">
+    <div v-if="frontmatter.authors" class="mb-12 max-w-prose mx-auto">
+      <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
+        <AuthorList :authors="frontmatter.authors" variant="expanded" />
+      </div>
+    </div>
+    <article class="max-w-prose mx-auto p-2 prose dark:prose-invert">
+      <div class="text-sm text-fg-muted font-mono mb-4">
+        <DateTime :datetime="frontmatter.date" year="numeric" month="short" day="numeric" />
+      </div>
+      <slot />
+    </article>
+
+    <!--
+      - Only renders if Constellation found a Bluesky post linking to this slug
+      - Cached API route avoids rate limits during build
+    -->
+    <LazyBlueskyComments v-if="blueskyPostUri" :post-uri="blueskyPostUri" />
+  </main>
+</template>
+
+<style scoped>
+:deep(.markdown-body) {
+  @apply prose dark:prose-invert;
+}
+</style>
diff --git a/app/components/BlueskyPostEmbed.client.vue b/app/components/global/BlueskyPostEmbed.client.vue
similarity index 68%
rename from app/components/BlueskyPostEmbed.client.vue
rename to app/components/global/BlueskyPostEmbed.client.vue
index ed253b8cff..c8513a7703 100644
--- a/app/components/BlueskyPostEmbed.client.vue
+++ b/app/components/global/BlueskyPostEmbed.client.vue
@@ -1,9 +1,15 @@
 <script setup lang="ts">
-import { BLUESKY_API, BSKY_POST_AT_URI_REGEX } from '#shared/utils/constants'
+import {
+  BLUESKY_API,
+  BLUESKY_URL_EXTRACT_REGEX,
+  BSKY_POST_AT_URI_REGEX,
+} from '#shared/utils/constants'
 
 const props = defineProps<{
   /** AT URI of the post, e.g. at://did:plc:.../app.bsky.feed.post/... */
-  uri: string
+  uri?: string
+  /** Bluesky URL of the post, e.g. https://bsky.app/profile/handle/post/rkey */
+  url?: string
 }>()
 
 interface PostAuthor {
@@ -30,24 +36,62 @@ interface BlueskyPost {
   repostCount?: number
 }
 
-const postUrl = computed(() => {
-  const match = props.uri.match(BSKY_POST_AT_URI_REGEX)
+/**
+ * Resolve a bsky.app URL to an AT URI by resolving the handle to a DID.
+ * If an AT URI is provided directly, returns it as-is.
+ */
+async function resolveAtUri(): Promise<string | null> {
+  if (props.uri) return props.uri
+
+  if (!props.url) return null
+  const match = props.url.match(BLUESKY_URL_EXTRACT_REGEX)
   if (!match) return null
-  const [, did, rkey] = match
-  return `https://bsky.app/profile/${did}/post/${rkey}`
-})
+  const [, handle, rkey] = match
+
+  if (!handle || !rkey) return null
+
+  // If the handle is already a DID, build the AT URI directly
+  if (handle.startsWith('did:')) {
+    return `at://${handle}/app.bsky.feed.post/${rkey}`
+  }
+
+  // Resolve handle to DID
+  const res = await $fetch<{ did: string }>(
+    `${BLUESKY_API}/xrpc/com.atproto.identity.resolveHandle`,
+    { query: { handle } },
+  )
+  return `at://${res.did}/app.bsky.feed.post/${rkey}`
+}
+
+const cacheKey = computed(() => `bsky-post-${props.uri || props.url}`)
 
 const { data: post, status } = useAsyncData(
-  `bsky-post-${props.uri}`,
+  cacheKey.value,
   async (): Promise<BlueskyPost | null> => {
+    const atUri = await resolveAtUri()
+    if (!atUri) return null
+
     const response = await $fetch<{ posts: BlueskyPost[] }>(
       `${BLUESKY_API}/xrpc/app.bsky.feed.getPosts`,
-      { query: { uris: props.uri } },
+      { query: { uris: atUri } },
     )
     return response.posts[0] ?? null
   },
   { lazy: true, server: false },
 )
+
+const postUrl = computed(() => {
+  // Prefer the explicit URL prop if provided
+  if (props.url) return props.url
+
+  // Otherwise derive from the fetched post's AT URI
+  const uri = post.value?.uri ?? props.uri
+  if (!uri) return null
+  const match = uri.match(BSKY_POST_AT_URI_REGEX)
+  if (!match) return null
+  const [, did, rkey] = match
+  return `https://bsky.app/profile/${did}/post/${rkey}`
+})
 </script>
 
 <template>
@@ -63,7 +107,7 @@ const { data: post, status } = useAsyncData(
     :href="postUrl ?? '#'"
     target="_blank"
     rel="noopener noreferrer"
-    class="block rounded-lg border border-border bg-bg-subtle p-4 sm:p-5 no-underline hover:border-border-hover transition-colors duration-200"
+    class="not-prose block rounded-lg border border-border bg-bg-subtle p-4 sm:p-5 no-underline hover:border-border-hover transition-colors duration-200"
   >
     <!-- Author row -->
     <div class="flex items-center gap-3 mb-3">
diff --git a/app/composables/useBlogPostBlueskyLink.ts b/app/composables/useBlogPostBlueskyLink.ts
new file mode 100644
index 0000000000..f5c41906d7
--- /dev/null
+++ b/app/composables/useBlogPostBlueskyLink.ts
@@ -0,0 +1,81 @@
+import { Constellation } from '#shared/utils/constellation'
+import { NPMX_SITE, NPMX_DID } from '#shared/utils/constants'
+
+const BLOG_BACKLINK_TTL_IN_SECONDS = 60 * 5
+
+export interface BlogPostBlueskyLink {
+  did: string
+  rkey: string
+  postUri: string
+}
+
+export function useBlogPostBlueskyLink(slug: MaybeRefOrGetter<string | null | undefined>) {
+  const cachedFetch = useCachedFetch()
+
+  const blogUrl = computed(() => {
+    const s = toValue(slug)
+    if (!s) return null
+    return `${NPMX_SITE}/blog/${s}`
+  })
+
+  return useAsyncData<BlogPostBlueskyLink | null>(
+    () => (blogUrl.value ? `blog-bsky-link:${blogUrl.value}` : 'blog-bsky-link:none'),
+    async () => {
+      const url = blogUrl.value
+      if (!url) return null
+
+      const constellation = new Constellation(cachedFetch)
+
+      try {
+        // Try embed.external.uri first (link card embeds)
+        const { data: embedBacklinks } = await constellation.getBackLinks(
+          url,
+          'app.bsky.feed.post',
+          'embed.external.uri',
+          1,
+          undefined,
+          true,
+          [[NPMX_DID]],
+          BLOG_BACKLINK_TTL_IN_SECONDS,
+        )
+
+        const embedRecord = embedBacklinks.records[0]
+        if (embedRecord) {
+          return {
+            did: embedRecord.did,
+            rkey: embedRecord.rkey,
+            postUri: `at://${embedRecord.did}/app.bsky.feed.post/${embedRecord.rkey}`,
+          }
+        }
+
+        // Try facets.features.uri (URLs in post text)
+        const { data: facetBacklinks } = await constellation.getBackLinks(
+          url,
+          'app.bsky.feed.post',
+          'facets[].features[app.bsky.richtext.facet#link].uri',
+          1,
+          undefined,
+          true,
+          [[NPMX_DID]],
+          BLOG_BACKLINK_TTL_IN_SECONDS,
+        )
+
+        const facetRecord = facetBacklinks.records[0]
+        if (facetRecord) {
+          return {
+            did: facetRecord.did,
+            rkey: facetRecord.rkey,
+            postUri: `at://${facetRecord.did}/app.bsky.feed.post/${facetRecord.rkey}`,
+          }
+        }
+      } catch (error: unknown) {
+        // TODO: Will need to remove this console error to satisfy linting scan
+        // Constellation unavailable or error - fail silently
+        // But during dev we will get an error
+        if (import.meta.dev) console.error('[Bluesky] Constellation error:', error)
+      }
+
+      return null
+    },
+  )
+}
diff --git a/app/composables/useBlueskyAuthorProfiles.ts b/app/composables/useBlueskyAuthorProfiles.ts
new file mode 100644
index 0000000000..5f4758dfeb
--- /dev/null
+++ b/app/composables/useBlueskyAuthorProfiles.ts
@@ -0,0 +1,36 @@
+import type { Author, ResolvedAuthor } from '#shared/schemas/blog'
+
+/**
+ * Fetches author avatar URLs and profile links from the Bluesky API (AT Protocol).
+ *
+ * Makes a server-side request to `/api/atproto/bluesky-author-profiles`, which looks up
+ * each author's Bluesky profile to retrieve their avatar. Results are cached for 1 day.
+ *
+ * While the fetch is pending (or if it fails), returns authors with `avatar: null`
+ * and a constructed profile URL as fallback.
+ */
+export function useBlueskyAuthorProfiles(authors: Author[]) {
+  const authorsJson = JSON.stringify(authors)
+
+  const { data } = useFetch('/api/atproto/bluesky-author-profiles', {
+    query: {
+      authors: authorsJson,
+    },
+  })
+
+  const resolvedAuthors = computed<ResolvedAuthor[]>(
+    () => data.value?.authors ?? withoutBlueskyData(authors),
+  )
+
+  return {
+    resolvedAuthors,
+  }
+}
+
+function withoutBlueskyData(authors: Author[]): ResolvedAuthor[] {
+  return authors.map(author => ({
+    ...author,
+    avatar: null,
+    profileUrl: author.blueskyHandle ? `https://bsky.app/profile/${author.blueskyHandle}` : null,
+  }))
+}
diff --git a/app/composables/useBlueskyComments.ts b/app/composables/useBlueskyComments.ts
new file mode 100644
index 0000000000..5b51261ade
--- /dev/null
+++ b/app/composables/useBlueskyComments.ts
@@ -0,0 +1,46 @@
+import type { Comment } from '#shared/types/blog-post'
+import { BLUESKY_COMMENTS_REQUEST } from '#shared/utils/constants'
+
+export type BlueskyCommentsState = {
+  thread: Comment | null
+  likes: Array<{
+    actor: {
+      did: string
+      handle: string
+      displayName?: string
+      avatar?: string
+    }
+  }>
+  totalLikes: number
+  postUrl: string | null
+  _empty?: boolean
+  _error?: boolean
+}
+
+// Handles both server-side caching and client-side hydration
+export function useBlueskyComments(postUri: MaybeRefOrGetter<string>) {
+  const uri = toRef(postUri)
+
+  const { data, pending, error, refresh } = useFetch(BLUESKY_COMMENTS_REQUEST, {
+    query: { uri },
+    key: () => `bsky-comments-${uri.value}`,
+    default: (): BlueskyCommentsState => ({
+      thread: null,
+      likes: [],
+      totalLikes: 0,
+      postUrl: null,
+    }),
+  })
+
+  // Hydrate with fresh data on client side
+  onMounted(() => {
+    refresh()
+  })
+
+  return {
+    data,
+    pending,
+    error,
+    refresh,
+  }
+}
diff --git a/app/pages/about.vue b/app/pages/about.vue
index 37396110f5..aceb259fa2 100644
--- a/app/pages/about.vue
+++ b/app/pages/about.vue
@@ -72,7 +72,7 @@ const roleLabels = computed(
         </p>
       </header>
 
-      <section class="prose prose-invert max-w-none space-y-12">
+      <section class="max-w-none space-y-12">
         <div>
           <h2 class="text-lg text-fg uppercase tracking-wider mb-4">
             {{ $t('about.what_we_are.title') }}
diff --git a/app/pages/accessibility.vue b/app/pages/accessibility.vue
index 8f3750fb27..53972b6ba8 100644
--- a/app/pages/accessibility.vue
+++ b/app/pages/accessibility.vue
@@ -37,7 +37,7 @@ const canGoBack = useCanGoBack()
         </div>
       </header>
 
-      <section class="prose prose-invert max-w-none space-y-8">
+      <section class="max-w-none space-y-8">
         <p class="text-fg-muted leading-relaxed">
           <i18n-t keypath="a11y.welcome" tag="span" scope="global">
             <template #app>
diff --git a/app/pages/blog/alpha-release.md b/app/pages/blog/alpha-release.md
new file mode 100644
index 0000000000..d6c56e9189
--- /dev/null
+++ b/app/pages/blog/alpha-release.md
@@ -0,0 +1,174 @@
+---
+authors:
+  - name: Daniel Roe
+    blueskyHandle: danielroe.dev
+  - name: Salma Alam-Naylor
+    blueskyHandle: whitep4nth3r.com
+  - name: Matias Capeletto
+    blueskyHandle: patak.cat
+title: "Announcing npmx: a fast, modern browser for the npm registry"
+tags: ["OpenSource", "Release"]
+excerpt: "npmx is an open-source project built by a rapidly growing community. It's for open-source developers, and by
+extension, everyone who works in the JavaScript ecosystem."
+date: "2026-03-03"
+slug: "alpha-release"
+description: "npmx is an open-source project built by a rapidly growing community. It's for open-source developers, and by extension, everyone who works in the JavaScript ecosystem."
+draft: true
+---
+
+# Announcing npmx: a fast, modern browser for the npm registry
+
+Today we're announcing the alpha release of [npmx.dev](https://npmx.dev), a fast, modern browser for the npm registry.
+
+npmx is an open-source project built by a rapidly growing community. It's for open-source developers, and by
+extension, everyone who works in the JavaScript ecosystem.
+
+npmx is about speed and simplicity: it's a suite of tools to make package management quicker and easier. It also
+surfaces valuable data insights coupled with power-user features to help developers discover packages and make informed
+decisions about the packages they choose to use.
+
+At the heart of npmx is the web development community. To this end, we're also integrating rich social features into npmx
+to make it easier for developers to connect with each other, share their work, collaborate on projects, and
+ultimately, to build a more vibrant and inclusive web development community through the power of the ecosystem and open
+source.
+
+## The need for npmx
+
+On January 22nd 2026, Daniel Roe, open-source maintainer and founder, and leader of the [Nuxt](https://nuxt.com/) core
+team, had an idea, and made
+[the first commit to the npmx repository](https://github.com/npmx-dev/npmx.dev/commit/e39e56c08fd1e7bdb556c8565c6b11b3c34c8934).
+The next day, [Daniel posted on Bluesky](https://bsky.app/profile/danielroe.dev/post/3md3cmrg56k2r) to ask about
+people's frustrations with the npm experience on the web and the CLI. The question resonated deeply with the community
+as they voiced frustrations with the user experience including code browsing, missing data, trust signals, surfacing
+dependencies, and the friction surrounding the publishing experience.
+
+<BlueskyPostEmbed url="https://bsky.app/profile/danielroe.dev/post/3md3cmrg56k2r" />
+
+It was clear there was a huge opportunity to build a fast, modern browser for the npm registry with an improved
+developer experience, and that there were people willing to work with Daniel to build it.
+
+## The power of community
+
+Enthusiasm traveled quickly through the network about the idea of npmx, and just a day later, the project began to grow
+_exponentially_. In just 24 hours, a thriving community had mobilized in the form of contributions to the npmx project,
+and opened 49 pull requests in a single day. And this showed no signs of slowing down. Just two weeks later, the
+[community had contributed 1000 issues and PRs](https://github.com/npmx-dev/npmx.dev/issues/1000) to the project. The
+statistics tell a story of _one pull request or issue every 20 minutes_, around the clock, which equated to **over a
+million seconds of project activity in 14 days**. We don't know how the exact statistics compare, but with
+[over 105 contributors](https://github.com/npmx-dev/npmx.dev/graphs/contributors) to npmx to date, and 1500 stars on the project in just 16 days, we hypothesize that this might be the most active early open-source
+project yet.
+
+[![Star History Chart](https://api.star-history.com/svg?repos=npmx-dev/npmx.dev&type=date&legend=top-left)](https://www.star-history.com/#npmx-dev/npmx.dev&type=date&legend=top-left)
+
+At npmx, we don't believe this happened by chance. npmx was created to meet the needs of a global and diverse developer
+community, prioritizing accessibility, internationalization, and decentralization. As a result, a strong and diverse
+global community came together to realize this vision. And the great thing about people who believe in these areas of
+focus is that they're all committed to collaborating in meaningful ways while building an inclusive and welcoming
+environment in which to do so: together. The npmx project is a testament to how open source is an enabler for
+individuals, and a powerful catalyst to build community when done really, really well.
+
+## What's included in the npmx alpha release
+
+We've packed a lot into the alpha release. Here's an overview of what you can expect from npmx today.
+
+Search and view details about packages, users and organizations available on npm, dive deeper into the code, plus get detailed information on:
+
+- download statistics
+- outdated dependency warnings
+- module format (ESM/CJS)
+- install size calculation
+- JSR cross-reference
+- multi-provider repo support
+- version range resolution
+- package likes and other social features
+- performance recommendations powered by [e18e](https://e18e.dev/)
+
+You also get quick access to StackBlitz, CodeSandbox, and other demo environments from package READMEs files. Plus, use
+npmx in 19 languages and additional locales, customize your experience with light or dark mode, and power-up your
+workflow across the user interface with intuitive keyboard shortcuts.
+
+## The future of npmx
+
+Our goal at npmx is to build a faster, modern package browsing and management experience _for everyone in the JavaScript
+ecosystem_. We're moving fast, but we know we don't have all the answers. To work toward this goal, today we're building
+together for our peers: open-source developers who work with packages on a daily basis who are keen early adopters
+willing to try out the alpha to help us identify what's working and what's not. Our aim is to build on our progress to
+date, and learn together how to tackle the next stage of releasing npmx in beta for a wider audience.
+
+## Join us at npmx
+
+Open source is an incredible way to gain professional experience, make new friends, and help make The Web ecosystem
+better for everyone.
+
+We'd love to welcome you to the npmx community to experience how good open source can be. Even if you've never
+contributed to an open source project before, you are welcome to join us and get involved. If you're unsure where to
+start, Salma Alam-Naylor has put together
+[a ten step guide to making your first open-source contribution on GitHub](https://whitep4nth3r.com/blog/how-to-make-your-first-open-source-contribution/)
+to help you get started. Below this post, you'll also find a collection of articles written by contributors to the npmx
+project from a wide variety of perspectives and experiences.
+
+The alpha release of npmx is intentionally early. We want real-world feedback from _you_ to guide our roadmap and priorities. Try [npmx](https://npmx.dev) today, let us know what you think and share your use-cases and missing features at [chat.npmx.dev](https://chat.npmx.dev). [Open an issue on GitHub](https://github.com/npmx-dev/npmx.dev/issues) or submit a pull request, and [follow npmx.dev on Bluesky](https://bsky.app/profile/npmx.dev) to keep up to date with what we're working on.
+
+And thank you: thank you to every single human who has contributed to npmx so far, whether that's in the form of code, documentation, testing, community activities, and more. You are the people building npmx; you are the people building the future we want.
+
+---
+
+<BlogPostFederatedArticles
+headline="Read more from the community"
+:articles="[
+  {
+    url: 'https://whitep4nth3r.com/blog/how-to-make-your-first-open-source-contribution/',
+    title: 'How to Make Your First Open Source Contribution',
+    authorHandle: 'whitep4nth3r.com',
+    description: 'Getting involved in open source doesn\'t have to be scary! Understand how to find a great project and make your first contribution in this guide from Salma.'
+  },
+  {
+    url: 'https://graphieros.github.io/graphieros-blog/blog/2026/npmx.html',
+    title: 'vue-data-ui is on npmx npmx is on vue-data-ui',
+    authorHandle: 'graphieros.com',
+    description: 'Graphieros explores a minimal npm-based workflow and why it exists.'
+  },
+  {
+    url: 'https://www.alexdln.com/blog/npmx-the-month',
+    title: 'The month. npmx',
+    authorHandle: 'alexdln.com',
+    description: 'Alex reflects on the project, warm stories, wonderful people, and a look into the future'
+  },
+  {
+    url: 'https://johnnyreilly.com/npmx-with-a-little-help-from-my-friends',
+    title: 'npmx: With a Little Help From My Friends',
+    authorHandle: 'johnnyreilly.com',
+    description: 'How to contribute to npmx.dev, and thoughts on Johnny\'s experience with the project.'
+  },
+  {
+    url: 'https://blog.trueberryless.org/blog/npmx/',
+    title: 'Rising community at tomorrow\'s horizon',
+    authorHandle: 'trueberryless.org',
+    description: 'Telling the story of a newly founded community.'
+  },
+  {
+    url: 'https://www.sybers.fr/blog/3mfhn5xoawz24',
+    title: 'From a Bluesky post to my favorite open source community',
+    authorHandle: 'sybers.fr',
+    description: 'The best open source projects aren\'t just about great code. They\'re about the people behind them.'
+  },
+  {
+    url: 'https://storybook.js.org/blog/storybook-npmx',
+    title: 'Storybook 💙 npmx',
+    authorHandle: 'storybook.js.org',
+    description: 'We\'re huge fans of what the npmx community is building. Today\'s alpha is just the starting line, and we\'re proud to be running alongside them.'
+  },
+  {
+    url: 'https://jensroemer.com/writing/open-source-whats-in-it-for-me/',
+    title: 'Open source, what\'s in it for me?',
+    authorHandle: 'jensroemer.com',
+    description: 'Reflections on learning, community, and change.'
+  },
+  {
+    url: 'https://paulie.codes/blog/3mfs2stugzp2v',
+    title: 'Overcoming Imposter Syndrome: My First Open Source Contribution',
+    authorHandle: 'paulie.codes',
+    description: 'The most important part of open source is the people, and everyone has something valuable to bring to the table.'
+  }
+]"
+/>
diff --git a/app/pages/blog/first-post.md b/app/pages/blog/first-post.md
new file mode 100644
index 0000000000..c63264d4ae
--- /dev/null
+++ b/app/pages/blog/first-post.md
@@ -0,0 +1,318 @@
+---
+authors:
+  - name: Daniel Roe
+    blueskyHandle: danielroe.dev
+  - name: Salma Alam-Naylor
+    blueskyHandle: whitep4nth3r.com
+title: 'Hello World'
+tags: ['OpenSource', 'Nuxt']
+excerpt: 'My first post'
+date: '2026-01-28T15:30:00Z'
+slug: 'first-post'
+description: 'My first post on the blog'
+draft: true
+---
+
+# Markdown: Syntax
+
+- [Overview](#overview)
+  - [Philosophy](#philosophy)
+- [Block Elements](#block-elements)
+  - [Paragraphs and Line Breaks](#paragraphs-and-line-breaks)
+  - [Headers](#headers)
+  - [Blockquotes](#blockquotes)
+  - [Lists](#lists)
+  - [Code Blocks](#code-blocks)
+- [Span Elements](#span-elements)
+  - [Links](#links)
+  - [Emphasis](#emphasis)
+  - [Code](#code)
+
+**Note:** This document is itself written using Markdown; you
+can [see the source for it by adding '.text' to the URL](/projects/markdown/syntax.text).
+
+---
+
+## Overview
+
+### Philosophy
+
+Markdown is intended to be as easy-to-read and easy-to-write as is feasible.
+
+Readability, however, is emphasized above all else. A Markdown-formatted
+document should be publishable as-is, as plain text, without looking
+like it's been marked up with tags or formatting instructions. While
+Markdown's syntax has been influenced by several existing text-to-HTML
+filters -- including [Setext](http://docutils.sourceforge.net/mirror/setext.html), [atx](http://www.aaronsw.com/2002/atx/), [Textile](http://textism.com/tools/textile/), [reStructuredText](http://docutils.sourceforge.net/rst.html),
+[Grutatext](http://www.triptico.com/software/grutatxt.html), and [EtText](http://ettext.taint.org/doc/) -- the single biggest source of
+inspiration for Markdown's syntax is the format of plain text email.
+
+## Block Elements
+
+### Paragraphs and Line Breaks
+
+A paragraph is simply one or more consecutive lines of text, separated
+by one or more blank lines. (A blank line is any line that looks like a
+blank line -- a line containing nothing but spaces or tabs is considered
+blank.) Normal paragraphs should not be indented with spaces or tabs.
+
+The implication of the "one or more consecutive lines of text" rule is
+that Markdown supports "hard-wrapped" text paragraphs. This differs
+significantly from most other text-to-HTML formatters (including Movable
+Type's "Convert Line Breaks" option) which translate every line break
+character in a paragraph into a `<br />` tag.
+
+When you _do_ want to insert a `<br />` break tag using Markdown, you
+end a line with two or more spaces, then type return.
+
+### Headers
+
+Markdown supports two styles of headers, [Setext] [1] and [atx] [2].
+
+Optionally, you may "close" atx-style headers. This is purely
+cosmetic -- you can use this if you think it looks better. The
+closing hashes don't even need to match the number of hashes
+used to open the header. (The number of opening hashes
+determines the header level.)
+
+### Blockquotes
+
+Markdown uses email-style `>` characters for blockquoting. If you're
+familiar with quoting passages of text in an email message, then you
+know how to create a blockquote in Markdown. It looks best if you hard
+wrap the text and put a `>` before every line:
+
+> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
+> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
+> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+>
+> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
+> id sem consectetuer libero luctus adipiscing.
+
+Markdown allows you to be lazy and only put the `>` before the first
+line of a hard-wrapped paragraph:
+
+> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
+> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
+> Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
+
+> Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
+> id sem consectetuer libero luctus adipiscing.
+
+Blockquotes can be nested (i.e. a blockquote-in-a-blockquote) by
+adding additional levels of `>`:
+
+> This is the first level of quoting.
+>
+> > This is nested blockquote.
+>
+> Back to the first level.
+
+Blockquotes can contain other Markdown elements, including headers, lists,
+and code blocks:
+
+> ## This is a header.
+>
+> 1.  This is the first list item.
+> 2.  This is the second list item.
+>
+> Here's some example code:
+>
+>     return shell_exec("echo $input | $markdown_script");
+
+Any decent text editor should make email-style quoting easy. For
+example, with BBEdit, you can make a selection and choose Increase
+Quote Level from the Text menu.
+
+### Lists
+
+Markdown supports ordered (numbered) and unordered (bulleted) lists.
+
+Unordered lists use asterisks, pluses, and hyphens -- interchangably
+-- as list markers:
+
+- Red
+- Green
+- Blue
+
+is equivalent to:
+
+- Red
+- Green
+- Blue
+
+and:
+
+- Red
+- Green
+- Blue
+
+Ordered lists use numbers followed by periods:
+
+1.  Bird
+2.  McHale
+3.  Parish
+
+It's important to note that the actual numbers you use to mark the
+list have no effect on the HTML output Markdown produces. The HTML
+Markdown produces from the above list is:
+
+If you instead wrote the list in Markdown like this:
+
+1.  Bird
+1.  McHale
+1.  Parish
+
+or even:
+
+3. Bird
+1. McHale
+1. Parish
+
+you'd get the exact same HTML output. The point is, if you want to,
+you can use ordinal numbers in your ordered Markdown lists, so that
+the numbers in your source match the numbers in your published HTML.
+But if you want to be lazy, you don't have to.
+
+To make lists look nice, you can wrap items with hanging indents:
+
+- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+  Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,
+  viverra nec, fringilla in, laoreet vitae, risus.
+- Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
+  Suspendisse id sem consectetuer libero luctus adipiscing.
+
+But if you want to be lazy, you don't have to:
+
+- Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+  Aliquam hendrerit mi posuere lectus. Vestibulum enim wisi,
+  viverra nec, fringilla in, laoreet vitae, risus.
+- Donec sit amet nisl. Aliquam semper ipsum sit amet velit.
+  Suspendisse id sem consectetuer libero luctus adipiscing.
+
+List items may consist of multiple paragraphs. Each subsequent
+paragraph in a list item must be indented by either 4 spaces
+or one tab:
+
+1.  This is a list item with two paragraphs. Lorem ipsum dolor
+    sit amet, consectetuer adipiscing elit. Aliquam hendrerit
+    mi posuere lectus.
+
+    Vestibulum enim wisi, viverra nec, fringilla in, laoreet
+    vitae, risus. Donec sit amet nisl. Aliquam semper ipsum
+    sit amet velit.
+
+2.  Suspendisse id sem consectetuer libero luctus adipiscing.
+
+It looks nice if you indent every line of the subsequent
+paragraphs, but here again, Markdown will allow you to be
+lazy:
+
+- This is a list item with two paragraphs.
+
+      This is the second paragraph in the list item. You're
+
+  only required to indent the first line. Lorem ipsum dolor
+  sit amet, consectetuer adipiscing elit.
+
+- Another item in the same list.
+
+To put a blockquote within a list item, the blockquote's `>`
+delimiters need to be indented:
+
+- A list item with a blockquote:
+
+  > This is a blockquote
+  > inside a list item.
+
+To put a code block within a list item, the code block needs
+to be indented _twice_ -- 8 spaces or two tabs:
+
+- A list item with a code block:
+
+      <code goes here>
+
+### Code Blocks
+
+Pre-formatted code blocks are used for writing about programming or
+markup source code. Rather than forming normal paragraphs, the lines
+of a code block are interpreted literally. Markdown wraps a code block
+in both `<pre>` and `<code>` tags.
+
+To produce a code block in Markdown, simply indent every line of the
+block by at least 4 spaces or 1 tab.
+
+This is a normal paragraph:
+
+    This is a code block.
+
+Here is an example of AppleScript:
+
+    tell application "Foo"
+        beep
+    end tell
+
+A code block continues until it reaches a line that is not indented
+(or the end of the article).
+
+Within a code block, ampersands (`&`) and angle brackets (`<` and `>`)
+are automatically converted into HTML entities. This makes it very
+easy to include example HTML source code using Markdown -- just paste
+it and indent it, and Markdown will handle the hassle of encoding the
+ampersands and angle brackets. For example, this:
+
+    <div class="footer">
+        &copy; 2004 Foo Corporation
+    </div>
+
+Regular Markdown syntax is not processed within code blocks. E.g.,
+asterisks are just literal asterisks within a code block. This means
+it's also easy to use Markdown to write about Markdown's own syntax.
+
+```
+tell application "Foo"
+    beep
+end tell
+```
+
+## Span Elements
+
+### Links
+
+Markdown supports two style of links: _inline_ and _reference_.
+
+In both styles, the link text is delimited by [square brackets].
+
+To create an inline link, use a set of regular parentheses immediately
+after the link text's closing square bracket. Inside the parentheses,
+put the URL where you want the link to point, along with an _optional_
+title for the link, surrounded in quotes. For example:
+
+This is [an example](http://example.com/) inline link.
+
+[This link](http://example.net/) has no title attribute.
+
+### Emphasis
+
+Markdown treats asterisks (`*`) and underscores (`_`) as indicators of
+emphasis. Text wrapped with one `*` or `_` will be wrapped with an
+HTML `<em>` tag; double `*`'s or `_`'s will be wrapped with an HTML
+`<strong>` tag. E.g., this input:
+
+_single asterisks_
+
+_single underscores_
+
+**double asterisks**
+
+**double underscores**
+
+### Code
+
+To indicate a span of code, wrap it with backtick quotes (`` ` ``).
+Unlike a pre-formatted code block, a code span indicates code within a
+normal paragraph. For example:
+
+Use the `printf()` function.
+
+![bagel image](https://plus.unsplash.com/premium_photo-1769376812336-847642b315a2?q=80&w=1287&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D)
diff --git a/app/pages/blog/index.vue b/app/pages/blog/index.vue
new file mode 100644
index 0000000000..22e4ac73e7
--- /dev/null
+++ b/app/pages/blog/index.vue
@@ -0,0 +1,52 @@
+<script setup lang="ts">
+import { posts } from '#blog/posts'
+
+const placeHolder = ['atproto', 'nuxt']
+
+definePageMeta({
+  name: 'blog',
+})
+
+useSeoMeta({
+  title: () => `${$t('blog.title')} - npmx`,
+  ogTitle: () => `${$t('blog.title')} - npmx`,
+  twitterTitle: () => `${$t('blog.title')} - npmx`,
+  description: () => $t('blog.meta_description'),
+  ogDescription: () => $t('blog.meta_description'),
+  twitterDescription: () => $t('blog.meta_description'),
+})
+</script>
+
+<template>
+  <main class="container w-full flex-1 py-12 sm:py-16 overflow-x-hidden">
+    <article class="max-w-2xl mx-auto">
+      <header class="mb-12">
+        <h1 class="font-mono text-3xl sm:text-4xl font-medium">
+          {{ $t('blog.heading') }}
+        </h1>
+        <p class="text-fg-muted text-lg">
+          {{ $t('tagline') }}
+        </p>
+      </header>
+      <article v-if="posts && posts.length > 0" class="flex flex-col gap-8">
+        <template
+          v-for="(post, idx) in posts"
+          :key="`${post.authors.map(a => a.name).join('-')}-${post.title}`"
+        >
+          <BlogPostListCard
+            :authors="post.authors"
+            :title="post.title"
+            :path="post.slug"
+            :excerpt="post.excerpt || post.description || 'No Excerpt Available'"
+            :topics="Array.isArray(post.tags) ? post.tags : placeHolder"
+            :published="post.date"
+            :index="idx"
+          />
+          <hr v-if="idx < posts.length - 1" class="border-border-subtle" />
+        </template>
+      </article>
+
+      <p v-else class="text-center py-20 text-fg-subtle">No posts found.</p>
+    </article>
+  </main>
+</template>
diff --git a/app/pages/privacy.vue b/app/pages/privacy.vue
index c0e93030a3..b37f784cc5 100644
--- a/app/pages/privacy.vue
+++ b/app/pages/privacy.vue
@@ -54,7 +54,7 @@ const { locale } = useI18n()
         </i18n-t>
       </header>
 
-      <section class="prose prose-invert max-w-none space-y-8">
+      <section class="max-w-none space-y-8">
         <p class="text-fg-muted leading-relaxed">
           <i18n-t keypath="privacy_policy.welcome" tag="span" scope="global">
             <template #app>
diff --git a/app/pages/recharging.vue b/app/pages/recharging.vue
index b84a6f6c18..f0787a8454 100644
--- a/app/pages/recharging.vue
+++ b/app/pages/recharging.vue
@@ -106,7 +106,7 @@ const icons = [
         />
       </div>
 
-      <section class="prose prose-invert max-w-none space-y-8">
+      <section class="max-w-none space-y-8">
         <!-- What happened -->
         <div>
           <h2 class="text-lg text-fg-subtle uppercase tracking-wider mb-4">
diff --git a/app/utils/bluesky.ts b/app/utils/bluesky.ts
new file mode 100644
index 0000000000..8076594035
--- /dev/null
+++ b/app/utils/bluesky.ts
@@ -0,0 +1,8 @@
+export function atUriToWebUrl(atUri: string): string | null {
+  // Convert AT URI to bsky.app URL
+  // at://did:plc:xxx/app.bsky.feed.post/rkey -> https://bsky.app/profile/did:plc:xxx/post/rkey
+  const match = atUri.match(BSKY_POST_AT_URI_REGEX)
+  if (!match) return null
+  const [, did, rkey] = match
+  return `https://bsky.app/profile/${did}/post/${rkey}`
+}
diff --git a/docs/content/2.guide/1.features.md b/docs/content/2.guide/1.features.md
index e229d2bf09..a0549ce54e 100644
--- a/docs/content/2.guide/1.features.md
+++ b/docs/content/2.guide/1.features.md
@@ -75,7 +75,7 @@ npmx.dev fetches repository statistics (stars, forks) from these git hosting pla
 
 ### :icon{name="i-simple-icons-jsr"} JSR availability
 
-See if scoped packages are also available on [JSR](https://jsr.io), the modern JavaScript registry with native TypeScript support.
+See if scoped packages are also available on [JSR](https://jsr.io), the modern JavaScript registry with native TypeScript support
 
 ### Playground links
 
diff --git a/i18n/locales/en.json b/i18n/locales/en.json
index 8f2f623252..1436ab296c 100644
--- a/i18n/locales/en.json
+++ b/i18n/locales/en.json
@@ -13,6 +13,7 @@
   "trademark_disclaimer": "npm is a registered trademark of npm, Inc. This site is not affiliated with npm, Inc.",
   "footer": {
     "about": "about",
+    "blog": "blog",
     "docs": "docs",
     "source": "source",
     "social": "social",
@@ -77,6 +78,29 @@
     "links": "Links",
     "tap_to_search": "Tap to search"
   },
+  "blog": {
+    "title": "Blog",
+    "heading": "blog",
+    "meta_description": "Insights and updates from the npmx community",
+    "author": {
+      "view_profile": "View {name}'s profile on Bluesky"
+    },
+    "atproto": {
+      "view_on_bluesky": "View on Bluesky",
+      "reply_on_bluesky": "Reply on Bluesky",
+      "likes_on_bluesky": "Likes on Bluesky",
+      "like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
+      "no_comments_yet": "No comments yet.",
+      "could_not_load_comments": "Could not load comments.",
+      "comments": "Comments",
+      "loading_comments": "Loading comments...",
+      "updating": "Updating...",
+      "reply_count": "{count} reply | {count} replies",
+      "like_count": "{count} like | {count} likes",
+      "repost_count": "{count} repost | {count} reposts",
+      "more_replies": "{count} more reply... | {count} more replies..."
+    }
+  },
   "settings": {
     "title": "settings",
     "tagline": "customize your npmx experience",
diff --git a/i18n/locales/fr-FR.json b/i18n/locales/fr-FR.json
index 5e60e017dd..4b5c1706e0 100644
--- a/i18n/locales/fr-FR.json
+++ b/i18n/locales/fr-FR.json
@@ -77,6 +77,9 @@
     "links": "Liens",
     "tap_to_search": "Toucher pour rechercher"
   },
+  "blog": {
+    "title": "Blog"
+  },
   "settings": {
     "title": "paramètres",
     "tagline": "personnalisez votre expérience npmx",
diff --git a/i18n/schema.json b/i18n/schema.json
index eaf4170a4c..42f4ee4d99 100644
--- a/i18n/schema.json
+++ b/i18n/schema.json
@@ -43,6 +43,9 @@
         "about": {
           "type": "string"
         },
+        "blog": {
+          "type": "string"
+        },
         "docs": {
           "type": "string"
         },
@@ -235,6 +238,75 @@
       },
       "additionalProperties": false
     },
+    "blog": {
+      "type": "object",
+      "properties": {
+        "title": {
+          "type": "string"
+        },
+        "heading": {
+          "type": "string"
+        },
+        "meta_description": {
+          "type": "string"
+        },
+        "author": {
+          "type": "object",
+          "properties": {
+            "view_profile": {
+              "type": "string"
+            }
+          },
+          "additionalProperties": false
+        },
+        "atproto": {
+          "type": "object",
+          "properties": {
+            "view_on_bluesky": {
+              "type": "string"
+            },
+            "reply_on_bluesky": {
+              "type": "string"
+            },
+            "likes_on_bluesky": {
+              "type": "string"
+            },
+            "like_or_reply_on_bluesky": {
+              "type": "string"
+            },
+            "no_comments_yet": {
+              "type": "string"
+            },
+            "could_not_load_comments": {
+              "type": "string"
+            },
+            "comments": {
+              "type": "string"
+            },
+            "loading_comments": {
+              "type": "string"
+            },
+            "updating": {
+              "type": "string"
+            },
+            "reply_count": {
+              "type": "string"
+            },
+            "like_count": {
+              "type": "string"
+            },
+            "repost_count": {
+              "type": "string"
+            },
+            "more_replies": {
+              "type": "string"
+            }
+          },
+          "additionalProperties": false
+        }
+      },
+      "additionalProperties": false
+    },
     "settings": {
       "type": "object",
       "properties": {
diff --git a/lexicons.json b/lexicons.json
index c13112e7a0..081d249ca4 100644
--- a/lexicons.json
+++ b/lexicons.json
@@ -10,8 +10,12 @@
     "app.bsky.feed.getPostThread",
     "app.bsky.feed.getPosts",
     "app.bsky.feed.post",
-    "com.bad-example.identity.resolveMiniDoc",
-    "site.standard.document"
+    "com.atproto.identity.resolveHandle",
+    "com.atproto.repo.applyWrites",
+    "com.atproto.repo.getRecord",
+    "com.atproto.sync.getLatestCommit",
+    "site.standard.document",
+    "site.standard.publication"
   ],
   "resolutions": {
     "app.bsky.actor.defs": {
@@ -98,6 +102,10 @@
       "uri": "at://did:plc:4v4y5r3lwsbtmsxhile2ljac/com.atproto.lexicon.schema/app.bsky.richtext.facet",
       "cid": "bafyreidg56eo7zynf6ihz4xb627vwoqf5idnevkmwp7sxc4tijg6xngbu4"
     },
+    "com.atproto.identity.resolveHandle": {
+      "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.identity.resolveHandle",
+      "cid": "bafyreigckmqtt3jrtzd7tvigjatnz6ajqyafs26h5pwcudwag2anedxnmu"
+    },
     "com.atproto.label.defs": {
       "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.label.defs",
       "cid": "bafyreig4hmnb2xkecyg4aaqfhr2rrcxxb3gsr4xks4rqb7rscrycalbrji"
@@ -106,18 +114,42 @@
       "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.moderation.defs",
       "cid": "bafyreideawy4rlpgces2oebk5q4kpurbonhb5qtl4pes7dvxsc5osaiksy"
     },
+    "com.atproto.repo.applyWrites": {
+      "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.repo.applyWrites",
+      "cid": "bafyreidwfwif7k5uncwqxhpxpxhvdkgedbvp6kqy6r4nozii433lwlajba"
+    },
+    "com.atproto.repo.defs": {
+      "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.repo.defs",
+      "cid": "bafyreigmp5xfpkhnmwr3l5o626ued2gc2ouioykj2tpgqjqqajvbvm3wlm"
+    },
+    "com.atproto.repo.getRecord": {
+      "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.repo.getRecord",
+      "cid": "bafyreihdnm3v25uaptt5vjvnpfsfgb6fbhxew2ye3l6q4ndm7xi5wpc4vy"
+    },
     "com.atproto.repo.strongRef": {
       "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.repo.strongRef",
       "cid": "bafyreifrkdbnkvfjujntdaeigolnrjj3srrs53tfixjhmacclps72qlov4"
     },
-    "com.bad-example.identity.resolveMiniDoc": {
-      "uri": "at://did:plc:hdhoaan3xa3jiuq4fg4mefid/com.atproto.lexicon.schema/com.bad-example.identity.resolveMiniDoc",
-      "cid": "bafyreihqq4ud3ihj63op2ety24nziyyh7axibm65mnde5bdeai2z6adety"
+    "com.atproto.sync.getLatestCommit": {
+      "uri": "at://did:plc:6msi3pj7krzih5qxqtryxlzw/com.atproto.lexicon.schema/com.atproto.sync.getLatestCommit",
+      "cid": "bafyreifewzvfus7z6rnmtv74lpulhldvikqmhzepwqdlaqmhllgyg4oejq"
     },
     "site.standard.document": {
       "uri": "at://did:plc:re3ebnp5v7ffagz6rb6xfei4/com.atproto.lexicon.schema/site.standard.document",
       "cid": "bafyreigdukg62hmel4jbdvghdsoaphslhrdktmahzdyokomuka6yejetwa"
     },
+    "site.standard.publication": {
+      "uri": "at://did:plc:re3ebnp5v7ffagz6rb6xfei4/com.atproto.lexicon.schema/site.standard.publication",
+      "cid": "bafyreigrsjktb6o225aoexib4kmckchzlhbnuckj5t3l6k4asmycrjt5vy"
+    },
+    "site.standard.theme.basic": {
+      "uri": "at://did:plc:re3ebnp5v7ffagz6rb6xfei4/com.atproto.lexicon.schema/site.standard.theme.basic",
+      "cid": "bafyreicgo6eszo6fgz6rpdc2wt4ou3dem65hkqagzgaw4xbl32i2ttdu3q"
+    },
+    "site.standard.theme.color": {
+      "uri": "at://did:plc:re3ebnp5v7ffagz6rb6xfei4/com.atproto.lexicon.schema/site.standard.theme.color",
+      "cid": "bafyreicps42z5maxdqwml7t3klsrrpk332jthyfgpeb4zjn3wlvp5vyjia"
+    },
     "tools.ozone.report.defs": {
       "uri": "at://did:plc:33dt5kftu3jq2h5h4jjlqezt/com.atproto.lexicon.schema/tools.ozone.report.defs",
       "cid": "bafyreic3l2rmh2ugirt3jz372wcvy333m7t2ynlyzj2k54oshijs6lxdfu"
diff --git a/lexicons/com/atproto/identity/resolveHandle.json b/lexicons/com/atproto/identity/resolveHandle.json
new file mode 100644
index 0000000000..3b7bff82b7
--- /dev/null
+++ b/lexicons/com/atproto/identity/resolveHandle.json
@@ -0,0 +1,41 @@
+{
+  "id": "com.atproto.identity.resolveHandle",
+  "defs": {
+    "main": {
+      "type": "query",
+      "errors": [
+        {
+          "name": "HandleNotFound",
+          "description": "The resolution process confirmed that the handle does not resolve to any DID."
+        }
+      ],
+      "output": {
+        "schema": {
+          "type": "object",
+          "required": ["did"],
+          "properties": {
+            "did": {
+              "type": "string",
+              "format": "did"
+            }
+          }
+        },
+        "encoding": "application/json"
+      },
+      "parameters": {
+        "type": "params",
+        "required": ["handle"],
+        "properties": {
+          "handle": {
+            "type": "string",
+            "format": "handle",
+            "description": "The handle to resolve."
+          }
+        }
+      },
+      "description": "Resolves an atproto handle (hostname) to a DID. Does not necessarily bi-directionally verify against the the DID document."
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/com/atproto/repo/applyWrites.json b/lexicons/com/atproto/repo/applyWrites.json
new file mode 100644
index 0000000000..bd03637fce
--- /dev/null
+++ b/lexicons/com/atproto/repo/applyWrites.json
@@ -0,0 +1,163 @@
+{
+  "id": "com.atproto.repo.applyWrites",
+  "defs": {
+    "main": {
+      "type": "procedure",
+      "input": {
+        "schema": {
+          "type": "object",
+          "required": ["repo", "writes"],
+          "properties": {
+            "repo": {
+              "type": "string",
+              "format": "at-identifier",
+              "description": "The handle or DID of the repo (aka, current account)."
+            },
+            "writes": {
+              "type": "array",
+              "items": {
+                "refs": ["#create", "#update", "#delete"],
+                "type": "union",
+                "closed": true
+              }
+            },
+            "validate": {
+              "type": "boolean",
+              "description": "Can be set to 'false' to skip Lexicon schema validation of record data across all operations, 'true' to require it, or leave unset to validate only for known Lexicons."
+            },
+            "swapCommit": {
+              "type": "string",
+              "format": "cid",
+              "description": "If provided, the entire operation will fail if the current repo commit CID does not match this value. Used to prevent conflicting repo mutations."
+            }
+          }
+        },
+        "encoding": "application/json"
+      },
+      "errors": [
+        {
+          "name": "InvalidSwap",
+          "description": "Indicates that the 'swapCommit' parameter did not match current commit."
+        }
+      ],
+      "output": {
+        "schema": {
+          "type": "object",
+          "required": [],
+          "properties": {
+            "commit": {
+              "ref": "com.atproto.repo.defs#commitMeta",
+              "type": "ref"
+            },
+            "results": {
+              "type": "array",
+              "items": {
+                "refs": ["#createResult", "#updateResult", "#deleteResult"],
+                "type": "union",
+                "closed": true
+              }
+            }
+          }
+        },
+        "encoding": "application/json"
+      },
+      "description": "Apply a batch transaction of repository creates, updates, and deletes. Requires auth, implemented by PDS."
+    },
+    "create": {
+      "type": "object",
+      "required": ["collection", "value"],
+      "properties": {
+        "rkey": {
+          "type": "string",
+          "format": "record-key",
+          "maxLength": 512,
+          "description": "NOTE: maxLength is redundant with record-key format. Keeping it temporarily to ensure backwards compatibility."
+        },
+        "value": {
+          "type": "unknown"
+        },
+        "collection": {
+          "type": "string",
+          "format": "nsid"
+        }
+      },
+      "description": "Operation which creates a new record."
+    },
+    "delete": {
+      "type": "object",
+      "required": ["collection", "rkey"],
+      "properties": {
+        "rkey": {
+          "type": "string",
+          "format": "record-key"
+        },
+        "collection": {
+          "type": "string",
+          "format": "nsid"
+        }
+      },
+      "description": "Operation which deletes an existing record."
+    },
+    "update": {
+      "type": "object",
+      "required": ["collection", "rkey", "value"],
+      "properties": {
+        "rkey": {
+          "type": "string",
+          "format": "record-key"
+        },
+        "value": {
+          "type": "unknown"
+        },
+        "collection": {
+          "type": "string",
+          "format": "nsid"
+        }
+      },
+      "description": "Operation which updates an existing record."
+    },
+    "createResult": {
+      "type": "object",
+      "required": ["uri", "cid"],
+      "properties": {
+        "cid": {
+          "type": "string",
+          "format": "cid"
+        },
+        "uri": {
+          "type": "string",
+          "format": "at-uri"
+        },
+        "validationStatus": {
+          "type": "string",
+          "knownValues": ["valid", "unknown"]
+        }
+      }
+    },
+    "deleteResult": {
+      "type": "object",
+      "required": [],
+      "properties": {}
+    },
+    "updateResult": {
+      "type": "object",
+      "required": ["uri", "cid"],
+      "properties": {
+        "cid": {
+          "type": "string",
+          "format": "cid"
+        },
+        "uri": {
+          "type": "string",
+          "format": "at-uri"
+        },
+        "validationStatus": {
+          "type": "string",
+          "knownValues": ["valid", "unknown"]
+        }
+      }
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/com/atproto/repo/defs.json b/lexicons/com/atproto/repo/defs.json
new file mode 100644
index 0000000000..d1c607b9b1
--- /dev/null
+++ b/lexicons/com/atproto/repo/defs.json
@@ -0,0 +1,21 @@
+{
+  "id": "com.atproto.repo.defs",
+  "defs": {
+    "commitMeta": {
+      "type": "object",
+      "required": ["cid", "rev"],
+      "properties": {
+        "cid": {
+          "type": "string",
+          "format": "cid"
+        },
+        "rev": {
+          "type": "string",
+          "format": "tid"
+        }
+      }
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/com/atproto/repo/getRecord.json b/lexicons/com/atproto/repo/getRecord.json
new file mode 100644
index 0000000000..0223fc91b4
--- /dev/null
+++ b/lexicons/com/atproto/repo/getRecord.json
@@ -0,0 +1,62 @@
+{
+  "id": "com.atproto.repo.getRecord",
+  "defs": {
+    "main": {
+      "type": "query",
+      "errors": [
+        {
+          "name": "RecordNotFound"
+        }
+      ],
+      "output": {
+        "schema": {
+          "type": "object",
+          "required": ["uri", "value"],
+          "properties": {
+            "cid": {
+              "type": "string",
+              "format": "cid"
+            },
+            "uri": {
+              "type": "string",
+              "format": "at-uri"
+            },
+            "value": {
+              "type": "unknown"
+            }
+          }
+        },
+        "encoding": "application/json"
+      },
+      "parameters": {
+        "type": "params",
+        "required": ["repo", "collection", "rkey"],
+        "properties": {
+          "cid": {
+            "type": "string",
+            "format": "cid",
+            "description": "The CID of the version of the record. If not specified, then return the most recent version."
+          },
+          "repo": {
+            "type": "string",
+            "format": "at-identifier",
+            "description": "The handle or DID of the repo."
+          },
+          "rkey": {
+            "type": "string",
+            "format": "record-key",
+            "description": "The Record Key."
+          },
+          "collection": {
+            "type": "string",
+            "format": "nsid",
+            "description": "The NSID of the record collection."
+          }
+        }
+      },
+      "description": "Get a single record from a repository. Does not require auth."
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/com/atproto/sync/getLatestCommit.json b/lexicons/com/atproto/sync/getLatestCommit.json
new file mode 100644
index 0000000000..774feb2376
--- /dev/null
+++ b/lexicons/com/atproto/sync/getLatestCommit.json
@@ -0,0 +1,53 @@
+{
+  "id": "com.atproto.sync.getLatestCommit",
+  "defs": {
+    "main": {
+      "type": "query",
+      "errors": [
+        {
+          "name": "RepoNotFound"
+        },
+        {
+          "name": "RepoTakendown"
+        },
+        {
+          "name": "RepoSuspended"
+        },
+        {
+          "name": "RepoDeactivated"
+        }
+      ],
+      "output": {
+        "schema": {
+          "type": "object",
+          "required": ["cid", "rev"],
+          "properties": {
+            "cid": {
+              "type": "string",
+              "format": "cid"
+            },
+            "rev": {
+              "type": "string",
+              "format": "tid"
+            }
+          }
+        },
+        "encoding": "application/json"
+      },
+      "parameters": {
+        "type": "params",
+        "required": ["did"],
+        "properties": {
+          "did": {
+            "type": "string",
+            "format": "did",
+            "description": "The DID of the repo."
+          }
+        }
+      },
+      "description": "Get the current commit CID & revision of the specified repo. Does not require auth."
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/com/bad-example/identity/resolveMiniDoc.json b/lexicons/com/bad-example/identity/resolveMiniDoc.json
deleted file mode 100644
index 7d51934c51..0000000000
--- a/lexicons/com/bad-example/identity/resolveMiniDoc.json
+++ /dev/null
@@ -1,50 +0,0 @@
-{
-  "id": "com.bad-example.identity.resolveMiniDoc",
-  "defs": {
-    "main": {
-      "type": "query",
-      "output": {
-        "schema": {
-          "type": "object",
-          "required": ["did", "handle", "pds", "signing_key"],
-          "properties": {
-            "did": {
-              "type": "string",
-              "format": "did",
-              "description": "DID, bi-directionally verified if a handle was provided in the query."
-            },
-            "pds": {
-              "type": "string",
-              "format": "uri",
-              "description": "The identity's PDS URL"
-            },
-            "handle": {
-              "type": "string",
-              "format": "handle",
-              "description": "The validated handle of the account or `handle.invalid` if the handle\ndid not bi-directionally match the DID document."
-            },
-            "signing_key": {
-              "type": "string",
-              "description": "The atproto signing key publicKeyMultibase\n\nLegacy key encoding not supported. the key is returned directly; `id`,\n`type`, and `controller` are omitted."
-            }
-          }
-        },
-        "encoding": "application/json"
-      },
-      "parameters": {
-        "type": "params",
-        "required": ["identifier"],
-        "properties": {
-          "identifier": {
-            "type": "string",
-            "format": "at-identifier",
-            "description": "Handle or DID to resolve"
-          }
-        }
-      },
-      "description": "Like [com.atproto.identity.resolveIdentity](https://docs.bsky.app/docs/api/com-atproto-identity-resolve-identity) but instead of the full `didDoc` it returns an atproto-relevant subset."
-    }
-  },
-  "$type": "com.atproto.lexicon.schema",
-  "lexicon": 1
-}
diff --git a/lexicons/site/standard/publication.json b/lexicons/site/standard/publication.json
new file mode 100644
index 0000000000..456f73068d
--- /dev/null
+++ b/lexicons/site/standard/publication.json
@@ -0,0 +1,62 @@
+{
+  "id": "site.standard.publication",
+  "defs": {
+    "main": {
+      "key": "tid",
+      "type": "record",
+      "record": {
+        "type": "object",
+        "required": ["url", "name"],
+        "properties": {
+          "url": {
+            "type": "string",
+            "format": "uri",
+            "description": "Base publication url (ex: https://standard.site). The canonical document URL is formed by combining this value with the document path."
+          },
+          "icon": {
+            "type": "blob",
+            "accept": ["image/*"],
+            "maxSize": 1000000,
+            "description": "Square image to identify the publication. Should be at least 256x256."
+          },
+          "name": {
+            "type": "string",
+            "maxLength": 5000,
+            "description": "Name of the publication.",
+            "maxGraphemes": 500
+          },
+          "basicTheme": {
+            "ref": "site.standard.theme.basic",
+            "type": "ref",
+            "description": "Simplified publication theme for tools and apps to utilize when displaying content."
+          },
+          "description": {
+            "type": "string",
+            "maxLength": 30000,
+            "description": "Brief description of the publication.",
+            "maxGraphemes": 3000
+          },
+          "preferences": {
+            "ref": "#preferences",
+            "type": "ref",
+            "description": "Object containing platform specific preferences (with a few shared properties)."
+          }
+        }
+      },
+      "description": "A publication record representing a blog, website, or content platform. Publications serve as containers for documents and define the overall branding and settings."
+    },
+    "preferences": {
+      "type": "object",
+      "properties": {
+        "showInDiscover": {
+          "type": "boolean",
+          "default": true,
+          "description": "Boolean which decides whether the publication should appear in discovery feeds."
+        }
+      },
+      "description": "Platform-specific preferences for the publication, including discovery and visibility settings."
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/site/standard/theme/basic.json b/lexicons/site/standard/theme/basic.json
new file mode 100644
index 0000000000..88c7cba094
--- /dev/null
+++ b/lexicons/site/standard/theme/basic.json
@@ -0,0 +1,34 @@
+{
+  "id": "site.standard.theme.basic",
+  "defs": {
+    "main": {
+      "type": "object",
+      "required": ["background", "foreground", "accent", "accentForeground"],
+      "properties": {
+        "accent": {
+          "refs": ["site.standard.theme.color#rgb"],
+          "type": "union",
+          "description": "Color used for links and button backgrounds."
+        },
+        "background": {
+          "refs": ["site.standard.theme.color#rgb"],
+          "type": "union",
+          "description": "Color used for content background."
+        },
+        "foreground": {
+          "refs": ["site.standard.theme.color#rgb"],
+          "type": "union",
+          "description": "Color used for content text."
+        },
+        "accentForeground": {
+          "refs": ["site.standard.theme.color#rgb"],
+          "type": "union",
+          "description": "Color used for button text."
+        }
+      },
+      "description": "A simplified theme definition for publications, providing basic color customization for content display across different platforms and applications."
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lexicons/site/standard/theme/color.json b/lexicons/site/standard/theme/color.json
new file mode 100644
index 0000000000..5dde553ff9
--- /dev/null
+++ b/lexicons/site/standard/theme/color.json
@@ -0,0 +1,54 @@
+{
+  "id": "site.standard.theme.color",
+  "defs": {
+    "rgb": {
+      "type": "object",
+      "required": ["r", "g", "b"],
+      "properties": {
+        "b": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        },
+        "g": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        },
+        "r": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        }
+      }
+    },
+    "rgba": {
+      "type": "object",
+      "required": ["r", "g", "b", "a"],
+      "properties": {
+        "a": {
+          "type": "integer",
+          "maximum": 100,
+          "minimum": 0
+        },
+        "b": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        },
+        "g": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        },
+        "r": {
+          "type": "integer",
+          "maximum": 255,
+          "minimum": 0
+        }
+      }
+    }
+  },
+  "$type": "com.atproto.lexicon.schema",
+  "lexicon": 1
+}
diff --git a/lunaria/files/en-GB.json b/lunaria/files/en-GB.json
index 45bbb60a4d..52d265f365 100644
--- a/lunaria/files/en-GB.json
+++ b/lunaria/files/en-GB.json
@@ -12,6 +12,7 @@
   "trademark_disclaimer": "npm is a registered trademark of npm, Inc. This site is not affiliated with npm, Inc.",
   "footer": {
     "about": "about",
+    "blog": "blog",
     "docs": "docs",
     "source": "source",
     "social": "social",
@@ -76,6 +77,29 @@
     "links": "Links",
     "tap_to_search": "Tap to search"
   },
+  "blog": {
+    "title": "Blog",
+    "heading": "blog",
+    "meta_description": "Insights and updates from the npmx community",
+    "author": {
+      "view_profile": "View {name}'s profile on Bluesky"
+    },
+    "atproto": {
+      "view_on_bluesky": "View on Bluesky",
+      "reply_on_bluesky": "Reply on Bluesky",
+      "likes_on_bluesky": "Likes on Bluesky",
+      "like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
+      "no_comments_yet": "No comments yet.",
+      "could_not_load_comments": "Could not load comments.",
+      "comments": "Comments",
+      "loading_comments": "Loading comments...",
+      "updating": "Updating...",
+      "reply_count": "{count} reply | {count} replies",
+      "like_count": "{count} like | {count} likes",
+      "repost_count": "{count} repost | {count} reposts",
+      "more_replies": "{count} more reply... | {count} more replies..."
+    }
+  },
   "settings": {
     "title": "settings",
     "tagline": "customise your npmx experience",
diff --git a/lunaria/files/en-US.json b/lunaria/files/en-US.json
index d7cc3addde..fd04a690bd 100644
--- a/lunaria/files/en-US.json
+++ b/lunaria/files/en-US.json
@@ -12,6 +12,7 @@
   "trademark_disclaimer": "npm is a registered trademark of npm, Inc. This site is not affiliated with npm, Inc.",
   "footer": {
     "about": "about",
+    "blog": "blog",
     "docs": "docs",
     "source": "source",
     "social": "social",
@@ -76,6 +77,29 @@
     "links": "Links",
     "tap_to_search": "Tap to search"
   },
+  "blog": {
+    "title": "Blog",
+    "heading": "blog",
+    "meta_description": "Insights and updates from the npmx community",
+    "author": {
+      "view_profile": "View {name}'s profile on Bluesky"
+    },
+    "atproto": {
+      "view_on_bluesky": "View on Bluesky",
+      "reply_on_bluesky": "Reply on Bluesky",
+      "likes_on_bluesky": "Likes on Bluesky",
+      "like_or_reply_on_bluesky": "Like this post or add your comment on Bluesky",
+      "no_comments_yet": "No comments yet.",
+      "could_not_load_comments": "Could not load comments.",
+      "comments": "Comments",
+      "loading_comments": "Loading comments...",
+      "updating": "Updating...",
+      "reply_count": "{count} reply | {count} replies",
+      "like_count": "{count} like | {count} likes",
+      "repost_count": "{count} repost | {count} reposts",
+      "more_replies": "{count} more reply... | {count} more replies..."
+    }
+  },
   "settings": {
     "title": "settings",
     "tagline": "customize your npmx experience",
diff --git a/lunaria/files/fr-FR.json b/lunaria/files/fr-FR.json
index 55dd9a43c5..b264e9f0c0 100644
--- a/lunaria/files/fr-FR.json
+++ b/lunaria/files/fr-FR.json
@@ -76,6 +76,9 @@
     "links": "Liens",
     "tap_to_search": "Toucher pour rechercher"
   },
+  "blog": {
+    "title": "Blog"
+  },
   "settings": {
     "title": "paramètres",
     "tagline": "personnalisez votre expérience npmx",
diff --git a/modules/blog.ts b/modules/blog.ts
new file mode 100644
index 0000000000..3e7513e3dc
--- /dev/null
+++ b/modules/blog.ts
@@ -0,0 +1,117 @@
+import { join } from 'node:path'
+import Markdown from 'unplugin-vue-markdown/vite'
+import { addTemplate, addVitePlugin, defineNuxtModule, useNuxt, createResolver } from 'nuxt/kit'
+import shiki from '@shikijs/markdown-it'
+import { defu } from 'defu'
+import { read } from 'gray-matter'
+import { safeParse } from 'valibot'
+import { BlogPostSchema, type BlogPostFrontmatter } from '../shared/schemas/blog'
+import { globSync } from 'tinyglobby'
+import { isProduction } from '../config/env'
+
+/**
+ * Scans the blog directory for .md files and extracts validated frontmatter.
+ * Returns only non-draft posts sorted by date descending.
+ */
+function loadBlogPosts(blogDir: string): BlogPostFrontmatter[] {
+  const files: string[] = globSync(join(blogDir, '*.md'))
+
+  const posts: BlogPostFrontmatter[] = []
+
+  for (const file of files) {
+    const { data: frontmatter } = read(file)
+
+    // Normalise slug → path (same logic as standard-site-sync)
+    if (typeof frontmatter.slug === 'string' && !frontmatter.path) {
+      frontmatter.path = `/blog/${frontmatter.slug}`
+    }
+    // Normalise date to ISO string
+    if (frontmatter.date) {
+      const raw = frontmatter.date
+      frontmatter.date = new Date(raw instanceof Date ? raw : String(raw)).toISOString()
+    }
+
+    const result = safeParse(BlogPostSchema, frontmatter)
+    if (!result.success) continue
+
+    if (result.output.draft) continue
+
+    posts.push(result.output)
+  }
+
+  // Sort newest first
+  posts.sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime())
+  return posts
+}
+
+export default defineNuxtModule({
+  meta: {
+    name: 'blog',
+  },
+  setup() {
+    const nuxt = useNuxt()
+    const resolver = createResolver(import.meta.url)
+    const blogDir = resolver.resolve('../app/pages/blog')
+
+    nuxt.options.extensions.push('.md')
+    nuxt.options.vite.vue = defu(nuxt.options.vite.vue, {
+      include: [/\.vue($|\?)/, /\.(md|markdown)($|\?)/],
+    })
+
+    addVitePlugin(() =>
+      Markdown({
+        include: [/\.(md|markdown)($|\?)/],
+        wrapperComponent: 'BlogPostWrapper',
+        wrapperClasses: 'text-fg-muted leading-relaxed',
+        async markdownItSetup(md) {
+          md.use(
+            await shiki({
+              themes: {
+                dark: 'github-dark',
+                light: 'github-light',
+              },
+            }),
+          )
+        },
+      }),
+    )
+
+    // Expose frontmatter for published posts to avoid bundling the full content
+    // of all posts in `/blog` page.
+    addTemplate({
+      filename: 'blog/posts.ts',
+      write: true,
+      getContents: () => {
+        const posts = loadBlogPosts(blogDir)
+        return [
+          `import type { BlogPostFrontmatter } from '#shared/schemas/blog'`,
+          ``,
+          `export const posts: BlogPostFrontmatter[] = ${JSON.stringify(posts, null, 2)}`,
+        ].join('\n')
+      },
+    })
+
+    nuxt.options.alias['#blog/posts'] = join(nuxt.options.buildDir, 'blog/posts')
+
+    // In production, remove page routes for draft posts
+    if (!nuxt.options.dev && isProduction) {
+      const publishedPosts = loadBlogPosts(blogDir)
+      const publishedSlugs = new Set(publishedPosts.map(p => p.slug))
+
+      nuxt.hook('pages:extend', pages => {
+        // Walk the pages tree and remove draft blog post pages
+        for (let i = pages.length - 1; i >= 0; i--) {
+          const page = pages[i]!
+          // Blog post pages are at /blog/<slug> — the file is blog/<slug>.md
+          if (page.file?.endsWith('.md') && page.file?.includes('/blog/')) {
+            // Extract the slug from the filename
+            const filename = page.file.split('/').pop()?.replace('.md', '')
+            if (filename && filename !== 'index' && !publishedSlugs.has(filename)) {
+              pages.splice(i, 1)
+            }
+          }
+        }
+      })
+    }
+  },
+})
diff --git a/modules/standard-site-sync.ts b/modules/standard-site-sync.ts
index f182489f39..c30f51c067 100644
--- a/modules/standard-site-sync.ts
+++ b/modules/standard-site-sync.ts
@@ -2,18 +2,37 @@ import process from 'node:process'
 import { createHash } from 'node:crypto'
 import { defineNuxtModule, useNuxt, createResolver } from 'nuxt/kit'
 import { safeParse } from 'valibot'
-import * as site from '../shared/types/lexicons/site'
-import { BlogPostSchema } from '../shared/schemas/blog'
+import { BlogPostSchema, type BlogPostFrontmatter } from '../shared/schemas/blog'
 import { NPMX_SITE } from '../shared/utils/constants'
 import { read } from 'gray-matter'
 import { TID } from '@atproto/common'
-import { Client } from '@atproto/lex'
+import { PasswordSession } from '@atproto/lex-password-session'
+import {
+  Client,
+  isAtIdentifierString,
+  XrpcResponseError,
+  type AtIdentifierString,
+} from '@atproto/lex'
+import * as com from '../shared/types/lexicons/com'
+import * as site from '../shared/types/lexicons/site'
 
 const syncedDocuments = new Map<string, string>()
 const CLOCK_ID_THREE = 3
-const DATE_TO_MICROSECONDS = 1000
+const MS_TO_MICROSECONDS = 1000
+const ONE_DAY_MILLISECONDS = 86400000
+
+type BlogPostDocument = Pick<
+  BlogPostFrontmatter,
+  'title' | 'date' | 'path' | 'tags' | 'draft' | 'description' | 'excerpt'
+>
+
+type DocumentToSync = { tid: string; document: site.standard.document.Main }
 
 // TODO: Currently logging quite a lot, can remove some later if we want
+/**
+ * INFO: Performs all necessary steps to synchronize with atproto for blog uploads
+ * All module setup logic is encapsulated in this file so as to make it available during nuxt build-time.
+ */
 export default defineNuxtModule({
   meta: { name: 'standard-site-sync' },
   async setup() {
@@ -21,67 +40,184 @@ export default defineNuxtModule({
     const { resolve } = createResolver(import.meta.url)
     const contentDir = resolve('../app/pages/blog')
 
-    // Authentication with PDS using an app password
-    const pdsUrl = process.env.NPMX_PDS_URL
-    if (!pdsUrl) {
-      console.warn('[standard-site-sync] NPMX_PDS_URL not set, skipping sync')
-      return
-    }
-    // Instantiate a single new client instance that is reused for every file
-    const client = new Client(pdsUrl)
+    const config = getPDSConfig()
+    if (!config) return
+
+    const { pdsUrl, handle, password } = config
 
+    // Skip auth during prepare phase (nuxt prepare, nuxt generate --prepare, etc)
     if (nuxt.options._prepare) return
 
+    const pdsPublicClient = new Client({ service: pdsUrl })
+    // If set we have a publication record to create
+    const possiblePublication = await checkPublication(handle, pdsPublicClient)
+
     nuxt.hook('build:before', async () => {
       const { glob } = await import('tinyglobby')
       const files: string[] = await glob(`${contentDir}/**/*.md`)
 
       // INFO: Arbitrarily chosen concurrency limit, can be changed if needed
       const concurrencyLimit = 5
+      let documentsToSync: DocumentToSync[] = []
       for (let i = 0; i < files.length; i += concurrencyLimit) {
         const batch = files.slice(i, i + concurrencyLimit)
         // Process files in parallel
-        await Promise.all(
+        let results = await Promise.all(
           batch.map(file =>
-            syncFile(file, NPMX_SITE, client).catch(error =>
+            syncFile(file, NPMX_SITE, handle, pdsPublicClient).catch(error =>
               console.error(`[standard-site-sync] Error in ${file}:` + error),
             ),
           ),
         )
+        // Filter out docs not needed to sync
+        documentsToSync.push(...results.filter(r => r !== undefined))
       }
-    })
-
-    nuxt.hook('builder:watch', async (event, path) => {
-      if (!path.endsWith('.md')) return
 
-      // Ignore deleted files
-      if (event === 'unlink') {
-        console.log(`[standard-site-sync] File deleted: ${path}`)
-        return
+      if (possiblePublication || documentsToSync.length > 0) {
+        try {
+          const session = await PasswordSession.login({
+            service: pdsUrl,
+            identifier: handle,
+            password: password,
+          })
+          const authenticatedClient = new Client(session)
+          if (possiblePublication) {
+            await authenticatedClient.create(
+              site.standard.publication,
+              possiblePublication.record,
+              {
+                rkey: possiblePublication.tid,
+              },
+            )
+          }
+          if (documentsToSync.length > 0) {
+            await syncsiteStandardDocuments(authenticatedClient, documentsToSync)
+          }
+        } catch (error) {
+          console.error(`[standard-site-sync] Error syncing records: ${error}`)
+        }
       }
-
-      // Process add/change events only
-      await syncFile(resolve(nuxt.options.rootDir, path), NPMX_SITE, client).catch(err =>
-        console.error(`[standard-site-sync] Failed ${path}:`, err),
-      )
     })
   },
 })
 
+// Get config from env vars
+function getPDSConfig():
+  | { pdsUrl: string; handle: AtIdentifierString; password: string }
+  | undefined {
+  const pdsUrl = process.env.NPMX_PDS_URL
+  if (!pdsUrl) {
+    console.warn('[standard-site-sync] NPMX_PDS_URL not set, skipping sync')
+    return
+  }
+
+  const handle = process.env.NPMX_IDENTIFIER
+  const password = process.env.NPMX_APP_PASSWORD
+
+  if (!handle || !password || !isAtIdentifierString(handle)) {
+    console.warn('[standard-site-sync] NPMX_IDENTIFIER or NPMX_APP_PASSWORD not set, skipping sync')
+    return
+  }
+
+  return {
+    pdsUrl,
+    handle,
+    password,
+  }
+}
+
+async function syncsiteStandardDocuments(client: Client, documentsToSync: DocumentToSync[]) {
+  let currentCommit = await client.xrpc(com.atproto.sync.getLatestCommit, {
+    params: {
+      did: client.assertDid,
+    },
+  })
+
+  let writes = documentsToSync.map(doc =>
+    //this should be an .update but having issues with it, and the records are checked before creating
+    com.atproto.repo.applyWrites.create.$build({
+      rkey: doc.tid,
+      value: doc.document,
+      collection: site.standard.document.$nsid,
+    }),
+  )
+
+  await client.xrpc(com.atproto.repo.applyWrites, {
+    body: {
+      repo: client.assertDid,
+      writes,
+      swapCommit: currentCommit.body.cid,
+    },
+  })
+
+  console.log('[standard-site-sync] synced all new publications')
+}
+
+// Parse date from frontmatter, add file-path entropy for same-date collision resolution
+function generateTID(dateString: string, filePath: string): string {
+  let timestamp = new Date(dateString).getTime()
+
+  // If date has no time component (exact midnight), add file-based entropy
+  // This ensures unique TIDs when multiple posts share the same date
+  if (timestamp % ONE_DAY_MILLISECONDS === 0) {
+    // Hash the file path to generate deterministic microseconds offset
+    const pathHash = createHash('md5').update(filePath).digest('hex')
+    const offset = parseInt(pathHash.slice(0, 8), 16) % 1000000 // 0-999999 microseconds
+    timestamp += offset
+  }
+
+  // Clock id(3) needs to be the same everytime to get the same TID from a timestamp
+  return TID.fromTime(timestamp * MS_TO_MICROSECONDS, CLOCK_ID_THREE).str
+}
+
+// Schema expects 'path' & frontmatter provides 'slug'
+function normalizeBlogFrontmatter(frontmatter: Record<string, unknown>): Record<string, unknown> {
+  return {
+    ...frontmatter,
+    path: typeof frontmatter.slug === 'string' ? `/blog/${frontmatter.slug}` : frontmatter.path,
+  }
+}
+
+// Keys are sorted to provide a more stable hash
+function createContentHash(data: unknown): string {
+  return createHash('sha256')
+    .update(JSON.stringify(data, Object.keys(data as object).sort()))
+    .digest('hex')
+}
+
+function buildATProtoDocument(siteUrl: string, data: BlogPostDocument) {
+  return site.standard.document.$build({
+    site: siteUrl as `${string}:${string}`,
+    path: data.path,
+    title: data.title,
+    description: data.description ?? data.excerpt,
+    tags: data.tags,
+    publishedAt: new Date(data.date).toISOString(),
+  })
+}
+
 /*
- * INFO: Loads record to atproto and ensures uniqueness by checking the date the article is published
+ * Loads a record to atproto and ensures uniqueness by checking the date the article is published
  * publishedAt is an id that does not change
  * Atomicity is enforced with upsert using publishedAt so we always update existing records instead of creating new ones
  * Clock id(3) provides a deterministic ID
  * WARN: DOES NOT CATCH ERRORS, THIS MUST BE HANDLED
  */
-const syncFile = async (filePath: string, siteUrl: string, client: Client) => {
+const syncFile = async (
+  filePath: string,
+  siteUrl: string,
+  identifier: AtIdentifierString,
+  pdsPublicClient: Client,
+) => {
   const { data: frontmatter } = read(filePath)
 
-  // Schema expects 'path' & frontmatter provides 'slug'
-  const normalizedFrontmatter = {
-    ...frontmatter,
-    path: typeof frontmatter.slug === 'string' ? `/blog/${frontmatter.slug}` : frontmatter.path,
+  const normalizedFrontmatter = normalizeBlogFrontmatter(frontmatter)
+  // formats dates to ISO string for records
+  if (normalizedFrontmatter['date']) {
+    const rawDate = normalizedFrontmatter['date']
+    normalizedFrontmatter.date = new Date(
+      rawDate instanceof Date ? rawDate : String(rawDate),
+    ).toISOString()
   }
 
   const result = safeParse(BlogPostSchema, normalizedFrontmatter)
@@ -100,34 +236,79 @@ const syncFile = async (filePath: string, siteUrl: string, client: Client) => {
     return
   }
 
-  // Keys are sorted to provide a more stable hash
-  const hash = createHash('sha256')
-    .update(JSON.stringify(data, Object.keys(data).sort()))
-    .digest('hex')
+  const hash = createContentHash(data)
 
   if (syncedDocuments.get(data.path) === hash) {
     return
   }
 
-  const document = site.standard.document.$build({
-    site: siteUrl as `${string}:${string}`,
-    path: data.path,
-    title: data.title,
-    description: data.description ?? data.excerpt,
-    tags: data.tags,
-    // This can be extended to update the site.standard.document .updatedAt if it is changed and use the posts date here
-    publishedAt: new Date(data.date).toISOString(),
+  const tid = generateTID(data.date, filePath)
+
+  let checkForBlogResult = await pdsPublicClient.xrpcSafe(com.atproto.repo.getRecord, {
+    params: {
+      rkey: tid,
+      repo: identifier,
+      collection: site.standard.document.$nsid,
+    },
   })
 
-  const dateInMicroSeconds = new Date(result.output.date).getTime() * DATE_TO_MICROSECONDS
+  if (checkForBlogResult.success) {
+    console.log(`[standard-site-sync]: ${data.title} is already synced`)
+    // Every thing is synced can now return
+    return
+  }
+  if (checkForBlogResult instanceof XrpcResponseError) {
+    //Means it's not been uploaded and we can do that now
+    if (checkForBlogResult.error === 'RecordNotFound') {
+      const document = buildATProtoDocument(siteUrl, data)
+      return { tid, document }
+    }
+  }
+  // Was another error and need to log it
+  console.error('[standard-site-sync]: Error syncing document', checkForBlogResult.error)
+}
 
-  // Clock id(3) needs to be the same everytime to get the same TID from a timestamp
-  const tid = TID.fromTime(dateInMicroSeconds, CLOCK_ID_THREE)
+/**
+ * Checks for a site.standard.publication. If not there returns one to create
+ * @param identifier
+ * @param pdsPublicClient
+ * @returns
+ */
+const checkPublication = async (identifier: AtIdentifierString, pdsPublicClient: Client) => {
+  // Using our release date as the tid for the publication
+  const publicationTid = TID.fromTime(
+    new Date('2026-03-03').getTime() * MS_TO_MICROSECONDS,
+    CLOCK_ID_THREE,
+  ).str
 
-  // client.put is async and needs to be awaited
-  await client.put(site.standard.document, document, {
-    rkey: tid.str,
+  //Check to see if we have a publication yet
+  const publicationCheck = await pdsPublicClient.xrpcSafe(com.atproto.repo.getRecord, {
+    params: {
+      repo: identifier,
+      collection: site.standard.publication.$nsid,
+      rkey: publicationTid,
+    },
   })
 
-  syncedDocuments.set(data.path, hash)
+  if (publicationCheck.success) {
+    // We have a publication record
+    return
+  }
+
+  if (publicationCheck instanceof XrpcResponseError) {
+    //Means it's not been uploaded and we can do that now
+    if (publicationCheck.error === 'RecordNotFound') {
+      return {
+        tid: publicationTid,
+        record: site.standard.publication.$build({
+          name: 'npmx.dev',
+          url: 'https://npmx.dev/blog',
+          description: 'a fast, modern browser for the npm registry',
+        }),
+      }
+    }
+  }
+  // Was another error and need to log it
+  console.error('[standard-site-sync]: Error syncing document', publicationCheck.error)
+  return
 }
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 23bfe00ff2..9598679fd5 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -162,7 +162,10 @@ export default defineNuxtConfig({
     '/settings': { prerender: true },
     '/recharging': { prerender: true },
     // proxy for insights
-    '/_v/script.js': { proxy: 'https://npmx.dev/_vercel/insights/script.js' },
+    '/blog/**': { prerender: true },
+    '/_v/script.js': {
+      proxy: 'https://npmx.dev/_vercel/insights/script.js',
+    },
     '/_v/view': { proxy: 'https://npmx.dev/_vercel/insights/view' },
     '/_v/event': { proxy: 'https://npmx.dev/_vercel/insights/event' },
     '/_v/session': { proxy: 'https://npmx.dev/_vercel/insights/session' },
diff --git a/package.json b/package.json
index 3904c2a1f6..440cfcd54c 100644
--- a/package.json
+++ b/package.json
@@ -53,8 +53,11 @@
     "chromatic": "chromatic"
   },
   "dependencies": {
+    "@atcute/bluesky-richtext-segmenter": "3.0.0",
+    "@atproto/api": "^0.18.17",
     "@atproto/common": "0.5.13",
     "@atproto/lex": "0.0.19",
+    "@atproto/lex-password-session": "0.0.7",
     "@atproto/oauth-client-node": "^0.3.15",
     "@deno/doc": "jsr:^0.189.1",
     "@floating-ui/vue": "1.1.10",
@@ -122,6 +125,7 @@
     "@intlify/core-base": "11.2.8",
     "@npm/types": "2.1.0",
     "@playwright/test": "1.58.2",
+    "@shikijs/markdown-it": "^3.21.0",
     "@storybook-vue/nuxt": "catalog:storybook",
     "@storybook/addon-a11y": "catalog:storybook",
     "@storybook/addon-docs": "catalog:storybook",
@@ -148,6 +152,7 @@
     "simple-git-hooks": "2.13.1",
     "storybook": "catalog:storybook",
     "typescript": "5.9.3",
+    "unplugin-vue-markdown": "^29.2.0",
     "vitest": "npm:@voidzero-dev/vite-plus-test@0.0.0-g52709db6.20260226-1136",
     "vitest-environment-nuxt": "1.0.1",
     "vue-i18n-extract": "2.0.7",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ff517ba806..1e69566f88 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -36,12 +36,21 @@ importers:
 
   .:
     dependencies:
+      '@atcute/bluesky-richtext-segmenter':
+        specifier: 3.0.0
+        version: 3.0.0
+      '@atproto/api':
+        specifier: ^0.18.17
+        version: 0.18.21
       '@atproto/common':
         specifier: 0.5.13
         version: 0.5.13
       '@atproto/lex':
         specifier: 0.0.19
         version: 0.0.19
+      '@atproto/lex-password-session':
+        specifier: 0.0.7
+        version: 0.0.7
       '@atproto/oauth-client-node':
         specifier: ^0.3.15
         version: 0.3.17
@@ -238,6 +247,9 @@ importers:
       '@playwright/test':
         specifier: 1.58.2
         version: 1.58.2
+      '@shikijs/markdown-it':
+        specifier: ^3.21.0
+        version: 3.23.0(markdown-it-async@2.2.0)
       '@storybook-vue/nuxt':
         specifier: catalog:storybook
         version: 9.0.1(943de74da843ff392a0ce19e8d4f1cd5)
@@ -313,6 +325,9 @@ importers:
       typescript:
         specifier: 5.9.3
         version: 5.9.3
+      unplugin-vue-markdown:
+        specifier: ^29.2.0
+        version: 29.2.0(vite@8.0.0-beta.10(@types/node@24.10.13)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))
       vitest:
         specifier: npm:@voidzero-dev/vite-plus-test@0.0.0-g52709db6.20260226-1136
         version: '@voidzero-dev/vite-plus-test@0.0.0-g52709db6.20260226-1136(@opentelemetry/api@1.9.0)(@types/node@24.10.13)(esbuild@0.27.3)(happy-dom@20.3.5)(jiti@2.6.1)(jsdom@27.4.0(@noble/hashes@1.8.0))(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(yaml@2.8.2)'
@@ -370,7 +385,7 @@ importers:
     dependencies:
       '@nuxt/ui':
         specifier: 4.5.0
-        version: 4.5.0(@nuxt/content@3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)
+        version: 4.5.0(@nuxt/content@3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)
       '@nuxtjs/mdc':
         specifier: 0.20.1
         version: 0.20.1(magicast@0.5.1)
@@ -379,7 +394,7 @@ importers:
         version: 12.6.2
       docus:
         specifier: 5.6.1
-        version: 5.6.1(1b65878319a3c9b5a58513a82f531338)
+        version: 5.6.1(1bb863532954efd1f2acaa1e1d613817)
       nuxt:
         specifier: 4.3.1
         version: 4.3.1(@parcel/watcher@2.5.4)(@types/node@25.0.10)(@upstash/redis@1.36.2)(@vue/compiler-sfc@3.5.29)(better-sqlite3@12.6.2)(cac@6.7.14)(db0@0.3.4(better-sqlite3@12.6.2))(encoding@0.1.13)(eslint@9.39.2(jiti@2.6.1))(ioredis@5.9.2)(magicast@0.5.1)(optionator@0.9.4)(oxlint@1.50.0(oxlint-tsgolint@0.15.0))(rolldown@1.0.0-rc.5)(rollup@4.56.0)(terser@5.46.0)(tsx@4.21.0)(typescript@5.9.3)(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-tsc@3.2.5(typescript@5.9.3))(yaml@2.8.2)
@@ -513,6 +528,9 @@ packages:
   '@asamuzakjp/nwsapi@2.3.9':
     resolution: {integrity: sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==}
 
+  '@atcute/bluesky-richtext-segmenter@3.0.0':
+    resolution: {integrity: sha512-NhZTUKtFpeBBbILwAcxj5u4RobIoHOmGw3CAaaEFNebKYSvmTecrXJ7XufHw5DFOUdr8SiKXQVRQxGAxulMNWg==}
+
   '@atproto-labs/did-resolver@0.2.6':
     resolution: {integrity: sha512-2K1bC04nI2fmgNcvof+yA28IhGlpWn2JKYlPa7To9JTKI45FINCGkQSGiL2nyXlyzDJJ34fZ1aq6/IRFIOIiqg==}
 
@@ -542,6 +560,9 @@ packages:
   '@atproto-labs/simple-store@0.3.0':
     resolution: {integrity: sha512-nOb6ONKBRJHRlukW1sVawUkBqReLlLx6hT35VS3imaNPwiXDxLnTK7lxw3Lrl9k5yugSBDQAkZAq3MPTEFSUBQ==}
 
+  '@atproto/api@0.18.21':
+    resolution: {integrity: sha512-s35MIJerGT/pKe2xJtKKswqlIr/ola2r2iURBKBL0Mk1OKe6jP4YvTMh1N2d2PEANFzNNTbKoDaLfJPo2Uvc/w==}
+
   '@atproto/common-web@0.4.17':
     resolution: {integrity: sha512-sfxD8NGxyoxhxmM9EUshEFbWcJ3+JHEOZF4Quk6HsCh1UxpHBmLabT/vEsAkDWl+C/8U0ine0+c/gHyE/OZiQQ==}
 
@@ -586,6 +607,9 @@ packages:
   '@atproto/lex-json@0.0.12':
     resolution: {integrity: sha512-XlEpnWWZdDJ5BIgG25GyH+6iBfyrFL18BI5JSE6rUfMObbFMrQRaCuRLQfryRXNysVz3L3U+Qb9y8KcXbE8AcA==}
 
+  '@atproto/lex-password-session@0.0.7':
+    resolution: {integrity: sha512-vk/lH/PNI2iV2kSkdVCmLUH11D/cd/qNlL/52C31f3LR+7XLBqqXGupqnvAkaX5BvcRkCr+hemRp7TmX9NDHKA==}
+
   '@atproto/lex-resolver@0.0.16':
     resolution: {integrity: sha512-N3Jag6uJ+sq2XIRxwtbzwWdE70oFZBi5s3tscWsU6qLPL6RzdO9/a3wtbCeNQh0uO2UlaajZTNf/UQSdjufBHg==}
 
@@ -2029,6 +2053,18 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
+  '@mdit-vue/plugin-component@3.0.2':
+    resolution: {integrity: sha512-Fu53MajrZMOAjOIPGMTdTXgHLgGU9KwTqKtYc6WNYtFZNKw04euSfJ/zFg8eBY/2MlciVngkF7Gyc2IL7e8Bsw==}
+    engines: {node: '>=20.0.0'}
+
+  '@mdit-vue/plugin-frontmatter@3.0.2':
+    resolution: {integrity: sha512-QKKgIva31YtqHgSAz7S7hRcL7cHXiqdog4wxTfxeQCHo+9IP4Oi5/r1Y5E93nTPccpadDWzAwr3A0F+kAEnsVQ==}
+    engines: {node: '>=20.0.0'}
+
+  '@mdit-vue/types@3.0.2':
+    resolution: {integrity: sha512-00aAZ0F0NLik6I6Yba2emGbHLxv+QYrPH00qQ5dFKXlAo1Ll2RHDXwY7nN2WAfrx2pP+WrvSRFTGFCNGdzBDHw==}
+    engines: {node: '>=20.0.0'}
+
   '@mdx-js/react@3.1.1':
     resolution: {integrity: sha512-f++rKLQgUVYDAtECQ6fn/is15GkEH9+nZPM3MS0RcxVqoTfawHvDlSCH7JbMhAM6uJ32v3eXLvLmLvjGu7PTQw==}
     peerDependencies:
@@ -4119,12 +4155,29 @@ packages:
   '@shikijs/engine-oniguruma@3.22.0':
     resolution: {integrity: sha512-DyXsOG0vGtNtl7ygvabHd7Mt5EY8gCNqR9Y7Lpbbd/PbJvgWrqaKzH1JW6H6qFkuUa8aCxoiYVv8/YfFljiQxA==}
 
+  '@shikijs/engine-oniguruma@3.23.0':
+    resolution: {integrity: sha512-1nWINwKXxKKLqPibT5f4pAFLej9oZzQTsby8942OTlsJzOBZ0MWKiwzMsd+jhzu8YPCHAswGnnN1YtQfirL35g==}
+
   '@shikijs/langs@3.22.0':
     resolution: {integrity: sha512-x/42TfhWmp6H00T6uwVrdTJGKgNdFbrEdhaDwSR5fd5zhQ1Q46bHq9EO61SCEWJR0HY7z2HNDMaBZp8JRmKiIA==}
 
+  '@shikijs/langs@3.23.0':
+    resolution: {integrity: sha512-2Ep4W3Re5aB1/62RSYQInK9mM3HsLeB91cHqznAJMuylqjzNVAVCMnNWRHFtcNHXsoNRayP9z1qj4Sq3nMqYXg==}
+
+  '@shikijs/markdown-it@3.23.0':
+    resolution: {integrity: sha512-0tgFk+UUxBDXmdS/3xznAj0hhZWAF88UgpGGfgQppAEohtYKw+5MAxpuPQwa+baK/NbRrGlyfGdcpeXZqqEQSw==}
+    peerDependencies:
+      markdown-it-async: ^2.2.0
+    peerDependenciesMeta:
+      markdown-it-async:
+        optional: true
+
   '@shikijs/themes@3.22.0':
     resolution: {integrity: sha512-o+tlOKqsr6FE4+mYJG08tfCFDS+3CG20HbldXeVoyP+cYSUxDhrFf3GPjE60U55iOkkjbpY2uC3It/eeja35/g==}
 
+  '@shikijs/themes@3.23.0':
+    resolution: {integrity: sha512-5qySYa1ZgAT18HR/ypENL9cUSGOeI2x+4IvYJu4JgVJdizn6kG4ia5Q1jDEOi7gTbN4RbuYtmHh0W3eccOrjMA==}
+
   '@shikijs/transformers@3.23.0':
     resolution: {integrity: sha512-F9msZVxdF+krQNSdQ4V+Ja5QemeAoTQ2jxt7nJCwhDsdF1JWS3KxIQXA3lQbyKwS3J61oHRUSv4jYWv3CkaKTQ==}
 
@@ -4846,6 +4899,11 @@ packages:
   '@upstash/redis@1.36.2':
     resolution: {integrity: sha512-C0Yt8hc12vLaQYRG1fMci8iPrLtnTdbJG0HR5T8vKnvEP/1RdMMblsOJs5/jp0JXZJ1oSzMnQz4J9EVezNpI6A==}
 
+  '@valibot/to-json-schema@1.5.0':
+    resolution: {integrity: sha512-GE7DmSr1C2UCWPiV0upRH6mv0cCPsqYGs819fb6srCS1tWhyXrkGGe+zxUiwzn/L1BOfADH4sNjY/YHCuP8phQ==}
+    peerDependencies:
+      valibot: ^1.2.0
+
   '@vercel/nft@1.3.0':
     resolution: {integrity: sha512-i4EYGkCsIjzu4vorDUbqglZc5eFtQI2syHb++9ZUDm6TU4edVywGpVnYDein35x9sevONOn9/UabfQXuNXtuzQ==}
     engines: {node: '>=20'}
@@ -5489,6 +5547,9 @@ packages:
     resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
     engines: {node: '>= 0.4'}
 
+  await-lock@2.2.2:
+    resolution: {integrity: sha512-aDczADvlvTGajTDjcjpJMqRkOF6Qdz3YbPZm/PyW6tKPkx2hlYBzxMhEywM/tU72HrVZjgl5VCdRuMlA7pZ8Gw==}
+
   axe-core@4.11.1:
     resolution: {integrity: sha512-BASOg+YwO2C+346x3LZOeoovTIoTrRqEsqMa6fmfAV0P+U9mFr9NsyOEpiYvFjbc64NMrSswhV50WdXzdb/Z5A==}
     engines: {node: '>=4'}
@@ -7760,6 +7821,9 @@ packages:
     resolution: {integrity: sha512-hXdUTZYIVOt1Ex//jAQi+wTZZpUpwBj/0QsOzqegb3rGMMeJiSEu5xLHnYfBrRV4RH2+OCSOO95Is/7x1WJ4bw==}
     engines: {node: '>=10'}
 
+  markdown-it-async@2.2.0:
+    resolution: {integrity: sha512-sITME+kf799vMeO/ww/CjH6q+c05f6TLpn6VOmmWCGNqPJzSh+uFgZoMB9s0plNtW6afy63qglNAC3MhrhP/gg==}
+
   markdown-it@14.1.1:
     resolution: {integrity: sha512-BuU2qnTti9YKgK5N+IeMubp14ZUKUUw7yeJbkjtosvHiP0AZ5c8IAgEMk79D0eC8F23r4Ac/q8cAIFdm2FtyoA==}
     hasBin: true
@@ -9283,6 +9347,9 @@ packages:
   shiki@3.22.0:
     resolution: {integrity: sha512-LBnhsoYEe0Eou4e1VgJACes+O6S6QC0w71fCSp5Oya79inkwkm15gQ1UF6VtQ8j/taMDh79hAB49WUk8ALQW3g==}
 
+  shiki@3.23.0:
+    resolution: {integrity: sha512-55Dj73uq9ZXL5zyeRPzHQsK7Nbyt6Y10k5s7OjuFZGMhpp4r/rsLBH0o/0fstIzX1Lep9VxefWljK/SKCzygIA==}
+
   side-channel-list@1.0.0:
     resolution: {integrity: sha512-FCLHtRD/gnpCiCHEiJLOwdmFP+wzCmDEkc9y7NsYxeF4u7Btsn1ZuwgwJGxImImHicJArLP4R0yX4c2KCrMrTA==}
     engines: {node: '>= 0.4'}
@@ -9691,6 +9758,10 @@ packages:
     resolution: {integrity: sha512-azl+t0z7pw/z958Gy9svOTuzqIk6xq+NSheJzn5MMWtWTFywIacg2wUlzKFGtt3cthx0r2SxMK0yzJOR0IES7Q==}
     engines: {node: '>=14.0.0'}
 
+  tlds@1.261.0:
+    resolution: {integrity: sha512-QXqwfEl9ddlGBaRFXIvNKK6OhipSiLXuRuLJX5DErz0o0Q0rYxulWLdFryTkV5PkdZct5iMInwYEGe/eR++1AA==}
+    hasBin: true
+
   tldts-core@7.0.19:
     resolution: {integrity: sha512-lJX2dEWx0SGH4O6p+7FPwYmJ/bu1JbcGJ8RLaG9b7liIgZ85itUVEPbMtWRVrde/0fnDPEPHW10ZsKW3kVsE9A==}
 
@@ -10010,6 +10081,12 @@ packages:
       '@nuxt/kit':
         optional: true
 
+  unplugin-vue-markdown@29.2.0:
+    resolution: {integrity: sha512-/x2hFgQ6cWN1Kls+yK5mAI9YDmeTofftynVGgOy1llBlDX1ifaXsQBls/bpORaiwn7cxA7HkOo0wn/xKcrXBHA==}
+    engines: {node: '>=20'}
+    peerDependencies:
+      vite: ^2.0.0 || ^3.0.0-0 || ^4.0.0-0 || ^5.0.0-0 || ^6.0.0 || ^7.0.0
+
   unplugin-vue-router@0.16.2:
     resolution: {integrity: sha512-lE6ZjnHaXfS2vFI/PSEwdKcdOo5RwAbCKUnPBIN9YwLgSWas3x+qivzQvJa/uxhKzJldE6WK43aDKjGj9Rij9w==}
     deprecated: 'Merged into vuejs/router. Migrate: https://router.vuejs.org/guide/migration/v4-to-v5.html'
@@ -10889,6 +10966,8 @@ snapshots:
   '@asamuzakjp/nwsapi@2.3.9':
     optional: true
 
+  '@atcute/bluesky-richtext-segmenter@3.0.0': {}
+
   '@atproto-labs/did-resolver@0.2.6':
     dependencies:
       '@atproto-labs/fetch': 0.2.3
@@ -10936,6 +11015,17 @@ snapshots:
 
   '@atproto-labs/simple-store@0.3.0': {}
 
+  '@atproto/api@0.18.21':
+    dependencies:
+      '@atproto/common-web': 0.4.17
+      '@atproto/lexicon': 0.6.1
+      '@atproto/syntax': 0.4.3
+      '@atproto/xrpc': 0.7.7
+      await-lock: 2.2.2
+      multiformats: 9.9.0
+      tlds: 1.261.0
+      zod: 3.25.76
+
   '@atproto/common-web@0.4.17':
     dependencies:
       '@atproto/lex-data': 0.0.12
@@ -11027,6 +11117,12 @@ snapshots:
       '@atproto/lex-data': 0.0.12
       tslib: 2.8.1
 
+  '@atproto/lex-password-session@0.0.7':
+    dependencies:
+      '@atproto/lex-client': 0.0.14
+      '@atproto/lex-schema': 0.0.13
+      tslib: 2.8.1
+
   '@atproto/lex-resolver@0.0.16':
     dependencies:
       '@atproto-labs/did-resolver': 0.2.6
@@ -12535,6 +12631,20 @@ snapshots:
       - encoding
       - supports-color
 
+  '@mdit-vue/plugin-component@3.0.2':
+    dependencies:
+      '@types/markdown-it': 14.1.2
+      markdown-it: 14.1.1
+
+  '@mdit-vue/plugin-frontmatter@3.0.2':
+    dependencies:
+      '@mdit-vue/types': 3.0.2
+      '@types/markdown-it': 14.1.2
+      gray-matter: 4.0.3
+      markdown-it: 14.1.1
+
+  '@mdit-vue/types@3.0.2': {}
+
   '@mdx-js/react@3.1.1(@types/react@19.2.14)(react@19.2.4)':
     dependencies:
       '@types/mdx': 2.0.13
@@ -12691,7 +12801,7 @@ snapshots:
       - magicast
       - supports-color
 
-  '@nuxt/content@3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))':
+  '@nuxt/content@3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))':
     dependencies:
       '@nuxt/kit': 4.3.1(magicast@0.5.1)
       '@nuxtjs/mdc': 0.20.1(magicast@0.5.1)
@@ -12742,6 +12852,7 @@ snapshots:
       zod: 3.25.76
       zod-to-json-schema: 3.25.1(zod@3.25.76)
     optionalDependencies:
+      '@valibot/to-json-schema': 1.5.0(valibot@1.2.0(typescript@5.9.3))
       better-sqlite3: 12.6.2
       valibot: 1.2.0(typescript@5.9.3)
     transitivePeerDependencies:
@@ -13318,7 +13429,7 @@ snapshots:
       - typescript
       - vite
 
-  '@nuxt/ui@4.5.0(@nuxt/content@3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)':
+  '@nuxt/ui@4.5.0(@nuxt/content@3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)':
     dependencies:
       '@floating-ui/dom': 1.7.5
       '@iconify/vue': 5.0.0(vue@3.5.29(typescript@5.9.3))
@@ -13387,7 +13498,7 @@ snapshots:
       vaul-vue: 0.4.1(reka-ui@2.8.2(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))
       vue-component-type-helpers: 3.2.5
     optionalDependencies:
-      '@nuxt/content': 3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))
+      '@nuxt/content': 3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))
       valibot: 1.2.0(typescript@5.9.3)
       vue-router: 4.6.4(vue@3.5.29(typescript@5.9.3))
       zod: 4.3.6
@@ -14802,14 +14913,34 @@ snapshots:
       '@shikijs/types': 3.22.0
       '@shikijs/vscode-textmate': 10.0.2
 
+  '@shikijs/engine-oniguruma@3.23.0':
+    dependencies:
+      '@shikijs/types': 3.23.0
+      '@shikijs/vscode-textmate': 10.0.2
+
   '@shikijs/langs@3.22.0':
     dependencies:
       '@shikijs/types': 3.22.0
 
+  '@shikijs/langs@3.23.0':
+    dependencies:
+      '@shikijs/types': 3.23.0
+
+  '@shikijs/markdown-it@3.23.0(markdown-it-async@2.2.0)':
+    dependencies:
+      markdown-it: 14.1.1
+      shiki: 3.23.0
+    optionalDependencies:
+      markdown-it-async: 2.2.0
+
   '@shikijs/themes@3.22.0':
     dependencies:
       '@shikijs/types': 3.22.0
 
+  '@shikijs/themes@3.23.0':
+    dependencies:
+      '@shikijs/types': 3.23.0
+
   '@shikijs/transformers@3.23.0':
     dependencies:
       '@shikijs/core': 3.23.0
@@ -15686,6 +15817,11 @@ snapshots:
     dependencies:
       uncrypto: 0.1.3
 
+  '@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3))':
+    dependencies:
+      valibot: 1.2.0(typescript@5.9.3)
+    optional: true
+
   '@vercel/nft@1.3.0(encoding@0.1.13)(rollup@4.56.0)':
     dependencies:
       '@mapbox/node-pre-gyp': 2.0.3(encoding@0.1.13)
@@ -16482,6 +16618,8 @@ snapshots:
     dependencies:
       possible-typed-array-names: 1.1.0
 
+  await-lock@2.2.2: {}
+
   axe-core@4.11.1: {}
 
   b4a@1.7.3: {}
@@ -17085,7 +17223,7 @@ snapshots:
 
   doctypes@1.1.0: {}
 
-  docus@5.6.1(1b65878319a3c9b5a58513a82f531338):
+  docus@5.6.1(1bb863532954efd1f2acaa1e1d613817):
     dependencies:
       '@ai-sdk/gateway': 3.0.55(zod@4.3.6)
       '@ai-sdk/mcp': 1.0.21(zod@4.3.6)
@@ -17093,10 +17231,10 @@ snapshots:
       '@iconify-json/lucide': 1.2.93
       '@iconify-json/simple-icons': 1.2.71
       '@iconify-json/vscode-icons': 1.2.43
-      '@nuxt/content': 3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))
+      '@nuxt/content': 3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3))
       '@nuxt/image': 2.0.0(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(ioredis@5.9.2)(magicast@0.5.1)
       '@nuxt/kit': 4.3.1(magicast@0.5.1)
-      '@nuxt/ui': 4.5.0(@nuxt/content@3.11.2(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)
+      '@nuxt/ui': 4.5.0(@nuxt/content@3.11.2(@valibot/to-json-schema@1.5.0(valibot@1.2.0(typescript@5.9.3)))(better-sqlite3@12.6.2)(magicast@0.5.1)(valibot@1.2.0(typescript@5.9.3)))(@tiptap/extensions@3.20.0(@tiptap/core@3.20.0(@tiptap/pm@3.20.0))(@tiptap/pm@3.20.0))(@tiptap/y-tiptap@3.0.2(prosemirror-model@1.25.4)(prosemirror-state@1.4.4)(prosemirror-view@1.41.6)(y-protocols@1.0.7(yjs@13.6.29))(yjs@13.6.29))(@upstash/redis@1.36.2)(db0@0.3.4(better-sqlite3@12.6.2))(embla-carousel@8.6.0)(focus-trap@8.0.0)(ioredis@5.9.2)(magicast@0.5.1)(react-dom@19.2.4(react@19.2.4))(react@19.2.4)(tailwindcss@4.2.1)(typescript@5.9.3)(valibot@1.2.0(typescript@5.9.3))(vite@8.0.0-beta.10(@types/node@25.0.10)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2))(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3))(yjs@13.6.29)(zod@4.3.6)
       '@nuxtjs/i18n': 10.2.3(@upstash/redis@1.36.2)(@vue/compiler-dom@3.5.29)(db0@0.3.4(better-sqlite3@12.6.2))(eslint@9.39.2(jiti@2.6.1))(ioredis@5.9.2)(magicast@0.5.1)(rollup@4.56.0)(vue@3.5.29(typescript@5.9.3))
       '@nuxtjs/mcp-toolkit': 0.7.0(magicast@0.5.1)(zod@4.3.6)
       '@nuxtjs/mdc': 0.20.1(magicast@0.5.1)
@@ -19145,6 +19283,11 @@ snapshots:
     dependencies:
       semver: 7.7.4
 
+  markdown-it-async@2.2.0:
+    dependencies:
+      '@types/markdown-it': 14.1.2
+      markdown-it: 14.1.1
+
   markdown-it@14.1.1:
     dependencies:
       argparse: 2.0.1
@@ -21682,6 +21825,17 @@ snapshots:
       '@shikijs/vscode-textmate': 10.0.2
       '@types/hast': 3.0.4
 
+  shiki@3.23.0:
+    dependencies:
+      '@shikijs/core': 3.23.0
+      '@shikijs/engine-javascript': 3.23.0
+      '@shikijs/engine-oniguruma': 3.23.0
+      '@shikijs/langs': 3.23.0
+      '@shikijs/themes': 3.23.0
+      '@shikijs/types': 3.23.0
+      '@shikijs/vscode-textmate': 10.0.2
+      '@types/hast': 3.0.4
+
   side-channel-list@1.0.0:
     dependencies:
       es-errors: 1.3.0
@@ -22120,6 +22274,8 @@ snapshots:
 
   tinyspy@4.0.4: {}
 
+  tlds@1.261.0: {}
+
   tldts-core@7.0.19:
     optional: true
 
@@ -22496,6 +22652,18 @@ snapshots:
     optionalDependencies:
       '@nuxt/kit': 4.3.1(magicast@0.5.1)
 
+  unplugin-vue-markdown@29.2.0(vite@8.0.0-beta.10(@types/node@24.10.13)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)):
+    dependencies:
+      '@mdit-vue/plugin-component': 3.0.2
+      '@mdit-vue/plugin-frontmatter': 3.0.2
+      '@mdit-vue/types': 3.0.2
+      '@types/markdown-it': 14.1.2
+      markdown-it: 14.1.1
+      markdown-it-async: 2.2.0
+      unplugin: 2.3.11
+      unplugin-utils: 0.3.1
+      vite: 8.0.0-beta.10(@types/node@24.10.13)(esbuild@0.27.3)(jiti@2.6.1)(terser@5.46.0)(tsx@4.21.0)(yaml@2.8.2)
+
   unplugin-vue-router@0.16.2(@vue/compiler-sfc@3.5.29)(vue-router@4.6.4(vue@3.5.29(typescript@5.9.3)))(vue@3.5.29(typescript@5.9.3)):
     dependencies:
       '@babel/generator': 7.29.1
diff --git a/server/api/atproto/author-profiles.get.ts b/server/api/atproto/bluesky-author-profiles.get.ts
similarity index 99%
rename from server/api/atproto/author-profiles.get.ts
rename to server/api/atproto/bluesky-author-profiles.get.ts
index e0e405196e..1122376d82 100644
--- a/server/api/atproto/author-profiles.get.ts
+++ b/server/api/atproto/bluesky-author-profiles.get.ts
@@ -52,6 +52,7 @@ export default defineCachedEventHandler(
       .catch(() => ({ profiles: [] }))
 
     const avatarMap = new Map<string, string>()
+
     for (const profile of response.profiles) {
       if (profile.avatar) {
         avatarMap.set(profile.handle, profile.avatar)
diff --git a/server/middleware/canonical-redirects.global.ts b/server/middleware/canonical-redirects.global.ts
index b6419f2e9e..274f544740 100644
--- a/server/middleware/canonical-redirects.global.ts
+++ b/server/middleware/canonical-redirects.global.ts
@@ -18,6 +18,7 @@ const pages = [
   '/opensearch.xml',
   '/about',
   '/accessibility',
+  '/blog',
   '/compare',
   '/org',
   '/package',
diff --git a/shared/schemas/atproto.ts b/shared/schemas/atproto.ts
new file mode 100644
index 0000000000..34e2ec30da
--- /dev/null
+++ b/shared/schemas/atproto.ts
@@ -0,0 +1,33 @@
+import { boolean, object, optional, pipe, string, url } from 'valibot'
+import type { InferOutput } from 'valibot'
+
+/**
+ * INFO: Validates AT Protocol createSession response
+ * Used for authenticating PDS sessions.
+ */
+export const PDSSessionSchema = object({
+  did: string(),
+  handle: string(),
+  accessJwt: string(),
+  refreshJwt: string(),
+  email: string(),
+  emailConfirmed: boolean(),
+})
+
+export type PDSSessionResponse = InferOutput<typeof PDSSessionSchema>
+
+export const BlogMetaRequestSchema = object({
+  url: pipe(string(), url()),
+})
+
+export type BlogMetaRequest = InferOutput<typeof BlogMetaRequestSchema>
+
+export const BlogMetaResponseSchema = object({
+  title: string(),
+  author: optional(string()),
+  description: optional(string()),
+  image: optional(string()),
+  _meta: optional(object({})),
+})
+
+export type BlogMetaResponse = InferOutput<typeof BlogMetaResponseSchema>
diff --git a/shared/schemas/blog.ts b/shared/schemas/blog.ts
index 587bf3288d..7d9ca269bc 100644
--- a/shared/schemas/blog.ts
+++ b/shared/schemas/blog.ts
@@ -1,5 +1,5 @@
+import { array, boolean, custom, isoTimestamp, object, optional, pipe, string } from 'valibot'
 import { isAtIdentifierString, type AtIdentifierString } from '@atproto/lex'
-import { custom, object, string, optional, array, boolean, pipe, isoDate } from 'valibot'
 import type { InferOutput } from 'valibot'
 
 export const AuthorSchema = object({
@@ -15,7 +15,7 @@ export const AuthorSchema = object({
 export const BlogPostSchema = object({
   authors: array(AuthorSchema),
   title: string(),
-  date: pipe(string(), isoDate()),
+  date: pipe(string(), isoTimestamp()),
   description: string(),
   path: string(),
   slug: string(),
diff --git a/shared/types/blog-post.ts b/shared/types/blog-post.ts
index c38449f3e2..2da1b95b0a 100644
--- a/shared/types/blog-post.ts
+++ b/shared/types/blog-post.ts
@@ -17,3 +17,16 @@ export interface Comment {
   repostCount: number
   replies: Comment[]
 }
+
+/*
+  WARN: FederatedArticleInput specifics
+  interface - All strings must be captured in single quotes in order to be parsed correctly in the MD file
+  authorHandle - Must not contain `@` symbol prefix
+  description - Any additional single quotes must be properly escaped with a `\`
+*/
+export interface FederatedArticleInput {
+  url: string
+  title: string
+  authorHandle: string
+  description: string
+}
diff --git a/shared/utils/constants.ts b/shared/utils/constants.ts
index 4b80623c47..a6bb67ab99 100644
--- a/shared/utils/constants.ts
+++ b/shared/utils/constants.ts
@@ -10,6 +10,7 @@ export const CACHE_MAX_AGE_ONE_YEAR = 60 * 60 * 24 * 365
 // API Strings
 export const NPMX_SITE = 'https://npmx.dev'
 export const NPMX_DOCS_SITE = 'https://docs.npmx.dev'
+export const NPMX_DID = 'did:plc:u5zp7npt5kpueado77kuihyz'
 export const BLUESKY_API = 'https://public.api.bsky.app'
 export const BLUESKY_COMMENTS_REQUEST = '/api/atproto/bluesky-comments'
 export const NPM_REGISTRY = 'https://registry.npmjs.org'
@@ -18,6 +19,8 @@ export const ERROR_PACKAGE_ANALYSIS_FAILED = 'Failed to analyze package.'
 export const ERROR_PACKAGE_VERSION_AND_FILE_FAILED = 'Version and file path are required.'
 export const ERROR_PACKAGE_REQUIREMENTS_FAILED =
   'Package name, version, and file path are required.'
+export const ERROR_BLUESKY_URL_FAILED =
+  'Invalid Bluesky URL format. Expected: https://bsky.app/profile/HANDLE/post/POST_ID'
 export const ERROR_FILE_LIST_FETCH_FAILED = 'Failed to fetch file list.'
 export const ERROR_CALC_INSTALL_SIZE_FAILED = 'Failed to calculate install size.'
 export const NPM_MISSING_README_SENTINEL = 'ERROR: No README data found!'
@@ -77,6 +80,10 @@ export const BACKGROUND_THEMES = {
   black: 'oklch(0.4 0 0)',
 } as const
 
-// Regex
+// INFO: Regex for capture groups
+export const BLUESKY_URL_EXTRACT_REGEX = /profile\/([^/]+)\/post\/([^/]+)/
 export const BSKY_POST_AT_URI_REGEX =
-  /^at:\/\/(did:plc:[a-z0-9]+)\/app\.bsky\.feed\.post\/([a-z0-9]+)$/
+  /^at:\/\/(did:[a-z]+:[\w.:%-]+)\/app\.bsky\.feed\.post\/([a-z0-9]+)$/
+export const BLOG_META_TAG_REGEX =
+  /<meta[^>]*(?:property|name)=["']([^"']+)["'][^>]*content=["']([^"']+)["'][^>]*>/gi
+export const META_TAG_TITLE_REGEX = /<title>([^<]*)<\/title>/i
diff --git a/test/nuxt/a11y.spec.ts b/test/nuxt/a11y.spec.ts
index 744e3c00c8..9fa5f127bd 100644
--- a/test/nuxt/a11y.spec.ts
+++ b/test/nuxt/a11y.spec.ts
@@ -121,6 +121,13 @@ import {
   AppLogo,
   AboutLogoImg,
   AboutLogoList,
+  AuthorAvatar,
+  AuthorList,
+  BlogPostFederatedArticles,
+  BlogPostListCard,
+  BlogPostWrapper,
+  BlueskyComment,
+  BlueskyComments,
   BaseCard,
   BlueskyPostEmbed,
   BuildEnvironment,
@@ -2170,6 +2177,143 @@ describe('component accessibility audits', () => {
     })
   })
 
+  describe('AuthorAvatar', () => {
+    it('should have no accessibility violations with fallback text', async () => {
+      const component = await mountSuspended(AuthorAvatar, {
+        props: {
+          author: {
+            name: 'Daniel Roe',
+            blueskyHandle: 'danielroe.dev',
+            avatar: null,
+            profileUrl: 'https://bsky.app/profile/danielroe.dev',
+          },
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('AuthorList', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(AuthorList, {
+        props: {
+          authors: [
+            { name: 'Daniel Roe', blueskyHandle: 'danielroe.dev' },
+            { name: 'Salma Alam-Naylor' },
+          ],
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('BlogPostWrapper', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(BlogPostWrapper, {
+        props: {
+          frontmatter: {
+            authors: [{ name: 'Daniel Roe', blueskyHandle: 'danielroe.dev' }],
+            title: 'Building Accessible Vue Components',
+            date: '2024-06-15',
+            description: 'A guide to building accessible components in Vue.js applications.',
+            path: '/blog/building-accessible-vue-components',
+            slug: 'building-accessible-vue-components',
+          },
+        },
+        slots: { default: '<p>Blog post content here.</p>' },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('BlueskyComment', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(BlueskyComment, {
+        props: {
+          comment: {
+            uri: 'at://did:plc:2gkh62xvzokhlf6li4ol3b3d/app.bsky.feed.post/3mcg7k75fdc2k',
+            cid: 'bafyreigincphooxt7zox3blbocf6hnczzv36fkuj2zi5iuzpjgq6gk6pju',
+            author: {
+              did: 'did:plc:2gkh62xvzokhlf6li4ol3b3d',
+              handle: 'patak.dev',
+              displayName: 'patak',
+              avatar:
+                'https://cdn.bsky.app/img/avatar/plain/did:plc:2gkh62xvzokhlf6li4ol3b3d/bafkreifgzl4e5jqlakd77ajvnilsb5tufsv24h2sxfwmitkzxrh3sk6mhq@jpeg',
+            },
+            text: 'our kids will need these new stories, thanks for writing this Daniel',
+            createdAt: '2026-01-14T23:22:05.257Z',
+            likeCount: 13,
+            replyCount: 0,
+            repostCount: 0,
+            replies: [],
+          },
+          depth: 0,
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('BlueskyComments', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(BlueskyComments, {
+        props: {
+          postUri: 'at://did:plc:jbeaa5kdaladzwq3r7f5xgwe/app.bsky.feed.post/3mcg6svsgsm2k',
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('BlogPostListCard', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(BlogPostListCard, {
+        props: {
+          authors: [{ name: 'Daniel Roe', blueskyHandle: 'danielroe.dev' }],
+          title: 'Building Accessible Vue Components',
+          topics: ['accessibility', 'vue'],
+          excerpt: 'A guide to building accessible components in Vue.js applications.',
+          published: '2024-06-15',
+          path: 'alpha-release',
+          index: 0,
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
+  describe('BlogPostFederatedArticles', () => {
+    it('should have no accessibility violations', async () => {
+      const component = await mountSuspended(BlogPostFederatedArticles, {
+        props: {
+          headline: 'Read more on Bluesky',
+          articles: [
+            {
+              url: 'https://example.com/post-1',
+              title: 'Federated Testing Patterns',
+              description: 'How to keep accessibility checks simple and maintainable.',
+              authorHandle: 'danielroe.dev',
+            },
+            {
+              url: 'https://example.com/post-2',
+              title: 'Composable Data in Vue',
+              description: 'Practical patterns for data composition in Vue components.',
+              authorHandle: 'salma.dev',
+            },
+          ],
+        },
+      })
+      const results = await runAxe(component)
+      expect(results.violations).toEqual([])
+    })
+  })
+
   describe('PackageReplacement', () => {
     it('should have no accessibility violations for native replacement', async () => {
       const component = await mountSuspended(PackageReplacement, {
diff --git a/test/unit/a11y-component-coverage.spec.ts b/test/unit/a11y-component-coverage.spec.ts
index 0f18a000e7..f6f6ea845a 100644
--- a/test/unit/a11y-component-coverage.spec.ts
+++ b/test/unit/a11y-component-coverage.spec.ts
@@ -23,6 +23,7 @@ import { fileURLToPath } from 'node:url'
  */
 const SKIPPED_COMPONENTS: Record<string, string> = {
   // OgImage components are server-side rendered images, not interactive UI
+  'OgImage/BlogPost.vue': 'OG Image component - server-rendered image, not interactive UI',
   'OgImage/Default.vue': 'OG Image component - server-rendered image, not interactive UI',
   'OgImage/Package.vue': 'OG Image component - server-rendered image, not interactive UI',
 
diff --git a/uno.config.ts b/uno.config.ts
index 506c8977d6..e865abbd09 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -1,6 +1,7 @@
 import {
   defineConfig,
   presetIcons,
+  presetTypography,
   presetWind4,
   transformerDirectives,
   transformerVariantGroup,
@@ -34,6 +35,7 @@ export default defineConfig({
         custom: customIcons,
       },
     }),
+    presetTypography(),
     // keep this preset last
     ...(process.env.CI ? [] : [presetRtl(), presetA11y()]),
   ].filter(Boolean),